fixes: PWA & interface on small screens

[p0lycarpio]

What type of PR is this?

(REQUIRED)

• bug
• cleanup

What this PR does / why we need it:

(REQUIRED)

This PR improves the PWA icons used on smartphone and disable the default icon generation with nuxt/pwa.
This also improves the readibility of actions buttons and fix spacing on small screens.

i18n : missing strings are added

Which issue(s) this PR fixes:

(REQUIRED)

Fixes #2364

Release Notes

(REQUIRED)

improve PWA icons & UI on small screens
regenerate translation strings

[hay-kot]

Can you post some screenshots of these UI changes?

[p0lycarpio]

Here are some examples of interface changes on small screens.

Before / After

Login page

Recipe editing

User settings

same in group and other pages

---

PWA icons changes

warning and cropped maskable icons

Before

After

[hay-kot]

These changes are lovely thank you!

[hay-kot]

Couple changes need to be made, but overall looks good.

For the translations. You should only modify the english set of json files. The rest are auto-generated and PR is made by an external service, so those need to be changed as well.

[p0lycarpio]

Thank you for your feedback ! I made the modifications. For translations, I know that Mealie uses Crowdwin but the English-only strings are not present in the other languages interface. Is there a pipeline to launch?

[hay-kot]

Thank you for your feedback ! I made the modifications. For translations, I know that Mealie uses Crowdwin but the English-only strings are not present in the other languages interface. Is there a pipeline to launch?

Thanks! The other languages should fallback if there's no reference. But once this is merged Crowdin will automatically fill those with defaults and then people can start translating them. I realized that the Crowdin integration has been broken for some time, so I wanted to get that fixed before I merged this. Thanks for your patience!

Should be fixed today and then I'll merge this!