From 96b462cbecd99b7f20fcbff227facd51a6a21c53 Mon Sep 17 00:00:00 2001 From: aPreciado88 Date: Tue, 18 Mar 2025 11:45:34 -0700 Subject: [PATCH 1/4] revert(menu): revert interaction state changes --- .../src/components/menu-item/menu-item.scss | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/packages/calcite-components/src/components/menu-item/menu-item.scss b/packages/calcite-components/src/components/menu-item/menu-item.scss index 12fea8c2a5d..1b132b0bdfc 100644 --- a/packages/calcite-components/src/components/menu-item/menu-item.scss +++ b/packages/calcite-components/src/components/menu-item/menu-item.scss @@ -59,13 +59,12 @@ color: var(--calcite-menu-text-color, var(--calcite-internal-menu-text-color, var(--calcite-color-text-2))); &:hover { + @apply bg-foreground-2 text-color-2; border-block-end-color: var(--calcite-menu-item-accent-color, var(--calcite-color-border-2)); } &:focus { - @apply focus-inset border-b-4; - padding-block-start: theme("spacing.1"); - border-block-end-width: theme("spacing.1"); + @apply bg-foreground-2 text-color-2 focus-inset; } &:active { From f556774f287a58d6be0e730285668423eac9e504 Mon Sep 17 00:00:00 2001 From: aPreciado88 Date: Tue, 18 Mar 2025 13:19:27 -0700 Subject: [PATCH 2/4] revert(menu-item): revert interaction state changes --- .../src/components/menu-item/menu-item.scss | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/packages/calcite-components/src/components/menu-item/menu-item.scss b/packages/calcite-components/src/components/menu-item/menu-item.scss index 1b132b0bdfc..7674a55cafa 100644 --- a/packages/calcite-components/src/components/menu-item/menu-item.scss +++ b/packages/calcite-components/src/components/menu-item/menu-item.scss @@ -59,12 +59,14 @@ color: var(--calcite-menu-text-color, var(--calcite-internal-menu-text-color, var(--calcite-color-text-2))); &:hover { - @apply bg-foreground-2 text-color-2; + @apply bg-foreground-2; border-block-end-color: var(--calcite-menu-item-accent-color, var(--calcite-color-border-2)); } &:focus { - @apply bg-foreground-2 text-color-2 focus-inset; + @apply focus-inset border-b-4; + padding-block-start: theme("spacing.1"); + border-block-end-width: theme("spacing.1"); } &:active { From fc843d35a1b8ca070800835970db0473a6bc39e0 Mon Sep 17 00:00:00 2001 From: aPreciado88 Date: Tue, 18 Mar 2025 13:55:37 -0700 Subject: [PATCH 3/4] revert(menu-item): revert interaction state changes --- .../calcite-components/src/components/menu-item/menu-item.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/calcite-components/src/components/menu-item/menu-item.scss b/packages/calcite-components/src/components/menu-item/menu-item.scss index 7674a55cafa..16fc48579a1 100644 --- a/packages/calcite-components/src/components/menu-item/menu-item.scss +++ b/packages/calcite-components/src/components/menu-item/menu-item.scss @@ -59,7 +59,7 @@ color: var(--calcite-menu-text-color, var(--calcite-internal-menu-text-color, var(--calcite-color-text-2))); &:hover { - @apply bg-foreground-2; + --calcite-internal-menu-background-color: var(--calcite-color-foreground-2); border-block-end-color: var(--calcite-menu-item-accent-color, var(--calcite-color-border-2)); } From 9d24458c4ecd34fa1902b1ce3b656bf397e31568 Mon Sep 17 00:00:00 2001 From: aPreciado88 Date: Tue, 18 Mar 2025 15:32:40 -0700 Subject: [PATCH 4/4] revert(menu-item): revert interaction state changes --- .../src/components/menu-item/menu-item.e2e.ts | 12 ------------ .../src/components/menu-item/menu-item.scss | 1 - 2 files changed, 13 deletions(-) diff --git a/packages/calcite-components/src/components/menu-item/menu-item.e2e.ts b/packages/calcite-components/src/components/menu-item/menu-item.e2e.ts index 32022bba82b..8e60f63e3f3 100644 --- a/packages/calcite-components/src/components/menu-item/menu-item.e2e.ts +++ b/packages/calcite-components/src/components/menu-item/menu-item.e2e.ts @@ -207,18 +207,6 @@ describe("calcite-menu-item", () => { ], }; - describe("horizontal layout", () => { - themed(menuHTML("horizontal"), { - ...tokens, - "--calcite-menu-item-accent-color": { - selector: "calcite-menu-item", - shadowSelector: `.${CSS.content}`, - targetProp: "borderBlockEndColor", - state: "hover", - }, - }); - }); - describe("vertical layout", () => { themed(menuHTML("vertical"), tokens); }); diff --git a/packages/calcite-components/src/components/menu-item/menu-item.scss b/packages/calcite-components/src/components/menu-item/menu-item.scss index 16fc48579a1..3390134ac18 100644 --- a/packages/calcite-components/src/components/menu-item/menu-item.scss +++ b/packages/calcite-components/src/components/menu-item/menu-item.scss @@ -60,7 +60,6 @@ &:hover { --calcite-internal-menu-background-color: var(--calcite-color-foreground-2); - border-block-end-color: var(--calcite-menu-item-accent-color, var(--calcite-color-border-2)); } &:focus {