// Bootstrap initialize @import “bootstrap/functions” @import “bootstrap/variables”

// PALETTE

// Background frame color. // Used in: html and footer nav $bg-frame: $gray-200 // use extending his class .bg-frame

background-color: $bg-frame

// Dropdown $dropdown-bg: $gray-800 $dropdown-border-color: rgba($white, .15)

$dropdown-link-color: $gray-200 $dropdown-link-hover-color: $gray-100 $dropdown-link-hover-bg: $gray-900 // FONTS

// Font size $font-size-base: 1.1rem

// Base font family @import url(“fonts.googleapis.com/css?family=Roboto:300,400,500”) $font-family-sans-serif: “Roboto”, Arial, sans-serif $font-family-base: $font-family-sans-serif

// Headings font family @import url(“fonts.googleapis.com/css?family=Roboto+Slab:300,400,700”) $font-family-headings: “Roboto Slab”, serif $font-family-headings-header: $font-family-headings

// // Bootstrap_end // @import “bootstrap/mixins” // @import “bootstrap/root” @import “bootstrap/reboot” @import “bootstrap/type” @import “bootstrap/images” @import “bootstrap/code” @import “bootstrap/grid” @import “bootstrap/tables” @import “bootstrap/forms” @import “bootstrap/buttons” @import “bootstrap/transitions” @import “bootstrap/dropdown” @import “bootstrap/button-group” @import “bootstrap/input-group” @import “bootstrap/custom-forms” @import “bootstrap/nav” @import “bootstrap/navbar” @import “bootstrap/card” @import “bootstrap/breadcrumb” @import “bootstrap/pagination” @import “bootstrap/badge” @import “bootstrap/jumbotron” @import “bootstrap/alert” @import “bootstrap/progress” @import “bootstrap/media” @import “bootstrap/list-group” @import “bootstrap/close” @import “bootstrap/modal” @import “bootstrap/tooltip” @import “bootstrap/popover” @import “bootstrap/carousel” @import “bootstrap/utilities” @import “bootstrap/print”

// MIXINS

// Headings mixin

Example:
@include headings(1,6,':first-child','main > ')
 ...
Render:
main > h1:first-child, main > .h2:first-child, ...
 ...

@mixin headings($from: 1, $to: 6, $condition: '', $prescope: '')

@for $i from $from through $to
  #{$prescope}h#{$i}#{$condition}, #{$prescope}.h#{$i}#{$condition}
    @content

// // CLASSES //

// font weights: .fw-1, … .fw-9 @for $weight from 1 through 9

.fw-#{$weight}
  font-weight: $weight * 100

// Bottom border only Class .bb

@extend .border, .border-top-0, .border-right-0, .border-left-0

// Big spacers $big_spacer: ( 6: ($spacer * 2), 7: ($spacer * 2.5), 8: ($spacer * 4), 9: ($spacer * 0.7) ) @each $prop, $abbrev in (margin: m, padding: p)

@each $size, $length in $big_spacer
  .#{$abbrev}-#{$size}
    #{$prop}: $length
  .#{$abbrev}t-#{$size}, .#{$abbrev}y-#{$size}
    #{$prop}-top: $length
  .#{$abbrev}r-#{$size}, .#{$abbrev}x-#{$size}
    #{$prop}-right: $length
  .#{$abbrev}b-#{$size}, .#{$abbrev}y-#{$size}
    #{$prop}-bottom: $length
  .#{$abbrev}l-#{$size}, .#{$abbrev}x-#{$size}
    #{$prop}-left: $length

// HTML html

@extend .bg-frame

// HEADER header

@extend .mb-0, .jumbotron, .rounded-0, .py-4

// MAIN main

@extend .mt-5, .mb-8
&.container-fluid
  @extend .px-5

// TABLES table

@extend .table
&:last-of-type
  @extend .mb-0

// HEADINGS @include headings()

font-family: $font-family-headings
letter-spacing: -1px

// HEADER headings header

@include headings()
  @extend .text-muted, .mb-0, .fw-3
  font-family: $font-family-headings-header
  span
    @extend .fw-8
    color: $black

// MAIN Headings main

@include headings()
  @extend .mt-6, .mb-3
.row:first-child .col
  @include headings(1, 6, ':first-child')
    @extend .mt-0

// NAVBARS // Top main nav body > nav, header > nav

@extend .navbar-dark, .bg-dark, .fw-3
a.dropdown-item
  @extend .fw-3

// Footer nav footer nav

@extend .navbar-light, .bg-frame

// Hamburger for mobile .navbar-toggler

color: $gray-900

// Space simple text like links .navbar-expand-lg

.navbar-nav
  .nav-link,
  .navbar-text
    @extend .px-9

// FORMS form

// Checkbox label with mouse pointer
.custom-checkbox,
.custom-radio
  label.custom-control-label
    cursor: pointer

// COLLAPSE // Hide link color on collapse links a

@extend .text-muted

// CODE // Fix margings, paddings and background-color code

padding: 2px 4px
background-color: $gray-100

pre.highlight

@extend .p-2
font-size: 75%
letter-spacing: -0.1px
border: $border-width solid $border-color
border-radius: $border-radius
code
  padding: unset
  background-color: transparent

// CARDS // Remove top margins for `last-of-type` objects .card

p:last-of-type,
ul:last-of-type,
pre:last-of-type
  @extend .mb-0
.card-title:first-of-type
  @extend .mt-0

// BLOCKQUOTES .blockquote

@extend .px-9, .py-1
border-left: 2px solid $border-color
p
  @extend .mb-1
footer
  @extend .text-muted, .small

// DROPDOWNS: move caret nearer .dropdown-toggle::after

margin-left: $caret-width * .3
vertical-align: $caret-width * .3

// ALERTS // Fix dark link colors inside alerts $alert_color_levels: -10 -9 5 6 // Loop @each $color, $value in $theme-colors

.alert-#{$color}
  @include alert-variant(theme-color-level($color, nth($alert_color_levels, 1)), theme-color-level($color, nth($alert_color_levels, 2)), theme-color-level($color, nth($alert_color_levels, 3)))
  a
    color: theme-color-level($color, nth($alert_color_levels, 4))

// extend alert links class .alert a

@extend .alert-link

// TEMPUS .tempus-past, .tempus-empty

@extend .text-muted

.tempus-difference

@extend .text-muted, .small

// PAGE_INFO pageinfoModal

table
  @extend .table-sm
  tr:first-child td
    border-top: 0
  tr
    td:first-child
      @extend .text-right
    td:last-child
      @extend .text-muted

// DATE picker .datepicker-container

font-size: $font-size-sm

// ADD-BOOK input-form

h3
  @extend .py-3
small
  @extend .form-text, .text-muted, .ml-1

// CODE SYNTAX @import “any_theme/syntax_default”