arc.codes icon indicating copy to clipboard operation
arc.codes copied to clipboard

Published 20 hours ago • verified publisher icon architect

Mobile: Top Nav, menu, and search

Open tbeseda opened this issue 2 years ago • 2 comments

Now that the Arc docs site feature-set has grown (dark mode FTW!), it's worth revisiting how the top nav works on mobile.

Currently, there are 3 static buttons for Discord | GitHub | dark mode and a hamburger menu for the docs navigation. Also, we left search out of the mobile interface when it was initially implemented.

What could this combination of features look like? ideally? we can then decide what iterative implementation looks like.

arc mobile nav

tbeseda avatar Sep 28 '21 16:09 tbeseda

A couple of options that I can think of:

  1. Slide search down under the Architect banner.

Screen Shot 2021-09-30 at 13 57 47

  1. Move the Search bar to the top of the navigation section for both desktop and mobile.

Screen Shot 2021-09-30 at 14 00 21

Screen Shot 2021-09-30 at 13 59 44

Obviously, option 2 would require some updated styling of the Search input.

macdonst avatar Sep 30 '21 18:09 macdonst

Nice previews. I kinda like option 2. Only issue might be that it isn't readily accessible when the side bar is scrolled way down. Maybe it's sticky inside that container? tbh both look great and I could go either way

tbeseda avatar Oct 01 '21 00:10 tbeseda