Hoe de shell Apple-strak werd: 76px rail en 228px dood-blok opgeruimd
Twee jaar aan CSS-lagen had een 228px sidebar-blok dat nergens meer op inhing. De opruimactie die de portal-shell in één sweep opnieuw ademruimte gaf.
Twee jaar CSS-lagen, twee sidebars
De portal-shell begon als een 228px brede sidebar met tekst-labels. Ergens onderweg groeide daarnaast een 76px "rail" met alleen iconen. De 228px versie bleef in de CSS staan omdat één component nog naar de klassen luisterde — maar op scherm was hij al lang verborgen. Twee jaar rebase-conflicten later stond hij nog steeds in de source-map te schreeuwen dat hij nog leefde.
Waarom !important hier de eerlijkste tool was
De schone oplossing zou zijn: elke conflicterende regel omhoog werken tot je bij de vervuiler bent. In een codebase met acht jaar CSS-geschiedenis en drie generaties naming-schemes is dat een maandenlang project. In plaats daarvan een authoritative shell-CSS-laag onderaan met !important op sidebar-breedte, topbar-hoogte en content-padding. Niet elegant — maar wél verifieerbaar in één screenshot en één diff.
Wat dat concreet opleverde
De topbar krimpt van 84px naar 64px. Sidebar rail is een strakke 76px, geen sub-pixel meer. Content-padding komt uit één definitie in plaats van drie plaatsen die het per pagina-type verschillend berekenden. De diff is meestal +1/-1 regel per component, maar de visuele impact is groot: alles ademt, niks staat scheef, en de shell voelt eindelijk als één ding.
Wat we bewust NIET aanraakten
De data-attributen die de dark-mode aan- en uitzetten. Het gedrag van de command palette. De keybindings. Elk stuk wat "gewoon werkt" is met opzet ongemoeid gelaten — een design-pass is bedoeld om zichtbaar op te ruimen, niet om onzichtbaar gedrag te breken. Alles wat op ⌘K werkte gisteren werkt vandaag ook op ⌘K.