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

Email inputs with placeholder text #6

Closed
yuanworks opened this issue Apr 7, 2020 · 6 comments
Closed

Email inputs with placeholder text #6

yuanworks opened this issue Apr 7, 2020 · 6 comments

Comments

@yuanworks
Copy link

@yuanworks yuanworks commented Apr 7, 2020

Hey there @shadeed, loved your guide on RTL! We've recently had a huge influx of Arabic-speaking users and your guide is incredibly useful. I wanted to ask if it's possible to add a section explaining how placeholder text for email/phone numbers should appear?

image

Today I learned from your guide that phones/email should still be LTR, but I was wondering if, when inputting the email, but how should the placeholder text look like?

(Sorry if it's mentioned and I missed it). Thanks!

Edit: I noticed FB keeps the email input LTR when there is no placeholder text, but when there is placeholder text, it stays RTL. Is this correct?

@shadeed
Copy link
Owner

@shadeed shadeed commented Apr 7, 2020

Hello @yuanworks, thank you for reading!

I'm not sure if I got your question correctly, the placeholder should be aligned the same as the email input while typing. Did you have a look at this section?

Let me know please if it's clear or in case I got the question incorrectly!

@yuanworks
Copy link
Author

@yuanworks yuanworks commented Apr 8, 2020

Thanks! I saw this section, sorry for not formulating the question correctly. But what if the placeholder text inside the text input for email is in Arabic (in your example it's mail@example.com), should it be LTR aligned?

[           arabic-placeholder-text]  (RTL)

when typing -->

[typing@myemail.com                ]  (LTR)

Should it work like this?

@shadeed
Copy link
Owner

@shadeed shadeed commented Apr 8, 2020

Yes, your solution is 100% correct and logical for me. I will make sure to update the section asap with that regard. Thank you :)

@yuanworks yuanworks changed the title Email inputs with placeholder text! Email inputs with placeholder text Apr 8, 2020
@shadeed
Copy link
Owner

@shadeed shadeed commented Apr 19, 2020

Hello @yuanworks, I updated the section with an example of the use-case you mentioned. Thank you :)

@shadeed shadeed reopened this Apr 19, 2020
@shadeed shadeed closed this as completed Apr 19, 2020
@yuanworks
Copy link
Author

@yuanworks yuanworks commented Apr 19, 2020

Great, thank you so much @shadeed!

@omar-dulaimi
Copy link

@omar-dulaimi omar-dulaimi commented Oct 6, 2021

Hello,
Some nice work you have here and on the website.

Just wanted to check if it's possible to set rtl to a placeholder and ltr to an input field using just css, and have them change when typing

@shadeed

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

No branches or pull requests

3 participants