The stipple was the wrong instrument. It is what a Macintosh did, and what it does is knock out every other pixel of whatever is behind — which is a way of saying "not this" and a poor way of leaving something legible. Half a letter is not a dimmer letter, it is a damaged one. So it is a veil now: black, at under half alpha. Black in both polarities and for the same reason each way round. On a light theme it takes the lightness out of the field and everything standing on it. On a dark one there is no lightness left in the field to take, so it works on the light letters instead and knocks them back off the black. Anything tinted to the theme fails on one side or the other — ink brightens a dark screen, paper washes out a light one. What is behind stays readable. It just stops being the thing you are reading, which is the entire job.
- commit
- 4caad897bcb5b300459eeefae484cd04533ca2f6
- parent
- 3a85d20b1968350630fd4e434cccf8ae8162d124
- author
- Dami <dami.etoile@gmail.com>
| M | assets/ | 29 | ++++++++++++----------------- |
@@ -187,26 +187,21 @@ button.ghost { border-color: transparent; }
187187 undoes the whole conceit. This is the QuickDraw menu instead: a hard box, a188188 hairline frame, and inversion to show the highlight. */189189 .menu { position: relative; }190-/* An open pull-down dims the rest of the sheet, the way a Macintosh dimmed191- anything it had taken over: a fifty-percent stipple, not an alpha fade. It192- does two jobs — it lifts the menu off the sheet it is standing on, and it says193- that everything behind it is now somewhere to click rather than somewhere to194- read, which is the only hint anyone gets that clicking away closes the thing.195-196- Stippled in *paper* and not in ink, which is the whole trick and is why it197- works in both polarities. Over the sheet's own ground it is paper on paper and198- invisible; over a letter or a rule it knocks out every other pixel, so the199- thing behind reads as dimmed rather than as covered. Ink would have been200- backwards on a dark theme, where the ink is the light colour and stippling201- with it brightens the screen it is meant to be putting to sleep. */190+/* An open pull-down dims the rest of the sheet. It lifts the menu off the thing191+ it is standing on, and it is the only hint anyone gets that clicking away is a192+ thing you can do.193+194+ A veil of black at less than half alpha, and black in both polarities. On a195+ light theme it takes the lightness out of the field and everything on it; on a196+ dark one there is no lightness left in the field to take, so it works on the197+ light letters instead and knocks them back. Anything tinted to the theme goes198+ the wrong way on one side or the other — ink brightens a dark screen, paper199+ washes out a light one — and the point is not to hide what is behind but to200+ stop it being the thing you are reading. */202201 .scrim {203202 position: absolute; inset: 0;204203 z-index: 4;205- /* Whole units, so the checker lands on whole device pixels like every other206- rule in this app. Hard stops rather than a gradient, and no alpha: there is207- no such thing as a half-inked pixel here. */208- background: conic-gradient(var(--paper) 0 25%, #0000 0 50%, var(--paper) 0 75%, #0000 0);209- background-size: calc(2px * var(--s)) calc(2px * var(--s));204+ background: rgb(0 0 0 / 45%);210205 }211206 .menu.open { z-index: 5; }212207 .menutitle { min-width: calc(84px * var(--s)); text-align: left; }