Skip to content

Commit 12eafcd

Browse files
authored
Merge pull request #230 from Rotzbua/upgrade_bootstrap
Upgrade to Bootstrap v4.6.2
2 parents a4a2f86 + 7770917 commit 12eafcd

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

46 files changed

+436
-269
lines changed

_sass/_variables.scss

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
// Customize default style definitions of Bootstrap.
2+
@import 'colors';
3+
4+
$link-decoration: underline;
5+
6+
$card-bg: $gray-100;
7+
8+
$card-border-width: 0;
9+
10+
$container-max-widths: (
11+
sm: 540px,
12+
md: 720px,
13+
lg: 960px,
14+
xl: 1360px
15+
);
16+
17+
$grid-breakpoints: (
18+
xs: 0,
19+
sm: 576px,
20+
md: 768px,
21+
lg: 992px,
22+
xl: 1400px
23+
);

_sass/bootstrap/_alert.scss

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -34,6 +34,7 @@
3434
position: absolute;
3535
top: 0;
3636
right: 0;
37+
z-index: 2;
3738
padding: $alert-padding-y $alert-padding-x;
3839
color: inherit;
3940
}

_sass/bootstrap/_breadcrumb.scss

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -10,14 +10,12 @@
1010
}
1111

1212
.breadcrumb-item {
13-
display: flex;
14-
1513
// The separator between breadcrumbs (by default, a forward-slash: "/")
1614
+ .breadcrumb-item {
1715
padding-left: $breadcrumb-item-padding;
1816

1917
&::before {
20-
display: inline-block; // Suppress underlining of the separator in modern browsers
18+
float: left; // Suppress inline spacings and underlining of the separator
2119
padding-right: $breadcrumb-item-padding;
2220
color: $breadcrumb-divider-color;
2321
content: escape-svg($breadcrumb-divider);

_sass/bootstrap/_card.scss

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -58,7 +58,7 @@
5858
}
5959

6060
.card-subtitle {
61-
margin-top: -$card-spacer-y / 2;
61+
margin-top: -$card-spacer-y * .5;
6262
margin-bottom: 0;
6363
}
6464

@@ -109,15 +109,15 @@
109109
//
110110

111111
.card-header-tabs {
112-
margin-right: -$card-spacer-x / 2;
112+
margin-right: -$card-spacer-x * .5;
113113
margin-bottom: -$card-spacer-y;
114-
margin-left: -$card-spacer-x / 2;
114+
margin-left: -$card-spacer-x * .5;
115115
border-bottom: 0;
116116
}
117117

118118
.card-header-pills {
119-
margin-right: -$card-spacer-x / 2;
120-
margin-left: -$card-spacer-x / 2;
119+
margin-right: -$card-spacer-x * .5;
120+
margin-left: -$card-spacer-x * .5;
121121
}
122122

123123
// Card image
@@ -206,12 +206,12 @@
206206

207207
.card-img-top,
208208
.card-header {
209-
// stylelint-disable-next-line property-blacklist
209+
// stylelint-disable-next-line property-disallowed-list
210210
border-top-right-radius: 0;
211211
}
212212
.card-img-bottom,
213213
.card-footer {
214-
// stylelint-disable-next-line property-blacklist
214+
// stylelint-disable-next-line property-disallowed-list
215215
border-bottom-right-radius: 0;
216216
}
217217
}
@@ -221,12 +221,12 @@
221221

222222
.card-img-top,
223223
.card-header {
224-
// stylelint-disable-next-line property-blacklist
224+
// stylelint-disable-next-line property-disallowed-list
225225
border-top-left-radius: 0;
226226
}
227227
.card-img-bottom,
228228
.card-footer {
229-
// stylelint-disable-next-line property-blacklist
229+
// stylelint-disable-next-line property-disallowed-list
230230
border-bottom-left-radius: 0;
231231
}
232232
}

_sass/bootstrap/_carousel.scss

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -95,8 +95,11 @@
9595
align-items: center; // 2. vertically center contents
9696
justify-content: center; // 3. horizontally center contents
9797
width: $carousel-control-width;
98+
padding: 0;
9899
color: $carousel-control-color;
99100
text-align: center;
101+
background: none;
102+
border: 0;
100103
opacity: $carousel-control-opacity;
101104
@include transition($carousel-control-transition);
102105

@@ -127,7 +130,7 @@
127130
display: inline-block;
128131
width: $carousel-control-icon-width;
129132
height: $carousel-control-icon-width;
130-
background: no-repeat 50% / 100% 100%;
133+
background: 50% / 100% 100% no-repeat;
131134
}
132135
.carousel-control-prev-icon {
133136
background-image: escape-svg($carousel-control-prev-icon-bg);
@@ -186,9 +189,9 @@
186189

187190
.carousel-caption {
188191
position: absolute;
189-
right: (100% - $carousel-caption-width) / 2;
192+
right: (100% - $carousel-caption-width) * .5;
190193
bottom: 20px;
191-
left: (100% - $carousel-caption-width) / 2;
194+
left: (100% - $carousel-caption-width) * .5;
192195
z-index: 10;
193196
padding-top: 20px;
194197
padding-bottom: 20px;

_sass/bootstrap/_custom-forms.scss

Lines changed: 16 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@
1313
display: block;
1414
min-height: $font-size-base * $line-height-base;
1515
padding-left: $custom-control-gutter + $custom-control-indicator-size;
16+
print-color-adjust: exact; // Keep themed appearance for print
1617
}
1718

1819
.custom-control-inline {
@@ -25,7 +26,7 @@
2526
left: 0;
2627
z-index: -1; // Put the input behind the label so it doesn't overlay text
2728
width: $custom-control-indicator-size;
28-
height: ($font-size-base * $line-height-base + $custom-control-indicator-size) / 2;
29+
height: ($font-size-base * $line-height-base + $custom-control-indicator-size) * .5;
2930
opacity: 0;
3031

3132
&:checked ~ .custom-control-label::before {
@@ -38,7 +39,7 @@
3839
&:focus ~ .custom-control-label::before {
3940
// the mixin is not used here to make sure there is feedback
4041
@if $enable-shadows {
41-
box-shadow: $input-box-shadow, $input-focus-box-shadow;
42+
box-shadow: $input-box-shadow, $custom-control-indicator-focus-box-shadow;
4243
} @else {
4344
box-shadow: $custom-control-indicator-focus-box-shadow;
4445
}
@@ -82,28 +83,28 @@
8283
// Background-color and (when enabled) gradient
8384
&::before {
8485
position: absolute;
85-
top: ($font-size-base * $line-height-base - $custom-control-indicator-size) / 2;
86+
top: ($font-size-base * $line-height-base - $custom-control-indicator-size) * .5;
8687
left: -($custom-control-gutter + $custom-control-indicator-size);
8788
display: block;
8889
width: $custom-control-indicator-size;
8990
height: $custom-control-indicator-size;
9091
pointer-events: none;
9192
content: "";
9293
background-color: $custom-control-indicator-bg;
93-
border: $custom-control-indicator-border-color solid $custom-control-indicator-border-width;
94+
border: $custom-control-indicator-border-width solid $custom-control-indicator-border-color;
9495
@include box-shadow($custom-control-indicator-box-shadow);
9596
}
9697

9798
// Foreground (icon)
9899
&::after {
99100
position: absolute;
100-
top: ($font-size-base * $line-height-base - $custom-control-indicator-size) / 2;
101+
top: ($font-size-base * $line-height-base - $custom-control-indicator-size) * .5;
101102
left: -($custom-control-gutter + $custom-control-indicator-size);
102103
display: block;
103104
width: $custom-control-indicator-size;
104105
height: $custom-control-indicator-size;
105106
content: "";
106-
background: no-repeat 50% / #{$custom-control-indicator-bg-size};
107+
background: 50% / #{$custom-control-indicator-bg-size} no-repeat;
107108
}
108109
}
109110

@@ -150,7 +151,7 @@
150151

151152
.custom-radio {
152153
.custom-control-label::before {
153-
// stylelint-disable-next-line property-blacklist
154+
// stylelint-disable-next-line property-disallowed-list
154155
border-radius: $custom-radio-indicator-border-radius;
155156
}
156157

@@ -180,17 +181,17 @@
180181
left: -($custom-switch-width + $custom-control-gutter);
181182
width: $custom-switch-width;
182183
pointer-events: all;
183-
// stylelint-disable-next-line property-blacklist
184+
// stylelint-disable-next-line property-disallowed-list
184185
border-radius: $custom-switch-indicator-border-radius;
185186
}
186187

187188
&::after {
188-
top: add(($font-size-base * $line-height-base - $custom-control-indicator-size) / 2, $custom-control-indicator-border-width * 2);
189+
top: add(($font-size-base * $line-height-base - $custom-control-indicator-size) * .5, $custom-control-indicator-border-width * 2);
189190
left: add(-($custom-switch-width + $custom-control-gutter), $custom-control-indicator-border-width * 2);
190191
width: $custom-switch-indicator-size;
191192
height: $custom-switch-indicator-size;
192193
background-color: $custom-control-indicator-border-color;
193-
// stylelint-disable-next-line property-blacklist
194+
// stylelint-disable-next-line property-disallowed-list
194195
border-radius: $custom-switch-indicator-border-radius;
195196
@include transition(transform .15s ease-in-out, $custom-forms-transition);
196197
}
@@ -314,6 +315,7 @@
314315
width: 100%;
315316
height: $custom-file-height;
316317
margin: 0;
318+
overflow: hidden;
317319
opacity: 0;
318320

319321
&:focus ~ .custom-file-label {
@@ -346,6 +348,7 @@
346348
z-index: 1;
347349
height: $custom-file-height;
348350
padding: $custom-file-padding-y $custom-file-padding-x;
351+
overflow: hidden;
349352
font-family: $custom-file-font-family;
350353
font-weight: $custom-file-font-weight;
351354
line-height: $custom-file-line-height;
@@ -387,7 +390,7 @@
387390
appearance: none;
388391

389392
&:focus {
390-
outline: none;
393+
outline: 0;
391394

392395
// Pseudo-elements must be split across multiple rulesets to have an effect.
393396
// No box-shadow() mixin for focus accessibility.
@@ -403,7 +406,7 @@
403406
&::-webkit-slider-thumb {
404407
width: $custom-range-thumb-width;
405408
height: $custom-range-thumb-height;
406-
margin-top: ($custom-range-track-height - $custom-range-thumb-height) / 2; // Webkit specific
409+
margin-top: ($custom-range-track-height - $custom-range-thumb-height) * .5; // Webkit specific
407410
@include gradient-bg($custom-range-thumb-bg);
408411
border: $custom-range-thumb-border;
409412
@include border-radius($custom-range-thumb-border-radius);
@@ -478,7 +481,7 @@
478481
cursor: $custom-range-track-cursor;
479482
background-color: transparent;
480483
border-color: transparent;
481-
border-width: $custom-range-thumb-height / 2;
484+
border-width: $custom-range-thumb-height * .5;
482485
@include box-shadow($custom-range-track-box-shadow);
483486
}
484487

_sass/bootstrap/_dropdown.scss

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@
2222
display: none; // none by default, but block on "open" of the menu
2323
float: left;
2424
min-width: $dropdown-min-width;
25-
padding: $dropdown-padding-y 0;
25+
padding: $dropdown-padding-y $dropdown-padding-x;
2626
margin: $dropdown-spacer 0 0; // override default ul
2727
@include font-size($dropdown-font-size);
2828
color: $dropdown-color;
@@ -100,7 +100,7 @@
100100
}
101101
}
102102

103-
// When enabled Popper.js, reset basic dropdown position
103+
// When Popper is enabled, reset the basic dropdown position
104104
// stylelint-disable-next-line no-duplicate-selectors
105105
.dropdown-menu {
106106
&[x-placement^="top"],

_sass/bootstrap/_forms.scss

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -30,12 +30,6 @@
3030
border: 0;
3131
}
3232

33-
// Remove select outline from select box in FF
34-
&:-moz-focusring {
35-
color: transparent;
36-
text-shadow: 0 0 0 $input-color;
37-
}
38-
3933
// Customize the `:focus` state to imitate native WebKit styles.
4034
@include form-control-focus($ignore-warning: true);
4135

@@ -69,6 +63,12 @@ input[type="month"] {
6963
}
7064

7165
select.form-control {
66+
// Remove select outline from select box in FF
67+
&:-moz-focusring {
68+
color: transparent;
69+
text-shadow: 0 0 0 $input-color;
70+
}
71+
7272
&:focus::-ms-value {
7373
// Suppress the nested default white text on blue background highlight given to
7474
// the selected option text when the (still closed) <select> receives focus
@@ -199,13 +199,13 @@ textarea.form-control {
199199
.form-row {
200200
display: flex;
201201
flex-wrap: wrap;
202-
margin-right: -$form-grid-gutter-width / 2;
203-
margin-left: -$form-grid-gutter-width / 2;
202+
margin-right: -$form-grid-gutter-width * .5;
203+
margin-left: -$form-grid-gutter-width * .5;
204204

205205
> .col,
206206
> [class*="col-"] {
207-
padding-right: $form-grid-gutter-width / 2;
208-
padding-left: $form-grid-gutter-width / 2;
207+
padding-right: $form-grid-gutter-width * .5;
208+
padding-left: $form-grid-gutter-width * .5;
209209
}
210210
}
211211

0 commit comments

Comments
 (0)