From 8480868059252da5e55a83c2e4e489ef3b92af2a Mon Sep 17 00:00:00 2001 From: Francisco Solla Date: Sat, 19 Sep 2026 01:03:48 -0300 Subject: [PATCH] chore(S16,S17,S18): formata artefatos ui-design (prettier) para o gate --- ...-time-de-voce-escala-cabeca-ui-design.html | 79 +++++++++----- ...me-de-voce-harmonizar-cores-ui-design.html | 99 +++++++++-------- ...s-time-de-voce-nomes-longos-ui-design.html | 103 +++++++++--------- 3 files changed, 156 insertions(+), 125 deletions(-) diff --git a/docs/plans/cards-time-de-voce-escala-cabeca-ui-design.html b/docs/plans/cards-time-de-voce-escala-cabeca-ui-design.html index 6c232f48..34935306 100644 --- a/docs/plans/cards-time-de-voce-escala-cabeca-ui-design.html +++ b/docs/plans/cards-time-de-voce-escala-cabeca-ui-design.html @@ -175,12 +175,12 @@

O enquadramento automático passa a mirar a proporção da cabeça: a cabeça do visitante fica na mesma ordem de grandeza das cabeças dos candidatos (±20%), medida pela mesma régua nos - dois lados. Sem controle novo; arrastar e zoom seguem como escape. Sem rosto detectado, vale - o enquadramento de hoje — sem erro visível. + dois lados. Sem controle novo; arrastar e zoom seguem como escape. Sem rosto detectado, + vale o enquadramento de hoje — sem erro visível.

- DEGRADED: este design não está certificado. É insumo para decisão humana no - gate/PR — o tier degradado nunca aprova. + DEGRADED: este design não está certificado. É insumo para decisão humana + no gate/PR — o tier degradado nunca aprova.

-
+
@@ -248,7 +250,9 @@
-
+
@@ -287,7 +291,9 @@
-
+
@@ -335,15 +341,17 @@

A medida é a mesma dos dois lados: a caixa do rosto. A referência dos candidatos é medida - uma vez sobre a arte-mestre e vira constante; a do visitante é medida na foto no momento do - recorte. O alvo é a mesma ordem de grandeza, ±20%. + uma vez sobre a arte-mestre e vira constante; a do visitante é medida na foto no momento + do recorte. O alvo é a mesma ordem de grandeza, ±20%.

-
+
@@ -354,13 +362,17 @@ >
-
+
Referência medida uma vez na arte-mestre (aprox. ilustrativa).
-
+
@@ -385,15 +397,21 @@ >
-
+
Mesma caixa, medida na foto do visitante; igual em ordem de grandeza.
-
    +
    • Em foto com mais de um rosto, vale o maior rosto (o do visitante).
    • O rosto nunca é cortado pelo enquadramento proporcional.
      • -
    • Cobertura da janela prevalece: sem buraco no card, mesmo que limite a proporção.
      • +
    • + Cobertura da janela prevalece: sem buraco no card, mesmo que limite a proporção. +
    • A medida é feita no recorte; arrastar/zoom não re-medem nem re-enquadram.
@@ -406,8 +424,8 @@

Sem rosto detectado, com detecção indisponível ou em qualquer falha, vale exatamente o - enquadramento de hoje (pelo contorno da foto): nenhum aviso, nenhum erro, nenhum bloqueio. O - único erro recuperável continua sendo o do recorte de fundo. + enquadramento de hoje (pelo contorno da foto): nenhum aviso, nenhum erro, nenhum bloqueio. + O único erro recuperável continua sendo o do recorte de fundo.

- +
@@ -534,9 +554,9 @@ class="mt-4 rounded-xl border border-zinc-700 bg-zinc-900 p-5 text-xs leading-6 text-zinc-300" >

- [foto escolhida] → [recorte no aparelho: progresso | erro + retry] → [rosto medido?] — sim - → [zoom p/ cabeça a ±20% da cabeça dos candidatos] · não → [enquadramento de hoje, pelo - contorno] → [prévia (arrastar/zoom como escape)] → [baixar PNG] + [foto escolhida] → [recorte no aparelho: progresso | erro + retry] → [rosto medido?] — + sim → [zoom p/ cabeça a ±20% da cabeça dos candidatos] · não → [enquadramento de hoje, + pelo contorno] → [prévia (arrastar/zoom como escape)] → [baixar PNG]

@@ -582,17 +602,18 @@

Em aberto (validar com produto): referência dos - candidatos como constante medida uma vez vs medida em runtime; só automático com fallback vs - toggle; detector (caixa do rosto vs malha facial). + candidatos como constante medida uma vez vs medida em runtime; só automático com fallback + vs toggle; detector (caixa do rosto vs malha facial).

- NEEDS ASSET: foto real do visitante (com e sem rosto) - para validar a proporção; aqui usamos silhueta cinza. A arte oficial dos candidatos é real. + NEEDS ASSET: foto real do visitante (com e sem + rosto) para validar a proporção; aqui usamos silhueta cinza. A arte oficial dos candidatos + é real.

Ilustração: as caixas da régua e as escalas dos - placeholders são aproximações para comunicar a intenção — a métrica final é a caixa do rosto - medida pelo detector, com tolerância ±20% e cobertura sempre prevalecendo. + placeholders são aproximações para comunicar a intenção — a métrica final é a caixa do + rosto medida pelo detector, com tolerância ±20% e cobertura sempre prevalecendo.

diff --git a/docs/plans/cards-time-de-voce-harmonizar-cores-ui-design.html b/docs/plans/cards-time-de-voce-harmonizar-cores-ui-design.html index ff16452c..36a60c82 100644 --- a/docs/plans/cards-time-de-voce-harmonizar-cores-ui-design.html +++ b/docs/plans/cards-time-de-voce-harmonizar-cores-ui-design.html @@ -224,13 +224,14 @@ Card “Time de você”: harmonizar as cores da foto

- No estado em que a foto já está pronta, um único controle binário ajusta brilho, contraste e - saturação da selfie para o tom das fotos oficiais dos candidatos. Padrão LIGADO; desligar - devolve a original na hora; vale para a prévia e para o PNG; nada persiste e não há editor. + No estado em que a foto já está pronta, um único controle binário ajusta brilho, contraste + e saturação da selfie para o tom das fotos oficiais dos candidatos. Padrão LIGADO; + desligar devolve a original na hora; vale para a prévia e para o PNG; nada persiste e não + há editor.

- DEGRADED: este design não está certificado. É insumo para decisão humana no - gate/PR — o tier degradado nunca aprova. + DEGRADED: este design não está certificado. É insumo para decisão humana + no gate/PR — o tier degradado nunca aprova.

390px · mobile - alvo ≥ 44px + alvo ≥ 44px padrão LIGADO @@ -254,8 +253,8 @@ Cena 1 · Estado pronto · dialog desktop 1280 — “Harmonizar cores” LIGADO (padrão)

- O controle entra depois do ajuste fino e antes de “Trocar foto”, com ajuda curta em pt-BR e - alvo ≥ 44px. No estado ligado, a prévia já abre harmonizada. + O controle entra depois do ajuste fino e antes de “Trocar foto”, com ajuda curta em pt-BR + e alvo ≥ 44px. No estado ligado, a prévia já abre harmonizada.

- + - +

Ajuste fino

@@ -355,7 +344,9 @@ - +
@@ -513,7 +504,9 @@ - +
@@ -579,8 +572,8 @@ Cena 3 · Estado pronto · drawer mobile 390 — controle LIGADO

- No mobile o controle fica na mesma ordem do desktop e o alvo de toque cobre a linha inteira - (≥ 44px), sem depender de mirar no trilho. + No mobile o controle fica na mesma ordem do desktop e o alvo de toque cobre a linha + inteira (≥ 44px), sem depender de mirar no trilho.

Time de você

-

Confira seu card

+

+ Confira seu card +

Arraste a foto ou use os controles.

@@ -659,7 +654,9 @@ - +
  • - Ajuda: “Ajusta o brilho e as cores da sua foto - para combinar com as fotos do card.” + Ajuda: “Ajusta o brilho e as cores da sua + foto para combinar com as fotos do card.”
  • Alvo: a linha inteira é o botão, com altura mínima de 44px; funciona por toque e teclado, com foco visível.
  • - Semântica: binário ligado/desligado - (role="switch" + aria-checked); no port, usa o vocabulário - de toggle já existente no app (sem shadcn Switch). + Semântica: binário ligado/desligado (role="switch" + + aria-checked); no port, usa o vocabulário de toggle já existente no + app (sem shadcn Switch).
  • Estados: LIGADO (trilho @@ -763,16 +762,18 @@ Cena 4 · Antes / depois da prévia — a escolha refletida

    - Mesmo recorte, mesmo enquadramento, mesma prévia: só o ajuste de brilho/contraste/saturação - muda. A foto do visitante é um placeholder cinza (NEEDS ASSET) — nenhuma foto real de - terceiro é simulada. + Mesmo recorte, mesmo enquadramento, mesma prévia: só o ajuste de + brilho/contraste/saturação muda. A foto do visitante é um placeholder cinza (NEEDS ASSET) + — nenhuma foto real de terceiro é simulada.

    -
    +
    @@ -815,7 +816,9 @@
    -
    +
    @@ -860,8 +863,7 @@

    NEEDS ASSET: foto real do visitante para validar o ajuste no lugar do - placeholder cinza. A referência de tom é a arte oficial - team-card-base.png. + placeholder cinza. A referência de tom é a arte oficial team-card-base.png.

    @@ -879,7 +881,9 @@
  • Desligar devolve a foto original instantaneamente; religar reaplica.
  • A escolha vale para a prévia e para o PNG baixado.
  • 100% no aparelho: sem upload, sem rede, sem analytics de PII.
    • -
  • Ajuste suave e limitado ao tom das fotos oficiais (brilho, contraste, saturação).
    • +
  • + Ajuste suave e limitado ao tom das fotos oficiais (brilho, contraste, saturação). +
  • Fica só no modelo time-de-voce.
  • A nota de privacidade existente continua visível e verdadeira.
    • @@ -906,17 +910,18 @@

    Copys literais do plano: rótulo “Harmonizar cores”; - ajuda “Ajusta o brilho e as cores da sua foto para combinar com as fotos do card.”; nota de - privacidade inalterada (CARD_PHOTO_PRIVACY_NOTE). + ajuda “Ajusta o brilho e as cores da sua foto para combinar com as fotos do card.”; nota + de privacidade inalterada (CARD_PHOTO_PRIVACY_NOTE).

    Em aberto (validar com produto): referência de tom - medida na arte-mestre vs perfil fixo; controle só no estado pronto vs também antes da foto. + medida na arte-mestre vs perfil fixo; controle só no estado pronto vs também antes da + foto.

    - Nota de justiça visual: os tons antes/depois aqui são - uma ilustração sobre placeholder cinza; o ajuste real é automático e calibrado contra a - arte-mestre, sem preview de número. + Nota de justiça visual: os tons antes/depois aqui + são uma ilustração sobre placeholder cinza; o ajuste real é automático e calibrado contra + a arte-mestre, sem preview de número.

    diff --git a/docs/plans/cards-time-de-voce-nomes-longos-ui-design.html b/docs/plans/cards-time-de-voce-nomes-longos-ui-design.html index ff8a1edc..dda60780 100644 --- a/docs/plans/cards-time-de-voce-nomes-longos-ui-design.html +++ b/docs/plans/cards-time-de-voce-nomes-longos-ui-design.html @@ -164,15 +164,15 @@ Card “Time de você”: nomes longos cabendo no banner

    - Militante no celular com nome composto digita o nome inteiro e o banner azul se alarga - apenas o necessário a partir da referência 509, agora até o teto de 1000 (antes 660; ≈40 px - de margem em cada lado do card), sem nunca cruzar o topo da janela da foto. Acima do teto, a - pessoa recebe a mesma mensagem de nome curto de hoje e o CTA segue desabilitado. Nenhum passo - novo, nenhuma decisão nova. + Militante no celular com nome composto digita o nome inteiro e o banner azul se alarga + apenas o necessário a partir da referência 509, agora até o teto de 1000 (antes 660; ≈40 + px de margem em cada lado do card), sem nunca cruzar o topo da janela da foto. Acima do + teto, a pessoa recebe a mesma mensagem de nome curto de hoje e o CTA segue desabilitado. + Nenhum passo novo, nenhuma decisão nova.

    - DEGRADED: este design não está certificado. É insumo para decisão humana no - gate/PR — o tier degradado nunca aprova. + DEGRADED: este design não está certificado. É insumo para decisão humana + no gate/PR — o tier degradado nunca aprova.

    - Centro, y, altura e rotação do banner azul permanecem os do S15; só a largura entra. No teto - (largura 1000) o canto mais baixo fica em ≈436, ~3 px acima do topo da janela da foto + Centro, y, altura e rotação do banner azul permanecem os do S15; só a largura entra. No + teto (largura 1000) o canto mais baixo fica em ≈436, ~3 px acima do topo da janela da foto (y=439) — encosta sem cruzar.

    @@ -259,10 +259,10 @@
    Largura dinâmica
    - referência 509 quando o nome cabe nela (tinta - ≤ 470); alarga só o necessário até o teto - 1000 (≈40 px de margem de cada lado); centro - mantido em 545. + referência 509 quando o nome cabe nela + (tinta ≤ 470); alarga só o necessário até o + teto 1000 (≈40 px de margem de cada lado); + centro mantido em 545.
    @@ -287,8 +287,8 @@
    - Banner vermelho intocado: 693×118, centro - (545, 162), −3,5°, fill #E50E2F, texto #FFEC01 — as cores do S15 seguem literais. O azul + Banner vermelho intocado: 693×118, centro (545, + 162), −3,5°, fill #E50E2F, texto #FFEC01 — as cores do S15 seguem literais. O azul agora pode ultrapassar o vermelho (teto 1000 > 693). Teto 1000 e cap mínimo 40: decisão do humano no gate (2026-09-19).
    @@ -302,10 +302,10 @@ Cena 2 · Alargamento do banner — referência 509 → teto 1000 · desktop 1280

    - ANA encosta na referência e pede só 566; MARIA, FULANO, MARIA CLARA, MARIA EDUARDA e MARIA DA - CONCEIÇÃO alargam conforme o nome, encostando no teto 1000. O cap desce até o mínimo legível - 40; abaixo disso o banner não é desenhado e a mensagem pede um nome mais curto. Nunca há corte - silencioso. + ANA encosta na referência e pede só 566; MARIA, FULANO, MARIA CLARA, MARIA EDUARDA e MARIA + DA CONCEIÇÃO alargam conforme o nome, encostando no teto 1000. O cap desce até o mínimo + legível 40; abaixo disso o banner não é desenhado e a mensagem pede um nome mais curto. + Nunca há corte silencioso.

    -
    +

    - Seu nome e sua foto são processados apenas no seu aparelho e não são enviados para nós. + Seu nome e sua foto são processados apenas no seu aparelho e não são enviados para + nós.