_variables.scss 2.88 KB
Newer Older
1 2
// lms - utilities - variables
// ====================
3

4 5 6 7 8 9 10 11
// #GRID:           Grid and layout variables
// #COLORS:         Base, palette and theme color definitions + application
// #TYPOGRAPHY:     Font definitions and scales
// #ICONS:          Icon specific colors + other styling

// ----------------------------
// #GRID
// ----------------------------
12
$lms-max-width: 1180px !default;
13

14 15 16 17
$grid-breakpoints-sm: 576px !default;
$grid-breakpoints-md: 768px !default;
$grid-breakpoints-lg: 992px !default;

18 19 20
// ----------------------------
// #COLORS
// ----------------------------
21

22 23 24 25 26 27 28 29 30
$lms-gray: palette(grayscale, base) !default;
$lms-background-color: palette(grayscale, x-back) !default;
$lms-container-background-color: $white !default;
$lms-border-color: palette(grayscale, back) !default;
$lms-label-color: palette(grayscale, black) !default;
$lms-active-color: palette(primary, base) !default;
$lms-preview-menu-color: #c8c8c8 !default;
$success-color: palette(success, accent) !default;
$success-color-hover: palette(success, text) !default;
AlasdairSwan committed
31

32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47
$button-bg-hover-color: $white !default;

$white-transparent: rgba(255, 255, 255, 0) !default;
$white-opacity-40: rgba(255, 255, 255, 0.4) !default;
$white-opacity-60: rgba(255, 255, 255, 0.6) !default;
$white-opacity-70: rgba(255, 255, 255, 0.7) !default;
$white-opacity-80: rgba(255, 255, 255, 0.8) !default;

$black:     rgb(0,0,0) !default;
$black-t0:  rgba($black, 0.125) !default;
$black-t1:  rgba($black, 0.25) !default;
$black-t2:  rgba($black, 0.5) !default;
$black-t3:  rgba($black, 0.75) !default;

$light-grey-transparent: rgba(200,200,200, 0) !default;
$light-grey-solid: rgba(200,200,200, 1) !default;
AlasdairSwan committed
48

49 50
$header-border-color: $gray-l1 !default;

51 52 53 54 55 56 57 58 59 60 61
// ----------------------------
// #TYPOGRAPHY
// ----------------------------
$font-light: 300 !default;
$font-regular: 400 !default;
$font-semibold: 600 !default;
$font-bold: 700 !default;

// ----------------------------
// #ICONS
// ----------------------------
62 63 64
// Icons
$lms-dark-icon-color: $white !default;
$lms-dark-icon-background-color: palette(grayscale, black) !default;
65

66
$site-status-color: rgb(182,37,103) !default;
67 68

$shadow-l1: rgba(0,0,0,0.1) !default;
69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88

// ----------------------------
// #ALERTS
// ----------------------------

$state-success-text:             $black !default;
$state-success-bg:               #dff0d8 !default;
$state-success-border:           darken($state-success-bg, 5%) !default;

$state-info-text:                $black !default;
$state-info-bg:                  #d9edf7 !default;
$state-info-border:              darken($state-info-bg, 7%) !default;

$state-warning-text:             $black !default;
$state-warning-bg:               #fcf8e3 !default;
$state-warning-border:           darken($state-warning-bg, 5%) !default;

$state-danger-text:              $black !default;
$state-danger-bg:                #f2dede !default;
$state-danger-border:            darken($state-danger-bg, 5%) !default;