viniBaxter-spa_landing 31.0.0 → 32.0.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (93) hide show
  1. checksums.yaml +4 -4
  2. data/lib/viniBaxter/sass/{spa_landing-nav.scss → spa_landing-creative-nav.scss} +1 -4
  3. data/lib/viniBaxter/sass/{spa_landing-basic-nav.scss → spa_landing-initial-nav.scss} +1 -4
  4. data/lib/viniBaxter/spa_landing/version.rb +1 -1
  5. metadata +4 -92
  6. data/lib/viniBaxter/sass/bootstrap/_alert.scss +0 -51
  7. data/lib/viniBaxter/sass/bootstrap/_badge.scss +0 -54
  8. data/lib/viniBaxter/sass/bootstrap/_breadcrumb.scss +0 -44
  9. data/lib/viniBaxter/sass/bootstrap/_button-group.scss +0 -163
  10. data/lib/viniBaxter/sass/bootstrap/_buttons.scss +0 -210
  11. data/lib/viniBaxter/sass/bootstrap/_card.scss +0 -287
  12. data/lib/viniBaxter/sass/bootstrap/_carousel.scss +0 -197
  13. data/lib/viniBaxter/sass/bootstrap/_close.scss +0 -40
  14. data/lib/viniBaxter/sass/bootstrap/_code.scss +0 -48
  15. data/lib/viniBaxter/sass/bootstrap/_custom-forms.scss +0 -556
  16. data/lib/viniBaxter/sass/bootstrap/_dropdown.scss +0 -192
  17. data/lib/viniBaxter/sass/bootstrap/_forms.scss +0 -364
  18. data/lib/viniBaxter/sass/bootstrap/_grid.scss +0 -86
  19. data/lib/viniBaxter/sass/bootstrap/_images.scss +0 -42
  20. data/lib/viniBaxter/sass/bootstrap/_input-group.scss +0 -192
  21. data/lib/viniBaxter/sass/bootstrap/_jumbotron.scss +0 -17
  22. data/lib/viniBaxter/sass/bootstrap/_list-group.scss +0 -154
  23. data/lib/viniBaxter/sass/bootstrap/_media.scss +0 -8
  24. data/lib/viniBaxter/sass/bootstrap/_mixins.scss +0 -47
  25. data/lib/viniBaxter/sass/bootstrap/_modal.scss +0 -240
  26. data/lib/viniBaxter/sass/bootstrap/_nav.scss +0 -123
  27. data/lib/viniBaxter/sass/bootstrap/_navbar.scss +0 -318
  28. data/lib/viniBaxter/sass/bootstrap/_pagination.scss +0 -74
  29. data/lib/viniBaxter/sass/bootstrap/_popover.scss +0 -170
  30. data/lib/viniBaxter/sass/bootstrap/_print.scss +0 -141
  31. data/lib/viniBaxter/sass/bootstrap/_progress.scss +0 -47
  32. data/lib/viniBaxter/sass/bootstrap/_reboot.scss +0 -498
  33. data/lib/viniBaxter/sass/bootstrap/_root.scss +0 -20
  34. data/lib/viniBaxter/sass/bootstrap/_spinners.scss +0 -56
  35. data/lib/viniBaxter/sass/bootstrap/_tables.scss +0 -185
  36. data/lib/viniBaxter/sass/bootstrap/_toasts.scss +0 -46
  37. data/lib/viniBaxter/sass/bootstrap/_tooltip.scss +0 -115
  38. data/lib/viniBaxter/sass/bootstrap/_transitions.scss +0 -20
  39. data/lib/viniBaxter/sass/bootstrap/_type.scss +0 -149
  40. data/lib/viniBaxter/sass/bootstrap/_utilities.scss +0 -18
  41. data/lib/viniBaxter/sass/bootstrap/bootstrap-grid.scss +0 -29
  42. data/lib/viniBaxter/sass/bootstrap/bootstrap-reboot.scss +0 -12
  43. data/lib/viniBaxter/sass/bootstrap/bootstrap.scss +0 -42
  44. data/lib/viniBaxter/sass/bootstrap/mixins/_alert.scss +0 -13
  45. data/lib/viniBaxter/sass/bootstrap/mixins/_background-variant.scss +0 -23
  46. data/lib/viniBaxter/sass/bootstrap/mixins/_badge.scss +0 -17
  47. data/lib/viniBaxter/sass/bootstrap/mixins/_border-radius.scss +0 -76
  48. data/lib/viniBaxter/sass/bootstrap/mixins/_box-shadow.scss +0 -20
  49. data/lib/viniBaxter/sass/bootstrap/mixins/_breakpoints.scss +0 -123
  50. data/lib/viniBaxter/sass/bootstrap/mixins/_buttons.scss +0 -153
  51. data/lib/viniBaxter/sass/bootstrap/mixins/_caret.scss +0 -62
  52. data/lib/viniBaxter/sass/bootstrap/mixins/_clearfix.scss +0 -7
  53. data/lib/viniBaxter/sass/bootstrap/mixins/_deprecate.scss +0 -10
  54. data/lib/viniBaxter/sass/bootstrap/mixins/_float.scss +0 -14
  55. data/lib/viniBaxter/sass/bootstrap/mixins/_forms.scss +0 -178
  56. data/lib/viniBaxter/sass/bootstrap/mixins/_gradients.scss +0 -45
  57. data/lib/viniBaxter/sass/bootstrap/mixins/_grid-framework.scss +0 -80
  58. data/lib/viniBaxter/sass/bootstrap/mixins/_grid.scss +0 -72
  59. data/lib/viniBaxter/sass/bootstrap/mixins/_hover.scss +0 -37
  60. data/lib/viniBaxter/sass/bootstrap/mixins/_image.scss +0 -36
  61. data/lib/viniBaxter/sass/bootstrap/mixins/_list-group.scss +0 -21
  62. data/lib/viniBaxter/sass/bootstrap/mixins/_lists.scss +0 -7
  63. data/lib/viniBaxter/sass/bootstrap/mixins/_nav-divider.scss +0 -11
  64. data/lib/viniBaxter/sass/bootstrap/mixins/_pagination.scss +0 -22
  65. data/lib/viniBaxter/sass/bootstrap/mixins/_reset-text.scss +0 -17
  66. data/lib/viniBaxter/sass/bootstrap/mixins/_resize.scss +0 -6
  67. data/lib/viniBaxter/sass/bootstrap/mixins/_screen-reader.scss +0 -34
  68. data/lib/viniBaxter/sass/bootstrap/mixins/_size.scss +0 -7
  69. data/lib/viniBaxter/sass/bootstrap/mixins/_table-row.scss +0 -39
  70. data/lib/viniBaxter/sass/bootstrap/mixins/_text-emphasis.scss +0 -17
  71. data/lib/viniBaxter/sass/bootstrap/mixins/_text-hide.scss +0 -11
  72. data/lib/viniBaxter/sass/bootstrap/mixins/_text-truncate.scss +0 -8
  73. data/lib/viniBaxter/sass/bootstrap/mixins/_transition.scss +0 -26
  74. data/lib/viniBaxter/sass/bootstrap/mixins/_visibility.scss +0 -8
  75. data/lib/viniBaxter/sass/bootstrap/utilities/_align.scss +0 -8
  76. data/lib/viniBaxter/sass/bootstrap/utilities/_background.scss +0 -19
  77. data/lib/viniBaxter/sass/bootstrap/utilities/_borders.scss +0 -75
  78. data/lib/viniBaxter/sass/bootstrap/utilities/_clearfix.scss +0 -3
  79. data/lib/viniBaxter/sass/bootstrap/utilities/_display.scss +0 -26
  80. data/lib/viniBaxter/sass/bootstrap/utilities/_embed.scss +0 -39
  81. data/lib/viniBaxter/sass/bootstrap/utilities/_flex.scss +0 -51
  82. data/lib/viniBaxter/sass/bootstrap/utilities/_float.scss +0 -11
  83. data/lib/viniBaxter/sass/bootstrap/utilities/_interactions.scss +0 -5
  84. data/lib/viniBaxter/sass/bootstrap/utilities/_overflow.scss +0 -5
  85. data/lib/viniBaxter/sass/bootstrap/utilities/_position.scss +0 -34
  86. data/lib/viniBaxter/sass/bootstrap/utilities/_screenreaders.scss +0 -11
  87. data/lib/viniBaxter/sass/bootstrap/utilities/_shadows.scss +0 -6
  88. data/lib/viniBaxter/sass/bootstrap/utilities/_sizing.scss +0 -20
  89. data/lib/viniBaxter/sass/bootstrap/utilities/_spacing.scss +0 -73
  90. data/lib/viniBaxter/sass/bootstrap/utilities/_stretched-link.scss +0 -19
  91. data/lib/viniBaxter/sass/bootstrap/utilities/_text.scss +0 -72
  92. data/lib/viniBaxter/sass/bootstrap/utilities/_visibility.scss +0 -13
  93. data/lib/viniBaxter/sass/bootstrap/vendor/_rfs.scss +0 -204
@@ -1,197 +0,0 @@
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(opacity 0s $carousel-transition-duration);
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-image: linear-gradient(90deg, rgba($black, .25), rgba($black, .001));
115
- }
116
- }
117
- .carousel-control-next {
118
- right: 0;
119
- @if $enable-gradients {
120
- background-image: 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: escape-svg($carousel-control-prev-icon-bg);
134
- }
135
- .carousel-control-next-icon {
136
- background-image: escape-svg($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
- }
@@ -1,40 +0,0 @@
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
- }
34
-
35
- // Future-proof disabling of clicks on `<a>` elements
36
-
37
- // stylelint-disable-next-line selector-no-qualifying-type
38
- a.close.disabled {
39
- pointer-events: none;
40
- }
@@ -1,48 +0,0 @@
1
- // Inline code
2
- code {
3
- @include font-size($code-font-size);
4
- color: $code-color;
5
- word-wrap: 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
- }
@@ -1,556 +0,0 @@
1
- // Embedded icons from Open Iconic.
2
- // Released under MIT and copyright 2014 Waybury.
3
- // https://useiconic.com/open
4
-
5
- // Checkboxes and radios
6
- //
7
- // Base class takes care of all the key behavioral aspects.
8
-
9
- .custom-control {
10
- position: relative;
11
- z-index: 1;
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
- left: 0;
25
- z-index: -1; // Put the input behind the label so it doesn't overlay text
26
- width: $custom-control-indicator-size;
27
- height: ($font-size-base * $line-height-base + $custom-control-indicator-size) /
28
- 2;
29
- opacity: 0;
30
-
31
- &:checked ~ .custom-control-label::before {
32
- color: $custom-control-indicator-checked-color;
33
- border-color: $custom-control-indicator-checked-border-color;
34
- @include gradient-bg($custom-control-indicator-checked-bg);
35
- // TODO: ERROR ☠️
36
- // @include box-shadow($custom-control-indicator-checked-box-shadow);
37
- }
38
-
39
- // TODO: ERROR ☠️
40
- // &:focus ~ .custom-control-label::before {
41
- // // the mixin is not used here to make sure there is feedback
42
- // @if $enable-shadows {
43
- // box-shadow: $input-box-shadow, $input-focus-box-shadow;
44
- // } @else {
45
- // box-shadow: $custom-control-indicator-focus-box-shadow;
46
- // }
47
- // }
48
-
49
- &:focus:not(:checked) ~ .custom-control-label::before {
50
- border-color: $custom-control-indicator-focus-border-color;
51
- }
52
-
53
- &:not(:disabled):active ~ .custom-control-label::before {
54
- color: $custom-control-indicator-active-color;
55
- background-color: $custom-control-indicator-active-bg;
56
- border-color: $custom-control-indicator-active-border-color;
57
- // TODO: ERROR ☠️
58
- // @include box-shadow($custom-control-indicator-active-box-shadow);
59
- }
60
-
61
- // Use [disabled] and :disabled to work around https://github.com/twbs/bootstrap/issues/28247
62
- &[disabled],
63
- &:disabled {
64
- ~ .custom-control-label {
65
- color: $custom-control-label-disabled-color;
66
-
67
- &::before {
68
- background-color: $custom-control-indicator-disabled-bg;
69
- }
70
- }
71
- }
72
- }
73
- // first part end 1st 😇
74
-
75
- // Custom control indicators
76
- //
77
- // Build the custom controls out of pseudo-elements.
78
-
79
- .custom-control-label {
80
- position: relative;
81
- margin-bottom: 0;
82
- color: $custom-control-label-color;
83
- vertical-align: top;
84
- cursor: $custom-control-cursor;
85
-
86
- // Background-color and (when enabled) gradient
87
- &::before {
88
- position: absolute;
89
- top: ($font-size-base * $line-height-base - $custom-control-indicator-size) /
90
- 2;
91
- left: -($custom-control-gutter + $custom-control-indicator-size);
92
- display: block;
93
- width: $custom-control-indicator-size;
94
- height: $custom-control-indicator-size;
95
- pointer-events: none;
96
- content: '';
97
- background-color: $custom-control-indicator-bg;
98
- border: $custom-control-indicator-border-color solid
99
- $custom-control-indicator-border-width;
100
- // @include box-shadow($custom-control-indicator-box-shadow);
101
- }
102
-
103
- // Foreground (icon)
104
- &::after {
105
- position: absolute;
106
- top: ($font-size-base * $line-height-base - $custom-control-indicator-size) /
107
- 2;
108
- left: -($custom-control-gutter + $custom-control-indicator-size);
109
- display: block;
110
- width: $custom-control-indicator-size;
111
- height: $custom-control-indicator-size;
112
- content: '';
113
- background: no-repeat 50% / #{$custom-control-indicator-bg-size};
114
- }
115
- }
116
-
117
- // Checkboxes
118
- //
119
- // Tweak just a few things for checkboxes.
120
-
121
- .custom-checkbox {
122
- .custom-control-label::before {
123
- @include border-radius($custom-checkbox-indicator-border-radius);
124
- }
125
-
126
- .custom-control-input:checked ~ .custom-control-label {
127
- &::after {
128
- background-image: escape-svg($custom-checkbox-indicator-icon-checked);
129
- }
130
- }
131
-
132
- .custom-control-input:indeterminate ~ .custom-control-label {
133
- &::before {
134
- border-color: $custom-checkbox-indicator-indeterminate-border-color;
135
- @include gradient-bg($custom-checkbox-indicator-indeterminate-bg);
136
- // @include box-shadow($custom-checkbox-indicator-indeterminate-box-shadow);
137
- }
138
- &::after {
139
- background-image: escape-svg(
140
- $custom-checkbox-indicator-icon-indeterminate
141
- );
142
- }
143
- }
144
-
145
- .custom-control-input:disabled {
146
- &:checked ~ .custom-control-label::before {
147
- @include gradient-bg($custom-control-indicator-checked-disabled-bg);
148
- }
149
- &:indeterminate ~ .custom-control-label::before {
150
- @include gradient-bg($custom-control-indicator-checked-disabled-bg);
151
- }
152
- }
153
- }
154
-
155
- // Radios
156
- //
157
- // Tweak just a few things for radios.
158
-
159
- .custom-radio {
160
- .custom-control-label::before {
161
- // stylelint-disable-next-line property-blacklist
162
- border-radius: $custom-radio-indicator-border-radius;
163
- }
164
-
165
- .custom-control-input:checked ~ .custom-control-label {
166
- &::after {
167
- background-image: escape-svg($custom-radio-indicator-icon-checked);
168
- }
169
- }
170
-
171
- .custom-control-input:disabled {
172
- &:checked ~ .custom-control-label::before {
173
- @include gradient-bg($custom-control-indicator-checked-disabled-bg);
174
- }
175
- }
176
- }
177
-
178
- // switches
179
- //
180
- // Tweak a few things for switches
181
-
182
- .custom-switch {
183
- padding-left: $custom-switch-width + $custom-control-gutter;
184
-
185
- .custom-control-label {
186
- &::before {
187
- left: -($custom-switch-width + $custom-control-gutter);
188
- width: $custom-switch-width;
189
- pointer-events: all;
190
- // stylelint-disable-next-line property-blacklist
191
- border-radius: $custom-switch-indicator-border-radius;
192
- }
193
-
194
- &::after {
195
- top: add(
196
- ($font-size-base * $line-height-base - $custom-control-indicator-size) /
197
- 2,
198
- $custom-control-indicator-border-width * 2
199
- );
200
- left: add(
201
- -($custom-switch-width + $custom-control-gutter),
202
- $custom-control-indicator-border-width * 2
203
- );
204
- width: $custom-switch-indicator-size;
205
- height: $custom-switch-indicator-size;
206
- background-color: $custom-control-indicator-border-color;
207
- // stylelint-disable-next-line property-blacklist
208
- border-radius: $custom-switch-indicator-border-radius;
209
- @include transition(
210
- transform 0.15s ease-in-out,
211
- $custom-forms-transition
212
- );
213
- }
214
- }
215
-
216
- .custom-control-input:checked ~ .custom-control-label {
217
- &::after {
218
- background-color: $custom-control-indicator-bg;
219
- transform: translateX(
220
- $custom-switch-width - $custom-control-indicator-size
221
- );
222
- }
223
- }
224
-
225
- .custom-control-input:disabled {
226
- &:checked ~ .custom-control-label::before {
227
- @include gradient-bg($custom-control-indicator-checked-disabled-bg);
228
- }
229
- }
230
- }
231
-
232
- // Select
233
- //
234
- // Replaces the browser default select with a custom one, mostly pulled from
235
- // https://primer.github.io/.
236
- //
237
-
238
- .custom-select {
239
- display: inline-block;
240
- width: 100%;
241
- height: $custom-select-height;
242
- padding: $custom-select-padding-y
243
- ($custom-select-padding-x + $custom-select-indicator-padding)
244
- $custom-select-padding-y $custom-select-padding-x;
245
- font-family: $custom-select-font-family;
246
- @include font-size($custom-select-font-size);
247
- font-weight: $custom-select-font-weight;
248
- line-height: $custom-select-line-height;
249
- color: $custom-select-color;
250
- vertical-align: middle;
251
- background: $custom-select-bg $custom-select-background;
252
- border: $custom-select-border-width solid $custom-select-border-color;
253
- @include border-radius($custom-select-border-radius, 0);
254
- // @include box-shadow($custom-select-box-shadow);
255
- appearance: none;
256
-
257
- &:focus {
258
- border-color: $custom-select-focus-border-color;
259
- outline: 0;
260
- // @if $enable-shadows {
261
- // @include box-shadow(
262
- // $custom-select-box-shadow,
263
- // $custom-select-focus-box-shadow
264
- // );
265
- // } @else {
266
- // // Avoid using mixin so we can pass custom focus shadow properly
267
- // box-shadow: $custom-select-focus-box-shadow;
268
- // }
269
-
270
- &::-ms-value {
271
- // For visual consistency with other platforms/browsers,
272
- // suppress the default white text on blue background highlight given to
273
- // the selected option text when the (still closed) <select> receives focus
274
- // in IE and (under certain conditions) Edge.
275
- // See https://github.com/twbs/bootstrap/issues/19398.
276
- color: $input-color;
277
- background-color: $input-bg;
278
- }
279
- }
280
-
281
- &[multiple],
282
- &[size]:not([size='1']) {
283
- height: auto;
284
- padding-right: $custom-select-padding-x;
285
- background-image: none;
286
- }
287
-
288
- &:disabled {
289
- color: $custom-select-disabled-color;
290
- background-color: $custom-select-disabled-bg;
291
- }
292
-
293
- // Hides the default caret in IE11
294
- &::-ms-expand {
295
- display: none;
296
- }
297
-
298
- // Remove outline from select box in FF
299
- &:-moz-focusring {
300
- color: transparent;
301
- text-shadow: 0 0 0 $custom-select-color;
302
- }
303
- }
304
-
305
- .custom-select-sm {
306
- height: $custom-select-height-sm;
307
- padding-top: $custom-select-padding-y-sm;
308
- padding-bottom: $custom-select-padding-y-sm;
309
- padding-left: $custom-select-padding-x-sm;
310
- @include font-size($custom-select-font-size-sm);
311
- }
312
-
313
- .custom-select-lg {
314
- height: $custom-select-height-lg;
315
- padding-top: $custom-select-padding-y-lg;
316
- padding-bottom: $custom-select-padding-y-lg;
317
- padding-left: $custom-select-padding-x-lg;
318
- @include font-size($custom-select-font-size-lg);
319
- }
320
-
321
- // File
322
- //
323
- // Custom file input.
324
-
325
- .custom-file {
326
- position: relative;
327
- display: inline-block;
328
- width: 100%;
329
- height: $custom-file-height;
330
- margin-bottom: 0;
331
- }
332
-
333
- .custom-file-input {
334
- position: relative;
335
- z-index: 2;
336
- width: 100%;
337
- height: $custom-file-height;
338
- margin: 0;
339
- opacity: 0;
340
-
341
- &:focus ~ .custom-file-label {
342
- border-color: $custom-file-focus-border-color;
343
- box-shadow: $custom-file-focus-box-shadow;
344
- }
345
-
346
- // Use [disabled] and :disabled to work around https://github.com/twbs/bootstrap/issues/28247
347
- &[disabled] ~ .custom-file-label,
348
- &:disabled ~ .custom-file-label {
349
- background-color: $custom-file-disabled-bg;
350
- }
351
-
352
- @each $lang, $value in $custom-file-text {
353
- &:lang(#{$lang}) ~ .custom-file-label::after {
354
- content: $value;
355
- }
356
- }
357
-
358
- ~ .custom-file-label[data-browse]::after {
359
- content: attr(data-browse);
360
- }
361
- }
362
-
363
- .custom-file-label {
364
- position: absolute;
365
- top: 0;
366
- right: 0;
367
- left: 0;
368
- z-index: 1;
369
- height: $custom-file-height;
370
- padding: $custom-file-padding-y $custom-file-padding-x;
371
- font-family: $custom-file-font-family;
372
- font-weight: $custom-file-font-weight;
373
- line-height: $custom-file-line-height;
374
- color: $custom-file-color;
375
- background-color: $custom-file-bg;
376
- border: $custom-file-border-width solid $custom-file-border-color;
377
- @include border-radius($custom-file-border-radius);
378
- // @include box-shadow($custom-file-box-shadow);
379
-
380
- &::after {
381
- position: absolute;
382
- top: 0;
383
- right: 0;
384
- bottom: 0;
385
- z-index: 3;
386
- display: block;
387
- height: $custom-file-height-inner;
388
- padding: $custom-file-padding-y $custom-file-padding-x;
389
- line-height: $custom-file-line-height;
390
- color: $custom-file-button-color;
391
- content: 'Browse';
392
- @include gradient-bg($custom-file-button-bg);
393
- border-left: inherit;
394
- @include border-radius(
395
- 0 $custom-file-border-radius $custom-file-border-radius 0
396
- );
397
- }
398
- }
399
-
400
- // Range
401
- //
402
- // Style range inputs the same across browsers. Vendor-specific rules for pseudo
403
- // elements cannot be mixed. As such, there are no shared styles for focus or
404
- // active states on prefixed selectors.
405
-
406
- .custom-range {
407
- width: 100%;
408
- height: add(
409
- $custom-range-thumb-height,
410
- $custom-range-thumb-focus-box-shadow-width * 2
411
- );
412
- padding: 0; // Need to reset padding
413
- background-color: transparent;
414
- appearance: none;
415
-
416
- &:focus {
417
- outline: none;
418
-
419
- // Pseudo-elements must be split across multiple rulesets to have an effect.
420
- // No box-shadow() mixin for focus accessibility.
421
- &::-webkit-slider-thumb {
422
- box-shadow: $custom-range-thumb-focus-box-shadow;
423
- }
424
- &::-moz-range-thumb {
425
- box-shadow: $custom-range-thumb-focus-box-shadow;
426
- }
427
- &::-ms-thumb {
428
- box-shadow: $custom-range-thumb-focus-box-shadow;
429
- }
430
- }
431
-
432
- &::-moz-focus-outer {
433
- border: 0;
434
- }
435
-
436
- &::-webkit-slider-thumb {
437
- width: $custom-range-thumb-width;
438
- height: $custom-range-thumb-height;
439
- margin-top: ($custom-range-track-height - $custom-range-thumb-height) / 2; // Webkit specific
440
- @include gradient-bg($custom-range-thumb-bg);
441
- border: $custom-range-thumb-border;
442
- @include border-radius($custom-range-thumb-border-radius);
443
- // @include box-shadow($custom-range-thumb-box-shadow);
444
- @include transition($custom-forms-transition);
445
- appearance: none;
446
-
447
- &:active {
448
- @include gradient-bg($custom-range-thumb-active-bg);
449
- }
450
- }
451
-
452
- &::-webkit-slider-runnable-track {
453
- width: $custom-range-track-width;
454
- height: $custom-range-track-height;
455
- color: transparent; // Why?
456
- cursor: $custom-range-track-cursor;
457
- background-color: $custom-range-track-bg;
458
- border-color: transparent;
459
- @include border-radius($custom-range-track-border-radius);
460
- // @include box-shadow($custom-range-track-box-shadow);
461
- }
462
-
463
- &::-moz-range-thumb {
464
- width: $custom-range-thumb-width;
465
- height: $custom-range-thumb-height;
466
- @include gradient-bg($custom-range-thumb-bg);
467
- border: $custom-range-thumb-border;
468
- @include border-radius($custom-range-thumb-border-radius);
469
- // @include box-shadow($custom-range-thumb-box-shadow);
470
- @include transition($custom-forms-transition);
471
- appearance: none;
472
-
473
- &:active {
474
- @include gradient-bg($custom-range-thumb-active-bg);
475
- }
476
- }
477
-
478
- &::-moz-range-track {
479
- width: $custom-range-track-width;
480
- height: $custom-range-track-height;
481
- color: transparent;
482
- cursor: $custom-range-track-cursor;
483
- background-color: $custom-range-track-bg;
484
- border-color: transparent; // Firefox specific?
485
- @include border-radius($custom-range-track-border-radius);
486
- // @include box-shadow($custom-range-track-box-shadow);
487
- }
488
-
489
- &::-ms-thumb {
490
- width: $custom-range-thumb-width;
491
- height: $custom-range-thumb-height;
492
- margin-top: 0; // Edge specific
493
- margin-right: $custom-range-thumb-focus-box-shadow-width; // Workaround that overflowed box-shadow is hidden.
494
- margin-left: $custom-range-thumb-focus-box-shadow-width; // Workaround that overflowed box-shadow is hidden.
495
- @include gradient-bg($custom-range-thumb-bg);
496
- border: $custom-range-thumb-border;
497
- @include border-radius($custom-range-thumb-border-radius);
498
- // @include box-shadow($custom-range-thumb-box-shadow);
499
- @include transition($custom-forms-transition);
500
- appearance: none;
501
-
502
- &:active {
503
- @include gradient-bg($custom-range-thumb-active-bg);
504
- }
505
- }
506
-
507
- &::-ms-track {
508
- width: $custom-range-track-width;
509
- height: $custom-range-track-height;
510
- color: transparent;
511
- cursor: $custom-range-track-cursor;
512
- background-color: transparent;
513
- border-color: transparent;
514
- border-width: $custom-range-thumb-height / 2;
515
- // @include box-shadow($custom-range-track-box-shadow);
516
- }
517
-
518
- &::-ms-fill-lower {
519
- background-color: $custom-range-track-bg;
520
- @include border-radius($custom-range-track-border-radius);
521
- }
522
-
523
- &::-ms-fill-upper {
524
- margin-right: 15px; // arbitrary?
525
- background-color: $custom-range-track-bg;
526
- @include border-radius($custom-range-track-border-radius);
527
- }
528
-
529
- &:disabled {
530
- &::-webkit-slider-thumb {
531
- background-color: $custom-range-thumb-disabled-bg;
532
- }
533
-
534
- &::-webkit-slider-runnable-track {
535
- cursor: default;
536
- }
537
-
538
- &::-moz-range-thumb {
539
- background-color: $custom-range-thumb-disabled-bg;
540
- }
541
-
542
- &::-moz-range-track {
543
- cursor: default;
544
- }
545
-
546
- &::-ms-thumb {
547
- background-color: $custom-range-thumb-disabled-bg;
548
- }
549
- }
550
- }
551
-
552
- .custom-control-label::before,
553
- .custom-file-label,
554
- .custom-select {
555
- @include transition($custom-forms-transition);
556
- }