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: add language picker #1695

Open
wants to merge 8 commits into
base: gh-pages
Choose a base branch
from

Conversation

cengizcmataraci
Copy link
Contributor

@cengizcmataraci cengizcmataraci commented Nov 23, 2024

Adding language picker to header
closes #1687

Copy link

netlify bot commented Nov 23, 2024

Deploy Preview for expressjscom-preview ready!

Name Link
🔨 Latest commit f39992e
🔍 Latest deploy log https://app.netlify.com/sites/expressjscom-preview/deploys/678587d0292d400008d3b140
😎 Deploy Preview https://deploy-preview-1695--expressjscom-preview.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

@bjohansebas bjohansebas requested a review from a team November 24, 2024 00:00
Copy link
Member

@bjohansebas bjohansebas left a comment

Choose a reason for hiding this comment

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

Maybe we don't want it to be removed in mobile until it really breaks the mobile responsiveness.

With the selector, I think this part of the page can be removed now.
image

I really love that this is being added.

@cengizcmataraci
Copy link
Contributor Author

I don't add the picker in the mobile, but I'll add it and remove the language part if you folks want. And I also like the picker. 😄

@carlosstenzel
Copy link
Contributor

@cengizcmataraci
good job ;)

@cengizcmataraci
Copy link
Contributor Author

Hello, sorry about the delay. Could you review again, please? I added the language picker for mobile. I tested for various devices in browser dev tools. @bjohansebas @carlosstenzel

js/menu.js Show resolved Hide resolved
Copy link
Member

@bjohansebas bjohansebas 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 for working on this @cengizcmataraci, it really looks great

ctcpip

This comment was marked as resolved.

}

#language-picker-menu #navmenu>li:first-child {
display: flex !important;
Copy link
Member

Choose a reason for hiding this comment

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

We try not to use !important, please find a way to remove it.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Sure, I will look at it.

Copy link
Member

@bjohansebas bjohansebas left a comment

Choose a reason for hiding this comment

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

Please remove the !important

@bjohansebas
Copy link
Member

On mobile, I think it would be better to handle it the same way as on desktop, meaning the menu doesn't take up the full width, similar to how Node.js does it

image

And maybe always keep the icon instead of showing the language name

@cengizcmataraci
Copy link
Contributor Author

On mobile, I think it would be better to handle it the same way as on desktop, meaning the menu doesn't take up the full width, similar to how Node.js does it

image

And maybe always keep the icon instead of showing the language name

Are you referring to the desktop version? Because we don’t display the language name in the mobile picker. And do we really think the Node.js website offers a better UX for the mobile picker? I find it a bit confusing. In our design, the user opens the picker solely to change the language, and once that’s done, it closes automatically. @bjohansebas

@bjohansebas
Copy link
Member

I'm not an expert in UX/UI to determine if Node.js has the best mobile user experience, it was just a suggestion, so I'm okay with leaving it as it is, which I also think is great.

@carlosstenzel
Copy link
Contributor

In my analysis, I believe it is good for this first version.

Captura de tela 2025-01-16 081427
Captura de tela 2025-01-16 081804

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.

Add language selector
4 participants