3 publicações com a etiqueta "ui"

Dia pesado: 25 PRs no front-web-base cobrindo um empurrão grande de performance (CSS, ícones, modal), refatoração do header secundário com gating de rota, novas features de cassino e pagamentos, e ajustes finos de SEO/mobile/auth. Plus 4 mudanças de CI/CD em front-ops pra suportar o novo modelo de cache por device/country/buildId.

Performance — empurrão grande​

• Drop important: true do Tailwind (tailwind.config.js). Removido globalmente — precedência CSS volta ao normal (inline style vence class). Resultado: CSS −23,5KB raw (−14,4%). Componentes que usavam o pattern condicional bgStyle ? "" : "bg-..." (omitir classe quando havia inline style) foram simplificados — agora basta sempre emitir a classe que o style inline sobrescreve quando presente. Atualizados: GameCardStacked, GameStats, GameWinners, MainLeaguesSquare, SidebarButtonsGradient, SidebarButtonsGrid.
• Migração react-modal-sheet → vaul (app/components/base/Modal.tsx). Modal chunk caiu de ~158KB pra ~65KB raw — −93KB (−59%). Mesma API externa, drop-in pelos consumers. (PR #405 fez ajustes finos depois pra resolver bugs de input-focus em mobile e espaço fantasma no footer.)
• Remoção do @tailwindcss/typography. Plugin não justificava o custo — uso restrito a 4 lugares (FaqSingleContent, WpPostContent, page.$slug, vip/levels) substituído por classes utilitárias inline. package.json enxuga uma dep + 22 linhas de pnpm-lock.yaml.
• Ícones direct-imports + lazy MainLeagues (app/widgets/home-leagues/). Drop do registry intermediário — agora cada componente faz import Icon from "~icons/<set>/<name>" direto. MainLeaguesSquare virou lazy chunk separado. 25 arquivos tocados, −564 linhas vs +454. Atualiza configs de home-leagues em 7 brands (7k-bet-br, cassino-bet-br, fi-7k-bet, ng-7k-bet, pb-bet, vera-bet-br, state77-com, x2b-bet).
• CI Lighthouse manual (.github/workflows/lighthouse.yml). Workflow caller dispatchável via workflow_dispatch pra rodar Lighthouse on-demand contra preview/prod sem precisar de schedule fixo. Útil pra validar PRs pesados de UI antes de mergear.

Jogos​

• Modal fullscreen para o player de jogos no mobile: ao clicar em Jogar, o jogo abre em tela cheia com header próprio (botão voltar e botão Depositar)
• Detecção de dispositivo móvel no GameIframe para ajustar comportamento de exibição
• Carrossel de jogos relacionados atualizado com setas de navegação e link "Ver todos"
• Carrossel de provedores adicionado na página de detalhe do jogo
• Grid de jogos ajustado para 3 colunas com espaçamento mais compacto
• Deduplicação de jogos no cache para evitar itens repetidos nas linhas
• Chaves de componentes migradas de game.id para game.slug para maior consistência
• Ajuste no fallback de estatísticas: API pode retornar objeto com valores zerados, agora verificado corretamente antes de cair no mock

i18n — Suporte multi-idioma completo​

O maior entregável do dia: infraestrutura de internacionalização integrada em toda a plataforma.

• Adicionada infraestrutura base de i18n com i18next e react-i18next, incluindo alias ~i18n no Vite para seleção de idioma em tempo de build e constante __BRAND_LANGUAGE__
• Criados contextos CountryProvider (hook useCountry) e TranslationProvider com suporte a overrides por fork
• Migrados componentes de layout (Header, Sidebar, MobileBottomNav, Footer) para usar t() em todos os textos
• Migrados modais de autenticação (Login e Registro) com tipo de documento dinâmico por país (CPF/RUT/CURP)
• Migrados componentes de pagamento (Depósito, Saque, Cupom, Pix, resultados) para t() com locale dinâmico via useCountry().intlLocale
• Migrados steps de validação KYC (documentos, endereço, limites, termos, telefone, e-mail, senha) com símbolo de moeda e tipo de doc por país
• Migrada área do usuário (conta, carteira, proteção, segurança) com 26 labels de status antes hardcoded em PT-BR
• Migrados jogos, widgets da home e busca (títulos de seção, filtros, contagens, mensagens de resultado vazio)
• Migrados componentes de gamificação e rotas VIP (torneios, missões, loja, níveis, badges, bônus)
• Adicionados i18nKey nos arquivos de configuração de navegação (header, sidebar, bottomnav, menu horizontal, account-menu)
• Substituídas strings PT-BR hardcoded remanescentes por chamadas t() em validação, senha, sidebar e busca