Automattic / themes

Free WordPress themes made by Automattic for WordPress.org and WordPress.com.
https://themeshaper.com
GNU General Public License v2.0
908 stars 358 forks source link

StartFitter Theme Images not responsive on mobile #7696

Open tavilla61 opened 8 months ago

tavilla61 commented 8 months ago

Quick summary

Using the StartFitter Theme, the main cover image on the Home page is slightly cut off on mobile views. It's fine on desktop.

Explorer plan, simple site

Marie Burthiault – Fasciapulsologie®   Energy Car…

Steps to reproduce

  1. View marie-burthiault.fr on desktop and mobile and compared
  2. Checked for known bugs
  3. Checked MGS for other known issues

What you expected to happen

Image should display correctly on mobile device.

What actually happened

I wasn't able to adjust settings to fix the image.

Browser

Google Chrome/Chromium, iOS Safari

Context

No response

Platform (Simple, Atomic, or both?)

Simple

Other notes

No response

Reproducibility

Consistent

Severity

Some (< 50%)

Available workarounds?

None

Workaround details

No response

mrfoxtalbot commented 8 months ago

I have noticed that this is not happening with the default content:

https://github.com/Automattic/themes/assets/4452464/e0836a53-4756-4798-a866-865b99aa080b

It looks like the words inside the cover block are too long. See what happens if I add "Supercalifragilisticexpialidocious" to the header:

https://github.com/Automattic/themes/assets/4452464/3d5e8b9b-5168-4bfa-a8e5-e02d901e4a29

Interestingly enough, Twenty Twenty-Four behaves better (the big word does overflow, but other elements inside the Cover block stay within the viewport: Screenshot on 2024-03-22 at 07-22-37

I suspect that having a mix of stack & regular nested groups is causing the issue: Annotation on 2024-03-22 at 07-25-16