Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: better left navbar response at varying heights #1663

Merged
merged 1 commit into from Oct 7, 2020

Conversation

jessicaschilling
Copy link
Contributor

@jessicaschilling jessicaschilling commented Oct 6, 2020

Closes ipfs/ipfs-desktop#1668 (but requires release of webui).

  • Makes room for Electron window furniture (top left) vis-a-vis logo when used in IPFS Desktop
  • Maintains the 640px+ (aka 40em in our height system) behavior requirement outlined in feat: add version info in nav and Status screen, tighten nav accordingly #1654: preserves display of version/revision/repo/bug-report links at nav bottom for 640+ high windows
  • Enhancement: Adds a "height breakpoint" for condensing left-nav elements at windows shorter than 49em (see screenshot)
  • Behavior at different heights remains unchanged if window is narrower than 60em (aka width breakpoint for moving the nav to the top of the window)

Eyeballed as OK in Web UI in Mac Chrome, Firefox, and Safari.

Gif demonstration (Mac Firefox): https://gateway.ipfs.io/ipfs/QmUiSXL2Gt1176ncuUjU8KaKuPYkWyXu3tMK2opU5BF5CZ

Quick screenshot for comparison (Desktop RC2 from here on left, full-height Mac Chrome in middle, condensed-height Mac Chrome on right):
image

@rafaelramalho19 may have tweaks for a cleaner approach, but as-is this doesn't substantially introduce complexity, and in return offers a cleaner left navbar experience overall.

Copy link
Member

@lidel lidel left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thank you! Quickly eyeballed in Electron/Desktop and looks good too.
Will cut a release to fix ipfs/ipfs-desktop#1668 tomorrow.

ps. nice side-effect: we now use em for all navbar media queries

@lidel lidel changed the title bug/feat: better left navbar response at varying heights feat: better left navbar response at varying heights Oct 7, 2020
@lidel lidel merged commit e443286 into master Oct 7, 2020
@lidel lidel deleted the bug/left-nav-logo branch October 7, 2020 11:44
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Make room for window controls in left nav
2 participants