Sha256: 4ad2e7b3839352ce163cf76bfe82d204d8a74699868a821f0818fdba396bc71b
Contents?: true
Size: 1.74 KB
Versions: 18
Compression:
Stored size: 1.74 KB
Contents
@import "../tokens/shadows";
@import "../tokens/border_radius";
@import "../tokens/spacing";
@import "../tokens/colors";
@import "../tokens/transition";
@import "../tokens/animation-curves";
$pb_card_border_width: 1px;
$pb_card_border_radius: $border_rad_heavier;
$pb_card_highlight_colors: map-merge(map-merge($status_colors, $product_colors), $category_colors);
$pb_card_highlight_size: 4px;
$pb_card_header_colors: map-merge($category_colors, $product_colors);
$pb_card_header_border_radius: $border_rad_heavy;
$pb_card_padding:(
none: 0,
xs: $space_xs,
sm: $space_sm,
md: $space_md,
lg: $space_lg,
xl: $space_xl,
);
@mixin pb_card_selected($border_color: $primary) {
border-color: $border_color;
border-width: $pb_card_border_width * 2;
}
@mixin pb_card_selected_dark {
@include pb_card_selected($primary_action);
}
@mixin pb_card($background: $card_light, $border_color: $border_light) {
position: relative;
display: flex;
flex-direction: column;
min-width: 0;
word-wrap: break-word;
background-color: $background;
background-clip: border-box;
border-width: $pb_card_border_width;
border-style: solid;
border-color: $border_color;
border-radius: $pb_card_border_radius;
transition-property: all;
transition-duration: $transition_short;
transition-timing-function: $easeIn;
@each $name, $shadow in $box_shadows {
&[class*=_#{$name}] {
box-shadow: $shadow;
}
}
}
@mixin pb_card_dark {
@include pb_card($card_dark, $border_dark);
}
@mixin pb_card_highlight($width, $height, $background){
content: "";
position: absolute;
top: 0;
left: 0;
width: $width;
height: $height;
background: $background;
z-index: 10;
}
@mixin pb_card_header_color($header_color) {
background: $header_color;
}
Version data entries
18 entries across 18 versions & 1 rubygems