Skip to content

Commit

Permalink
Merge pull request #291 from Oksydan/bootstrap-5-migration
Browse files Browse the repository at this point in the history
Bootstrap 5 migration
  • Loading branch information
Oksydan authored Oct 3, 2023
2 parents 53d65e4 + 31c2757 commit b236d9d
Show file tree
Hide file tree
Showing 21 changed files with 12,378 additions and 4,227 deletions.
6 changes: 4 additions & 2 deletions _dev/css/abstracts/_index.scss
Original file line number Diff line number Diff line change
@@ -1,8 +1,10 @@
@import "~bootstrap/scss/functions";
@import "~bootstrap/scss/mixins";

@import "functions/index";
@import "mixins/index";
@import "variables/index";
@import "mixins/index";

@import "~bootstrap/scss/variables";
@import "~bootstrap/scss/variables-dark";
@import "~bootstrap/scss/maps";
@import "~bootstrap/scss/mixins";
1 change: 1 addition & 0 deletions _dev/css/abstracts/variables/bootstrap/_forms.scss
Original file line number Diff line number Diff line change
Expand Up @@ -6,3 +6,4 @@ $input-btn-padding-x-sm: rem-calc(8px);

$input-btn-padding-y-lg: rem-calc(14px);
$input-btn-padding-x-lg: rem-calc(20px);

2 changes: 2 additions & 0 deletions _dev/css/abstracts/variables/bootstrap/_index.scss
Original file line number Diff line number Diff line change
Expand Up @@ -12,3 +12,5 @@
@import "forms";
@import "badge";
@import "progress";
@import "tables";
@import "modal";
2 changes: 2 additions & 0 deletions _dev/css/abstracts/variables/bootstrap/_modal.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@

$modal-inner-padding: $spacer;
3 changes: 3 additions & 0 deletions _dev/css/abstracts/variables/bootstrap/_tables.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@

$table-cell-padding-y: .5rem;
$table-cell-padding-x: .5rem;
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,8 @@
background: $gray-100;
border-radius: 50%;

@include hover-focus() {
&:hover,
&:focus {
color: $gray-900;
background: $gray-200;
}
Expand Down
3 changes: 2 additions & 1 deletion _dev/css/theme/components/customer/_address.scss
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,8 @@
border-right: 1px solid $card-border-color;
}

@include hover-focus() {
&:hover,
&:focus {
text-decoration: none;
background: $gray-200;
}
Expand Down
3 changes: 2 additions & 1 deletion _dev/css/theme/components/customer/_customer-links.scss
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,8 @@
white-space: normal;
}

@include hover-focus() {
&:hover,
&:focus {
color: $primary;
text-decoration: none;
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@
&__cell {
padding: map.get($spacers, 2);
@include media-breakpoint-up(sm) {
padding: $table-cell-padding;
padding: $table-cell-padding-x $table-cell-padding-y;
vertical-align: middle;
}
}
Expand Down
3 changes: 2 additions & 1 deletion _dev/css/theme/components/links-list/_links-list.scss
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,8 @@

&__link {
color: $gray-600;
@include hover-focus() {
&:hover,
&:focus {
color: $gray-900;
}
}
Expand Down
9 changes: 5 additions & 4 deletions _dev/css/theme/components/menu/_mainmenu.scss
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,8 @@
font-weight: 700;
color: $gray-900;

@include hover-focus() {
&:hover,
&:focus {
text-decoration: none;
}

Expand All @@ -69,21 +70,21 @@
}

&--2 {
padding-left: #{$modal-inner-padding + rem-calc(map.get($spacers, 2))};
padding-left: #{rem-calc($modal-inner-padding) + rem-calc(map.get($spacers, 2))};
@include media-breakpoint-up(md) {
padding: 0;
}
}

&--3 {
padding-left: #{$modal-inner-padding + rem-calc(map.get($spacers, 3))};
padding-left: #{rem-calc($modal-inner-padding) + rem-calc(map.get($spacers, 3))};
@include media-breakpoint-up(md) {
padding-left: map.get($spacers, 2);
}
}

&--4 {
padding-left: #{$modal-inner-padding + rem-calc(map.get($spacers, 4))};
padding-left: #{rem-calc($modal-inner-padding) + rem-calc(map.get($spacers, 4))};
@include media-breakpoint-up(md) {
padding-left: map.get($spacers, 2);
}
Expand Down
3 changes: 2 additions & 1 deletion _dev/css/theme/layout/_header.scss
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,8 @@
padding: map.get($spacers, 2);
}

@include hover-focus() {
&:hover,
&:focus {
color: $black;
text-decoration: none;
background: $gray-100;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,8 @@
background-color: $white;
border: 0;

@include hover-focus() {
&:hover,
&:focus {
background: $gray-200;
}
}
Expand Down

This file was deleted.

3 changes: 2 additions & 1 deletion _dev/css/theme/override/bootstrap/_collapse.scss
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,8 @@
}
}

@include hover-focus() {
&:hover,
&:focus {
text-decoration: none;
}
}
181 changes: 90 additions & 91 deletions _dev/css/theme/override/bootstrap/_custom-control.scss
Original file line number Diff line number Diff line change
@@ -1,93 +1,92 @@
@use "sass:math";

.custom-checkbox-color {
@extend .custom-checkbox;

.custom-control-label {
&::before {
/* stylelint-disable */
display: none !important;
/* stylelint-enable */
}
}

.custom-control-input:checked ~ .custom-control-label-dark {
&::after {
background-image: escape-svg($custom-checkbox-indicator-icon-checked-dark);
}
}
}

.custom-control-input-color {
position: absolute;
top: math.div(($font-size-base * $line-height-base - $custom-control-indicator-size), 2);
left: -($custom-control-gutter + $custom-control-indicator-size);
display: block;
width: $custom-control-indicator-size;
height: $custom-control-indicator-size;
pointer-events: none;
content: "";
background-color: $custom-control-indicator-bg;
border: $custom-control-indicator-border-color solid $custom-control-indicator-border-width;
@include box-shadow($custom-control-indicator-box-shadow);
@include border-radius($custom-checkbox-indicator-border-radius);
}

.custom-checkbox-block {
padding-left: $custom-control-indicator-size;
.custom-control-label::after,
.custom-control-label::before {
left: -#{$custom-control-indicator-size};
}
}

.custom-radio-color {
@extend .custom-radio;
position: relative;
width: $custom-color-control-indicator-size;
height: $custom-color-control-indicator-size;
padding-left: $custom-color-control-indicator-size;

.custom-control-input-color {
@extend .custom-control-input-color;
top: 0;
left: -#{$custom-color-control-indicator-size};
width: $custom-color-control-indicator-size;
height: $custom-color-control-indicator-size;
border-radius: $custom-radio-indicator-border-radius;
}

.custom-control-label {
&::before {
display: none;
}
}


.custom-control-input {
width: 100%;
height: 100%;

&:checked ~ .custom-control-label {
&::after {
top: #{math.div(($custom-color-control-indicator-size - $custom-color-control-indicator-icon-size), 2)};
right: #{math.div(($custom-color-control-indicator-size - $custom-color-control-indicator-icon-size), 2)};
left: auto;
width: $custom-color-control-indicator-icon-size;
height: $custom-color-control-indicator-icon-size;
background-image: escape-svg($custom-checkbox-indicator-icon-checked);
}

.custom-control-input-color {
border-color: $custom-color-control-indicator-size-checked-border-color;
}
}
}

.custom-control-input:checked ~ .custom-control-label-dark {
&::after {
background-image: escape-svg($custom-checkbox-indicator-icon-checked-dark);
}
}
}

/* stylelint-disable */
// KEEPING FOR MIGRATION REFERENCE
//.custom-checkbox-color {
// @extend .custom-checkbox;
//
// .custom-control-label {
// &::before {
// display: none !important;
// }
// }
//
// .custom-control-input:checked ~ .custom-control-label-dark {
// &::after {
// background-image: escape-svg($custom-checkbox-indicator-icon-checked-dark);
// }
// }
//}
//
//.custom-control-input-color {
// position: absolute;
// top: math.div(($font-size-base * $line-height-base - $custom-control-indicator-size), 2);
// left: -($custom-control-gutter + $custom-control-indicator-size);
// display: block;
// width: $custom-control-indicator-size;
// height: $custom-control-indicator-size;
// pointer-events: none;
// content: "";
// background-color: $custom-control-indicator-bg;
// border: $custom-control-indicator-border-color solid $custom-control-indicator-border-width;
// @include border-radius($custom-checkbox-indicator-border-radius);
//}
//
//.custom-checkbox-block {
// padding-left: $custom-control-indicator-size;
// .custom-control-label::after,
// .custom-control-label::before {
// left: -#{$custom-control-indicator-size};
// }
//}
//
//.custom-radio-color {
// @extend .custom-radio;
// position: relative;
// width: $custom-color-control-indicator-size;
// height: $custom-color-control-indicator-size;
// padding-left: $custom-color-control-indicator-size;
//
// .custom-control-input-color {
// @extend .custom-control-input-color;
// top: 0;
// left: -#{$custom-color-control-indicator-size};
// width: $custom-color-control-indicator-size;
// height: $custom-color-control-indicator-size;
// border-radius: $custom-radio-indicator-border-radius;
// }
//
// .custom-control-label {
// &::before {
// display: none;
// }
// }
//
//
// .custom-control-input {
// width: 100%;
// height: 100%;
//
// &:checked ~ .custom-control-label {
// &::after {
// top: #{math.div(($custom-color-control-indicator-size - $custom-color-control-indicator-icon-size), 2)};
// right: #{math.div(($custom-color-control-indicator-size - $custom-color-control-indicator-icon-size), 2)};
// left: auto;
// width: $custom-color-control-indicator-icon-size;
// height: $custom-color-control-indicator-icon-size;
// background-image: escape-svg($custom-checkbox-indicator-icon-checked);
// }
//
// .custom-control-input-color {
// border-color: $custom-color-control-indicator-size-checked-border-color;
// }
// }
// }
//
// .custom-control-input:checked ~ .custom-control-label-dark {
// &::after {
// background-image: escape-svg($custom-checkbox-indicator-icon-checked-dark);
// }
// }
//}
/* stylelint-enable */
1 change: 0 additions & 1 deletion _dev/css/theme/override/bootstrap/_index.scss
Original file line number Diff line number Diff line change
Expand Up @@ -6,4 +6,3 @@
@import "form";
@import "list-group";
@import "custom-control";
@import "bootstrap-backwards-compatibility";
Loading

0 comments on commit b236d9d

Please sign in to comment.