frontend: Fix visibility of Sidebar Elements and Navigation Tabs #1720
Conversation
Signed-off-by: Mariusz Winnik <[email protected]>
tazo90
force-pushed
the
fix/1719-sidebar-and-topbar-mobile-fixes
branch
from
ea4c0dd to
63c60b4
Compare
…topbar-mobile-fixes
Signed-off-by: Mariusz Winnik <[email protected]>
tazo90
force-pushed
the
fix/1719-sidebar-and-topbar-mobile-fixes
branch
from
830a907 to
bba6366
Compare
Signed-off-by: Mariusz Winnik <[email protected]>
tazo90
force-pushed
the
fix/1719-sidebar-and-topbar-mobile-fixes
branch
from
bdbd6b5 to
e500d42
Compare
|
Hey @tazo90 , thanks for this PR. I have noticed that the logo looks broken with it though (maybe due to the updates we had in the meanwhile): I will review the code now. |
There was a problem hiding this comment.
Thanks again @tazo90 . I left some comments on how to improve this PR.
| @@ -31,6 +31,7 @@ import VersionButton from './VersionButton'; | |||
| export const drawerWidth = 240; | |||
| export const mobileDrawerWidth = 320; | |||
| export const drawerWidthClosed = 64; | |||
| export const topBarHeight = 64; | |||
There was a problem hiding this comment.
The problem is that the sidebar is set from the top of the screen, without having the toolbar before it.
A more future-proof way of fixing this issue is to see what the normal case is doing: Adding a Box with the toolbar style mixin (look for the use of the toolbar class).
frontend/src/components/App/Home/__snapshots__/RecentClusters.stories.storyshot
Show resolved
Hide resolved
There was a problem hiding this comment.
We no longer have the frequent namespace. Only glossary + translation (default).
|
@tazo90 , have you had any more time to work on this? Really excited for this PR to get in so that headlamp is usable on mobile for me |
|
@tazo90 , if you don't have time to work on this PR, we understand and we can take it from here. Please let us know. |
|
Closing in favor of #2062 . |
This PR fixes #1719 .
Problem 1: Sidebar elements not visible
Before:
After:
Problem 2: Invisible Navigation Tabs
Before:
After:
