diff --git a/.github/workflows/node-sass.yml b/.github/workflows/node-sass.yml index fb4d4944c0..d83e3e70f7 100644 --- a/.github/workflows/node-sass.yml +++ b/.github/workflows/node-sass.yml @@ -34,3 +34,15 @@ jobs: npx --package node-sass@latest node-sass --version npx --package node-sass@latest node-sass --output-style expanded --source-map true --source-map-contents true --precision 6 scss/ -o dist-sass/css/ ls -Al dist-sass/css + + # Check that there are no Sass variables (`$`) + - name: Check built CSS files + shell: bash + run: | + if [[ $(find dist-sass/css/ -name "*.css" | xargs grep -F "\$" | wc -l | bc) -eq 0 ]]; then + echo "All good, no Sass variables found" + exit 0 + else + echo "Found Sass variables!" + exit 1 + fi diff --git a/scss/_button-group.scss b/scss/_button-group.scss index eb7969a2d1..55ae3f65d2 100644 --- a/scss/_button-group.scss +++ b/scss/_button-group.scss @@ -39,7 +39,7 @@ // Prevent double borders when buttons are next to each other > :not(.btn-check:first-child) + .btn, > .btn-group:not(:first-child) { - margin-left: calc($btn-border-width * -1); // stylelint-disable-line function-disallowed-list + margin-left: calc(#{$btn-border-width} * -1); // stylelint-disable-line function-disallowed-list } // Reset rounded corners @@ -126,7 +126,7 @@ > .btn:not(:first-child), > .btn-group:not(:first-child) { - margin-top: calc($btn-border-width * -1); // stylelint-disable-line function-disallowed-list + margin-top: calc(#{$btn-border-width} * -1); // stylelint-disable-line function-disallowed-list } // Reset rounded corners diff --git a/scss/_pagination.scss b/scss/_pagination.scss index ba83d35784..f275a62eb4 100644 --- a/scss/_pagination.scss +++ b/scss/_pagination.scss @@ -75,7 +75,7 @@ margin-left: $pagination-margin-start; } - @if $pagination-margin-start == calc($pagination-border-width * -1) { + @if $pagination-margin-start == calc(#{$pagination-border-width} * -1) { &:first-child { .page-link { @include border-start-radius(var(--#{$prefix}pagination-border-radius)); diff --git a/scss/_tables.scss b/scss/_tables.scss index 6c981f6c2f..23de7c31b4 100644 --- a/scss/_tables.scss +++ b/scss/_tables.scss @@ -42,7 +42,7 @@ } .table-group-divider { - border-top: calc($table-border-width * 2) solid $table-group-separator-color; // stylelint-disable-line function-disallowed-list + border-top: calc(#{$table-border-width} * 2) solid $table-group-separator-color; // stylelint-disable-line function-disallowed-list } // diff --git a/scss/_variables.scss b/scss/_variables.scss index abd7a73057..eed9a13535 100644 --- a/scss/_variables.scss +++ b/scss/_variables.scss @@ -914,7 +914,7 @@ $input-focus-box-shadow: $input-btn-focus-box-shadow !default; $input-placeholder-color: var(--#{$prefix}secondary-color) !default; $input-plaintext-color: var(--#{$prefix}body-color) !default; -$input-height-border: calc($input-border-width * 2) !default; // stylelint-disable-line function-disallowed-list +$input-height-border: calc(#{$input-border-width} * 2) !default; // stylelint-disable-line function-disallowed-list $input-height-inner: add($input-line-height * 1em, $input-padding-y * 2) !default; $input-height-inner-half: add($input-line-height * .5em, $input-padding-y) !default; @@ -1238,7 +1238,7 @@ $dropdown-bg: var(--#{$prefix}body-bg) !default; $dropdown-border-color: var(--#{$prefix}border-color-translucent) !default; $dropdown-border-radius: var(--#{$prefix}border-radius) !default; $dropdown-border-width: var(--#{$prefix}border-width) !default; -$dropdown-inner-border-radius: calc($dropdown-border-radius - $dropdown-border-width) !default; // stylelint-disable-line function-disallowed-list +$dropdown-inner-border-radius: calc(#{$dropdown-border-radius} - #{$dropdown-border-width}) !default; // stylelint-disable-line function-disallowed-list $dropdown-divider-bg: $dropdown-border-color !default; $dropdown-divider-margin-y: $spacer * .5 !default; $dropdown-box-shadow: $box-shadow !default; @@ -1295,7 +1295,7 @@ $pagination-color: var(--#{$prefix}link-color) !default; $pagination-bg: var(--#{$prefix}body-bg) !default; $pagination-border-radius: var(--#{$prefix}border-radius) !default; $pagination-border-width: var(--#{$prefix}border-width) !default; -$pagination-margin-start: calc($pagination-border-width * -1) !default; // stylelint-disable-line function-disallowed-list +$pagination-margin-start: calc(#{$pagination-border-width} * -1) !default; // stylelint-disable-line function-disallowed-list $pagination-border-color: var(--#{$prefix}border-color) !default; $pagination-focus-color: var(--#{$prefix}link-hover-color) !default; @@ -1429,7 +1429,7 @@ $popover-max-width: 276px !default; $popover-border-width: var(--#{$prefix}border-width) !default; $popover-border-color: var(--#{$prefix}border-color-translucent) !default; $popover-border-radius: var(--#{$prefix}border-radius-lg) !default; -$popover-inner-border-radius: calc($popover-border-radius - $popover-border-width) !default; // stylelint-disable-line function-disallowed-list +$popover-inner-border-radius: calc(#{$popover-border-radius} - #{$popover-border-width}) !default; // stylelint-disable-line function-disallowed-list $popover-box-shadow: $box-shadow !default; $popover-header-font-size: $font-size-base !default; diff --git a/scss/forms/_input-group.scss b/scss/forms/_input-group.scss index d6370ed7f0..58e4d409c0 100644 --- a/scss/forms/_input-group.scss +++ b/scss/forms/_input-group.scss @@ -121,7 +121,7 @@ } > :not(:first-child):not(.dropdown-menu)#{$validation-messages} { - margin-left: calc($input-border-width * -1); // stylelint-disable-line function-disallowed-list + margin-left: calc(#{$input-border-width} * -1); // stylelint-disable-line function-disallowed-list @include border-start-radius(0); }