diff --git a/easy-ui-react/src/ForgeLayout/ForgeLayoutControls.module.scss b/easy-ui-react/src/ForgeLayout/ForgeLayoutControls.module.scss index 9ca9d764..6d58bcca 100644 --- a/easy-ui-react/src/ForgeLayout/ForgeLayoutControls.module.scss +++ b/easy-ui-react/src/ForgeLayout/ForgeLayoutControls.module.scss @@ -11,6 +11,7 @@ .breadcrumbNavigationContainer { border: design-token("shape.border_width.1") solid theme-token("color.neutral.300"); + padding-right: design-token("space.3"); display: inline-flex; z-index: 1; } @@ -62,7 +63,7 @@ border: design-token("shape.border_width.1") solid theme-token("color.neutral.300"); border-radius: design-token("shape.border_radius.md"); - background-color: white; + background-color: theme-token("color.neutral.000"); padding: design-token("space.2"); box-shadow: design-token("shadow.overlay"); } diff --git a/easy-ui-react/src/ForgeLayout/ForgeLayoutControls.tsx b/easy-ui-react/src/ForgeLayout/ForgeLayoutControls.tsx index 429340cc..f527a6b6 100644 --- a/easy-ui-react/src/ForgeLayout/ForgeLayoutControls.tsx +++ b/easy-ui-react/src/ForgeLayout/ForgeLayoutControls.tsx @@ -27,6 +27,9 @@ import styles from "./ForgeLayoutControls.module.scss"; const TEST_MODE = "Test"; const PRODUCTION_MODE = "Production"; +const POPOVER_CROSS_OFFSET = 116; +const POPOVER_OFFSET = 2; + export type ForgeLayoutControlsProps = { /** Controls children. */ children: ReactNode; @@ -48,10 +51,6 @@ export function ForgeLayoutControls(props: ForgeLayoutControlsProps) { return null; } - if (areControlsGrouped) { - return