diff --git a/packages/clay-css/src/scss/cadmin/variables/_globals.scss b/packages/clay-css/src/scss/cadmin/variables/_globals.scss index 645cf81a4d..2f2c69cb97 100644 --- a/packages/clay-css/src/scss/cadmin/variables/_globals.scss +++ b/packages/clay-css/src/scss/cadmin/variables/_globals.scss @@ -329,8 +329,9 @@ $cadmin-component-transition: color 0.15s ease-in-out, $cadmin-component-focus-box-shadow: #{0 0 0 2px $cadmin-white, 0 0 0 4px $cadmin-primary-l0} !default; -$cadmin-component-focus-inset-box-shadow: #{inset 0 0 0 2px $cadmin-primary-l0, - inset 0 0 0 4px $cadmin-white} !default; +$cadmin-component-focus-inset-box-shadow: #{inset 0 0 0 0.125rem + $cadmin-primary-l0, + inset 0 0 0 0.25rem $cadmin-white} !default; $cadmin-component-active-bg: $cadmin-primary !default; $cadmin-component-active-color: $cadmin-white !default; diff --git a/packages/clay-css/src/scss/cadmin/variables/_range.scss b/packages/clay-css/src/scss/cadmin/variables/_range.scss index d0c0e4d35d..5f339e0a36 100644 --- a/packages/clay-css/src/scss/cadmin/variables/_range.scss +++ b/packages/clay-css/src/scss/cadmin/variables/_range.scss @@ -80,6 +80,11 @@ $cadmin-clay-range-input: map-deep-merge( position: absolute, top: 50%, width: 50%, + focus: ( + clay-range-thumb: ( + box-shadow: $cadmin-component-focus-inset-box-shadow, + ), + ), ), tooltip: ( margin-left: 13px,