MDL-55593 Theme: Style for the login page
[moodle.git] / theme / noname / scss / preset-default.scss
CommitLineData
d48dbde9
FM
1/**
2 * Default preset file.
3 *
4 * Use this space to customise variables, create mixins and override SCSS.
5 */
6
7// Variables and mixins here. Do not forget to make your variable defaults.
8
28762213
BR
9// Variables
10//
11// Copy settings from this file into the provided `_custom.scss` to override
12// the Bootstrap defaults without modifying key, versioned files.
13
14
15// Table of Contents
16//
17// Colors
18// Options
19// Spacing
20// Body
21// Links
22// Grid breakpoints
23// Grid containers
24// Grid columns
25// Fonts
26// Components
27
28@mixin _assert-ascending($map, $map-name) {
29 $prev-key: null;
30 $prev-num: null;
31 @each $key, $num in $map {
32 @if $prev-num == null {
33 // Do nothing
34 } @else if not comparable($prev-num, $num) {
35 @warn "Potentially invalid value for #{$map-name}: This map must be in ascending order, but key '#{$key}' has value #{$num} whose unit makes it incomparable to #{$prev-num}, the value of the previous key '#{$prev-key}' !";
36 } @else if $prev-num >= $num {
37 @warn "Invalid value for #{$map-name}: This map must be in ascending order, but key '#{$key}' has value #{$num} which isn't greater than #{$prev-num}, the value of the previous key '#{$prev-key}' !";
38 }
39 $prev-key: $key;
40 $prev-num: $num;
41 }
42}
43
44// General variable structure
45//
46// Variable format should follow the `$component-modifier-state-property` order.
47
48
49// Colors
50//
51// Grayscale and brand colors for use across Bootstrap.
52
53$gray-dark: #373a3c !default;
54$gray: #55595c !default;
55$gray-light: #818a91 !default;
56$gray-lighter: #eceeef !default;
57$gray-lightest: #f7f7f9 !default;
58
4a59602a
BR
59$brand-primary: #00acdf !default;
60$brand-success: #77b300 !default;
61$brand-info: #9954bb !default;
62$brand-warning: #ff8800 !default;
63$brand-danger: #ff4136 !default;
28762213
BR
64$brand-inverse: $gray-dark !default;
65
66
67// Options
68//
69// Quickly modify global styling by enabling or disabling optional features.
70
71$enable-flex: false !default;
72$enable-rounded: true !default;
73$enable-shadows: false !default;
74$enable-gradients: false !default;
75$enable-transitions: false !default;
76$enable-hover-media-query: false !default;
77$enable-grid-classes: true !default;
78$enable-print-styles: true !default;
79
80
81// Spacing
82//
83// Control the default styling of most Bootstrap elements by modifying these
84// variables. Mostly focused on spacing.
85// You can add more entries to the $spacers map, should you need more variation.
86
87$spacer: 1rem !default;
88$spacer-x: $spacer !default;
89$spacer-y: $spacer !default;
90$spacers: (
91 0: (
92 x: 0,
93 y: 0
94 ),
95 1: (
96 x: $spacer-x,
97 y: $spacer-y
98 ),
99 2: (
100 x: ($spacer-x * 1.5),
101 y: ($spacer-y * 1.5)
102 ),
103 3: (
104 x: ($spacer-x * 3),
105 y: ($spacer-y * 3)
106 )
107) !default;
108$border-width: 1px !default;
109
110
111// Body
112//
113// Settings for the `<body>` element.
114
4a59602a
BR
115$body-bg: #f4f4f4 !default;
116$body-color: #333333 !default;
28762213
BR
117
118
119// Links
120//
121// Style anchor elements.
122
123$link-color: $brand-primary !default;
124$link-decoration: none !default;
125$link-hover-color: darken($link-color, 15%) !default;
126$link-hover-decoration: underline !default;
127
128
129// Grid breakpoints
130//
131// Define the minimum dimensions at which your layout will change,
132// adapting to different screen sizes, for use in media queries.
133
134$grid-breakpoints: (
135 xs: 0,
136 sm: 544px,
137 md: 768px,
138 lg: 992px,
139 xl: 1200px
140) !default;
141@include _assert-ascending($grid-breakpoints, "$grid-breakpoints");
142
143
144// Grid containers
145//
146// Define the maximum width of `.container` for different screen sizes.
147
148$container-max-widths: (
149 sm: 576px,
150 md: 720px,
151 lg: 940px,
152 xl: 1140px
153) !default;
154@include _assert-ascending($container-max-widths, "$container-max-widths");
155
156
157// Grid columns
158//
159// Set the number of columns and specify the width of the gutters.
160
161$grid-columns: 12 !default;
162$grid-gutter-width: 30px !default;
163
164
165// Typography
166//
167// Font, line-height, and color for body text, headings, and more.
168
4a59602a 169$font-family-sans-serif: "Open Sans", "Helvetica Neue", Arial, sans-serif !default;
28762213
BR
170$font-family-serif: Georgia, "Times New Roman", Times, serif !default;
171$font-family-monospace: Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !default;
172$font-family-base: $font-family-sans-serif !default;
173
174// Pixel value used to responsively scale all typography. Applied to the `<html>` element.
4a59602a 175$font-size-root: 14px !default;
28762213
BR
176
177$font-size-base: 1rem !default;
178$font-size-lg: 1.25rem !default;
179$font-size-sm: .875rem !default;
180$font-size-xs: .75rem !default;
181
182$line-height-base: 1.5 !default;
183
184$font-size-h1: 2.5rem !default;
185$font-size-h2: 2rem !default;
186$font-size-h3: 1.75rem !default;
187$font-size-h4: 1.5rem !default;
188$font-size-h5: 1.25rem !default;
189$font-size-h6: 1rem !default;
190
191$display1-size: 6rem !default;
192$display2-size: 5.5rem !default;
193$display3-size: 4.5rem !default;
194$display4-size: 3.5rem !default;
195
196$display1-weight: 300 !default;
197$display2-weight: 300 !default;
198$display3-weight: 300 !default;
199$display4-weight: 300 !default;
200
201$headings-margin-bottom: ($spacer / 2) !default;
202$headings-font-family: inherit !default;
203$headings-font-weight: 500 !default;
204$headings-line-height: 1.1 !default;
205$headings-color: inherit !default;
206
207$lead-font-size: 1.25rem !default;
208$lead-font-weight: 300 !default;
209
210$small-font-size: 80% !default;
211
212$text-muted: $gray-light !default;
213
214$abbr-border-color: $gray-light !default;
215
216$blockquote-small-color: $gray-light !default;
217$blockquote-font-size: ($font-size-base * 1.25) !default;
218$blockquote-border-color: $gray-lighter !default;
219$blockquote-border-width: .25rem !default;
220
221$hr-border-color: rgba(0,0,0,.1) !default;
222$hr-border-width: $border-width !default;
223
224$mark-padding: .2em !default;
225
226$dt-font-weight: bold !default;
227
228$kbd-box-shadow: inset 0 -.1rem 0 rgba(0,0,0,.25) !default;
229$nested-kbd-font-weight: bold !default;
230
231$list-inline-padding: 5px !default;
232
233
234// Components
235//
236// Define common padding and border radius sizes and more.
237
238$line-height-lg: (4 / 3) !default;
239$line-height-sm: 1.5 !default;
240
241$border-radius: .25rem !default;
242$border-radius-lg: .3rem !default;
243$border-radius-sm: .2rem !default;
244
245$component-active-color: #fff !default;
246$component-active-bg: $brand-primary !default;
247
248$caret-width: .3em !default;
249$caret-width-lg: $caret-width !default;
250
251
252// Tables
253//
254// Customizes the `.table` component with basic values, each used across all table variations.
255
256$table-cell-padding: .75rem !default;
257$table-sm-cell-padding: .3rem !default;
258
259$table-bg: transparent !default;
260$table-bg-accent: rgba(0,0,0,.05) !default;
261$table-bg-hover: rgba(0,0,0,.075) !default;
262$table-bg-active: $table-bg-hover !default;
263
264$table-border-width: $border-width !default;
265$table-border-color: $gray-lighter !default;
266
267
268// Buttons
269//
270// For each of Bootstrap's buttons, define text, background and border color.
271
272$btn-padding-x: 1rem !default;
273$btn-padding-y: .5rem !default;
274$btn-line-height: 1.25 !default;
275$btn-font-weight: normal !default;
276$btn-box-shadow: inset 0 1px 0 rgba(255,255,255,.15), 0 1px 1px rgba(0,0,0,.075) !default;
277$btn-active-box-shadow: inset 0 3px 5px rgba(0,0,0,.125) !default;
278
279$btn-primary-color: #fff !default;
280$btn-primary-bg: $brand-primary !default;
281$btn-primary-border: $btn-primary-bg !default;
282
283$btn-secondary-color: $gray-dark !default;
284$btn-secondary-bg: #fff !default;
285$btn-secondary-border: #ccc !default;
286
287$btn-info-color: #fff !default;
288$btn-info-bg: $brand-info !default;
289$btn-info-border: $btn-info-bg !default;
290
291$btn-success-color: #fff !default;
292$btn-success-bg: $brand-success !default;
293$btn-success-border: $btn-success-bg !default;
294
295$btn-warning-color: #fff !default;
296$btn-warning-bg: $brand-warning !default;
297$btn-warning-border: $btn-warning-bg !default;
298
299$btn-danger-color: #fff !default;
300$btn-danger-bg: $brand-danger !default;
301$btn-danger-border: $btn-danger-bg !default;
302
303$btn-link-disabled-color: $gray-light !default;
304
305$btn-padding-x-sm: .5rem !default;
306$btn-padding-y-sm: .25rem !default;
307
308$btn-padding-x-lg: 1.5rem !default;
309$btn-padding-y-lg: .75rem !default;
310
311$btn-block-spacing-y: .5rem !default;
312$btn-toolbar-margin: .5rem !default;
313
314// Allows for customizing button radius independently from global border radius
315$btn-border-radius: $border-radius !default;
316$btn-border-radius-lg: $border-radius-lg !default;
317$btn-border-radius-sm: $border-radius-sm !default;
318
319
320// Forms
321
322$input-padding-x: .75rem !default;
323$input-padding-y: .5rem !default;
324$input-line-height: 1.25 !default;
325
326$input-bg: #fff !default;
327$input-bg-disabled: $gray-lighter !default;
328
329$input-color: $gray !default;
330$input-border-color: rgba(0,0,0,.15) !default;
331$input-btn-border-width: $border-width !default; // For form controls and buttons
332$input-box-shadow: inset 0 1px 1px rgba(0,0,0,.075) !default;
333
334$input-border-radius: $border-radius !default;
335$input-border-radius-lg: $border-radius-lg !default;
336$input-border-radius-sm: $border-radius-sm !default;
337
338$input-bg-focus: $input-bg;
339$input-border-focus: #66afe9 !default;
340$input-box-shadow-focus: rgba(102,175,233,.6) !default;
341$input-color-focus: $input-color;
342
343$input-color-placeholder: #999 !default;
344
345$input-padding-x-sm: .5rem !default;
346$input-padding-y-sm: .25rem !default;
347
348$input-padding-x-lg: 1.5rem !default;
349$input-padding-y-lg: .75rem !default;
350
351$input-height: (($font-size-base * $line-height-base) + ($input-padding-y * 2)) !default;
352$input-height-lg: (($font-size-lg * $line-height-lg) + ($input-padding-y-lg * 2)) !default;
353$input-height-sm: (($font-size-sm * $line-height-sm) + ($input-padding-y-sm * 2)) !default;
354
355$form-group-margin-bottom: $spacer-y !default;
356
357$input-group-addon-bg: $gray-lighter !default;
358$input-group-addon-border-color: $input-border-color !default;
359
360$cursor-disabled: not-allowed !default;
361
362$custom-control-gutter: 1.5rem !default;
363$custom-control-spacer-x: 1rem !default;
364$custom-control-spacer-y: .25rem !default;
365
366$custom-control-indicator-size: 1rem !default;
367$custom-control-indicator-bg: #ddd !default;
368$custom-control-indicator-bg-size: 50% 50% !default;
369$custom-control-indicator-box-shadow: inset 0 .25rem .25rem rgba(0,0,0,.1) !default;
370
371$custom-control-disabled-cursor: $cursor-disabled !default;
372$custom-control-disabled-indicator-bg: #eee !default;
373$custom-control-disabled-description-color: #767676 !default;
374
375$custom-control-checked-indicator-color: #fff !default;
376$custom-control-checked-indicator-bg: #0074d9 !default;
377$custom-control-checked-indicator-box-shadow: none !default;
378
379$custom-control-focus-indicator-box-shadow: 0 0 0 .075rem #fff, 0 0 0 .2rem #0074d9 !default;
380
381$custom-control-active-indicator-color: #fff !default;
382$custom-control-active-indicator-bg: #84c6ff !default;
383$custom-control-active-indicator-box-shadow: none !default;
384
385$custom-checkbox-radius: $border-radius !default;
386$custom-checkbox-checked-icon: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E") !default;
387$custom-checkbox-indeterminate-bg: #0074d9 !default;
388$custom-checkbox-indeterminate-icon: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 4'%3E%3Cpath stroke='%23fff' d='M0 2h4'/%3E%3C/svg%3E") !default;
389$custom-checkbox-indeterminate-box-shadow: none !default;
390
391$custom-radio-radius: 50% !default;
392$custom-radio-checked-icon: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='%23fff'/%3E%3C/svg%3E") !default;
393
394$custom-select-padding-x: .75rem !default;
395$custom-select-padding-y: .375rem !default;
396$custom-select-indicator-padding: 1rem !default; // Extra padding to account for the presence of the background-image based indicator
397$custom-select-color: $input-color !default;
398$custom-select-disabled-color: $gray-light !default;
399$custom-select-bg: #fff !default;
400$custom-select-disabled-bg: $gray-lighter !default;
401$custom-select-bg-size: 8px 10px !default; // In pixels because image dimensions
402$custom-select-indicator: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23333' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E") !default;
403$custom-select-border-width: $input-btn-border-width !default;
404$custom-select-border-color: $input-border-color !default;
405$custom-select-border-radius: $border-radius !default;
406
407$custom-select-focus-border-color: #51a7e8 !default;
408$custom-select-focus-box-shadow: inset 0 1px 2px rgba(0, 0, 0, .075), 0 0 5px rgba(81, 167, 232, .5) !default;
409
410$custom-select-sm-padding-y: .2rem !default;
411$custom-select-sm-font-size: 75% !default;
412
413$custom-file-height: 2.5rem !default;
414$custom-file-width: 14rem !default;
415$custom-file-focus-box-shadow: 0 0 0 .075rem #fff, 0 0 0 .2rem #0074d9 !default;
416
417$custom-file-padding-x: .5rem !default;
418$custom-file-padding-y: 1rem !default;
419$custom-file-line-height: 1.5 !default;
420$custom-file-color: #555 !default;
421$custom-file-bg: #fff !default;
422$custom-file-border-width: $border-width !default;
423$custom-file-border-color: #ddd !default;
424$custom-file-border-radius: $border-radius !default;
425$custom-file-box-shadow: inset 0 .2rem .4rem rgba(0,0,0,.05) !default;
426$custom-file-button-color: $custom-file-color !default;
427$custom-file-button-bg: #eee !default;
428$custom-file-text: (
429 placeholder: (
430 en: "Choose file..."
431 ),
432 button-label: (
433 en: "Browse"
434 )
435) !default;
436
437
438// Form validation icons
439$form-icon-success: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%235cb85c' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3E%3C/svg%3E") !default;
440$form-icon-warning: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23f0ad4e' d='M4.4 5.324h-.8v-2.46h.8zm0 1.42h-.8V5.89h.8zM3.76.63L.04 7.075c-.115.2.016.425.26.426h7.397c.242 0 .372-.226.258-.426C6.726 4.924 5.47 2.79 4.253.63c-.113-.174-.39-.174-.494 0z'/%3E%3C/svg%3E") !default;
441$form-icon-danger: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23d9534f' viewBox='-2 -2 7 7'%3E%3Cpath stroke='%23d9534f' d='M0 0l3 3m0-3L0 3'/%3E%3Ccircle r='.5'/%3E%3Ccircle cx='3' r='.5'/%3E%3Ccircle cy='3' r='.5'/%3E%3Ccircle cx='3' cy='3' r='.5'/%3E%3C/svg%3E") !default;
442
443
444// Dropdowns
445//
446// Dropdown menu container and contents.
447
448$dropdown-min-width: 160px !default;
449$dropdown-padding-y: 5px !default;
450$dropdown-margin-top: 2px !default;
451$dropdown-bg: #fff !default;
452$dropdown-border-color: rgba(0,0,0,.15) !default;
453$dropdown-border-width: $border-width !default;
454$dropdown-divider-bg: #e5e5e5 !default;
455$dropdown-box-shadow: 0 6px 12px rgba(0,0,0,.175) !default;
456
457$dropdown-link-color: $gray-dark !default;
458$dropdown-link-hover-color: darken($gray-dark, 5%) !default;
459$dropdown-link-hover-bg: #f5f5f5 !default;
460
461$dropdown-link-active-color: $component-active-color !default;
462$dropdown-link-active-bg: $component-active-bg !default;
463
464$dropdown-link-disabled-color: $gray-light !default;
465
466$dropdown-item-padding-x: 20px !default;
467
468$dropdown-header-color: $gray-light !default;
469
470
471// Z-index master list
472//
473// Warning: Avoid customizing these values. They're used for a bird's eye view
474// of components dependent on the z-axis and are designed to all work together.
475
476$zindex-dropdown-backdrop: 990 !default;
477$zindex-navbar: 1000 !default;
478$zindex-dropdown: 1000 !default;
479$zindex-popover: 1060 !default;
480$zindex-tooltip: 1070 !default;
481$zindex-navbar-fixed: 1030 !default;
482$zindex-navbar-sticky: 1030 !default;
483$zindex-modal-bg: 1040 !default;
484$zindex-modal: 1050 !default;
485
486
487// Navbar
488
489$navbar-border-radius: $border-radius !default;
490$navbar-padding-x: $spacer !default;
491$navbar-padding-y: ($spacer / 2) !default;
492$navbar-brand-padding-y: .25rem !default;
493
494$navbar-dark-color: rgba(255,255,255,.5) !default;
495$navbar-dark-hover-color: rgba(255,255,255,.75) !default;
496$navbar-dark-active-color: rgba(255,255,255,1) !default;
497$navbar-dark-disabled-color: rgba(255,255,255,.25) !default;
498
4a59602a
BR
499$navbar-light-color: rgba(0,0,0,.535) !default;
500$navbar-light-hover-color: $brand-primary !default;
501$navbar-light-active-color: $brand-primary !default;
28762213
BR
502$navbar-light-disabled-color: rgba(0,0,0,.15) !default;
503
504
505// Navs
506
507$nav-item-margin: .2rem !default;
508$nav-item-inline-spacer: 1rem !default;
509$nav-link-padding: .5em 1em !default;
510$nav-link-hover-bg: $gray-lighter !default;
511$nav-disabled-link-color: $gray-light !default;
512$nav-disabled-link-hover-color: $gray-light !default;
513$nav-disabled-link-hover-bg: transparent !default;
514
515$nav-tabs-border-color: #ddd !default;
516$nav-tabs-border-width: $border-width !default;
517$nav-tabs-border-radius: $border-radius !default;
518$nav-tabs-link-hover-border-color: $gray-lighter !default;
519$nav-tabs-active-link-hover-color: $gray !default;
520$nav-tabs-active-link-hover-bg: $body-bg !default;
521$nav-tabs-active-link-hover-border-color: #ddd !default;
522$nav-tabs-justified-link-border-color: #ddd !default;
523$nav-tabs-justified-active-link-border-color: $body-bg !default;
524
525$nav-pills-border-radius: $border-radius !default;
526$nav-pills-active-link-color: $component-active-color !default;
527$nav-pills-active-link-bg: $component-active-bg !default;
528
529
530// Pagination
531
532$pagination-padding-x: .75rem !default;
533$pagination-padding-y: .5rem !default;
534$pagination-padding-x-sm: .75rem !default;
535$pagination-padding-y-sm: .275rem !default;
536$pagination-padding-x-lg: 1.5rem !default;
537$pagination-padding-y-lg: .75rem !default;
538
539
540$pagination-color: $link-color !default;
541$pagination-bg: #fff !default;
542$pagination-border-width: $border-width !default;
543$pagination-border-color: #ddd !default;
544
545$pagination-hover-color: $link-hover-color !default;
546$pagination-hover-bg: $gray-lighter !default;
547$pagination-hover-border: #ddd !default;
548
549$pagination-active-color: #fff !default;
550$pagination-active-bg: $brand-primary !default;
551$pagination-active-border: $brand-primary !default;
552
553$pagination-disabled-color: $gray-light !default;
554$pagination-disabled-bg: #fff !default;
555$pagination-disabled-border: #ddd !default;
556
557
558// Jumbotron
559
560$jumbotron-padding: 2rem !default;
561$jumbotron-bg: $gray-lighter !default;
562
563
564// Form states and alerts
565//
566// Define colors for form feedback states and, by default, alerts.
567
568$state-success-text: #3c763d !default;
569$state-success-bg: #dff0d8 !default;
570$state-success-border: darken($state-success-bg, 5%) !default;
571
572$state-info-text: #31708f !default;
573$state-info-bg: #d9edf7 !default;
574$state-info-border: darken($state-info-bg, 7%) !default;
575
576$state-warning-text: #8a6d3b !default;
577$state-warning-bg: #fcf8e3 !default;
578$mark-bg: $state-warning-bg !default;
579$state-warning-border: darken($state-warning-bg, 5%) !default;
580
581$state-danger-text: #a94442 !default;
582$state-danger-bg: #f2dede !default;
583$state-danger-border: darken($state-danger-bg, 5%) !default;
584
585
586// Cards
587$card-spacer-x: 1.25rem !default;
588$card-spacer-y: .75rem !default;
589$card-border-width: 1px !default;
4a59602a
BR
590$card-border-radius: none !default;
591$card-border-color: rgba(238,238,238,1) !default;
28762213
BR
592$card-border-radius-inner: $card-border-radius !default;
593$card-cap-bg: #f5f5f5 !default;
594$card-bg: #fff !default;
595
596$card-link-hover-color: #fff !default;
597
598$card-img-overlay-padding: 1.25rem !default;
599
600$card-deck-margin: .625rem !default;
601
602$card-columns-sm-up-column-gap: 1.25rem !default;
603
604
605// Tooltips
606
607$tooltip-max-width: 200px !default;
608$tooltip-color: #fff !default;
609$tooltip-bg: #000 !default;
610$tooltip-opacity: .9 !default;
611$tooltip-padding-y: 3px !default;
612$tooltip-padding-x: 8px !default;
613$tooltip-margin: 3px !default;
614
615$tooltip-arrow-width: 5px !default;
616$tooltip-arrow-color: $tooltip-bg !default;
617
618
619// Popovers
620
621$popover-inner-padding: 1px !default;
622$popover-bg: #fff !default;
623$popover-max-width: 276px !default;
624$popover-border-width: $border-width !default;
625$popover-border-color: rgba(0,0,0,.2) !default;
626$popover-box-shadow: 0 5px 10px rgba(0,0,0,.2) !default;
627
628$popover-title-bg: darken($popover-bg, 3%) !default;
629$popover-title-padding-x: 14px !default;
630$popover-title-padding-y: 8px !default;
631
632$popover-content-padding-x: 14px !default;
633$popover-content-padding-y: 9px !default;
634
635$popover-arrow-width: 10px !default;
636$popover-arrow-color: $popover-bg !default;
637
638$popover-arrow-outer-width: ($popover-arrow-width + 1px) !default;
639$popover-arrow-outer-color: fade-in($popover-border-color, .05) !default;
640
641
642// Tags
643
644$tag-default-bg: $gray-light !default;
645$tag-primary-bg: $brand-primary !default;
646$tag-success-bg: $brand-success !default;
647$tag-info-bg: $brand-info !default;
648$tag-warning-bg: $brand-warning !default;
649$tag-danger-bg: $brand-danger !default;
650
651$tag-color: #fff !default;
652$tag-link-hover-color: #fff !default;
653$tag-font-size: 75% !default;
654$tag-font-weight: bold !default;
655$tag-padding-x: .4em !default;
656$tag-padding-y: .25em !default;
657
658$tag-pill-padding-x: .6em !default;
659// Use a higher than normal value to ensure completely rounded edges when
660// customizing padding or font-size on labels.
661$tag-pill-border-radius: 10rem !default;
662
663// Modals
664
665// Padding applied to the modal body
666$modal-inner-padding: 15px !default;
667
668$modal-dialog-margin: 10px !default;
669$modal-dialog-sm-up-margin-y: 30px !default;
670
671$modal-title-padding: 15px !default;
672$modal-title-line-height: $line-height-base !default;
673
674$modal-content-bg: #fff !default;
675$modal-content-border-color: rgba(0,0,0,.2) !default;
676$modal-content-border-width: $border-width !default;
677$modal-content-xs-box-shadow: 0 3px 9px rgba(0,0,0,.5) !default;
678$modal-content-sm-up-box-shadow: 0 5px 15px rgba(0,0,0,.5) !default;
679
680$modal-backdrop-bg: #000 !default;
681$modal-backdrop-opacity: .5 !default;
682$modal-header-border-color: #e5e5e5 !default;
683$modal-footer-border-color: $modal-header-border-color !default;
684$modal-header-border-width: $modal-content-border-width !default;
685$modal-footer-border-width: $modal-header-border-width !default;
686
687$modal-lg: 900px !default;
688$modal-md: 600px !default;
689$modal-sm: 300px !default;
690
691
692// Alerts
693//
694// Define alert colors, border radius, and padding.
695
696$alert-padding: 15px !default;
697$alert-border-radius: $border-radius !default;
698$alert-link-font-weight: bold !default;
699$alert-border-width: $border-width !default;
700
701$alert-success-bg: $state-success-bg !default;
702$alert-success-text: $state-success-text !default;
703$alert-success-border: $state-success-border !default;
704
705$alert-info-bg: $state-info-bg !default;
706$alert-info-text: $state-info-text !default;
707$alert-info-border: $state-info-border !default;
708
709$alert-warning-bg: $state-warning-bg !default;
710$alert-warning-text: $state-warning-text !default;
711$alert-warning-border: $state-warning-border !default;
712
713$alert-danger-bg: $state-danger-bg !default;
714$alert-danger-text: $state-danger-text !default;
715$alert-danger-border: $state-danger-border !default;
716
717
718// Progress bars
719
720$progress-bg: #eee !default;
721$progress-bar-color: #0074d9 !default;
722$progress-border-radius: $border-radius !default;
723$progress-box-shadow: inset 0 .1rem .1rem rgba(0,0,0,.1) !default;
724
725$progress-bar-bg: $brand-primary !default;
726$progress-bar-success-bg: $brand-success !default;
727$progress-bar-warning-bg: $brand-warning !default;
728$progress-bar-danger-bg: $brand-danger !default;
729$progress-bar-info-bg: $brand-info !default;
730
731
732// List group
733
734$list-group-bg: #fff !default;
735$list-group-border-color: #ddd !default;
736$list-group-border-width: $border-width !default;
737$list-group-border-radius: $border-radius !default;
738
739$list-group-hover-bg: #f5f5f5 !default;
740$list-group-active-color: $component-active-color !default;
741$list-group-active-bg: $component-active-bg !default;
742$list-group-active-border: $list-group-active-bg !default;
743$list-group-active-text-color: lighten($list-group-active-bg, 40%) !default;
744
745$list-group-disabled-color: $gray-light !default;
746$list-group-disabled-bg: $gray-lighter !default;
747$list-group-disabled-text-color: $list-group-disabled-color !default;
748
749$list-group-link-color: #555 !default;
750$list-group-link-hover-color: $list-group-link-color !default;
751$list-group-link-heading-color: #333 !default;
752
753$list-group-item-padding-x: 1.25rem !default;
754$list-group-item-padding-y: .75rem !default;
755$list-group-item-heading-margin-bottom: 5px !default;
756
757
758// Image thumbnails
759
760$thumbnail-padding: .25rem !default;
761$thumbnail-bg: $body-bg !default;
762$thumbnail-border-width: $border-width !default;
763$thumbnail-border-color: #ddd !default;
764$thumbnail-border-radius: $border-radius !default;
765$thumbnail-box-shadow: 0 1px 2px rgba(0,0,0,.075) !default;
766
767
768// Figures
769
770$figure-caption-font-size: 90% !default;
771
772
773// Breadcrumbs
774
775$breadcrumb-padding-y: .75rem !default;
776$breadcrumb-padding-x: 1rem !default;
777$breadcrumb-item-padding: .5rem !default;
778
779$breadcrumb-bg: $gray-lighter !default;
780$breadcrumb-divider-color: $gray-light !default;
781$breadcrumb-active-color: $gray-light !default;
782$breadcrumb-divider: "/" !default;
783
784
785// Media objects
786
787$media-margin-top: 15px !default;
788$media-heading-margin-bottom: 5px !default;
789$media-alignment-padding-x: 10px !default;
790
791
792// Carousel
793
794$carousel-text-shadow: 0 1px 2px rgba(0,0,0,.6) !default;
795
796$carousel-control-color: #fff !default;
797$carousel-control-width: 15% !default;
798$carousel-control-sm-up-size: 30px !default;
799$carousel-control-opacity: .5 !default;
800$carousel-control-font-size: 20px !default;
801
802$carousel-indicators-width: 60% !default;
803
804$carousel-indicator-size: 10px !default;
805$carousel-indicator-active-size: 12px !default;
806$carousel-indicator-active-bg: #fff !default;
807$carousel-indicator-border-color: #fff !default;
808
809$carousel-caption-width: 70% !default;
810$carousel-caption-sm-up-width: 60% !default;
811$carousel-caption-color: #fff !default;
812
813$carousel-icon-width: 20px !default;
814
815
816// Close
817
818$close-font-weight: bold !default;
819$close-color: #000 !default;
820$close-text-shadow: 0 1px 0 #fff !default;
821
822
823// Code
824
825$code-font-size: 90% !default;
826$code-padding-x: .4rem !default;
827$code-padding-y: .2rem !default;
828$code-color: #bd4147 !default;
829$code-bg: #f7f7f9 !default;
830
831$kbd-color: #fff !default;
832$kbd-bg: #333 !default;
833
834$pre-bg: #f7f7f9 !default;
835$pre-color: $gray-dark !default;
836$pre-border-color: #ccc !default;
837$pre-scrollable-max-height: 340px !default;
838
d48dbde9
FM
839// Import everything.
840@import "moodle";
841
842// Additional scss here.
4a59602a
BR
843
844.navbar-brand {
845 padding-left: 1rem;
846 padding-right: 1rem;
847}
848
849.navbar-light {
850 background-color: #fff;
851 border-bottom: 1px solid #e5e5e5;
852 border-radius: 0;
853 .navbar-brand {
854 color: #fff;
855 background-color: $brand-primary;
856 @include hover-focus {
857 color: #fff;
858 }
859 }
860 .navbar-nav {
861 .nav-link {
862 font-size: $font-size-sm;
863 text-transform: uppercase;
864 letter-spacing: 1px;
865 }
866 }
867}
868
869.navbar-nav {
870 .nav-item + .nav-item {
871 margin-left: 0;
872 }
873}
874
875.dropdown-menu {
876 font-size: 14px;
877 border-color: #e2e2e2;
878 border-radius: 0;
879 margin-top: 11px;
880 .dropdown-item {
881 color: rgba(0,0,0,.535);
882 padding: 8px 20px;
883 border-bottom: 1px solid #e2e2e2;
884 &:last-child {
885 border-bottom: 0;
886 }
887 }
888}
889
890#page-header {
891 background-color: #fff;
892 border: 1px solid rgba(238,238,238,1);
893 margin-top: $spacer;
894 margin-bottom: $spacer;
895}
896
897.breadcrumb {
898 background-color: transparent;
899 border-radius: 0;
900}
901
902#region-main {
903 background-color: #fff;
904 border: 1px solid rgba(238,238,238,1);
905}
906
907.course-content ul {
908 &.topics li.section {
909 padding-top: $spacer;
910 padding-bottom: ($spacer/2);
911 }
912 li.section.main {
913 border-bottom: 1px solid #eceeef;
914 }
915}
916
917.pagelayout-login {
4553c8bd
BR
918 &.notloggedin {
919 #region-main {
920 background-color: transparent;
921 border: 0;
922 padding: 0 !important;
923 }
924 .login-wrapper {
925 background-color: #fff;
926 border: 1px solid rgba(238,238,238,1);
927 }
4a59602a 928 }
4553c8bd
BR
929 #notice {
930 text-align: center;
4a59602a
BR
931 }
932}
933
934.block-region .card-block {
935 .card-title {
936 padding-bottom: ($spacer/2);
937 small {
938 font-size: 65.3%;
939 font-weight: 600;
940 text-transform: uppercase;
941 }
942 }
943}
944
945.block_navigation,
946.block_settings {
947 .block_tree .tree_item {
948 margin: ($spacer/2) 0;
949 }
950}
951
952#page-footer {
953 color: #fff;
954 text-align: right;
955 background-color: #333;
956 border-top: none;
957}