From fef39976fcfac2bf10054e56cbb93c09f6e4f703 Mon Sep 17 00:00:00 2001 From: James Koster Date: Wed, 11 May 2022 13:21:47 +0100 Subject: [PATCH 1/2] Reduce active tab accent height --- packages/base-styles/_variables.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/base-styles/_variables.scss b/packages/base-styles/_variables.scss index d1d6cb848876e..53a8431094762 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: 2px; $helptext-font-size: 12px; $radius-round: 50%; $radius-block-ui: 2px; From 48916bf489eeb38f4e960f457560e213fde5be79 Mon Sep 17 00:00:00 2001 From: James Koster Date: Thu, 12 May 2022 13:24:10 +0100 Subject: [PATCH 2/2] Try 1.5px --- packages/base-styles/_variables.scss | 2 +- packages/components/src/tab-panel/style.scss | 2 +- .../edit-post/src/components/sidebar/settings-header/style.scss | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/base-styles/_variables.scss b/packages/base-styles/_variables.scss index 53a8431094762..cc922ba5a035a 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: 2px; +$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 40950b09ffdd6..6d902445f88ef 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 ca340185e8357..469920ece7b78 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); } }