diff --git a/client/editor_ui.tsx b/client/editor_ui.tsx index 39b60e7d..0ffca98a 100644 --- a/client/editor_ui.tsx +++ b/client/editor_ui.tsx @@ -449,7 +449,7 @@ export class MainUI { .includes("hamburger") ? [ { - icon: featherIcons.MoreVertical, + icon: featherIcons.Menu, description: "Open Menu", class: "expander", callback: () => { diff --git a/client/styles/top.scss b/client/styles/top.scss index 845037e9..1623bc1d 100644 --- a/client/styles/top.scss +++ b/client/styles/top.scss @@ -133,9 +133,8 @@ } #sb-top .sb-actions.hamburger { - border-radius: 5px; - border: 1px solid #444; width: 2.8rem; + margin-top: 2px; background: color-mix( in srgb, var(--top-background-color) 90%, @@ -146,7 +145,9 @@ flex-direction: column; align-items: center; z-index: 10; - transition: max-height 0.3s ease-in-out, box-shadow 0.3s ease-in-out; + transition: + max-height 0.3s ease-in-out, + box-shadow 0.3s ease-in-out; /* Initial collapsed height */ max-height: 2.2rem; @@ -168,7 +169,9 @@ margin: 8px 0; opacity: 0; transform: translateY(-10px); - transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out; + transition: + opacity 0.3s ease-in-out, + transform 0.3s ease-in-out; } } @@ -176,7 +179,6 @@ &.open:hover { /* Expanded height limited to the viewport height minus some padding */ max-height: calc(100vh - 24px); - box-shadow: 0 2px 15px rgba(0, 0, 0, 0.5); button { opacity: 1;