.card-dashboard { @extend .mb-3; .card-header { @extend .h4; margin-bottom: 0; } .card-body { .card-title { @extend .h4; } .card-text { @extend .text-muted; } } } .card-diaperchange { @extend .border-danger; .card-header { @extend .text-white, .bg-danger; } .card-body { @extend .text-danger; } .progress { height: $progress-height * 2; } } .card-feeding { @extend .border-primary; .card-header { @extend .text-white, .bg-primary; } .card-body { @extend .text-primary; } } .card-sleep { @extend .border-secondary; .card-header { @extend .text-white, .bg-secondary; } } .card-timer { @extend .border-light; .card-header { @extend .text-dark, .bg-light; } .card-body { @extend .text-light; } } .card-tummytime { @extend .border-success; .card-header { @extend .text-white, .bg-success; } .card-body { @extend .text-success; } }