organicmaps / organicmaps.github.io

Official Organic Maps website source code. Please contribute your translations!
Apache License 2.0
35 stars 34 forks source link

Fix the styling of the donation buttons #169

Open meenbeese opened 12 months ago

meenbeese commented 12 months ago

Closes #150

Preview link: https://934d6be4.organicmaps-github-io.pages.dev/ (I do not know why some changes are not showing up correctly.)

Desktop: Before Desktop: After
desk1 desk2
Mobile: Before Mobile: After
mob1 mob2
meenbeese commented 12 months ago

Thanks! Did you try to set up Cloudflare Preview deployments in your forked repo? They, unfortunately, don't allow to preview PRs from contributor's forks. Or do you know other ways to see a live preview for contributor's PRs?

This is really weird. I tried to set up a preview website using two different providers and both of them are not showing the changes I made to the icons, only to the text. I don't know why this is the case since zola serve works perfectly on my machine.

Due to this, I would recommend you to clone the redo-donate-buttons branch from my fork repo and just build it locally. This looks like the best way as other methods are not reliable for some reason. I'm sorry for the inconvenience caused.

biodranik commented 12 months ago

This is really weird. I tried to set up a preview website using two different providers and both of them are not showing the changes I made to the icons, only to the text. I don't know why this is the case since zola serve works perfectly on my machine.

Can you please share links to previews? Did you do zola build locally and compare the HTML output with the expected one?

rtsisyk commented 12 months ago

I like the screenshots. Please fix translations separately to reduce the size of PR.

meenbeese commented 12 months ago

Can you please share links to previews?

Here is the Cloudflare preview but do note that it does not reflect all my changes correctly: https://a5f2e489.organicmaps-github-io.pages.dev/donate/

Did you do zola build locally and compare the HTML output with the expected one?

I don't know what you mean exactly by that. I ran both zola build and zola serve again now and it matches what I expect it to be.

meenbeese commented 12 months ago

I like the screenshots. Please fix translations separately to reduce the size of PR.

Done! Here is the new PR for that: #173

meenbeese commented 12 months ago
  1. Can you please rebase this commit on the latest master branch and force-push it here again?

Done! As you recommended, git rebase is much cleaner. Thanks.

  1. The preview link didn't show any changes to buttons for some reason. What is the branch-preview link?

I couldn't manage to get a preview link for this branch. I you could give me some level of access as discussed earlier, that would be possible perhaps. Did you try to build it in your local machine to test it? That's a good way as well.

meenbeese commented 12 months ago
  1. How does it look on mobile screen? The current version fits it well. Most of our website audience comes from mobiles.

The mobile screenshots are also available in the top comment. If I left something important out, let me know please.

  1. Now buttons take too much space. Is it really necessary? Maybe leaving them more compact has its advantages?

Yeah, this may be true for the mobile version. I can adjust that even though screen space is not a huge issue and making them too compact makes them harder to click imo.

  1. It is not clear for some users that these icons are actually clickable. Does it make sense to show some light border (aka button) on them, and highlight it on mouse hover/finger touch?

I already implemented a dark green border on mouse hover/touch, and I can expand this if you think that is not enough. I will try to work on this more as I haven't done a great job about this distinction.

  1. As it was mentioned in #164, some translations are not migrated to weblate and are not supported yet by tools/i18n script. Can you please help to finish this migration? Then it would be easy to add/modify text blocks everywhere, and keep everything in sync. There should be an issue or a closed PR from @rtsisyk about that (and he can also suggest how to finish it).

I will try to investigate this then, as I am not very familiar with the site's inner workings. Can you help me guide towards a solid initial implementation @rtsisyk ?

biodranik commented 11 months ago

It would be awesome to start with porting missing translations to weblate. They are described in more details here: https://github.com/organicmaps/organicmaps.github.io/blob/master/TRANSLATIONS.md

meenbeese commented 10 months ago

It would be awesome to start with porting missing translations to weblate.

Can't that be done in another PR where we only focus on translations? I can create a separate issue for that after this is done.