fix(css): remove Stylelint multiline comments from built CSS files

.github/workflows/css.yml

@@ -44,3 +44,15 @@ jobs:
 
  - name: Run CSS tests
  run: npm run css-test
+
+ # Check that there are no stylelint multiline comments (e.g. /* stylelint-disable */)
+ - name: Check built CSS files
+ shell: bash
+ run: |
+ if [[ $(find dist/css/ -name "*.css" | xargs grep -F "/* stylelint" | wc -l | bc) -eq 0 ]]; then
+ echo "All good, no stylelint multiline comments found"
+ exit 0
+ else
+ echo "Found stylelint multiline comments!"
+ exit 1
+ fi

scss/_button-group.scss

@@ -79,7 +79,8 @@
 //
 
 .dropdown-toggle-split {
- min-width: add($dropdown-padding-x * 2, calc(#{$caret-width} * 2)); /* stylelint-disable-line function-disallowed-list */ // Boosted mod
+ // stylelint-disable-next-line function-disallowed-list
+ min-width: add($dropdown-padding-x * 2, calc(#{$caret-width} * 2)); // Boosted mod
  padding-right: subtract($dropdown-padding-x, $btn-border-width); // Boosted mod
  padding-left: subtract($dropdown-padding-x, $btn-border-width); // Boosted mod
  border-color: currentcolor; // Boosted mod

scss/_nav.scss

@@ -149,7 +149,7 @@
 
  // Boosted mod
  .nav-item + .nav-item {
- margin-left: calc(var(--#{$prefix}nav-link-padding-y) * .5); /* stylelint-disable-line function-disallowed-list */
+ margin-left: calc(var(--#{$prefix}nav-link-padding-y) * .5); // stylelint-disable-line function-disallowed-list
  }
  // End mod
 }

scss/_navbar.scss

@@ -52,7 +52,7 @@
  padding: var(--#{$prefix}navbar-padding-y) var(--#{$prefix}navbar-padding-x);
  // Boosted mod
  font-weight: var(--#{$prefix}navbar-font-weight);
- box-shadow: inset 0 calc(-1 * var(--#{$prefix}navbar-border-width)) 0 var(--#{$prefix}navbar-border-color); /* stylelint-disable-line function-disallowed-list */
+ box-shadow: inset 0 calc(-1 * var(--#{$prefix}navbar-border-width)) 0 var(--#{$prefix}navbar-border-color); // stylelint-disable-line function-disallowed-list
  @include transition($navbar-transition);
  // End mod
  @include gradient-bg();
@@ -137,7 +137,7 @@
  //// Ensure headings variant align consistently
  .title,
  .two-lined {
- margin: divide(-2em, 7) $spacer divide(-1em, 7) calc(var(--#{$prefix}navbar-brand-logo-size) / 2); /* stylelint-disable-line function-disallowed-list */
+ margin: divide(-2em, 7) $spacer divide(-1em, 7) calc(var(--#{$prefix}navbar-brand-logo-size) / 2); // stylelint-disable-line function-disallowed-list
  @include font-size(var(--#{$prefix}navbar-brand-font-size));
  line-height: 1;
  letter-spacing: var(--#{$prefix}navbar-brand-letter-spacing);
@@ -184,7 +184,7 @@
  .nav-link {
  position: relative;
  padding-top: subtract(var(--#{$prefix}navbar-nav-link-padding-y), var(--#{$prefix}navbar-border-width));
- margin-left: calc(-1 * var(--#{$prefix}navbar-nav-link-padding-x)); /* stylelint-disable-line function-disallowed-list */
+ margin-left: calc(-1 * var(--#{$prefix}navbar-nav-link-padding-x)); // stylelint-disable-line function-disallowed-list
  word-break: break-all;
 
  &:hover {
@@ -211,7 +211,7 @@
 
  .nav-link.nav-icon {
  padding: var(--#{$prefix}navbar-nav-icon-padding-y) var(--#{$prefix}navbar-nav-icon-padding-x);
- margin-left: calc(-1 * var(--#{$prefix}navbar-nav-icon-padding-x)); /* stylelint-disable-line function-disallowed-list */
+ margin-left: calc(-1 * var(--#{$prefix}navbar-nav-icon-padding-x)); // stylelint-disable-line function-disallowed-list
  white-space: nowrap;
 
  svg,
@@ -280,7 +280,7 @@
  border-top: var(--#{$prefix}navbar-border-width) solid var(--#{$prefix}navbar-border-color);
 
  @include media-breakpoint-up(md) {
- margin-bottom: calc(-1 * var(--#{$prefix}navbar-padding-y)); /* stylelint-disable-line function-disallowed-list */
+ margin-bottom: calc(-1 * var(--#{$prefix}navbar-padding-y)); // stylelint-disable-line function-disallowed-list
  }
  }
 
@@ -294,8 +294,10 @@
 
 // Button for toggling the navbar when in its collapsed state
 .navbar-toggler {
- padding: var(--#{$prefix}navbar-toggler-padding-y) calc(var(--#{$prefix}navbar-toggler-padding-x) / 2) var(--#{$prefix}navbar-toggler-padding-y) var(--#{$prefix}navbar-toggler-padding-x); /* stylelint-disable-line function-disallowed-list */ // Boosted mod
- margin-right: calc(-.5 * var(--#{$prefix}navbar-toggler-padding-x)); /* stylelint-disable-line function-disallowed-list */ // Boosted mod
+ // stylelint-disable-next-line function-disallowed-list
+ padding: var(--#{$prefix}navbar-toggler-padding-y) calc(var(--#{$prefix}navbar-toggler-padding-x) / 2) var(--#{$prefix}navbar-toggler-padding-y) var(--#{$prefix}navbar-toggler-padding-x); // Boosted mod
+ // stylelint-disable-next-line function-disallowed-list
+ margin-right: calc(-.5 * var(--#{$prefix}navbar-toggler-padding-x)); // Boosted mod
  @include font-size(var(--#{$prefix}navbar-toggler-font-size));
  line-height: 1;
  color: var(--#{$prefix}navbar-color);
@@ -397,19 +399,19 @@
  border: 0;
 
  &:first-child > .nav-link {
- margin-left: calc(-1 * var(--#{$prefix}navbar-nav-link-padding-x)); /* stylelint-disable-line function-disallowed-list */
+ margin-left: calc(-1 * var(--#{$prefix}navbar-nav-link-padding-x)); // stylelint-disable-line function-disallowed-list
  }
 
  &:last-child > .nav-link {
- margin-right: calc(-1 * var(--#{$prefix}navbar-nav-link-padding-x)); /* stylelint-disable-line function-disallowed-list */
+ margin-right: calc(-1 * var(--#{$prefix}navbar-nav-link-padding-x)); // stylelint-disable-line function-disallowed-list
  }
 
  &:first-child > .nav-icon {
- margin-left: calc(-1 * var(--#{$prefix}navbar-nav-icon-padding-x)); /* stylelint-disable-line function-disallowed-list */
+ margin-left: calc(-1 * var(--#{$prefix}navbar-nav-icon-padding-x)); // stylelint-disable-line function-disallowed-list
  }
 
  &:last-child > .nav-icon {
- margin-right: calc(-1 * var(--#{$prefix}navbar-nav-icon-padding-x)); /* stylelint-disable-line function-disallowed-list */
+ margin-right: calc(-1 * var(--#{$prefix}navbar-nav-icon-padding-x)); // stylelint-disable-line function-disallowed-list
  }
  }
  // End mod

scss/_orange-navbar.scss

@@ -4,7 +4,7 @@
 // Brand exclusive thin navbar that can be used with orange navbar
 .supra {
  // scss-docs-start supra-navbar-css-vars
- --#{$prefix}navbar-padding-y: 0px; /* stylelint-disable-line length-zero-no-unit */
+ --#{$prefix}navbar-padding-y: 0px; // stylelint-disable-line length-zero-no-unit
  --#{$prefix}navbar-nav-font-size: #{$font-size-sm};
  --#{$prefix}navbar-nav-line-height: #{$line-height-sm};
  --#{$prefix}navbar-nav-link-padding-y: #{$navbar-supra-link-padding-y};
@@ -28,7 +28,7 @@
 .header-minimized {
  // scss-docs-start minimized-navbar-css-vars
  @include media-breakpoint-up(md){
- --#{$prefix}navbar-padding-y: 0px; /* stylelint-disable-line length-zero-no-unit */
+ --#{$prefix}navbar-padding-y: 0px; // stylelint-disable-line length-zero-no-unit
  --#{$prefix}navbar-brand-margin-y: #{$navbar-minimized-brand-margin-y};
  --#{$prefix}navbar-brand-logo-size: #{$navbar-brand-logo-size-xs};
  --#{$prefix}navbar-brand-font-size: #{$navbar-brand-font-size-xs};

scss/_popover.scss

@@ -62,7 +62,7 @@
 
 .bs-popover-top {
  > .popover-arrow {
- bottom: calc((-1 * var(--#{$prefix}popover-arrow-height)) - var(--#{$prefix}popover-border-width)); /* stylelint-disable-line function-disallowed-list */
+ bottom: calc((-1 * var(--#{$prefix}popover-arrow-height)) - var(--#{$prefix}popover-border-width)); // stylelint-disable-line function-disallowed-list
 
  &::before,
  &::after {
@@ -84,7 +84,7 @@
 /* rtl:begin:ignore */
 .bs-popover-end {
  > .popover-arrow {
- left: calc((-1 * var(--#{$prefix}popover-arrow-height)) - var(--#{$prefix}popover-border-width)); /* stylelint-disable-line function-disallowed-list */
+ left: calc((-1 * var(--#{$prefix}popover-arrow-height)) - var(--#{$prefix}popover-border-width)); // stylelint-disable-line function-disallowed-list
  width: var(--#{$prefix}popover-arrow-height);
  height: var(--#{$prefix}popover-arrow-width);
 
@@ -109,7 +109,7 @@
 
 .bs-popover-bottom {
  > .popover-arrow {
- top: calc((-1 * var(--#{$prefix}popover-arrow-height)) - var(--#{$prefix}popover-border-width)); /* stylelint-disable-line function-disallowed-list */
+ top: calc((-1 * var(--#{$prefix}popover-arrow-height)) - var(--#{$prefix}popover-border-width)); // stylelint-disable-line function-disallowed-list
 
  &::before,
  &::after {
@@ -143,7 +143,7 @@
 /* rtl:begin:ignore */
 .bs-popover-start {
  > .popover-arrow {
- right: calc((-1 * var(--#{$prefix}popover-arrow-height)) - var(--#{$prefix}popover-border-width)); /* stylelint-disable-line function-disallowed-list */
+ right: calc((-1 * var(--#{$prefix}popover-arrow-height)) - var(--#{$prefix}popover-border-width)); // stylelint-disable-line function-disallowed-list
  width: var(--#{$prefix}popover-arrow-height);
  height: var(--#{$prefix}popover-arrow-width);
 

scss/_variables.scss

@@ -898,7 +898,8 @@ $table-hover-bg: rgba($black, $table-hover-bg-factor) !de
 $table-variant-hover-bg-factor: .2 !default; // Boosted mod
 
 $table-border-factor: .4 !default; // Boosted mod
-$table-border-width: calc(var(--#{$prefix}border-width) * .5) !default; /* stylelint-disable-line function-disallowed-list */ // Boosted mod
+// stylelint-disable-next-line function-disallowed-list
+$table-border-width: calc(var(--#{$prefix}border-width) * .5) !default; // Boosted mod
 $table-border-color: var(--#{$prefix}border-color-translucent) !default; // Boosted mod
 
 $table-striped-order: odd !default;
@@ -1195,7 +1196,8 @@ $form-switch-transition: background-position .15s ease-in-out, $transit
 // Boosted mod: no $form-switch-checked-color
 $form-switch-checked-bg-image: $form-check-input-checked-bg-image !default; // Boosted mod
 $form-switch-checked-bg-size: add(map-get($spacers, 2), map-get($spacers, 1)) !default; // Boosted mod
-$form-switch-checked-bg-position: calc(var(--#{$prefix}border-width) * 3) 50% !default; /* stylelint-disable-line function-disallowed-list */ // Boosted mod
+// stylelint-disable-next-line function-disallowed-list
+$form-switch-checked-bg-position: calc(var(--#{$prefix}border-width) * 3) 50% !default; // Boosted mod
 // scss-docs-end form-switch-variables
 
 // scss-docs-start input-group-variables
@@ -1388,13 +1390,15 @@ $nav-pills-link-active-bg: $component-active-bg !default;
 
 $nav-underline-gap: 0 !default; // Boosted mod: instead of 1rem
 $nav-underline-gap-lg: $spacer * .5 !default; // Boosted mod
-$nav-underline-border-width: calc(var(--#{$prefix}border-width) * .5) !default; /* stylelint-disable-line function-disallowed-list */ // Boosted mod: instead of .125rem
+// stylelint-disable-next-line function-disallowed-list
+$nav-underline-border-width: calc(var(--#{$prefix}border-width) * .5) !default; // Boosted mod: instead of .125rem
 $nav-underline-border-color: $gray-500 !default; // Boosted mod
 $nav-underline-border-radius: var(--#{$prefix}border-radius) !default; // Boosted mod
 $nav-underline-link-active-color: var(--#{$prefix}emphasis-color) !default;
 $nav-underline-link-padding-x: 1.8125rem !default; // Boosted mod
 $nav-underline-link-hover-color: $accessible-orange !default; // Boosted mod
-$nav-underline-link-border-width: 0 0 calc(var(--#{$prefix}nav-underline-border-width) * 4) !default; /* stylelint-disable-line function-disallowed-list */ // Boosted mod
+// stylelint-disable-next-line function-disallowed-list
+$nav-underline-link-border-width: 0 0 calc(var(--#{$prefix}nav-underline-border-width) * 4) !default; // Boosted mod
 $nav-underline-link-active-bg: var(--#{$prefix}body-bg) !default; // Boosted mod
 $nav-underline-link-active-border-color: $accessible-orange !default; // Boosted mod
 // scss-docs-end nav-variables
@@ -1679,7 +1683,8 @@ $accordion-padding-y: $spacer * .5 !default; // Boosted mod
 $accordion-padding-x: 0 !default; // Boosted mod
 $accordion-color: var(--#{$prefix}body-color) !default;
 $accordion-bg: var(--#{$prefix}body-bg) !default;
-$accordion-border-width: calc(var(--#{$prefix}border-width) * .5) !default; /* stylelint-disable-line function-disallowed-list */ // Boosted mod
+// stylelint-disable-next-line function-disallowed-list
+$accordion-border-width: calc(var(--#{$prefix}border-width) * .5) !default; // Boosted mod
 $accordion-border-color: $gray-500 !default; // Boosted mod
 $accordion-border-radius: var(--#{$prefix}border-radius) !default;
 $accordion-inner-border-radius: subtract($accordion-border-radius, #{$accordion-border-width}) !default;
@@ -1745,7 +1750,8 @@ $tooltip-line-height: $line-height-sm !default; // Boosted mod
 $tooltip-max-width: $spacer * 10 !default;
 $tooltip-color: var(--#{$prefix}body-color) !default; // Boosted mod: instead of `var(--#{$prefix}body-bg)`
 $tooltip-bg: var(--#{$prefix}body-bg) !default; // Boosted mod: instead of `var(--#{$prefix}emphasis-color)`
-$tooltip-border-width: calc(var(--#{$prefix}border-width) * .5) !default; /* stylelint-disable-line function-disallowed-list */ // Boosted mod
+// stylelint-disable-next-line function-disallowed-list
+$tooltip-border-width: calc(var(--#{$prefix}border-width) * .5) !default; // Boosted mod
 $tooltip-border-color: var(--#{$prefix}emphasis-color) !default; // Boosted mod
 $tooltip-border-radius: var(--#{$prefix}border-radius) !default;
 $tooltip-opacity: 1 !default;
@@ -2119,16 +2125,19 @@ $carousel-transition: transform $carousel-transition-duration $tr
 $spinner-width: $spacer * 2 !default;
 $spinner-height: $spinner-width !default;
 $spinner-vertical-align: -.125em !default;
-$spinner-border-width: calc(var(--#{$prefix}border-width) * 3) !default; /* stylelint-disable-line function-disallowed-list */ // Boosted mod
+// stylelint-disable-next-line function-disallowed-list
+$spinner-border-width: calc(var(--#{$prefix}border-width) * 3) !default; // Boosted mod
 $spinner-animation-speed: .75s !default;
 
 $spinner-width-sm: $spacer !default;
 $spinner-height-sm: $spinner-width-sm !default;
-$spinner-border-width-sm: calc(var(--#{$prefix}border-width) * 2) !default; /* stylelint-disable-line function-disallowed-list */ // Boosted mod
+// stylelint-disable-next-line function-disallowed-list
+$spinner-border-width-sm: calc(var(--#{$prefix}border-width) * 2) !default; // Boosted mod
 
 $spinner-width-lg: $spacer * 4 !default; // Boosted mod
 $spinner-height-lg: $spinner-width-lg !default; // Boosted mod
-$spinner-border-width-lg: calc(var(--#{$prefix}border-width) * 4) !default; /* stylelint-disable-line function-disallowed-list */ // Boosted mod
+// stylelint-disable-next-line function-disallowed-list
+$spinner-border-width-lg: calc(var(--#{$prefix}border-width) * 4) !default; // Boosted mod
 // scss-docs-end spinner-variables
 
 

scss/forms/_form-check.scss

@@ -91,12 +91,16 @@
 
  @if $enable-gradients {
  --#{$prefix}form-check-bg-image: #{escape-svg($form-check-input-indeterminate-bg-image)}, var(--#{$prefix}gradient);
- background-position: 50% add(50%, calc(var(--#{$prefix}border-width) * .25)), center; /* stylelint-disable-line function-disallowed-list */ // Boosted mod
- background-size: map-get($spacers, 2) calc(var(--#{$prefix}border-width) * 1.5), auto; /* stylelint-disable-line function-disallowed-list */ // Boosted mod
+ // stylelint-disable-next-line function-disallowed-list
+ background-position: 50% add(50%, calc(var(--#{$prefix}border-width) * .25)), center; // Boosted mod
+ // stylelint-disable-next-line function-disallowed-list
+ background-size: map-get($spacers, 2) calc(var(--#{$prefix}border-width) * 1.5), auto; // Boosted mod
  } @else {
  --#{$prefix}form-check-bg-image: #{escape-svg($form-check-input-indeterminate-bg-image)};
- background-position: 50% add(50%, calc(var(--#{$prefix}border-width) * .25)); /* stylelint-disable-line function-disallowed-list */ // Boosted mod
- background-size: map-get($spacers, 2) calc(var(--#{$prefix}border-width) * 1.5); /* stylelint-disable-line function-disallowed-list */ // Boosted mod
+ // stylelint-disable-next-line function-disallowed-list
+ background-position: 50% add(50%, calc(var(--#{$prefix}border-width) * .25)); // Boosted mod
+ // stylelint-disable-next-line function-disallowed-list
+ background-size: map-get($spacers, 2) calc(var(--#{$prefix}border-width) * 1.5); // Boosted mod
  }
  }
 

scss/forms/_form-range.scss

@@ -41,7 +41,8 @@
  box-sizing: content-box; // Boosted mod
  width: $form-range-thumb-width;
  height: $form-range-thumb-height;
- margin-top: calc((#{$form-range-track-height} - (#{$form-range-thumb-height} + var(--#{$prefix}border-width) * 2)) * .5); /* stylelint-disable-line function-disallowed-list */ // Webkit specific // Boosted mod
+ // stylelint-disable-next-line function-disallowed-list
+ margin-top: calc((#{$form-range-track-height} - (#{$form-range-thumb-height} + var(--#{$prefix}border-width) * 2)) * .5); // Webkit specific // Boosted mod
  cursor: grab; // Boosted mod
  @include gradient-bg($form-range-thumb-bg);
  border: $form-range-thumb-border;

scss/mixins/_caret.scss

@@ -47,7 +47,8 @@
  content: "";
  @if $direction == down {
  @include caret-down($width);
- transform: translateY(calc(var(--#{$prefix}border-width) * .5)); /* stylelint-disable-line function-disallowed-list */ // Boosted mod
+ // stylelint-disable-next-line function-disallowed-list
+ transform: translateY(calc(var(--#{$prefix}border-width) * .5)); // Boosted mod
  } @else if $direction == up {
  @include caret-up($width);
  } @else if $direction == end {