diff --git a/packages/base-styles/_variables.scss b/packages/base-styles/_variables.scss index d1d6cb848876ee..cc922ba5a035a2 100644 --- a/packages/base-styles/_variables.scss +++ b/packages/base-styles/_variables.scss @@ -84,7 +84,7 @@ $widget-area-width: 700px; $block-toolbar-height: $grid-unit-60; $border-width: 1px; $border-width-focus: 2px; // This exists as a fallback, and is ideally overridden by var(--wp-admin-border-width-focus) unless in some SASS math cases. -$border-width-tab: 4px; +$border-width-tab: 1.5px; $helptext-font-size: 12px; $radius-round: 50%; $radius-block-ui: 2px; diff --git a/packages/components/src/tab-panel/style.scss b/packages/components/src/tab-panel/style.scss index 40950b09ffdd6d..6d902445f88ef4 100644 --- a/packages/components/src/tab-panel/style.scss +++ b/packages/components/src/tab-panel/style.scss @@ -59,6 +59,6 @@ } &.is-active:focus { - box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color), inset 0 0 -$border-width-tab 0 0 var(--wp-admin-theme-color); + box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color), inset 0 - #{$border-width-tab * 2} 0 0 var(--wp-admin-theme-color); } } diff --git a/packages/edit-post/src/components/sidebar/settings-header/style.scss b/packages/edit-post/src/components/sidebar/settings-header/style.scss index ca340185e83574..469920ece7b787 100644 --- a/packages/edit-post/src/components/sidebar/settings-header/style.scss +++ b/packages/edit-post/src/components/sidebar/settings-header/style.scss @@ -48,6 +48,6 @@ } &.is-active:focus { - box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color), inset 0 0 -$border-width-tab 0 0 var(--wp-admin-theme-color); + box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color), inset 0 - #{$border-width-tab * 2} 0 0 var(--wp-admin-theme-color); } }