viniBaxter-spa_landing 15.0.0 → 32.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/lib/viniBaxter/sass/{spa_landing-nav.scss → spa_landing-creative-nav.scss} +1 -4
- data/lib/viniBaxter/sass/{spa_landing-basic-nav.scss → spa_landing-initial-nav.scss} +1 -4
- data/lib/viniBaxter/sass/spa_landing/theme/both_gems/jumbotrons/_jubo-home.scss +4 -3
- data/lib/viniBaxter/spa_landing/version.rb +9 -1
- metadata +4 -92
- data/lib/viniBaxter/sass/bootstrap/_alert.scss +0 -51
- data/lib/viniBaxter/sass/bootstrap/_badge.scss +0 -54
- data/lib/viniBaxter/sass/bootstrap/_breadcrumb.scss +0 -44
- data/lib/viniBaxter/sass/bootstrap/_button-group.scss +0 -163
- data/lib/viniBaxter/sass/bootstrap/_buttons.scss +0 -203
- data/lib/viniBaxter/sass/bootstrap/_card.scss +0 -286
- data/lib/viniBaxter/sass/bootstrap/_carousel.scss +0 -197
- data/lib/viniBaxter/sass/bootstrap/_close.scss +0 -40
- data/lib/viniBaxter/sass/bootstrap/_code.scss +0 -48
- data/lib/viniBaxter/sass/bootstrap/_custom-forms.scss +0 -556
- data/lib/viniBaxter/sass/bootstrap/_dropdown.scss +0 -192
- data/lib/viniBaxter/sass/bootstrap/_forms.scss +0 -364
- data/lib/viniBaxter/sass/bootstrap/_grid.scss +0 -86
- data/lib/viniBaxter/sass/bootstrap/_images.scss +0 -42
- data/lib/viniBaxter/sass/bootstrap/_input-group.scss +0 -192
- data/lib/viniBaxter/sass/bootstrap/_jumbotron.scss +0 -17
- data/lib/viniBaxter/sass/bootstrap/_list-group.scss +0 -154
- data/lib/viniBaxter/sass/bootstrap/_media.scss +0 -8
- data/lib/viniBaxter/sass/bootstrap/_mixins.scss +0 -47
- data/lib/viniBaxter/sass/bootstrap/_modal.scss +0 -240
- data/lib/viniBaxter/sass/bootstrap/_nav.scss +0 -123
- data/lib/viniBaxter/sass/bootstrap/_navbar.scss +0 -318
- data/lib/viniBaxter/sass/bootstrap/_pagination.scss +0 -74
- data/lib/viniBaxter/sass/bootstrap/_popover.scss +0 -170
- data/lib/viniBaxter/sass/bootstrap/_print.scss +0 -141
- data/lib/viniBaxter/sass/bootstrap/_progress.scss +0 -47
- data/lib/viniBaxter/sass/bootstrap/_reboot.scss +0 -498
- data/lib/viniBaxter/sass/bootstrap/_root.scss +0 -20
- data/lib/viniBaxter/sass/bootstrap/_spinners.scss +0 -56
- data/lib/viniBaxter/sass/bootstrap/_tables.scss +0 -185
- data/lib/viniBaxter/sass/bootstrap/_toasts.scss +0 -46
- data/lib/viniBaxter/sass/bootstrap/_tooltip.scss +0 -115
- data/lib/viniBaxter/sass/bootstrap/_transitions.scss +0 -20
- data/lib/viniBaxter/sass/bootstrap/_type.scss +0 -149
- data/lib/viniBaxter/sass/bootstrap/_utilities.scss +0 -18
- data/lib/viniBaxter/sass/bootstrap/bootstrap-grid.scss +0 -29
- data/lib/viniBaxter/sass/bootstrap/bootstrap-reboot.scss +0 -12
- data/lib/viniBaxter/sass/bootstrap/bootstrap.scss +0 -42
- data/lib/viniBaxter/sass/bootstrap/mixins/_alert.scss +0 -13
- data/lib/viniBaxter/sass/bootstrap/mixins/_background-variant.scss +0 -23
- data/lib/viniBaxter/sass/bootstrap/mixins/_badge.scss +0 -17
- data/lib/viniBaxter/sass/bootstrap/mixins/_border-radius.scss +0 -76
- data/lib/viniBaxter/sass/bootstrap/mixins/_box-shadow.scss +0 -20
- data/lib/viniBaxter/sass/bootstrap/mixins/_breakpoints.scss +0 -123
- data/lib/viniBaxter/sass/bootstrap/mixins/_buttons.scss +0 -153
- data/lib/viniBaxter/sass/bootstrap/mixins/_caret.scss +0 -62
- data/lib/viniBaxter/sass/bootstrap/mixins/_clearfix.scss +0 -7
- data/lib/viniBaxter/sass/bootstrap/mixins/_deprecate.scss +0 -10
- data/lib/viniBaxter/sass/bootstrap/mixins/_float.scss +0 -14
- data/lib/viniBaxter/sass/bootstrap/mixins/_forms.scss +0 -178
- data/lib/viniBaxter/sass/bootstrap/mixins/_gradients.scss +0 -45
- data/lib/viniBaxter/sass/bootstrap/mixins/_grid-framework.scss +0 -80
- data/lib/viniBaxter/sass/bootstrap/mixins/_grid.scss +0 -72
- data/lib/viniBaxter/sass/bootstrap/mixins/_hover.scss +0 -37
- data/lib/viniBaxter/sass/bootstrap/mixins/_image.scss +0 -36
- data/lib/viniBaxter/sass/bootstrap/mixins/_list-group.scss +0 -21
- data/lib/viniBaxter/sass/bootstrap/mixins/_lists.scss +0 -7
- data/lib/viniBaxter/sass/bootstrap/mixins/_nav-divider.scss +0 -11
- data/lib/viniBaxter/sass/bootstrap/mixins/_pagination.scss +0 -22
- data/lib/viniBaxter/sass/bootstrap/mixins/_reset-text.scss +0 -17
- data/lib/viniBaxter/sass/bootstrap/mixins/_resize.scss +0 -6
- data/lib/viniBaxter/sass/bootstrap/mixins/_screen-reader.scss +0 -34
- data/lib/viniBaxter/sass/bootstrap/mixins/_size.scss +0 -7
- data/lib/viniBaxter/sass/bootstrap/mixins/_table-row.scss +0 -39
- data/lib/viniBaxter/sass/bootstrap/mixins/_text-emphasis.scss +0 -17
- data/lib/viniBaxter/sass/bootstrap/mixins/_text-hide.scss +0 -11
- data/lib/viniBaxter/sass/bootstrap/mixins/_text-truncate.scss +0 -8
- data/lib/viniBaxter/sass/bootstrap/mixins/_transition.scss +0 -26
- data/lib/viniBaxter/sass/bootstrap/mixins/_visibility.scss +0 -8
- data/lib/viniBaxter/sass/bootstrap/utilities/_align.scss +0 -8
- data/lib/viniBaxter/sass/bootstrap/utilities/_background.scss +0 -19
- data/lib/viniBaxter/sass/bootstrap/utilities/_borders.scss +0 -75
- data/lib/viniBaxter/sass/bootstrap/utilities/_clearfix.scss +0 -3
- data/lib/viniBaxter/sass/bootstrap/utilities/_display.scss +0 -26
- data/lib/viniBaxter/sass/bootstrap/utilities/_embed.scss +0 -39
- data/lib/viniBaxter/sass/bootstrap/utilities/_flex.scss +0 -51
- data/lib/viniBaxter/sass/bootstrap/utilities/_float.scss +0 -11
- data/lib/viniBaxter/sass/bootstrap/utilities/_interactions.scss +0 -5
- data/lib/viniBaxter/sass/bootstrap/utilities/_overflow.scss +0 -5
- data/lib/viniBaxter/sass/bootstrap/utilities/_position.scss +0 -34
- data/lib/viniBaxter/sass/bootstrap/utilities/_screenreaders.scss +0 -11
- data/lib/viniBaxter/sass/bootstrap/utilities/_shadows.scss +0 -6
- data/lib/viniBaxter/sass/bootstrap/utilities/_sizing.scss +0 -20
- data/lib/viniBaxter/sass/bootstrap/utilities/_spacing.scss +0 -73
- data/lib/viniBaxter/sass/bootstrap/utilities/_stretched-link.scss +0 -19
- data/lib/viniBaxter/sass/bootstrap/utilities/_text.scss +0 -72
- data/lib/viniBaxter/sass/bootstrap/utilities/_visibility.scss +0 -13
- 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
|
-
}
|