// VARIABILES // —————————-
// COLORS // —————————-
// Base // $black: white // $white: black
// Body // $body-bg: lighten(black,6%) // $body-color: darken(white,5%)
$maroon: maroon $gold: chocolate $khaki: rgba(darkkhaki,.5)
// Links $link-color: $maroon $link-hover-color: $gold
// Colors darkened $blue: mix(#007bff,$maroon,55%) $indigo: mix(#6610f2,$maroon,55%) $purple: mix(#6f42c1,$maroon,55%) $pink: mix(e83e8c,$maroon,55%) $red: mix(dc3545,$maroon,55%) $orange: mix(fd7e14,$maroon,55%) $yellow: mix(ffc107,$maroon,55%) $green: mix(#28a745,$maroon,55%) $teal: mix(#20c997,$maroon,55%) $cyan: mix(#17a2b8,$maroon,55%)
// BACKGROUND .dnd-background
background-image: url('/assets/images/dnd-bg.jpg') background-size: 100% auto background-position: top left background-color: #E3C8A1
// Kbd // $kbd-color: white
// FONTS // —————————-
// Size $font-size-base: 1.2rem $code-font-size: 80%
// Font family $font-family-sans-serif: 'Scala Sans SC', sans-serif $font-family-serif: 'Scala', serif $font-family-base: $font-family-serif $headings-color: $maroon // $font-family-headings-header: $font-family-serif
// Weights // $font-weight-base: 300 $headings-font-weight: 400
// Helper .font-sans
font-family: $font-family-sans-serif
// BLOCKQUOTES $blockquote-small-color: lighten(black,30%) $text-muted: lighten(black,40%)
// CODE $code-color: brown
// CARDS $card-bg: $khaki $card-cap-bg: darkkhaki $card-spacer-x: .75rem $card-spacer-y: .75rem $card-border-radius: 0 $card-border-width: 0 $card-border-color: black
// Helper .card-border
border-width: 3px 0 !important
// FORMS $custom-select-bg: rgba(white,.5) $input-bg: rgba(white,.5)
// LISTS $list-group-bg: rgba(white, .1) $list-group-action-color: rgba(black,.8) $list-group-item-padding-y: .35rem $list-group-item-padding-x: .75rem $component-active-bg: $maroon
// TABLES $table-bg: transparent $table-border-color: rgba(black,.05) $table-accent-bg: $khaki $table-border-width: 0 $table-cell-padding-sm: .3rem .75rem
// MODALS $modal-header-border-color: rgba(black,.2)
// DROPDOWNS $dropdown-bg: rgba(white,.4) $dropdown-link-hover-bg: rgba(white,.5) $dropdown-padding-y: 0 $dropdown-border-radius: 0
@import “any_theme” @import “any_theme/syntax_blood”
// BODY body
@extend .dnd-background
.modal-content
@extend .dnd-background
// HEADINGS @include headings()
font-variant-caps: small-caps
h2
border-bottom: 2px solid $gold @extend .d-flex
// TYPE b
font-variant-caps: small-caps font-size: 105%
// HEADER header
@extend .pt-4
// MAIN main
// Add vertical padding @extend .py-5 // Headings // Set a top margin @include headings() @extend .mt-3 // Reset to margin for first child heaings in the first row columns .row:first-child div[class*="col"] @include headings(1, 6, ':first-child') @extend .mt-0
// ALERTS @each $color, $value in $theme-colors
.alert-#{$color} color: color-yiq($value) background: darken($value,5%) border-color: $value hr border-top-color: $value a, code opacity: 0.7 color: color-yiq($value)
// TABLES table
@extend .table-striped, .table-sm, .font-sans
.card
@extend .font-sans, .card-border
// BLOCKQUOTES blockquote
@extend .pl-3, .m-2 border-left: ($border-width * 3) solid $maroon
// CODE HIGHLIGHT // Set padding and background pre.highlight
@extend .px-2, .py-1 background: rgba(white, .2) // Prevent long code to break bootstrapper grid: // Fix user agent stylesheet `white-space: pre` white-space: pre-wrap