Increase consistence of nav bars

[SidharthBansal]

We are preparing to participate in Google Code-in, and have reserved this issue for participants in GCI - but we'd love to have your help with another one! Please check out https://code.publiclab.org to see more.
Instance count 1

Please describe the problem (or idea)

On small screen devices we get inconsistent nav bars

What happened just before the problem occurred? Or what problem could this idea solve?

We need to make them look similar

What did you expect to see that you didn't?

Please show us where to look

https://publiclab.org/ questions

What's your PublicLab.org username?

This can help us diagnose the issue:

Browser, version, and operating system

Many bugs are related to these -- please help us track it down and reproduce what you're seeing!

---

Thank you!

Your help makes Public Lab better! We deeply appreciate your helping refine and improve this site.

To learn how to write really great issues, which increases the chances they'll be resolved, see:

https://publiclab.org/wiki/developers#Contributing+for+non-coders

[SidharthBansal]

May be we can highlight the selected nav bar in rectangular form or any other way so that it will not create ambiguity to users

[jywarren]

Do you mean the black top navbar or the tabs? Sorry, not quite sure what you're pointing at? Thanks!

…

On Tue, Sep 25, 2018 at 9:41 AM Sidharth Bansal ***@***.***> wrote: May be we can highlight the selected nav bar in rectangular form or any other way so that it will not create ambiguity to users — You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub <#3454 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AABfJ2xDxsJqLW2NAA6mr37Wzv9oCrJ5ks5uejJdgaJpZM4W4noZ> .

[SidharthBansal]

Following nav bars

• Popular
• Recently asked
• Recently answered
  etc.
  They are not aligned properly
  Also, I face problem in detecting which nav bar is selected right now. We can change the front end a little bit to enhance which button is selected.

[oorjitchowdhary]

Hi, @publiclab/reviewers .. I think the inconsistency was due to the redundant list and grid view buttons in the mobile view.. I just removed them through my PR #4201 .. I just viewed this page and this is how it looks without the list and grid buttons..

For the problem in detecting which navbar is selected, I think we can either highlight that tab or perhaps bold the font of that tab..

Hope this helps!

[jonxuxu]

Great job @oorjitchowdhary fixing the layout! Would you guys like it if I implemented a dropdown on mobile view for these buttons since they no longer have the same tab view when they overlap each other?

vs

[SidharthBansal]

Yeah sure create an issue and submit a patch

…

On Mon, Dec 10, 2018, 11:00 AM Jonathan Xu ***@***.*** wrote: Great job @oorjitchowdhary <https://github.com/oorjitchowdhary> fixing the layout! Would you guys like it if I implemented a dropdown on mobile view for these buttons since they no longer have the same tab view when they overlap each other? [image: image] <https://user-images.githubusercontent.com/22998430/49712477-a5702080-fc12-11e8-953b-2e08dc10ab71.png> vs [image: image] <https://user-images.githubusercontent.com/22998430/49712484-b02ab580-fc12-11e8-92d1-e63b4386b7bb.png> — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub <#3454 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AUACQ9QhVQO94NzL1OGdMXkHm8eGuFr2ks5u3fFbgaJpZM4W4noZ> .

[jonxuxu]

While testing out mobile dropdown, it seems like after a certain point, the buttons stop displaying text, most likely for better ui on mobile view.

However, at the apect ratio targeted from @oorjitchowdhary 's PR the text reappears. Perhaps the issue with tabs is a result of another issue of text reappearing at that aspect ratio?

[jonxuxu]

Okay it seems that the small icons only get toggled on /notes and /questions but not /tags. Also it happens when the navbar takes up extra vertical space.

[jonxuxu]

@SidharthBansal I fixed the issue here: #4248

[SidharthBansal]

Please wait. I am reviewing sorry I was not present for last hour.
Was busy with my lunch.

[VladimirMikulic]

This has been fixed in #4201 & #4248. Closing this.

[SidharthBansal]

Great you have power to close issues :-)

…

On Fri, Jan 31, 2020 at 8:47 PM Vladimir Mikulic ***@***.***> wrote: This has been fixed in #4201 <#4201> & #4248 <#4248>. Closing this. — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#3454?email_source=notifications&email_token=AFAAEQ6UTG5PDUQKCPFOL3DRAQ6IFA5CNFSM4FXCPIM2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEKO6XLI#issuecomment-580774829>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AFAAEQ27GZK3OX5TQAISTGTRAQ6IFANCNFSM4FXCPIMQ> .