Feed browser: Redesign finalization #5

2026-10-20T09:09:50-06:00

calcazar commented

2026-10-20 09:09:50 -06:00

Finalization milestone of the feed browser redesign. Work so far is from 99puxwol5 (acceptance pass), which is not finished: the run was stopped at Cesar's request.

What changed:

src/styles/legacy.css is deleted and no longer imported. Its last rules in use moved: .center to layout.css, the error box to .signin-error (signin.css) and .composer-error (composer.css), and font: inherit for form controls to the globals reset layer. The global button margin rule and button:disabled { opacity:.5 } are gone.
The weight of the Discover row sub-labels is now set in buttons.css (it used to be inherited from the legacy button rule).
The four "Try again" buttons (feed error, load-more error, desktop and mobile) had no class of their own and relied on legacy.css. They now use the outline sweep button.
The button tests now check that legacy.css is gone, that layout does not import it, and that no stylesheet fades disabled buttons.

Visible effect of the deletion: computed styles of every element were compared before and after on /, /dev/feed and /dev/buttons at 1440, 1024, 820 and 390px, dark and light, in 44 states. The only visible changes fix bugs the legacy margin caused. The mobile dock is 64px tall again (it was 80px, with the like, comment and More icons 16px off center). The sheet backdrop now covers the full screen (it was shifted down 16px).

Verified: tsc, eslint, vitest (262 passed) and next build pass.

CRM task: 99puxwol5. The acceptance results are in the CRM comment on that task.

Finalization milestone of the feed browser redesign. Work so far is from 99puxwol5 (acceptance pass), which is not finished: the run was stopped at Cesar's request. What changed: - `src/styles/legacy.css` is deleted and no longer imported. Its last rules in use moved: `.center` to layout.css, the error box to `.signin-error` (signin.css) and `.composer-error` (composer.css), and `font: inherit` for form controls to the globals reset layer. The global `button` margin rule and `button:disabled { opacity:.5 }` are gone. - The weight of the Discover row sub-labels is now set in buttons.css (it used to be inherited from the legacy button rule). - The four "Try again" buttons (feed error, load-more error, desktop and mobile) had no class of their own and relied on legacy.css. They now use the outline sweep button. - The button tests now check that legacy.css is gone, that layout does not import it, and that no stylesheet fades disabled buttons. Visible effect of the deletion: computed styles of every element were compared before and after on /, /dev/feed and /dev/buttons at 1440, 1024, 820 and 390px, dark and light, in 44 states. The only visible changes fix bugs the legacy margin caused. The mobile dock is 64px tall again (it was 80px, with the like, comment and More icons 16px off center). The sheet backdrop now covers the full screen (it was shifted down 16px). Verified: tsc, eslint, vitest (262 passed) and next build pass. CRM task: 99puxwol5. The acceptance results are in the CRM comment on that task.

calcazar added 3 commits 2026-10-20 09:09:50 -06:00

99puxwol5: Delete legacy.css and move its last rules into the component stylesheets a069c2fb2f

99puxwol5: Give the feed retry buttons the outline sweep style now that legacy.css is gone c56addec5d

99puxwol5: Check in the button tests that legacy.css is gone and no stylesheet fades disabled buttons ec3421512f

calcazar added 3 commits 2026-10-20 09:43:21 -06:00

99puxwol5: Lift small crimson like counts to 4.5:1 contrast and darken meta on the light featured slide 583e287af6

99puxwol5: Show native video controls on trending cards only after the first play 7647d78550

99puxwol5: Reduce the Discover avatar stack overlap so each initial stays readable 260c419faa

calcazar added 1 commit 2026-10-20 09:47:58 -06:00

0k0zutujo: Add the design system section to the README and the redesign handoff b0685c212b

calcazar merged commit c4434198ad into develop

2026-10-20 09:48:48 -06:00