1 | @import './spacing';
|
2 |
|
3 |
|
4 |
|
5 |
|
6 | $brand-blue: #023365 !default;
|
7 | $brand-green: #00E6B2 !default;
|
8 | $crimson: #E24763 !default;
|
9 | $amber: #FFD879 !default;
|
10 | $dark-gray-1: #293036 !default;
|
11 | $dark-gray-2: #46525C !default;
|
12 | $dark-gray-3: #677784 !default;
|
13 | $light-gray-1: #CBD5E0 !default;
|
14 | $light-gray-1_5: #F0F4F9 !default;
|
15 | $light-gray-2: #E2E8F0 !default;
|
16 | $light-gray-3: #F7FAFC !default;
|
17 | $white: #fff !default;
|
18 |
|
19 |
|
20 | $box-shadow-xs: 0 2px 5px 0 rgba(60,66,87, .12),0 1px 1px 0 rgba(0,0,0, .12);
|
21 | $box-shadow-sm: 0 4px 6px rgba(50,50,93,.11), 0 1px 3px rgba(0,0,0,.08);
|
22 | $box-shadow-md: 0 7px 14px 0 rgba(60,66,87, .12), 0 3px 6px 0 rgba(0,0,0, .12);
|
23 | $box-shadow-lg: 0 15px 35px 0 rgba(60,66,87, .12), 0 5px 15px 0 rgba(0,0,0, .12);
|
24 | $box-shadow-xl: 0 50px 100px 0 rgba(60,66,87, .12), 0 15px 35px 0 rgba(60,66,87, .12), 0 5px 15px 0 rgba(0,0,0, .12);
|
25 |
|
26 | $box-shadow: $box-shadow-md;
|
27 |
|
28 |
|
29 | $primary: $brand-blue !default;
|
30 | $secondary: $light-gray-3 !default;
|
31 | $accent: $brand-green !default;
|
32 | $success: $brand-green !default;
|
33 | $danger: $crimson !default;
|
34 | $warning: $amber !default;
|
35 | $light: $white !default;
|
36 | $dark: $dark-gray-1 !default;
|
37 |
|
38 | $theme-colors: () !default;
|
39 |
|
40 | $theme-colors: map-merge(
|
41 | (
|
42 | "primary" : $primary,
|
43 | "secondary" : $secondary,
|
44 | "success" : $success,
|
45 | "accent" : $accent,
|
46 | "warning" : $warning,
|
47 | "danger" : $danger,
|
48 | "light" : $light,
|
49 | "dark" : $dark,
|
50 | "dark-gray-1" : $dark-gray-1,
|
51 | "dark-gray-2" : $dark-gray-2,
|
52 | "dark-gray-3" : $dark-gray-3,
|
53 | "light-gray-1" : $light-gray-1,
|
54 | "light-gray-1_5": $light-gray-1,
|
55 | "light-gray-2" : $light-gray-2,
|
56 | "light-gray-3" : $light-gray-3
|
57 | ),
|
58 | $theme-colors
|
59 | );
|
60 |
|
61 |
|
62 | $light-gradient: linear-gradient(180deg, $light 0%, $light-gray-3 100%) !default;
|
63 | $gradient-a: linear-gradient(180deg, $brand-green 0%, $brand-blue 100%) !default;
|
64 | $gradient-b: linear-gradient(180deg, #0093A2 0%, $brand-green 100%) !default;
|
65 |
|
66 |
|
67 | $body-bg: $light !default;
|
68 | $body-color: $dark !default;
|
69 |
|
70 |
|
71 | $link-color: $primary !default;
|
72 | $link-decoration: none !default;
|
73 | $link-hover-color: darken($link-color, 15%) !default;
|
74 | $link-hover-decoration: underline !default;
|
75 |
|
76 |
|
77 | $grid-breakpoints: (
|
78 | xs: 0,
|
79 | sm: 576px,
|
80 | md: 768px,
|
81 | lg: 992px,
|
82 | xl: 1200px,
|
83 | xxl: 1600px,
|
84 | ) !default;
|
85 |
|
86 | $container-max-widths: (
|
87 | sm: 540px,
|
88 | md: 720px,
|
89 | lg: 960px,
|
90 | xl: 1140px,
|
91 | ) !default;
|
92 |
|
93 | $grid-columns: 12 !default;
|
94 | $grid-gutter-width: $spacing-md !default;
|
95 |
|
96 | $container-padding-x: $grid-gutter-width / 2 !default;
|
97 |
|
98 | $spacers: () !default;
|
99 | $spacers: map-merge(
|
100 | (
|
101 | 0: 0,
|
102 | 1: $spacing-2xs,
|
103 | 2: $spacing-xs,
|
104 | 3: $spacing-sm,
|
105 | 4: $spacing-md,
|
106 | 5: $spacing-lg,
|
107 | 6: $spacing-xl,
|
108 | 7: $spacing-2xl,
|
109 | ),
|
110 | $spacers
|
111 | );
|
112 |
|
113 | $negative-spacers: negativify-map($spacers) !default;
|
114 |
|
115 | $layout-spacers: () !default;
|
116 | $layout-spacers: map-merge(
|
117 | (
|
118 | 'layout-1': $layout-2xs,
|
119 | 'layout-2': $layout-xs,
|
120 | 'layout-3': $layout-sm,
|
121 | 'layout-4': $layout-md,
|
122 | 'layout-5': $layout-lg,
|
123 | 'layout-6': $layout-xl,
|
124 | 'layout-7': $layout-2xl,
|
125 | ),
|
126 | $layout-spacers
|
127 | );
|
128 |
|
129 |
|
130 | @import url('https://fonts.googleapis.com/css?family=IBM+Plex+Sans:200,300,400,500,700&display=swap');
|
131 | @import url('https://fonts.googleapis.com/css?family=IBM+Plex+Mono:400,500&display=swap');
|
132 | $font-family-sans-serif: 'IBM Plex Sans', sans-serif !default;
|
133 | $font-family-monospace: 'IBM Plex Mono', monospace !default;
|
134 | $font-family-base: $font-family-sans-serif !default;
|
135 | $font-size-base: 1rem !default;
|
136 | $font-size-lg: $font-size-base * 1.25 !default;
|
137 | $font-size-sm: $font-size-base * .875 !default;
|
138 | $font-weight-lighter: 100 !default;
|
139 | $font-weight-light: 200 !default;
|
140 | $font-weight-normal: 400 !default;
|
141 | $font-weight-bold: 500 !default;
|
142 | $font-weight-bolder: 700 !default;
|
143 |
|
144 |
|
145 | $font-weight-base: $font-weight-normal !default;
|
146 | $line-height-base: 1.5 !default;
|
147 | $line-height-sm: 1.2 !default;
|
148 | $line-height-lg: 1.7 !default;
|
149 |
|
150 | $lead-font-size: $font-size-lg !default;
|
151 | $lead-font-weight: 300 !default;
|
152 |
|
153 | $paragraph-line-height: 1.5 !default;
|
154 | $paragraph-margin-bottom: $spacing-md !default;
|
155 |
|
156 | $text-muted: $dark-gray-3;
|
157 |
|
158 |
|
159 | $h1-font-size: $font-size-base * 2.5 !default;
|
160 | $h2-font-size: $font-size-base * 2 !default;
|
161 | $h3-font-size: $font-size-base * 1.75 !default;
|
162 | $h4-font-size: $font-size-base * 1.5 !default;
|
163 | $h5-font-size: $font-size-base * 1.25 !default;
|
164 | $h6-font-size: $font-size-base !default;
|
165 |
|
166 | $headings-margin-bottom: $spacing-xs !default;
|
167 | $headings-font-family: $font-family-base !default;
|
168 | $headings-font-style: normal !default;
|
169 | $headings-font-weight: $font-weight-bold !default;
|
170 | $headings-line-height: 1.2 !default;
|
171 | $headings-color: inherit;
|
172 |
|
173 |
|
174 | $display-1-font-size: $font-size-base * 6 !default;
|
175 | $display-2-font-size: $font-size-base * 5.5 !default;
|
176 | $display-3-font-size: $font-size-base * 4.5 !default;
|
177 | $display-4-font-size: $font-size-base * 3.5 !default;
|
178 |
|
179 | $display-font-family: $headings-font-family !default;
|
180 | $display-font-weight: 200 !default;
|
181 |
|
182 |
|
183 |
|
184 | $border-width: 1px !default;
|
185 | $border-color: $light-gray-2 !default;
|
186 |
|
187 | $border-radius: .25rem !default;
|
188 | $border-radius-lg: .3rem !default;
|
189 | $border-radius-sm: .2rem !default;
|
190 |
|
191 |
|
192 |
|
193 | $input-btn-padding-y: $spacing-xs !default;
|
194 | $input-btn-padding-x: $spacing-md !default;
|
195 | $input-btn-font-family: $font-family-base !default;
|
196 | $input-btn-font-size: $font-size-base !default;
|
197 | $input-btn-line-height: $line-height-base !default;
|
198 |
|
199 | $label-font-size: 14px !default;
|
200 |
|
201 | $radio-checkbox-font-size: $label-font-size !default;
|
202 | $radio-checkbox-font-weight: $font-weight-base !default;
|