mirror of
https://github.com/picocss/pico.git
synced 2025-02-24 00:39:20 -05:00
85e21d35de
- Edit code colors and add a color for comments - Add ::selection - Small edits for cards: last-child and overflow - Add card-sectioning (header, footer, pre) - Change global hue for Primary color - Remove border for pre - Add querySelectorAll() for theme-switcher.js - Update docs
63 lines
1.7 KiB
SCSS
63 lines
1.7 KiB
SCSS
/**
|
|
* Card (<article>)
|
|
*/
|
|
|
|
article {
|
|
margin: $spacing-block;
|
|
margin-right: -$spacing-gutter;
|
|
margin-left: -$spacing-gutter;
|
|
padding: $spacing-block $spacing-gutter;
|
|
overflow: hidden;
|
|
background: var(--card-background);
|
|
box-shadow: var(--card-shadow);
|
|
|
|
@if map-get($breakpoints, "sm") {
|
|
@media (min-width: map-get($breakpoints, "sm")) {
|
|
@if map-get($spacing-factor, "sm") and $enable-responsive-spacings {
|
|
margin: ($spacing-block*map-get($spacing-factor, "sm")) 0;
|
|
padding: $spacing-block*map-get($spacing-factor, "sm");
|
|
}
|
|
@else {
|
|
margin: $spacing-block 0;
|
|
padding: $spacing-block;
|
|
}
|
|
border-radius: $round;
|
|
}
|
|
}
|
|
|
|
@if map-get($breakpoints, "md") and
|
|
map-get($spacing-factor, "md") and
|
|
$enable-responsive-spacings {
|
|
|
|
@media (min-width: map-get($breakpoints, "md")) {
|
|
margin: ($spacing-block*map-get($spacing-factor, "md")) 0;
|
|
padding: $spacing-block*map-get($spacing-factor, "md");
|
|
}
|
|
}
|
|
|
|
@if map-get($breakpoints, "lg") and
|
|
map-get($spacing-factor, "lg") and
|
|
$enable-responsive-spacings {
|
|
|
|
@media (min-width: map-get($breakpoints, "lg")) {
|
|
margin: ($spacing-block*map-get($spacing-factor, "lg")) 0;
|
|
padding: $spacing-block*map-get($spacing-factor, "lg");
|
|
}
|
|
}
|
|
|
|
@if map-get($breakpoints, "xl") and
|
|
map-get($spacing-factor, "xl") and
|
|
$enable-responsive-spacings {
|
|
|
|
@media (min-width: map-get($breakpoints, "xl")) {
|
|
margin: ($spacing-block*map-get($spacing-factor, "xl")) 0;
|
|
padding: $spacing-block*map-get($spacing-factor, "xl");
|
|
}
|
|
}
|
|
|
|
// Remove last-child margin bottom
|
|
> *:not(footer):not(pre):last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
}
|