diff --git a/src/styles/_utilities.scss b/src/styles/_utilities.scss index ab717c2b1..8975c0426 100644 --- a/src/styles/_utilities.scss +++ b/src/styles/_utilities.scss @@ -7,7 +7,11 @@ @each $breakpoint in map.keys(breakpoint-settings.$values) { @include breakpoint.up($breakpoint) { - $infix: if(map.get(breakpoint-settings.$values, $breakpoint) == 0, "", "-#{$breakpoint}"); + $infix: ""; + + @if map.get(breakpoint-settings.$values, $breakpoint) != 0 { + $infix: "-#{$breakpoint}"; + } @each $key, $utility in utility-settings.$map { @if meta.type-of($utility) == "map" and (map.get($utility, responsive) == true or $infix == "") { diff --git a/src/styles/tools/_collections.scss b/src/styles/tools/_collections.scss index dc0cbf9e9..a8987526d 100644 --- a/src/styles/tools/_collections.scss +++ b/src/styles/tools/_collections.scss @@ -63,8 +63,29 @@ $properties, ) { @each $property in $properties { - $modifier: if($modifier-value, "--" + $modifier-value, ""); - $state: if($interaction-state, "--" + $interaction-state, ""); + $fallback-custom-property: ""; + $modifier: ""; + $state: ""; + + @if $modifier-value { + $modifier: "--" + $modifier-value; + } + + @if $interaction-state { + $state: "--" + $interaction-state; + } + + @if $interaction-state == "disabled" { + $fallback-custom-property: ", var(--" + + $prefix + + $component-name + + $modifier + + "--" + + $variant-value + + "--default__" + + $property + + ")"; + } // 1. --#{$prefix}local-#{$property}: @@ -80,19 +101,7 @@ + "__" + $property } - #{if( - $interaction-state and $interaction-state == "disabled", - ", var(--" - + $prefix - + $component-name - + $modifier - + "--" - + $variant-value - + "--default__" - + $property - + ")", - "" - )} + #{$fallback-custom-property} ); // 2. } } @@ -202,13 +211,16 @@ $inherit-link-color: false, $properties, ) { - $modifier-class-name: - if( - $modifier-name and $modifier-value, - ".isRoot#{rui-string.capitalize($modifier-name)}#{rui-string.capitalize($modifier-value)}", - "" - ); - $variant-class-name: ".isRoot#{rui-string.capitalize($variant-name)}#{rui-string.capitalize($variant-value)}"; + $modifier-class-name: ""; + $variant-class-name: ".isRoot" + + rui-string.capitalize($variant-name) + + rui-string.capitalize($variant-value); + + @if $modifier-name and $modifier-value { + $modifier-class-name: ".isRoot" + + rui-string.capitalize($modifier-name) + + rui-string.capitalize($modifier-value); + } #{$modifier-class-name}#{$variant-class-name} { @if $generate-interaction-states { diff --git a/src/styles/tools/_utilities.scss b/src/styles/tools/_utilities.scss index a64a76761..9233df751 100644 --- a/src/styles/tools/_utilities.scss +++ b/src/styles/tools/_utilities.scss @@ -16,9 +16,11 @@ @each $key, $value in $values { $properties: map.get($utility, property); $property-class: map.get($utility, class); + $property-class-modifier: ""; - // Don't prefix if value key is null (e.g. with shadow class) - $property-class-modifier: if($key, "-" + $key, ""); + @if $key { + $property-class-modifier: "-" + $key; + } .#{$property-class + $infix + $property-class-modifier} { @each $property in $properties { diff --git a/tests/playwright/env/parseDotEnvFile.ts b/tests/playwright/env/parseDotEnvFile.ts index 0a67f89bd..02aa3a346 100644 --- a/tests/playwright/env/parseDotEnvFile.ts +++ b/tests/playwright/env/parseDotEnvFile.ts @@ -6,7 +6,10 @@ const PLAYWRIGHT_ENV_FILE = '.env.playwright'; * Load and parse Playwright environment file into an object. */ export const parseDotEnvFile = () => { - const dotEnvConfigOutput = dotenv.config({ path: PLAYWRIGHT_ENV_FILE }); + const dotEnvConfigOutput = dotenv.config({ + path: PLAYWRIGHT_ENV_FILE, + quiet: true, + }); if (dotEnvConfigOutput.error) { // eslint-disable-next-line no-console