darkade.github.io-theme 1.0.2

Sign up to get free protection for your applications and to get access to all the features.
Files changed (110) hide show
  1. checksums.yaml +7 -0
  2. data/LICENSE.txt +21 -0
  3. data/README.md +52 -0
  4. data/_includes/footer.html +34 -0
  5. data/_includes/head.html +33 -0
  6. data/_includes/header.html +8 -0
  7. data/_includes/jquery.html +5 -0
  8. data/_includes/mathjax.html +17 -0
  9. data/_includes/paginator.html +33 -0
  10. data/_layouts/default.html +12 -0
  11. data/_layouts/home.html +28 -0
  12. data/_layouts/mathpost.html +7 -0
  13. data/_layouts/page.html +9 -0
  14. data/_layouts/post.html +18 -0
  15. data/_sass/bootstrap/_alert.scss +51 -0
  16. data/_sass/bootstrap/_badge.scss +54 -0
  17. data/_sass/bootstrap/_breadcrumb.scss +41 -0
  18. data/_sass/bootstrap/_button-group.scss +163 -0
  19. data/_sass/bootstrap/_buttons.scss +137 -0
  20. data/_sass/bootstrap/_card.scss +289 -0
  21. data/_sass/bootstrap/_carousel.scss +197 -0
  22. data/_sass/bootstrap/_close.scss +41 -0
  23. data/_sass/bootstrap/_code.scss +48 -0
  24. data/_sass/bootstrap/_custom-forms.scss +507 -0
  25. data/_sass/bootstrap/_dropdown.scss +191 -0
  26. data/_sass/bootstrap/_forms.scss +330 -0
  27. data/_sass/bootstrap/_functions.scss +86 -0
  28. data/_sass/bootstrap/_grid.scss +52 -0
  29. data/_sass/bootstrap/_images.scss +42 -0
  30. data/_sass/bootstrap/_input-group.scss +193 -0
  31. data/_sass/bootstrap/_jumbotron.scss +17 -0
  32. data/_sass/bootstrap/_list-group.scss +149 -0
  33. data/_sass/bootstrap/_media.scss +8 -0
  34. data/_sass/bootstrap/_mixins.scss +47 -0
  35. data/_sass/bootstrap/_modal.scss +229 -0
  36. data/_sass/bootstrap/_nav.scss +120 -0
  37. data/_sass/bootstrap/_navbar.scss +294 -0
  38. data/_sass/bootstrap/_pagination.scss +73 -0
  39. data/_sass/bootstrap/_popover.scss +171 -0
  40. data/_sass/bootstrap/_print.scss +141 -0
  41. data/_sass/bootstrap/_progress.scss +43 -0
  42. data/_sass/bootstrap/_reboot.scss +483 -0
  43. data/_sass/bootstrap/_root.scss +19 -0
  44. data/_sass/bootstrap/_spinners.scss +55 -0
  45. data/_sass/bootstrap/_tables.scss +185 -0
  46. data/_sass/bootstrap/_toasts.scss +44 -0
  47. data/_sass/bootstrap/_tooltip.scss +115 -0
  48. data/_sass/bootstrap/_transitions.scss +20 -0
  49. data/_sass/bootstrap/_type.scss +125 -0
  50. data/_sass/bootstrap/_utilities.scss +17 -0
  51. data/_sass/bootstrap/_variables.scss +1123 -0
  52. data/_sass/bootstrap/bootstrap-grid.scss +29 -0
  53. data/_sass/bootstrap/bootstrap-reboot.scss +12 -0
  54. data/_sass/bootstrap/bootstrap.scss +44 -0
  55. data/_sass/bootstrap/mixins/_alert.scss +13 -0
  56. data/_sass/bootstrap/mixins/_background-variant.scss +21 -0
  57. data/_sass/bootstrap/mixins/_badge.scss +17 -0
  58. data/_sass/bootstrap/mixins/_border-radius.scss +63 -0
  59. data/_sass/bootstrap/mixins/_box-shadow.scss +20 -0
  60. data/_sass/bootstrap/mixins/_breakpoints.scss +123 -0
  61. data/_sass/bootstrap/mixins/_buttons.scss +107 -0
  62. data/_sass/bootstrap/mixins/_caret.scss +62 -0
  63. data/_sass/bootstrap/mixins/_clearfix.scss +7 -0
  64. data/_sass/bootstrap/mixins/_deprecate.scss +10 -0
  65. data/_sass/bootstrap/mixins/_float.scss +14 -0
  66. data/_sass/bootstrap/mixins/_forms.scss +192 -0
  67. data/_sass/bootstrap/mixins/_gradients.scss +45 -0
  68. data/_sass/bootstrap/mixins/_grid-framework.scss +66 -0
  69. data/_sass/bootstrap/mixins/_grid.scss +51 -0
  70. data/_sass/bootstrap/mixins/_hover.scss +37 -0
  71. data/_sass/bootstrap/mixins/_image.scss +36 -0
  72. data/_sass/bootstrap/mixins/_list-group.scss +21 -0
  73. data/_sass/bootstrap/mixins/_lists.scss +7 -0
  74. data/_sass/bootstrap/mixins/_nav-divider.scss +10 -0
  75. data/_sass/bootstrap/mixins/_pagination.scss +22 -0
  76. data/_sass/bootstrap/mixins/_reset-text.scss +17 -0
  77. data/_sass/bootstrap/mixins/_resize.scss +6 -0
  78. data/_sass/bootstrap/mixins/_screen-reader.scss +33 -0
  79. data/_sass/bootstrap/mixins/_size.scss +7 -0
  80. data/_sass/bootstrap/mixins/_table-row.scss +39 -0
  81. data/_sass/bootstrap/mixins/_text-emphasis.scss +16 -0
  82. data/_sass/bootstrap/mixins/_text-hide.scss +11 -0
  83. data/_sass/bootstrap/mixins/_text-truncate.scss +8 -0
  84. data/_sass/bootstrap/mixins/_transition.scss +16 -0
  85. data/_sass/bootstrap/mixins/_visibility.scss +8 -0
  86. data/_sass/bootstrap/utilities/_align.scss +8 -0
  87. data/_sass/bootstrap/utilities/_background.scss +19 -0
  88. data/_sass/bootstrap/utilities/_borders.scss +75 -0
  89. data/_sass/bootstrap/utilities/_clearfix.scss +3 -0
  90. data/_sass/bootstrap/utilities/_display.scss +26 -0
  91. data/_sass/bootstrap/utilities/_embed.scss +39 -0
  92. data/_sass/bootstrap/utilities/_flex.scss +51 -0
  93. data/_sass/bootstrap/utilities/_float.scss +11 -0
  94. data/_sass/bootstrap/utilities/_overflow.scss +5 -0
  95. data/_sass/bootstrap/utilities/_position.scss +32 -0
  96. data/_sass/bootstrap/utilities/_screenreaders.scss +11 -0
  97. data/_sass/bootstrap/utilities/_shadows.scss +6 -0
  98. data/_sass/bootstrap/utilities/_sizing.scss +20 -0
  99. data/_sass/bootstrap/utilities/_spacing.scss +73 -0
  100. data/_sass/bootstrap/utilities/_stretched-link.scss +19 -0
  101. data/_sass/bootstrap/utilities/_text.scss +72 -0
  102. data/_sass/bootstrap/utilities/_visibility.scss +13 -0
  103. data/_sass/bootstrap/vendor/_rfs.scss +204 -0
  104. data/_sass/main.scss +48 -0
  105. data/_sass/manni.scss +69 -0
  106. data/assets/css/styles.scss +4 -0
  107. data/assets/sprites/brands.svg +1291 -0
  108. data/assets/sprites/regular.svg +463 -0
  109. data/assets/sprites/solid.svg +2878 -0
  110. metadata +275 -0
@@ -0,0 +1,197 @@
1
+ // Notes on the classes:
2
+ //
3
+ // 1. .carousel.pointer-event should ideally be pan-y (to allow for users to scroll vertically)
4
+ // even when their scroll action started on a carousel, but for compatibility (with Firefox)
5
+ // we're preventing all actions instead
6
+ // 2. The .carousel-item-left and .carousel-item-right is used to indicate where
7
+ // the active slide is heading.
8
+ // 3. .active.carousel-item is the current slide.
9
+ // 4. .active.carousel-item-left and .active.carousel-item-right is the current
10
+ // slide in its in-transition state. Only one of these occurs at a time.
11
+ // 5. .carousel-item-next.carousel-item-left and .carousel-item-prev.carousel-item-right
12
+ // is the upcoming slide in transition.
13
+
14
+ .carousel {
15
+ position: relative;
16
+ }
17
+
18
+ .carousel.pointer-event {
19
+ touch-action: pan-y;
20
+ }
21
+
22
+ .carousel-inner {
23
+ position: relative;
24
+ width: 100%;
25
+ overflow: hidden;
26
+ @include clearfix();
27
+ }
28
+
29
+ .carousel-item {
30
+ position: relative;
31
+ display: none;
32
+ float: left;
33
+ width: 100%;
34
+ margin-right: -100%;
35
+ backface-visibility: hidden;
36
+ @include transition($carousel-transition);
37
+ }
38
+
39
+ .carousel-item.active,
40
+ .carousel-item-next,
41
+ .carousel-item-prev {
42
+ display: block;
43
+ }
44
+
45
+ .carousel-item-next:not(.carousel-item-left),
46
+ .active.carousel-item-right {
47
+ transform: translateX(100%);
48
+ }
49
+
50
+ .carousel-item-prev:not(.carousel-item-right),
51
+ .active.carousel-item-left {
52
+ transform: translateX(-100%);
53
+ }
54
+
55
+
56
+ //
57
+ // Alternate transitions
58
+ //
59
+
60
+ .carousel-fade {
61
+ .carousel-item {
62
+ opacity: 0;
63
+ transition-property: opacity;
64
+ transform: none;
65
+ }
66
+
67
+ .carousel-item.active,
68
+ .carousel-item-next.carousel-item-left,
69
+ .carousel-item-prev.carousel-item-right {
70
+ z-index: 1;
71
+ opacity: 1;
72
+ }
73
+
74
+ .active.carousel-item-left,
75
+ .active.carousel-item-right {
76
+ z-index: 0;
77
+ opacity: 0;
78
+ @include transition(0s $carousel-transition-duration opacity);
79
+ }
80
+ }
81
+
82
+
83
+ //
84
+ // Left/right controls for nav
85
+ //
86
+
87
+ .carousel-control-prev,
88
+ .carousel-control-next {
89
+ position: absolute;
90
+ top: 0;
91
+ bottom: 0;
92
+ z-index: 1;
93
+ // Use flex for alignment (1-3)
94
+ display: flex; // 1. allow flex styles
95
+ align-items: center; // 2. vertically center contents
96
+ justify-content: center; // 3. horizontally center contents
97
+ width: $carousel-control-width;
98
+ color: $carousel-control-color;
99
+ text-align: center;
100
+ opacity: $carousel-control-opacity;
101
+ @include transition($carousel-control-transition);
102
+
103
+ // Hover/focus state
104
+ @include hover-focus {
105
+ color: $carousel-control-color;
106
+ text-decoration: none;
107
+ outline: 0;
108
+ opacity: $carousel-control-hover-opacity;
109
+ }
110
+ }
111
+ .carousel-control-prev {
112
+ left: 0;
113
+ @if $enable-gradients {
114
+ background: linear-gradient(90deg, rgba($black, .25), rgba($black, .001));
115
+ }
116
+ }
117
+ .carousel-control-next {
118
+ right: 0;
119
+ @if $enable-gradients {
120
+ background: linear-gradient(270deg, rgba($black, .25), rgba($black, .001));
121
+ }
122
+ }
123
+
124
+ // Icons for within
125
+ .carousel-control-prev-icon,
126
+ .carousel-control-next-icon {
127
+ display: inline-block;
128
+ width: $carousel-control-icon-width;
129
+ height: $carousel-control-icon-width;
130
+ background: no-repeat 50% / 100% 100%;
131
+ }
132
+ .carousel-control-prev-icon {
133
+ background-image: $carousel-control-prev-icon-bg;
134
+ }
135
+ .carousel-control-next-icon {
136
+ background-image: $carousel-control-next-icon-bg;
137
+ }
138
+
139
+
140
+ // Optional indicator pips
141
+ //
142
+ // Add an ordered list with the following class and add a list item for each
143
+ // slide your carousel holds.
144
+
145
+ .carousel-indicators {
146
+ position: absolute;
147
+ right: 0;
148
+ bottom: 0;
149
+ left: 0;
150
+ z-index: 15;
151
+ display: flex;
152
+ justify-content: center;
153
+ padding-left: 0; // override <ol> default
154
+ // Use the .carousel-control's width as margin so we don't overlay those
155
+ margin-right: $carousel-control-width;
156
+ margin-left: $carousel-control-width;
157
+ list-style: none;
158
+
159
+ li {
160
+ box-sizing: content-box;
161
+ flex: 0 1 auto;
162
+ width: $carousel-indicator-width;
163
+ height: $carousel-indicator-height;
164
+ margin-right: $carousel-indicator-spacer;
165
+ margin-left: $carousel-indicator-spacer;
166
+ text-indent: -999px;
167
+ cursor: pointer;
168
+ background-color: $carousel-indicator-active-bg;
169
+ background-clip: padding-box;
170
+ // Use transparent borders to increase the hit area by 10px on top and bottom.
171
+ border-top: $carousel-indicator-hit-area-height solid transparent;
172
+ border-bottom: $carousel-indicator-hit-area-height solid transparent;
173
+ opacity: .5;
174
+ @include transition($carousel-indicator-transition);
175
+ }
176
+
177
+ .active {
178
+ opacity: 1;
179
+ }
180
+ }
181
+
182
+
183
+ // Optional captions
184
+ //
185
+ //
186
+
187
+ .carousel-caption {
188
+ position: absolute;
189
+ right: (100% - $carousel-caption-width) / 2;
190
+ bottom: 20px;
191
+ left: (100% - $carousel-caption-width) / 2;
192
+ z-index: 10;
193
+ padding-top: 20px;
194
+ padding-bottom: 20px;
195
+ color: $carousel-caption-color;
196
+ text-align: center;
197
+ }
@@ -0,0 +1,41 @@
1
+ .close {
2
+ float: right;
3
+ @include font-size($close-font-size);
4
+ font-weight: $close-font-weight;
5
+ line-height: 1;
6
+ color: $close-color;
7
+ text-shadow: $close-text-shadow;
8
+ opacity: .5;
9
+
10
+ // Override <a>'s hover style
11
+ @include hover {
12
+ color: $close-color;
13
+ text-decoration: none;
14
+ }
15
+
16
+ &:not(:disabled):not(.disabled) {
17
+ @include hover-focus {
18
+ opacity: .75;
19
+ }
20
+ }
21
+ }
22
+
23
+ // Additional properties for button version
24
+ // iOS requires the button element instead of an anchor tag.
25
+ // If you want the anchor version, it requires `href="#"`.
26
+ // See https://developer.mozilla.org/en-US/docs/Web/Events/click#Safari_Mobile
27
+
28
+ // stylelint-disable-next-line selector-no-qualifying-type
29
+ button.close {
30
+ padding: 0;
31
+ background-color: transparent;
32
+ border: 0;
33
+ appearance: none;
34
+ }
35
+
36
+ // Future-proof disabling of clicks on `<a>` elements
37
+
38
+ // stylelint-disable-next-line selector-no-qualifying-type
39
+ a.close.disabled {
40
+ pointer-events: none;
41
+ }
@@ -0,0 +1,48 @@
1
+ // Inline code
2
+ code {
3
+ @include font-size($code-font-size);
4
+ color: $code-color;
5
+ word-break: break-word;
6
+
7
+ // Streamline the style when inside anchors to avoid broken underline and more
8
+ a > & {
9
+ color: inherit;
10
+ }
11
+ }
12
+
13
+ // User input typically entered via keyboard
14
+ kbd {
15
+ padding: $kbd-padding-y $kbd-padding-x;
16
+ @include font-size($kbd-font-size);
17
+ color: $kbd-color;
18
+ background-color: $kbd-bg;
19
+ @include border-radius($border-radius-sm);
20
+ @include box-shadow($kbd-box-shadow);
21
+
22
+ kbd {
23
+ padding: 0;
24
+ @include font-size(100%);
25
+ font-weight: $nested-kbd-font-weight;
26
+ @include box-shadow(none);
27
+ }
28
+ }
29
+
30
+ // Blocks of code
31
+ pre {
32
+ display: block;
33
+ @include font-size($code-font-size);
34
+ color: $pre-color;
35
+
36
+ // Account for some code outputs that place code tags in pre tags
37
+ code {
38
+ @include font-size(inherit);
39
+ color: inherit;
40
+ word-break: normal;
41
+ }
42
+ }
43
+
44
+ // Enable scrollable blocks of code
45
+ .pre-scrollable {
46
+ max-height: $pre-scrollable-max-height;
47
+ overflow-y: scroll;
48
+ }
@@ -0,0 +1,507 @@
1
+ // Embedded icons from Open Iconic.
2
+ // Released under MIT and copyright 2014 Waybury.
3
+ // https://useiconic.com/open
4
+
5
+
6
+ // Checkboxes and radios
7
+ //
8
+ // Base class takes care of all the key behavioral aspects.
9
+
10
+ .custom-control {
11
+ position: relative;
12
+ display: block;
13
+ min-height: $font-size-base * $line-height-base;
14
+ padding-left: $custom-control-gutter + $custom-control-indicator-size;
15
+ }
16
+
17
+ .custom-control-inline {
18
+ display: inline-flex;
19
+ margin-right: $custom-control-spacer-x;
20
+ }
21
+
22
+ .custom-control-input {
23
+ position: absolute;
24
+ z-index: -1; // Put the input behind the label so it doesn't overlay text
25
+ opacity: 0;
26
+
27
+ &:checked ~ .custom-control-label::before {
28
+ color: $custom-control-indicator-checked-color;
29
+ border-color: $custom-control-indicator-checked-border-color;
30
+ @include gradient-bg($custom-control-indicator-checked-bg);
31
+ @include box-shadow($custom-control-indicator-checked-box-shadow);
32
+ }
33
+
34
+ &:focus ~ .custom-control-label::before {
35
+ // the mixin is not used here to make sure there is feedback
36
+ @if $enable-shadows {
37
+ box-shadow: $input-box-shadow, $input-focus-box-shadow;
38
+ } @else {
39
+ box-shadow: $custom-control-indicator-focus-box-shadow;
40
+ }
41
+ }
42
+
43
+ &:focus:not(:checked) ~ .custom-control-label::before {
44
+ border-color: $custom-control-indicator-focus-border-color;
45
+ }
46
+
47
+ &:not(:disabled):active ~ .custom-control-label::before {
48
+ color: $custom-control-indicator-active-color;
49
+ background-color: $custom-control-indicator-active-bg;
50
+ border-color: $custom-control-indicator-active-border-color;
51
+ @include box-shadow($custom-control-indicator-active-box-shadow);
52
+ }
53
+
54
+ &:disabled {
55
+ ~ .custom-control-label {
56
+ color: $custom-control-label-disabled-color;
57
+
58
+ &::before {
59
+ background-color: $custom-control-indicator-disabled-bg;
60
+ }
61
+ }
62
+ }
63
+ }
64
+
65
+ // Custom control indicators
66
+ //
67
+ // Build the custom controls out of pseudo-elements.
68
+
69
+ .custom-control-label {
70
+ position: relative;
71
+ margin-bottom: 0;
72
+ vertical-align: top;
73
+
74
+ // Background-color and (when enabled) gradient
75
+ &::before {
76
+ position: absolute;
77
+ top: ($font-size-base * $line-height-base - $custom-control-indicator-size) / 2;
78
+ left: -($custom-control-gutter + $custom-control-indicator-size);
79
+ display: block;
80
+ width: $custom-control-indicator-size;
81
+ height: $custom-control-indicator-size;
82
+ pointer-events: none;
83
+ content: "";
84
+ background-color: $custom-control-indicator-bg;
85
+ border: $custom-control-indicator-border-color solid $custom-control-indicator-border-width;
86
+ @include box-shadow($custom-control-indicator-box-shadow);
87
+ }
88
+
89
+ // Foreground (icon)
90
+ &::after {
91
+ position: absolute;
92
+ top: ($font-size-base * $line-height-base - $custom-control-indicator-size) / 2;
93
+ left: -($custom-control-gutter + $custom-control-indicator-size);
94
+ display: block;
95
+ width: $custom-control-indicator-size;
96
+ height: $custom-control-indicator-size;
97
+ content: "";
98
+ background: no-repeat 50% / #{$custom-control-indicator-bg-size};
99
+ }
100
+ }
101
+
102
+
103
+ // Checkboxes
104
+ //
105
+ // Tweak just a few things for checkboxes.
106
+
107
+ .custom-checkbox {
108
+ .custom-control-label::before {
109
+ @include border-radius($custom-checkbox-indicator-border-radius);
110
+ }
111
+
112
+ .custom-control-input:checked ~ .custom-control-label {
113
+ &::after {
114
+ background-image: $custom-checkbox-indicator-icon-checked;
115
+ }
116
+ }
117
+
118
+ .custom-control-input:indeterminate ~ .custom-control-label {
119
+ &::before {
120
+ border-color: $custom-checkbox-indicator-indeterminate-border-color;
121
+ @include gradient-bg($custom-checkbox-indicator-indeterminate-bg);
122
+ @include box-shadow($custom-checkbox-indicator-indeterminate-box-shadow);
123
+ }
124
+ &::after {
125
+ background-image: $custom-checkbox-indicator-icon-indeterminate;
126
+ }
127
+ }
128
+
129
+ .custom-control-input:disabled {
130
+ &:checked ~ .custom-control-label::before {
131
+ background-color: $custom-control-indicator-checked-disabled-bg;
132
+ }
133
+ &:indeterminate ~ .custom-control-label::before {
134
+ background-color: $custom-control-indicator-checked-disabled-bg;
135
+ }
136
+ }
137
+ }
138
+
139
+ // Radios
140
+ //
141
+ // Tweak just a few things for radios.
142
+
143
+ .custom-radio {
144
+ .custom-control-label::before {
145
+ // stylelint-disable-next-line property-blacklist
146
+ border-radius: $custom-radio-indicator-border-radius;
147
+ }
148
+
149
+ .custom-control-input:checked ~ .custom-control-label {
150
+ &::after {
151
+ background-image: $custom-radio-indicator-icon-checked;
152
+ }
153
+ }
154
+
155
+ .custom-control-input:disabled {
156
+ &:checked ~ .custom-control-label::before {
157
+ background-color: $custom-control-indicator-checked-disabled-bg;
158
+ }
159
+ }
160
+ }
161
+
162
+
163
+ // switches
164
+ //
165
+ // Tweak a few things for switches
166
+
167
+ .custom-switch {
168
+ padding-left: $custom-switch-width + $custom-control-gutter;
169
+
170
+ .custom-control-label {
171
+ &::before {
172
+ left: -($custom-switch-width + $custom-control-gutter);
173
+ width: $custom-switch-width;
174
+ pointer-events: all;
175
+ // stylelint-disable-next-line property-blacklist
176
+ border-radius: $custom-switch-indicator-border-radius;
177
+ }
178
+
179
+ &::after {
180
+ top: calc(#{(($font-size-base * $line-height-base - $custom-control-indicator-size) / 2)} + #{$custom-control-indicator-border-width * 2});
181
+ left: calc(#{-($custom-switch-width + $custom-control-gutter)} + #{$custom-control-indicator-border-width * 2});
182
+ width: $custom-switch-indicator-size;
183
+ height: $custom-switch-indicator-size;
184
+ background-color: $custom-control-indicator-border-color;
185
+ // stylelint-disable-next-line property-blacklist
186
+ border-radius: $custom-switch-indicator-border-radius;
187
+ @include transition(transform .15s ease-in-out, $custom-forms-transition);
188
+ }
189
+ }
190
+
191
+ .custom-control-input:checked ~ .custom-control-label {
192
+ &::after {
193
+ background-color: $custom-control-indicator-bg;
194
+ transform: translateX($custom-switch-width - $custom-control-indicator-size);
195
+ }
196
+ }
197
+
198
+ .custom-control-input:disabled {
199
+ &:checked ~ .custom-control-label::before {
200
+ background-color: $custom-control-indicator-checked-disabled-bg;
201
+ }
202
+ }
203
+ }
204
+
205
+
206
+ // Select
207
+ //
208
+ // Replaces the browser default select with a custom one, mostly pulled from
209
+ // https://primer.github.io/.
210
+ //
211
+
212
+ .custom-select {
213
+ display: inline-block;
214
+ width: 100%;
215
+ height: $custom-select-height;
216
+ padding: $custom-select-padding-y ($custom-select-padding-x + $custom-select-indicator-padding) $custom-select-padding-y $custom-select-padding-x;
217
+ font-family: $custom-select-font-family;
218
+ @include font-size($custom-select-font-size);
219
+ font-weight: $custom-select-font-weight;
220
+ line-height: $custom-select-line-height;
221
+ color: $custom-select-color;
222
+ vertical-align: middle;
223
+ background: $custom-select-background;
224
+ background-color: $custom-select-bg;
225
+ border: $custom-select-border-width solid $custom-select-border-color;
226
+ @include border-radius($custom-select-border-radius, 0);
227
+ @include box-shadow($custom-select-box-shadow);
228
+ appearance: none;
229
+
230
+ &:focus {
231
+ border-color: $custom-select-focus-border-color;
232
+ outline: 0;
233
+ @if $enable-shadows {
234
+ box-shadow: $custom-select-box-shadow, $custom-select-focus-box-shadow;
235
+ } @else {
236
+ box-shadow: $custom-select-focus-box-shadow;
237
+ }
238
+
239
+ &::-ms-value {
240
+ // For visual consistency with other platforms/browsers,
241
+ // suppress the default white text on blue background highlight given to
242
+ // the selected option text when the (still closed) <select> receives focus
243
+ // in IE and (under certain conditions) Edge.
244
+ // See https://github.com/twbs/bootstrap/issues/19398.
245
+ color: $input-color;
246
+ background-color: $input-bg;
247
+ }
248
+ }
249
+
250
+ &[multiple],
251
+ &[size]:not([size="1"]) {
252
+ height: auto;
253
+ padding-right: $custom-select-padding-x;
254
+ background-image: none;
255
+ }
256
+
257
+ &:disabled {
258
+ color: $custom-select-disabled-color;
259
+ background-color: $custom-select-disabled-bg;
260
+ }
261
+
262
+ // Hides the default caret in IE11
263
+ &::-ms-expand {
264
+ display: none;
265
+ }
266
+ }
267
+
268
+ .custom-select-sm {
269
+ height: $custom-select-height-sm;
270
+ padding-top: $custom-select-padding-y-sm;
271
+ padding-bottom: $custom-select-padding-y-sm;
272
+ padding-left: $custom-select-padding-x-sm;
273
+ @include font-size($custom-select-font-size-sm);
274
+ }
275
+
276
+ .custom-select-lg {
277
+ height: $custom-select-height-lg;
278
+ padding-top: $custom-select-padding-y-lg;
279
+ padding-bottom: $custom-select-padding-y-lg;
280
+ padding-left: $custom-select-padding-x-lg;
281
+ @include font-size($custom-select-font-size-lg);
282
+ }
283
+
284
+
285
+ // File
286
+ //
287
+ // Custom file input.
288
+
289
+ .custom-file {
290
+ position: relative;
291
+ display: inline-block;
292
+ width: 100%;
293
+ height: $custom-file-height;
294
+ margin-bottom: 0;
295
+ }
296
+
297
+ .custom-file-input {
298
+ position: relative;
299
+ z-index: 2;
300
+ width: 100%;
301
+ height: $custom-file-height;
302
+ margin: 0;
303
+ opacity: 0;
304
+
305
+ &:focus ~ .custom-file-label {
306
+ border-color: $custom-file-focus-border-color;
307
+ box-shadow: $custom-file-focus-box-shadow;
308
+ }
309
+
310
+ &:disabled ~ .custom-file-label {
311
+ background-color: $custom-file-disabled-bg;
312
+ }
313
+
314
+ @each $lang, $value in $custom-file-text {
315
+ &:lang(#{$lang}) ~ .custom-file-label::after {
316
+ content: $value;
317
+ }
318
+ }
319
+
320
+ ~ .custom-file-label[data-browse]::after {
321
+ content: attr(data-browse);
322
+ }
323
+ }
324
+
325
+ .custom-file-label {
326
+ position: absolute;
327
+ top: 0;
328
+ right: 0;
329
+ left: 0;
330
+ z-index: 1;
331
+ height: $custom-file-height;
332
+ padding: $custom-file-padding-y $custom-file-padding-x;
333
+ font-family: $custom-file-font-family;
334
+ font-weight: $custom-file-font-weight;
335
+ line-height: $custom-file-line-height;
336
+ color: $custom-file-color;
337
+ background-color: $custom-file-bg;
338
+ border: $custom-file-border-width solid $custom-file-border-color;
339
+ @include border-radius($custom-file-border-radius);
340
+ @include box-shadow($custom-file-box-shadow);
341
+
342
+ &::after {
343
+ position: absolute;
344
+ top: 0;
345
+ right: 0;
346
+ bottom: 0;
347
+ z-index: 3;
348
+ display: block;
349
+ height: $custom-file-height-inner;
350
+ padding: $custom-file-padding-y $custom-file-padding-x;
351
+ line-height: $custom-file-line-height;
352
+ color: $custom-file-button-color;
353
+ content: "Browse";
354
+ @include gradient-bg($custom-file-button-bg);
355
+ border-left: inherit;
356
+ @include border-radius(0 $custom-file-border-radius $custom-file-border-radius 0);
357
+ }
358
+ }
359
+
360
+ // Range
361
+ //
362
+ // Style range inputs the same across browsers. Vendor-specific rules for pseudo
363
+ // elements cannot be mixed. As such, there are no shared styles for focus or
364
+ // active states on prefixed selectors.
365
+
366
+ .custom-range {
367
+ width: 100%;
368
+ height: calc(#{$custom-range-thumb-height} + #{$custom-range-thumb-focus-box-shadow-width * 2});
369
+ padding: 0; // Need to reset padding
370
+ background-color: transparent;
371
+ appearance: none;
372
+
373
+ &:focus {
374
+ outline: none;
375
+
376
+ // Pseudo-elements must be split across multiple rulesets to have an effect.
377
+ // No box-shadow() mixin for focus accessibility.
378
+ &::-webkit-slider-thumb { box-shadow: $custom-range-thumb-focus-box-shadow; }
379
+ &::-moz-range-thumb { box-shadow: $custom-range-thumb-focus-box-shadow; }
380
+ &::-ms-thumb { box-shadow: $custom-range-thumb-focus-box-shadow; }
381
+ }
382
+
383
+ &::-moz-focus-outer {
384
+ border: 0;
385
+ }
386
+
387
+ &::-webkit-slider-thumb {
388
+ width: $custom-range-thumb-width;
389
+ height: $custom-range-thumb-height;
390
+ margin-top: ($custom-range-track-height - $custom-range-thumb-height) / 2; // Webkit specific
391
+ @include gradient-bg($custom-range-thumb-bg);
392
+ border: $custom-range-thumb-border;
393
+ @include border-radius($custom-range-thumb-border-radius);
394
+ @include box-shadow($custom-range-thumb-box-shadow);
395
+ @include transition($custom-forms-transition);
396
+ appearance: none;
397
+
398
+ &:active {
399
+ @include gradient-bg($custom-range-thumb-active-bg);
400
+ }
401
+ }
402
+
403
+ &::-webkit-slider-runnable-track {
404
+ width: $custom-range-track-width;
405
+ height: $custom-range-track-height;
406
+ color: transparent; // Why?
407
+ cursor: $custom-range-track-cursor;
408
+ background-color: $custom-range-track-bg;
409
+ border-color: transparent;
410
+ @include border-radius($custom-range-track-border-radius);
411
+ @include box-shadow($custom-range-track-box-shadow);
412
+ }
413
+
414
+ &::-moz-range-thumb {
415
+ width: $custom-range-thumb-width;
416
+ height: $custom-range-thumb-height;
417
+ @include gradient-bg($custom-range-thumb-bg);
418
+ border: $custom-range-thumb-border;
419
+ @include border-radius($custom-range-thumb-border-radius);
420
+ @include box-shadow($custom-range-thumb-box-shadow);
421
+ @include transition($custom-forms-transition);
422
+ appearance: none;
423
+
424
+ &:active {
425
+ @include gradient-bg($custom-range-thumb-active-bg);
426
+ }
427
+ }
428
+
429
+ &::-moz-range-track {
430
+ width: $custom-range-track-width;
431
+ height: $custom-range-track-height;
432
+ color: transparent;
433
+ cursor: $custom-range-track-cursor;
434
+ background-color: $custom-range-track-bg;
435
+ border-color: transparent; // Firefox specific?
436
+ @include border-radius($custom-range-track-border-radius);
437
+ @include box-shadow($custom-range-track-box-shadow);
438
+ }
439
+
440
+ &::-ms-thumb {
441
+ width: $custom-range-thumb-width;
442
+ height: $custom-range-thumb-height;
443
+ margin-top: 0; // Edge specific
444
+ margin-right: $custom-range-thumb-focus-box-shadow-width; // Workaround that overflowed box-shadow is hidden.
445
+ margin-left: $custom-range-thumb-focus-box-shadow-width; // Workaround that overflowed box-shadow is hidden.
446
+ @include gradient-bg($custom-range-thumb-bg);
447
+ border: $custom-range-thumb-border;
448
+ @include border-radius($custom-range-thumb-border-radius);
449
+ @include box-shadow($custom-range-thumb-box-shadow);
450
+ @include transition($custom-forms-transition);
451
+ appearance: none;
452
+
453
+ &:active {
454
+ @include gradient-bg($custom-range-thumb-active-bg);
455
+ }
456
+ }
457
+
458
+ &::-ms-track {
459
+ width: $custom-range-track-width;
460
+ height: $custom-range-track-height;
461
+ color: transparent;
462
+ cursor: $custom-range-track-cursor;
463
+ background-color: transparent;
464
+ border-color: transparent;
465
+ border-width: $custom-range-thumb-height / 2;
466
+ @include box-shadow($custom-range-track-box-shadow);
467
+ }
468
+
469
+ &::-ms-fill-lower {
470
+ background-color: $custom-range-track-bg;
471
+ @include border-radius($custom-range-track-border-radius);
472
+ }
473
+
474
+ &::-ms-fill-upper {
475
+ margin-right: 15px; // arbitrary?
476
+ background-color: $custom-range-track-bg;
477
+ @include border-radius($custom-range-track-border-radius);
478
+ }
479
+
480
+ &:disabled {
481
+ &::-webkit-slider-thumb {
482
+ background-color: $custom-range-thumb-disabled-bg;
483
+ }
484
+
485
+ &::-webkit-slider-runnable-track {
486
+ cursor: default;
487
+ }
488
+
489
+ &::-moz-range-thumb {
490
+ background-color: $custom-range-thumb-disabled-bg;
491
+ }
492
+
493
+ &::-moz-range-track {
494
+ cursor: default;
495
+ }
496
+
497
+ &::-ms-thumb {
498
+ background-color: $custom-range-thumb-disabled-bg;
499
+ }
500
+ }
501
+ }
502
+
503
+ .custom-control-label::before,
504
+ .custom-file-label,
505
+ .custom-select {
506
+ @include transition($custom-forms-transition);
507
+ }