Description
On the donate page, the "Join the food revolution!" image overlaps
the Donorbox donation widget above it, obscuring part of the payment UI.
Steps to reproduce
- Go to the donate page (e.g. https://world.openfoodfacts.org/donate-to-open-food-facts,
or local openfoodfacts.localhost)
- Scroll to the donation widget on the right
- Observe the image below the widget overlapping into it
Expected behavior
The image should sit cleanly below the Donorbox widget with normal spacing.
Actual behavior
The image overlaps into the widget due to a negative top margin.
Screenshot
Root cause (found while investigating)
In html/donate/*.html, the image has an inline style with
margin-top: -15%, which pulls it upward regardless of the actual
widget height. This affects all ~150 language files (same inline style,
just translated alt text).
Proposed fix
Replace the negative margin with a normal positive spacing value
(e.g. margin-top: 1rem). Happy to submit a PR for this.
Description
On the donate page, the "Join the food revolution!" image overlaps
the Donorbox donation widget above it, obscuring part of the payment UI.
Steps to reproduce
or local
openfoodfacts.localhost)Expected behavior
The image should sit cleanly below the Donorbox widget with normal spacing.
Actual behavior
The image overlaps into the widget due to a negative top margin.
Screenshot
Root cause (found while investigating)
In
html/donate/*.html, the image has an inline style withmargin-top: -15%, which pulls it upward regardless of the actualwidget height. This affects all ~150 language files (same inline style,
just translated
alttext).Proposed fix
Replace the negative margin with a normal positive spacing value
(e.g.
margin-top: 1rem). Happy to submit a PR for this.