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 2669dcf209e..bc52f472b02 100644 --- a/packages/calcite-components/src/components/menu-item/menu-item.scss +++ b/packages/calcite-components/src/components/menu-item/menu-item.scss @@ -180,6 +180,10 @@ calcite-action { } } +:host([layout="vertical"]:last-of-type) .dropdown-menu-items { + border-block-end: 0; +} + :host([slot="submenu-item"]) .parent--vertical { @apply ps-6; } diff --git a/packages/calcite-components/src/components/menu/menu.stories.ts b/packages/calcite-components/src/components/menu/menu.stories.ts index 81b462cb10f..3aff0495421 100644 --- a/packages/calcite-components/src/components/menu/menu.stories.ts +++ b/packages/calcite-components/src/components/menu/menu.stories.ts @@ -134,7 +134,7 @@ export const verticalComplexUseCase_TestOnly = (): string => html`<calcite-shell </calcite-menu-item> </calcite-menu-item> </calcite-menu-item> - <calcite-menu-item href="#" slot="submenu-item" text="It's stupendous"> + <calcite-menu-item href="#" slot="submenu-item" text="It's stupendous" open> <calcite-menu-item slot="submenu-item" text="Very nice example"></calcite-menu-item> <calcite-menu-item icon-start="layer" slot="submenu-item" text="Short one" open> <calcite-menu-item icon-start="layer" slot="submenu-item" text="Another thing" open>