Rearrange the navbar

[quadratz]

The existing navbar is excessively dense, resulting in some content being cut off. Perhaps combining some menus into one or converting texts to icons (e.g. GitHub link as icon instead of plain text) may help.

[KnorpelSenf]

English on FullHD screen works well, so I did not run into this myself yet.

Do you have any concrete suggestions?

[habemuscode]

In the same manner that in plugins, we have a dropdown with different sections we can do the same there. My concrete suggestions are:

• GitHub icon instead of text
• "Resources" that contains one section for resources itself and another for "Hosting" (So we combine here both)
• Examples and API references also are related
• Guide and Learn also are related

So users can learn about code, then check some examples (another dropdown), and finally see deployment options and other advanced stuff (3 dropdowns in total)

[KnorpelSenf]

Would it be enough to move Examples under Resources, and to shorten GitHub and Language to the icons? I'm afraid that merging any other entries will result in gigantic lists that are cumbersome to scroll through.

[habemuscode]

Also agreed with you. What do you think if we move only the following, then:

• Remove Guide button (It's the same URL as Learning → Overview)
• GitHub icon instead of text
• Languages flags instead of text (In the navbar, in the dropdown will remain the same as it looks now)
• API Reference inside of Resources → Grammy (In the same manner that we have the API Reference of Telegram in the Telegram part of that dropdown)
• (Optional): Move Examples → Resources

[KnorpelSenf]

Also agreed with you. What do you think if we move only the following, then:

• Remove Guide button (It's the same URL as Learning → Overview)

I disagree with this one, it's important to have a prominent button to get to the start of the story these docs are telling. If it can be avoided, I don't want to remove this one.

• GitHub icon instead of text

I agree!

• Languages flags instead of text (In the navbar, in the dropdown will remain the same as it looks now)

I agree! It would be nice to reuse the functionality of #507 if @CikiMomogi is willing to pick it up again.

• API Reference inside of Resources → Grammy (In the same manner that we have the API Reference of Telegram in the Telegram part of that dropdown)

Instead of hiding it away, we can just make it an icon. That way,

• it remains in the same place as before, and
• it is easily accessible (without having to open a menu first)

• (Optional): Move Examples → Resources

I agree, let's perform as few changes as necessary to fix this. After all, on bigger screens, it makes a whole lot of sense to use the available screen space. The most things are available directly, the better. So this is really only for the 1 % of people with the smallest screens.

[KnorpelSenf]

Closing because of inactivity.

[rojvv]

I have this issue on iPad.

[rojvv]

The longer dropdowns have some unusable items as well. The search works.

[KnorpelSenf]

I have this issue on iPad.

Very, very few uses use tablets (<0.5 % of users). I am not sure it is worth making the layout worse for the other >99.5 % just to accommodate for them.

The longer dropdowns have some unusable items

In what way? Are they too wide or is the menu too long? It works well on mobile.

[rojvv]

If you think the current grouping of the navbar isn’t going to get any better with #801, then #801 is not a good solution.

[rojvv]

@CikiMomogi You can close this if it’s no longer the case for you, because it’s OK for me now.