theme/boost/scss/preset/default.scss

   1 /* stylelint-disable color-hex-length */
   2 /**
   3  * Default preset file.
   4  *
   5  * Use this space to customise variables, create mixins and override SCSS.
   6  */
   7
   8 // Colors
   9 $gray-dark:                 #373a3c !default;
  10 $gray:                      #55595c !default;
  11 $gray-light:                #818a91 !default;
  12 $gray-lighter:              #eceeef !default;
  13 $gray-lightest:             #f7f7f9 !default;
  14
  15 $brand-primary:             #1177d1 !default;
  16 $brand-info:                #ad53b2 !default;
  17 $brand-success:             #77b300 !default;
  18 $brand-warning:             #ff8800 !default;
  19 $brand-danger:              #ff4136 !default;
  20 $brand-inverse:             $gray-dark !default;
  21 $navbar-height:             50px !default;
  22
  23 // Spacing
  24 $spacer:   1rem !default;
  25 $spacer-x: $spacer !default;
  26 $spacer-y: $spacer !default;
  27 $border-width: 1px !default;
  28
  29 // Body
  30 $body-bg:    #f4f4f4 !default;
  31 $body-color: #262626 !default;
  32
  33 // Typography
  34 $font-family-sans-serif: "Open Sans", "Helvetica Neue", Arial, sans-serif !default;
  35 $font-size-root: 14px !default;
  36
  37 // Tables
  38 $table-bg:                      transparent !default;
  39 $table-bg-accent:               #fafafa !default;
  40 $table-bg-hover:                lighten($brand-primary, 55%) !default;
  41 $table-bg-active:               $table-bg-hover !default;
  42 $table-border-color:            #f4f4f4 !default;
  43
  44 // Dropdowns
  45 $dropdown-border-color:          #e2e2e2 !default;
  46 $dropdown-link-color:            $body-color;
  47
  48 // Navbar
  49 $navbar-light-color:                rgba(0, 0, 0, .535) !default;
  50 $navbar-light-hover-color:          $brand-primary !default;
  51 $navbar-light-active-color:         $brand-primary !default;
  52
  53 // Cards
  54 $card-border-radius:       0 !default;
  55 $card-border-color:        rgba(238, 238, 238, 1) !default;
  56
  57 // Breadcrumbs
  58 $breadcrumb-bg:                 transparent !default;
  59 $breadcrumb-padding-x:          0 !default;
  60 $breadcrumb-divider: "/" !default;
  61 $breadcrumb-divider-rtl: "/" !default;
  62
  63 // Import everything.
  64 @import "moodle";
  65
  66 /**
  67  * Navigation bar identity.
  68  */
  69 .navbar-light {
  70     background-color: #fff;
  71     border-bottom: $border-width solid #e5e5e5;
  72
  73     .container {
  74         padding-left: 0;
  75         padding-right: 0;
  76     }
  77
  78     .navbar-brand {
  79         padding-left: 1rem;
  80         padding-right: 1rem;
  81         margin-right: $spacer * 2;
  82         color: #fff;
  83         background-color: $brand-primary;
  84         @include hover-focus {
  85             color: #fff;
  86         }
  87         &.has-logo {
  88             color: $brand-primary;
  89             background-color: transparent;
  90             @include hover-focus {
  91                 color: $brand-primary;
  92             }
  93         }
  94     }
  95
  96     .navbar-nav {
  97         .nav-item + .nav-item {
  98             margin-left: $spacer * 2;
  99         }
 100         .nav-link {
 101             font-size: $font-size-sm;
 102             text-transform: uppercase;
 103             letter-spacing: 1px;
 104         }
 105     }
 106 }
 107
 108 /**
 109  * Styling the dropdown menus.
 110  */
 111 .dropdown-menu {
 112     font-size: 14px;
 113     border-radius: 0;
 114     .dropdown-item {
 115         padding-top: 8px;
 116         padding-bottom: 8px;
 117         border-bottom: $border-width solid $dropdown-border-color;
 118         &:last-child {
 119             border-bottom: 0;
 120         }
 121     }
 122     .dropdown-divider {
 123         display: none;
 124     }
 125 }
 126
 127 /**
 128  * User picture.
 129  */
 130 .userpicture {
 131     border-radius: 50%;
 132 }
 133
 134 /**
 135  * For background in content areas.
 136  */
 137 #page.container-fluid {
 138     padding: 0 (2 * $spacer);
 139 }
 140
 141 #block-region-side-pre {
 142     padding-left: 0;
 143 }
 144
 145 /**
 146  * Dashboard styling.
 147  */
 148 #page-my-index {
 149     #region-main {
 150         background-color: transparent;
 151         border: 0;
 152         padding: 0;
 153     }
 154 }
 155
 156 /**
 157  * Blocks.
 158  */
 159 .block-region .card-block {
 160     .card-title {
 161         padding-bottom: ($spacer/2);
 162         font-size: 1.143rem;
 163         font-weight: 600;
 164         text-transform: uppercase;
 165     }
 166 }
 167
 168 /**
 169  * Navigation.
 170  */
 171 .block_navigation,
 172 .block_settings {
 173     .block_tree .tree_item {
 174         margin: ($spacer/2) 0;
 175     }
 176 }
 177
 178 /**
 179  * Form styles.
 180  */
 181
 182 .form-group {
 183     margin-top: ($spacer/2);
 184 }
 185
 186 .form-inline .form-group {
 187     margin-top: 0;
 188 }
 189
 190