diff --git a/packages/core/build/tokens.ts b/packages/core/build/tokens.ts index 6ead948465..350e96f722 100644 --- a/packages/core/build/tokens.ts +++ b/packages/core/build/tokens.ts @@ -471,6 +471,7 @@ const aliases = { 300: token('hsla(0, 0%, 0%, 0.6)'), }, interaction: { + borderColor: token(color.construction[500]), background: { value: token(color.white), hover: token(color.blue[50]), diff --git a/packages/core/src/checkbox/checkbox.element.scss b/packages/core/src/checkbox/checkbox.element.scss index 1451ec20d2..6715a7b214 100644 --- a/packages/core/src/checkbox/checkbox.element.scss +++ b/packages/core/src/checkbox/checkbox.element.scss @@ -9,7 +9,7 @@ --check-color: #{$cds-global-typography-color-100}; --background: #{$cds-alias-object-opacity-0}; --border-radius: #{$cds-alias-object-border-radius-100}; - --border: #{$cds-alias-object-border-width-100} solid #{$cds-alias-object-border-color}; + --border: #{$cds-alias-object-border-width-100} solid #{$cds-alias-object-interaction-border-color}; } .input { diff --git a/packages/core/src/input/input.element.scss b/packages/core/src/input/input.element.scss index f58796928d..d0769e9f60 100644 --- a/packages/core/src/input/input.element.scss +++ b/packages/core/src/input/input.element.scss @@ -8,7 +8,7 @@ --background-size: 0% 100%; --background-color: #{$cds-alias-object-opacity-0}; --background: linear-gradient(180deg, var(--background-color) 95%, var(--border-color) 0) no-repeat; - --border-color: #{$cds-alias-object-border-color}; + --border-color: #{$cds-alias-object-interaction-border-color}; --border: 0; --border-bottom: #{$cds-alias-object-border-width-100} solid var(--border-color); --border-radius: 0; diff --git a/packages/core/src/radio/radio.element.scss b/packages/core/src/radio/radio.element.scss index 3e6ca11140..7069bb61ea 100644 --- a/packages/core/src/radio/radio.element.scss +++ b/packages/core/src/radio/radio.element.scss @@ -7,7 +7,7 @@ :host { --width: #{$cds-global-space-7}; --height: #{$cds-global-space-7}; - --border: #{$cds-alias-object-border-width-100} solid #{$cds-alias-object-border-color}; + --border: #{$cds-alias-object-border-width-100} solid #{$cds-alias-object-interaction-border-color}; --fill-box-shadow: none; } diff --git a/packages/core/src/textarea/textarea.element.scss b/packages/core/src/textarea/textarea.element.scss index 86dedeeaf8..9632133318 100644 --- a/packages/core/src/textarea/textarea.element.scss +++ b/packages/core/src/textarea/textarea.element.scss @@ -6,7 +6,7 @@ :host { --background: #{$cds-alias-object-container-background}; - --border: #{$cds-alias-object-border-width-100} solid #{$cds-alias-object-border-color}; + --border: #{$cds-alias-object-border-width-100} solid #{$cds-alias-object-interaction-border-color}; --padding: #{$cds-global-space-5} #{$cds-global-space-6}; --font-size: #{$cds-global-typography-font-size-3}; --color: #{$cds-global-typography-color-500};