/* * 2. Cards and containers * All elements that are supposed to contain other stuff * * */ $card-bigpad: $lineheight_rel * 1.25; $card-smallpad: $lineheight_rel / 4; .card { @include panel($card-bigpad); display: flex; flex-direction: column; color:$color-font; &-body { padding:0!important; } &-header { @include panel-header($card-bigpad); .fa { margin-right: 0.5em; } font-family: $basefont; } } /* CARD LIST - Make a list part of a card */ @mixin list-symbol($symbol) { li.list-element { list-style: none; &::before { font-family: "ForkAwesome"; content:$symbol; padding-right: $lineheight_rel / 4; } } } @mixin list-color($color) { li.list-element { &::before { color: $color; } } } ul.card-list, .card > ul { padding:0; margin:0; li.list-element { line-height:$lineheight_rel / 2; padding: $lineheight_rel / 4, $lineheight_rel / 4, $lineheight_rel / 4, $lineheight_rel / 2; margin:0; } } .list { &-check {@include list-symbol("\f00c");} &-cross {@include list-symbol("\f00d");} &-danger{@include list-color($color-danger);} &-success{@include list-color($color-success);} } .smallcard { &-header { @include panel-header($card-bigpad); } }