Re: [Tails-dev] CSS fixes

u:
> sajolida:
>> u:
>>> sajolida:
>>>> u:
>>>> Also, in your mobile version you pretty much reuse the font size of the
>>>> logo where "the amnesic incognito live system" is as wide as "Tails" but
>>>> you also added some extra vertical space that is not present neither in
>>>> the logo nor on the desktop banner. Is there a reason for that?
>>>
>>> I did not add any extra vertical space as far as I know. So I don't know
>>> where you see that?
>>
>> See attachment. Compared with our canonical logo:
>>
>> https://tails.boum.org/contribute/how/promote/material/logo/tails-logo-flat-inverted.png
>>
>> But that might also mean that our canonical logo is problematic :)
>
> Actually, what I did:
> - the current banner is a gigantic image containing the white text and
> image of the USB key and a purple background.
> - I wanted to remove this background because
> - it makes the image too heavy
> - it prevents us from doing a nice :hover on the banner
> - it prevents us from resizing the logo on smaller screens

Cool!

> - The current banner image does not exist as a SVG on the promote page.
> - So I took our logo from the promote/ page and exported only the white
> parts. I then realized that the banner image's subtitle was much larger
> and increased the text to fit this large size. The image I based myself
> on was this one:
> https://tails.boum.org/contribute/how/promote/material/logo/tails-logo-flat.svg.
>
> You will also see that the horizontal space between the USB key and the
> text has increased. This is because the logo itself contains this space
> while this space has been diminished in the current banner.
>
>>>> As a more general note, in terms of style guide (I agree that so far we
>>>> have none), if we want to spend time on the display of our logo, I'd
>>>> rather go in the direction of using our logo in more similar ways
>>>> everywhere than creation new subtle variations.
>
>>>> But I reckon that we're doing this already in the banner so I can't
>>>> really blame you for continuing doing so :) And I'm not at all saying
>>>> that you should go edit our logo as part of this but maybe having some
>>>> discussion about it could be a first step towards and new a better version.
>
> As hopefully explained in detail above, indeed, the banner is itself
> already a modification of the original logo and does not even exist as
> part of our promote material.

Right.

>>> Yes, I figured that the current banner is actually not like what exists
>>> on /promote... And I wondered how that version came to life.
>>
>> Yeah... I (or tchou) probably did some ad hoc fixes on the logo to make
>> it fit better. Now I'm thinking that we should instead go in the
>> direction of having less logo variations, and maybe fixing the canonical
>> logo instead. Anyway, no big deal, low prio, etc.
>
> We should indeed have less variation.
>
>>> So I'm fine with keeping the banner as is, and for the mobile version
>>> just remove the text below.
>>
>> Let's try that!
>>
>> Can you check whether the layout of the canonical logo without the text
>> below works well in terms of vertical alignement. And if not propose an
>> adjusted layout, maybe for your banner only as a start.
>>
>> I'm curious to see how it would look like.
>
> Well, I can make a proposal, but in that case, I will simply use the
> original logo with its original spacings and not the banner as it is
> now. If you think the original logo has weird spacings, please fix it
> before I get into it.
>
> However, I really do not want this to become a blocker and I don't want
> this to eat up more of my time which would be better used to work on the
> donation campaign itself.

So I procrastinated for about one hour on removing the subtitle from our
canonical logo. This allowed me then to reuse it as such in the banner
and have the exact same version work on mobile as well. We're down from
3 variations to 1!

I pushed that in feature/smallCSSfixes.

Tell me what you think.

The ticket about removing the subtitle from the logo: #14835.
But I'll raise the issue on tails-project@ as well.

And regarding your branch, I'm fine merging it once we agree on
something regarding the logo (or even before if you think it will be a
complicated discussion).

Still, I spotted one little detail (see attachment): in the Farsi
version the search box is much taller. I narrowed the problem down to
having a bigger line-height in the input field in there (34px instead of
22px reported by Tor Browser). Then I couldn't see where this was coming
from... But I think we can ignore that, unless you find a quick way of
solving it.