mybuddy/dashboard/static_src/scss/cards.scss

111 lines
2.1 KiB
SCSS

%card-header-text {
font-size: $h4-font-size;
font-weight: $headings-font-weight;
line-height: $headings-line-height;
}
.card-dashboard {
margin-bottom: $spacer;
.card-header {
@extend %card-header-text;
margin-bottom: 0;
}
.card-body {
.card-title {
@extend %card-header-text;
}
.card-text {
color: $text-muted;
}
// Offset horizontal padding in dashboard cards with a carousel.
.carousel {
margin-left: -$card-spacer-x;
margin-right: -$card-spacer-x;
padding-left: $card-spacer-x;
padding-right: $card-spacer-x;
}
}
}
.card-diaperchange {
border-color: theme-color('danger');
.card-header, .card-header a {
background-color: theme-color('danger');
color: theme-color('light');
}
.card-body {
color: theme-color('danger');
}
.progress {
height: $progress-height * 2;
}
}
.card-feeding {
border-color: theme-color('primary');
.card-header, .card-header a {
background-color: theme-color('primary');
color: theme-color('light');
}
.card-body {
color: theme-color('primary');
// Last feeding method header in card.
.last-feeding-method {
font-size: 2em;
}
}
}
.card-sleep {
border-color: theme-color('secondary');
.card-header, .card-header a {
background-color: theme-color('secondary');
color: theme-color('light');
}
}
.card-statistics, .card-timer {
border-color: theme-color('light');
.card-header {
background-color: theme-color('light');
color: theme-color('dark');
a {
color: theme-color('dark');
}
}
.card-body {
color: theme-color('light');
.container {
padding: 0;
}
}
}
.card-tummytime {
border-color: theme-color('success');
.card-header, .card-header a {
background-color: theme-color('success');
color: theme-color('light');
}
.card-body {
color: theme-color('success');
}
}