From 65295a97ee17de0d8beacd2b4b76929d73a8c342 Mon Sep 17 00:00:00 2001 From: Jorge Costa Date: Tue, 10 Dec 2024 12:01:05 +0000 Subject: [PATCH 1/5] [Dataviews] Fix: Media item focus style is not visible on Grid. --- .../dataviews/src/dataviews-layouts/grid/style.scss | 12 +++++++----- 1 file changed, 7 insertions(+), 5 deletions(-) diff --git a/packages/dataviews/src/dataviews-layouts/grid/style.scss b/packages/dataviews/src/dataviews-layouts/grid/style.scss index e9fcb472dc318..b83186bc9cf2b 100644 --- a/packages/dataviews/src/dataviews-layouts/grid/style.scss +++ b/packages/dataviews/src/dataviews-layouts/grid/style.scss @@ -30,12 +30,14 @@ .dataviews-view-grid__fields .dataviews-view-grid__field .dataviews-view-grid__field-value { color: $gray-900; } - - .dataviews-view-grid__media::after { - background-color: rgba(var(--wp-admin-theme-color--rgb), 0.08); - box-shadow: inset 0 0 0 $border-width var(--wp-admin-theme-color); - } } + &.is-selected .dataviews-view-grid__media::after, + .dataviews-view-grid__media:focus:after { + background-color: rgba(var(--wp-admin-theme-color--rgb), 0.08); + box-shadow: inset 0 0 0 $border-width var(--wp-admin-theme-color); + } + + } .dataviews-view-grid__media { From c49db9cdc2b217f0b605fe9d0b9cda3b7c73639b Mon Sep 17 00:00:00 2001 From: Jorge Costa Date: Tue, 10 Dec 2024 15:02:54 +0000 Subject: [PATCH 2/5] lint fix --- packages/dataviews/src/dataviews-layouts/grid/style.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/dataviews/src/dataviews-layouts/grid/style.scss b/packages/dataviews/src/dataviews-layouts/grid/style.scss index b83186bc9cf2b..66e623d9ca0ec 100644 --- a/packages/dataviews/src/dataviews-layouts/grid/style.scss +++ b/packages/dataviews/src/dataviews-layouts/grid/style.scss @@ -32,7 +32,7 @@ } } &.is-selected .dataviews-view-grid__media::after, - .dataviews-view-grid__media:focus:after { + .dataviews-view-grid__media::focus::after { background-color: rgba(var(--wp-admin-theme-color--rgb), 0.08); box-shadow: inset 0 0 0 $border-width var(--wp-admin-theme-color); } From 6aea43459e565c621be05a0991ff4d62a84aa934 Mon Sep 17 00:00:00 2001 From: Jorge Costa Date: Tue, 10 Dec 2024 16:43:37 +0000 Subject: [PATCH 3/5] feedback --- packages/dataviews/src/dataviews-layouts/grid/style.scss | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/packages/dataviews/src/dataviews-layouts/grid/style.scss b/packages/dataviews/src/dataviews-layouts/grid/style.scss index 66e623d9ca0ec..8be5e9f93dde5 100644 --- a/packages/dataviews/src/dataviews-layouts/grid/style.scss +++ b/packages/dataviews/src/dataviews-layouts/grid/style.scss @@ -34,7 +34,13 @@ &.is-selected .dataviews-view-grid__media::after, .dataviews-view-grid__media::focus::after { background-color: rgba(var(--wp-admin-theme-color--rgb), 0.08); - box-shadow: inset 0 0 0 $border-width var(--wp-admin-theme-color); + + } + &.is-selected .dataviews-view-grid__media::after { + box-shadow: inset 0 0 0 $border-width var(--wp-admin-theme-color); + } + .dataviews-view-grid__media:focus::after { + box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color); } From 9bb35cfadd94ced94ee04c3b593b2258fe521a1d Mon Sep 17 00:00:00 2001 From: Jorge Costa Date: Tue, 10 Dec 2024 17:24:02 +0000 Subject: [PATCH 4/5] lint fixes --- packages/dataviews/src/dataviews-layouts/grid/style.scss | 7 ++----- 1 file changed, 2 insertions(+), 5 deletions(-) diff --git a/packages/dataviews/src/dataviews-layouts/grid/style.scss b/packages/dataviews/src/dataviews-layouts/grid/style.scss index 8be5e9f93dde5..e68950f32e100 100644 --- a/packages/dataviews/src/dataviews-layouts/grid/style.scss +++ b/packages/dataviews/src/dataviews-layouts/grid/style.scss @@ -32,9 +32,8 @@ } } &.is-selected .dataviews-view-grid__media::after, - .dataviews-view-grid__media::focus::after { - background-color: rgba(var(--wp-admin-theme-color--rgb), 0.08); - + .dataviews-view-grid__media:focus::after { + background-color: rgba(var(--wp-admin-theme-color--rgb), 0.08); } &.is-selected .dataviews-view-grid__media::after { box-shadow: inset 0 0 0 $border-width var(--wp-admin-theme-color); @@ -42,8 +41,6 @@ .dataviews-view-grid__media:focus::after { box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color); } - - } .dataviews-view-grid__media { From ed1658767ee292525440682821a19b4db08b0199 Mon Sep 17 00:00:00 2001 From: Jorge Costa Date: Tue, 10 Dec 2024 17:26:57 +0000 Subject: [PATCH 5/5] lint --- packages/dataviews/src/dataviews-layouts/grid/style.scss | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/dataviews/src/dataviews-layouts/grid/style.scss b/packages/dataviews/src/dataviews-layouts/grid/style.scss index e68950f32e100..51db297b4025b 100644 --- a/packages/dataviews/src/dataviews-layouts/grid/style.scss +++ b/packages/dataviews/src/dataviews-layouts/grid/style.scss @@ -33,10 +33,10 @@ } &.is-selected .dataviews-view-grid__media::after, .dataviews-view-grid__media:focus::after { - background-color: rgba(var(--wp-admin-theme-color--rgb), 0.08); + background-color: rgba(var(--wp-admin-theme-color--rgb), 0.08); } &.is-selected .dataviews-view-grid__media::after { - box-shadow: inset 0 0 0 $border-width var(--wp-admin-theme-color); + box-shadow: inset 0 0 0 $border-width var(--wp-admin-theme-color); } .dataviews-view-grid__media:focus::after { box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);