better width

PostHog · Nov 15, 2023 · 37d09c7 · 37d09c7
1 parent 29f5254
commit 37d09c7
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 4 deletions.
diff --git a/frontend/src/toolbar/3000/Toolbar3000.tsx b/frontend/src/toolbar/3000/Toolbar3000.tsx
@@ -93,7 +93,7 @@ function MoreMenu(): JSX.Element {
                         click: true,
                     }
                 )}
-                square={true}
+                className={'ToolbarMenu__button--square-left'}
             />
         </LemonMenu>
     )
@@ -192,7 +192,7 @@ export function Toolbar3000(): JSX.Element {
                                 click: true,
                             }
                         )}
-                        className={clsx(!minimizedWidth && 'ToolbarMenu__logo--minimized-width')}
+                        className={clsx(!minimizedWidth && 'ToolbarMenu__button--square-right')}
                     />
                 </Tooltip>
                 {!minimizedWidth ? <LemonDivider vertical={true} className={'h-full bg-border-bold-3000'} /> : null}
@@ -296,6 +296,7 @@ export function Toolbar3000(): JSX.Element {
                                 square={true}
                             />
                         </Tooltip>
+                        <LemonDivider vertical={true} className={'h-full bg-border-bold-3000'} />
                         <MoreMenu />
                     </>
                 ) : null}

diff --git a/frontend/src/toolbar/button/ToolbarButton.scss b/frontend/src/toolbar/button/ToolbarButton.scss
@@ -54,13 +54,18 @@
     transition-timing-function: ease;
     filter: drop-shadow(1px 2px 2px var(--trace-3000));
 
-    .ToolbarMenu__logo--minimized-width {
+    .ToolbarMenu__button--square-right {
         border-bottom-right-radius: 0;
         border-top-right-radius: 0;
     }
 
+    .ToolbarMenu__button--square-left {
+        border-bottom-left-radius: 0;
+        border-top-left-radius: 0;
+    }
+
     // fixed width so that animations work when changing width
-    width: 15.5rem;
+    width: 15.1rem;
 
     &.Toolbar3000--minimized-width {
         width: 2.5rem;