From 51a88c4ec23330361a36d9edb40218ed8f0f0b4d Mon Sep 17 00:00:00 2001 From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com> Date: Thu, 16 Oct 2025 21:21:24 +0000 Subject: [PATCH 1/3] Initial plan From 058a87623cf1b2c6ffd33240d058b247fdc9b821 Mon Sep 17 00:00:00 2001 From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com> Date: Thu, 16 Oct 2025 21:37:39 +0000 Subject: [PATCH 2/3] Improve sidebar selected state visibility with distinct colors and border indicator Co-authored-by: adamziel <205419+adamziel@users.noreply.github.com> --- .../components/site-manager/sidebar/style.module.css | 12 +++++++++--- 1 file changed, 9 insertions(+), 3 deletions(-) diff --git a/packages/playground/website/src/components/site-manager/sidebar/style.module.css b/packages/playground/website/src/components/site-manager/sidebar/style.module.css index fcf8bf8cbf..ccfedb28fc 100644 --- a/packages/playground/website/src/components/site-manager/sidebar/style.module.css +++ b/packages/playground/website/src/components/site-manager/sidebar/style.module.css @@ -50,15 +50,21 @@ text-align: left; border-radius: 4px; margin-bottom: 2px; + border-left: 3px solid transparent; } -.sidebar-item:hover, -.sidebar-item--selected { +.sidebar-item:hover { color: var(--site-manager-text-color) !important; background-color: #353535; } +.sidebar-item--selected { + color: var(--site-manager-text-color) !important; + background-color: #2c5282; + border-left: 3px solid #4299e1; +} + .sidebar-item--selected:hover { - background-color: #545454; + background-color: #2b6cb0; } .sidebar-list-item--logo { From 0f7ef40699ddd9a19e7cedeafd6c1a836c1a5049 Mon Sep 17 00:00:00 2001 From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com> Date: Thu, 16 Oct 2025 21:43:06 +0000 Subject: [PATCH 3/3] Refactor to use CSS custom properties for sidebar selected state colors Co-authored-by: adamziel <205419+adamziel@users.noreply.github.com> --- .../src/components/site-manager/sidebar/style.module.css | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) diff --git a/packages/playground/website/src/components/site-manager/sidebar/style.module.css b/packages/playground/website/src/components/site-manager/sidebar/style.module.css index ccfedb28fc..d8f7fa0333 100644 --- a/packages/playground/website/src/components/site-manager/sidebar/style.module.css +++ b/packages/playground/website/src/components/site-manager/sidebar/style.module.css @@ -4,6 +4,9 @@ flex-shrink: 0; flex-direction: column; --site-manager-text-color: #fff; + --sidebar-item-selected-bg: #2c5282; + --sidebar-item-selected-border: #4299e1; + --sidebar-item-selected-hover-bg: #2b6cb0; color: var(--site-manager-text-color); overflow: auto; } @@ -59,12 +62,12 @@ .sidebar-item--selected { color: var(--site-manager-text-color) !important; - background-color: #2c5282; - border-left: 3px solid #4299e1; + background-color: var(--sidebar-item-selected-bg); + border-left: 3px solid var(--sidebar-item-selected-border); } .sidebar-item--selected:hover { - background-color: #2b6cb0; + background-color: var(--sidebar-item-selected-hover-bg); } .sidebar-list-item--logo {