Skip to content

fix(ui): troca text-rendering pra optimizeLegibility - #38

Merged
johnenderson merged 3 commits into
mainfrom
fix/me-preference-cards-height
Aug 29, 2026
Merged

fix(ui): troca text-rendering pra optimizeLegibility#38
johnenderson merged 3 commits into
mainfrom
fix/me-preference-cards-height

Conversation

@johnenderson

Copy link
Copy Markdown
Owner

Summary

Continuacao do PR #37 (ja mergeado antes deste commit ser pushado).

text-rendering: geometricPrecision no body deixava o texto com aparencia
borrada em navegadores Chromium — mais perceptivel em texto pequeno/baixo
contraste (ex: descricoes dos cards em text-site-body-muted, 11-14px).
Troca pra optimizeLegibility, que mantem o kerning bom sem esse efeito.

Test plan

  • getComputedStyle(document.body).textRendering confirmado como optimizelegibility no preview
  • yarn prettier --check styles/globals.css limpo (sem stylelint configurado no projeto)

geometricPrecision deixa o texto com aparencia borrada em navegadores
Chromium, mais perceptivel em texto pequeno/baixo contraste (ex:
descricoes dos cards em text-site-body-muted). optimizeLegibility
mantem o kerning bom sem esse efeito.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
@vercel

vercel Bot commented Aug 29, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
ojohn.dev Ready Ready Preview Aug 29, 2026 11:36pm

- Blocos html.light que so redeclaravam a mesma custom property que
  ja muda de valor sozinha via :root/html.light (navbar, prefs-panel,
  body, article h2/h3/blockquote, hovers de link de heading, code
  block do artigo) - zero diferenca de renderizacao, confirmado via
  toggle de tema real no preview
- a.link: classe morta (sem nenhum uso em src/app/content), cor
  hardcoded em white que quebraria o tema claro se algum dia fosse
  usada

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
.interactive-card, .interactive-row e .about-tag mantinham
will-change: transform o tempo todo, mesmo sem interacao - forcando
uma camada de composicao permanente em cada elemento com essas
classes. Como sao usadas em listas longas (jogos, artistas, repos,
tags), isso desperdicava GPU/memoria a toa. Move a declaracao pra
dentro do :hover/:focus-within, que e quando a transform de fato
acontece.

Deixei de fora os !important em .content pre/pre code - confirmei que
sao necessarios pra sobrepor os estilos inline que o Shiki injeta no
HTML do syntax highlighting.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
@johnenderson
johnenderson merged commit ac031f3 into main Aug 29, 2026
4 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant