Skip to content

Commit

Permalink
fix: adapt project SCSS definitions in regards to sass '/' deprecatio…
Browse files Browse the repository at this point in the history
…n warnings (#751)

- introduced by the the latest @angular-devkit/build-angular update that updates 'sass' from 1.32.12 to 1.35.1

DEPRECATION WARNING: Using / for division is deprecated and will be removed in Dart Sass 2.0.0.
Recommendation: math.div($spacer, 2)
More info and automated migrator: https://sass-lang.com/d/slash-div
  • Loading branch information
shauke authored Jun 29, 2021
1 parent c08eebe commit 9ba3618
Show file tree
Hide file tree
Showing 37 changed files with 154 additions and 114 deletions.
2 changes: 1 addition & 1 deletion src/styles/components/cookies.scss
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@
.cookie-option {
label {
span {
padding-left: $space-default / 2;
padding-left: $space-default * 0.5;
font-family: $font-family-bold;
}
}
Expand Down
6 changes: 3 additions & 3 deletions src/styles/components/footer/footer.scss
Original file line number Diff line number Diff line change
Expand Up @@ -66,14 +66,14 @@ footer {
border-bottom: $border-width-default solid $border-color-default;

ul {
padding: $space-default ($space-default + ($space-default/2)) ($space-default * 2);
padding: $space-default ($space-default * 1.5) ($space-default * 2);
margin: 0;
list-style: none;
}
}

.link-group-title {
padding: $space-default ($space-default + ($space-default/2));
padding: $space-default ($space-default * 1.5);
margin: 0 (-$space-default);
cursor: pointer;
border-bottom: $border-width-default solid $border-color-default;
Expand Down Expand Up @@ -139,7 +139,7 @@ footer {
@media (max-width: $screen-sm-max) {
float: none;
width: 100%;
padding: ($space-default + ($space-default / 2));
padding: ($space-default * 1.5);
}

.newsletter-form {
Expand Down
6 changes: 3 additions & 3 deletions src/styles/components/header/header.scss
Original file line number Diff line number Diff line change
Expand Up @@ -122,7 +122,7 @@ header {

li {
float: left;
padding-right: ($space-default * 3 / 2);
padding-right: ($space-default * 1.5);
font-family: $font-family-bold;
font-size: 12px;
color: $text-color-quarternary;
Expand All @@ -149,8 +149,8 @@ header {
}

.separator {
padding-right: ($space-default / 2);
padding-left: ($space-default / 2);
padding-right: ($space-default * 0.5);
padding-left: ($space-default * 0.5);
}

.ng-fa-icon.header-icon {
Expand Down
6 changes: 4 additions & 2 deletions src/styles/components/header/language-switch.scss
Original file line number Diff line number Diff line change
@@ -1,3 +1,5 @@
@use 'sass:math';

.language-switch {
margin-left: ($space-default * 2);
font-family: $font-family-bold;
Expand All @@ -19,7 +21,7 @@
.language-switch-link {
display: block;
padding-right: $space-default;
padding-left: $space-default / 2;
padding-left: $space-default * 0.5;
color: $text-color-quinary !important;

//language selector when dropdown is shown
Expand All @@ -44,7 +46,7 @@

.language-switch-container {
z-index: 9999;
padding: ($space-default * 2/3) $space-default;
padding: math.div($space-default * 2, 3) $space-default;
background: $color-inverse;
box-shadow: 0 4px 3px 0 rgba(0, 0, 0, 0.2);

Expand Down
6 changes: 3 additions & 3 deletions src/styles/components/header/main-navigation.scss
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,7 @@
> a {
float: left;
width: calc(100% - #{$toggler-width});
padding: $space-default ($grid-gutter-width / 2) !important;
padding: $space-default ($grid-gutter-width * 0.5) !important;
font-size: $font-size-menu-item-mobile;
line-height: 1.3125rem;
}
Expand Down Expand Up @@ -224,10 +224,10 @@
z-index: 9999;
display: block;
width: 720px;
padding: 25px 25px ($grid-gutter-width / 2) 25px;
padding: 25px 25px ($grid-gutter-width * 0.5) 25px;
margin: 0;
visibility: hidden;
border-top: ($space-default / 2) solid $border-color-default;
border-top: ($space-default * 0.5) solid $border-color-default;

@media (max-width: $screen-xs-max) {
visibility: visible;
Expand Down
6 changes: 4 additions & 2 deletions src/styles/components/header/search-container.scss
Original file line number Diff line number Diff line change
@@ -1,5 +1,7 @@
/*********** SEARCH CONTAINER **********/

@use 'sass:math';

.search-container {
position: relative;

Expand Down Expand Up @@ -134,7 +136,7 @@
&.form-control {
float: right;
height: $search-container-height;
padding-left: ($search-container-height / 2);
padding-left: ($search-container-height * 0.5);
font-size: 14px;
color: $white;
background: $color-primary;
Expand Down Expand Up @@ -180,7 +182,7 @@

.btn-search {
@include media-breakpoint-down(md) {
right: $space-default * 2/3;
right: math.div($space-default * 2, 3);
margin-right: 0;
}
}
Expand Down
4 changes: 3 additions & 1 deletion src/styles/components/header/user-information-mobile.scss
Original file line number Diff line number Diff line change
@@ -1,3 +1,5 @@
@use 'sass:math';

.user-info-box {
padding-bottom: 10px;
//overflow: hidden;
Expand Down Expand Up @@ -26,7 +28,7 @@
padding-bottom: 0;

ul {
padding: $space-default * 2/3;
padding: math.div($space-default * 2, 3);
margin-bottom: 0;

li a {
Expand Down
2 changes: 1 addition & 1 deletion src/styles/global/breadcrumbs.scss
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@
text-transform: uppercase;

span {
margin: 0 ($space-default / 2);
margin: 0 ($space-default * 0.5);
}

a {
Expand Down
8 changes: 5 additions & 3 deletions src/styles/global/buttons.scss
Original file line number Diff line number Diff line change
@@ -1,6 +1,8 @@
//
// BUTTONS

@use 'sass:math';

.btn {
font-family: $font-family-bold;
text-transform: uppercase;
Expand Down Expand Up @@ -54,18 +56,18 @@
// multiple buttons margin handling (use "button-group" in case the buttons are not direct siblings)
.button-group .btn,
.btn:not(:only-child) {
margin-bottom: $space-default/3;
margin-bottom: math.div($space-default, 3);

&:not(.float-right) {
margin-right: $space-default/3;
margin-right: math.div($space-default, 3);

@media (max-width: $screen-xs-max) {
margin-right: 0;
}
}

&.float-right {
margin-left: $space-default/3;
margin-left: math.div($space-default, 3);

@media (max-width: $screen-xs-max) {
margin-left: 0;
Expand Down
2 changes: 1 addition & 1 deletion src/styles/global/forms/fields.scss
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ fieldset {
}

input[type='radio'] ~ input[type='text'] {
margin-left: $space-default / 2;
margin-left: $space-default * 0.5;

@media (max-width: $screen-xs-max) {
display: inline-block;
Expand Down
8 changes: 5 additions & 3 deletions src/styles/global/forms/forms.scss
Original file line number Diff line number Diff line change
@@ -1,3 +1,5 @@
@use 'sass:math';

.form-check {
height: auto;
padding-bottom: 0;
Expand All @@ -6,7 +8,7 @@

.has-feedback {
.form-control[type='number'] {
padding: $grid-gutter-width / 5 $grid-gutter-width / 2.5;
padding: $grid-gutter-width * 0.2 math.div($grid-gutter-width, 2.5);
}

.form-control[type='number'] + * .form-control-feedback {
Expand Down Expand Up @@ -121,7 +123,7 @@ input.form-check-input {
.icon-checked {
position: absolute;
right: 15px;
padding-top: $space-default/6;
padding-top: math.div($space-default, 6);
}
}
}
Expand All @@ -146,7 +148,7 @@ input.form-check-input {
&::after {
position: absolute;
top: calc(#{$input-height} / 2);
right: $space-default/2;
right: $space-default * 0.5;
}
}
}
Expand Down
2 changes: 1 addition & 1 deletion src/styles/global/forms/labels.scss
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
.form-inline {
label {
padding-right: ($space-default / 4);
padding-right: ($space-default * 0.25);
}
}

Expand Down
16 changes: 9 additions & 7 deletions src/styles/global/global.scss
Original file line number Diff line number Diff line change
@@ -1,13 +1,15 @@
//
// LAYOUT
// contains layout and presentation classes for the global page structure (header, footer, global navigation, ...)
@use 'sass:math';

.main-container {
background: $color-inverse;
}

.container {
padding-right: ($grid-gutter-width / 2);
padding-left: ($grid-gutter-width / 2);
padding-right: ($grid-gutter-width * 0.5);
padding-left: ($grid-gutter-width * 0.5);
margin-right: auto;
margin-left: auto;
}
Expand Down Expand Up @@ -41,7 +43,7 @@ h4,
.h4 h5,
.h5 h6,
.h6 {
margin-top: ($space-default * 2/3);
margin-top: math.div($space-default * 2, 3);
margin-bottom: $space-default;
font-family: $font-family-regular;
}
Expand Down Expand Up @@ -115,7 +117,7 @@ img {
//
// Global Panels
.grey-panel {
padding: ($space-default + ($space-default / 2)) 0;
padding: ($space-default * 1.5) 0;
background: $color-tertiary;
}

Expand Down Expand Up @@ -145,7 +147,7 @@ img {

// Help Text
.form-text {
margin: $space-default / 3 0 $space-default / 2;
margin: math.div($space-default, 3) 0 $space-default * 0.5;
color: $text-color-quarternary;
}

Expand All @@ -172,7 +174,7 @@ img.marketing {
// Detail links and tooltips
[data-toggle='popover'] {
.ng-fa-icon {
padding-left: $space-default/4;
padding-left: $space-default * 0.25;
font-size: 120%;
}
}
Expand All @@ -184,7 +186,7 @@ img.marketing {
.details-link,
.details-tooltip {
display: inline-block;
padding-left: $space-default/2;
padding-left: $space-default * 0.5;
font-family: $font-family-regular;
font-size: 90%;
text-transform: none;
Expand Down
6 changes: 4 additions & 2 deletions src/styles/global/icons.scss
Original file line number Diff line number Diff line change
@@ -1,3 +1,5 @@
@use 'sass:math';

.ng-fa-icon {
line-height: 1;
}
Expand All @@ -8,7 +10,7 @@
}

& ~ .btn-tool {
margin-left: $space-default * 2 / 3;
margin-left: math.div($space-default * 2, 3);
}
}

Expand All @@ -24,7 +26,7 @@

& ~ .btn-tool {
margin-top: 7.5px;
margin-left: $space-default * 2 / 3;
margin-left: math.div($space-default * 2, 3);
}
}
}
Expand Down
2 changes: 1 addition & 1 deletion src/styles/global/line-item.scss
Original file line number Diff line number Diff line change
Expand Up @@ -8,5 +8,5 @@

.line-item-edit-link {
display: inline-block;
margin-bottom: $space-default / 2;
margin-bottom: $space-default * 0.5;
}
4 changes: 2 additions & 2 deletions src/styles/global/lists.scss
Original file line number Diff line number Diff line change
@@ -1,14 +1,14 @@
//
// DL - List
.dl-horizontal {
margin-bottom: ($space-default / 2);
margin-bottom: ($space-default * 0.5);

dt {
font-weight: normal;
}

dt + dd {
margin-bottom: ($space-default / 4);
margin-bottom: ($space-default * 0.25);
}

// displays a separator (e.g. colon) after the definition type field
Expand Down
2 changes: 1 addition & 1 deletion src/styles/global/notifications.scss
Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,7 @@

.btn {
width: 100%;
margin-top: $space-default/2;
margin-top: $space-default * 0.5;
}

.list-item-row {
Expand Down
Loading

0 comments on commit 9ba3618

Please sign in to comment.