Hi Antoine!
El 14/8/21 a las 15:45, Antoine Le Gonidec escribió:
>> I've used the Adaptable Design view of the Developer tools in Firefox to
>> test this on different screen sizes and I think it works well for screens
>> 600px wide or more, but not for narrower screens. I don't know enough CSS to
>> tweak there.
>
> As discussed on IRC, a proposal would be to change the position of the banner
> foreground based on the viewport width. So the left part of it no longer
> overflows on narrow screens due to trying to keep it centered it in its
> container.
>
> An example to align the image with the left side of the banner container when
> the screen is 650px or narrower:
>
> @media screen and (max-width: 650px) {
> #splash h1 {
> background-position-x: left;
> }
> }
>
> My CSS is a bit rusty, but I think this only override previous rules so
> should be declared *after* the regular "#splash h1" rules.
>
that works, thanks a lot.
I have also removed the left and right margins the foreground image so it's
well displayed, as you suggested by IRC.
I have uploaded the updated SVG and PNG files to the wiki page, and will create
a merge request with the changes in CSS so everything is ready for publishing
when we update the website for Debian 11.
Thanks again!
--
Laura Arjona Reina
https://wiki.debian.org/LauraArjona