Skip to content

Improve CSS variables for tor browser letterboxing

At the moment we declare the tor letterboxing colours as

.letterboxing {
  --letterboxing-bgcolor: var(--color-grey-light-20, #F0F0F4);
  --letterboxing-gradient-color1: rgba(0, 219, 222, 0.02);
  --letterboxing-gradient-color2: rgba(252, 0, 255, 0.02);
}

@media (prefers-color-scheme: dark) {
  .letterboxing {
    --letterboxing-bgcolor: var(--color-grey-dark-10, #52525E);
    --letterboxing-gradient-color1: rgba(0, 219, 222, 0.06);
    --letterboxing-gradient-color2: rgba(252, 0, 255, 0.06);
  }
}

The --color-grey- variables do not exist in either ESR 128 or 140, but I guess there was an intention to eventually move towards a named colour?

But given that the gradient colours are entirely custom, I doubt we want these to be applied on top of upstream variable colours. So I imagine we should just drop these undefined variables from the file.

@donuts and @ma1 can you confirm what the intention was here, and whether you want these colours to use hard-coded or upstream colours?

Edited by henry
To upload designs, you'll need to enable LFS and have an admin enable hashed storage. More information