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

Change layout to fix language selector #3

Merged
merged 3 commits into from
Jan 24, 2023
Merged

Change layout to fix language selector #3

merged 3 commits into from
Jan 24, 2023

Conversation

Thithic
Copy link
Contributor

@Thithic Thithic commented Nov 3, 2022

Hello,
Following the discussion in #2 , I thought I'd give a try in fixing the layout for small screens.
The result I have for now looks like that :
image
I basically just centered the "Visit Github", and let the language selector go in the top-right corner.

The "big screen" layout is also changed the same way.

Please, when you have time, could tell me if that suits you or not.
I can, of course rework it if you have a specific idea in mind :)

Thank you

Copy link
Member

@patrickgold patrickgold left a comment

Choose a reason for hiding this comment

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

Thanks a lot for your PR!

It looks pretty well I must say :)

Please, when you have time, could tell me if that suits you or not.
I can, of course rework it if you have a specific idea in mind :)

The idea I had at the time was to just replace the "Visit GitHub repo" link with a clickable GitHub icon on mobile and then it should fit into one line (provided we reduce the horizontal header padding a bit).

If you want you can change it to this way, but I would also be okay with your solution for now :)

@Thithic
Copy link
Contributor Author

Thithic commented Nov 7, 2022

Hello,

Thank you for your review :)

The idea I had at the time was to just replace the "Visit GitHub repo" link with a clickable GitHub icon on mobile and then it should fit into one line (provided we reduce the horizontal header padding a bit).

Ah yes I see, I'll see if I manage to do that and I'll get back to you !

@Thithic
Copy link
Contributor Author

Thithic commented Nov 8, 2022

Hello,
I have changed the header design according (I think) to your view. Here is the result on big screen:
image
and on small screen:
image
The design works well with screen as little as 320px wide (tested with firefox developper tools)

Feel free to tell me what you think about it :)

Copy link
Member

@patrickgold patrickgold left a comment

Choose a reason for hiding this comment

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

Hey Thithic,

I am very sorry for not reviewing your PR for 3 months, I completely oversaw your awesome changes and now just stumbled on it by accident.

I have reviewed your changes and must say I really like them, they also seem to work very well with mobile screens.

As such I will merge in your changes, and again sorry for letting your PR collecting dust for so long!

@patrickgold patrickgold merged commit ba1a13d into florisboard:main Jan 24, 2023
@Thithic
Copy link
Contributor Author

Thithic commented Jan 25, 2023

Hello Patrick,

Thank you for the merge.
No worries, I can only imagine how Florisboard alone keeps you busy !

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.

2 participants