Otimizações específicas para melhorar UX em dispositivos iOS: VIEWPORT & SAFE AREAS: - viewport-fit=cover para suporte a notch/Dynamic Island - user-scalable=no para prevenir zoom acidental - Safe area insets em body, navbar e modais - @supports padding: max() para compatibilidade TOUCH TARGETS (Apple HIG): - Botões mínimos 44x44px - touch-action: manipulation (desabilita zoom duplo-toque) - tap-highlight otimizado (azul translúcido) INPUTS & FORMS: - font-size 16px para prevenir zoom automático no iOS - -webkit-appearance: none (reset iOS) - border-radius fixo (iOS reseta) SCROLL & PERFORMANCE: - overscroll-behavior-y: none (sem bounce) - -webkit-overflow-scrolling: touch (scroll suave) - Dropdowns com max-height e touch scrolling MEDIA QUERIES: - @media (max-width: 430px) - iPhone 14 Pro Max e menores - @media (max-height: 430px) - Landscape mode - Ajustes de fonte: 10pt base em telas pequenas - Padding/margins reduzidos - Canvas: 250px (portrait) / 180px (landscape) PWA: - @media (display-mode: standalone) - Remove bounce quando instalado Deploy: frontend/dist deployed to 213.165.93.60
49 lines
2.3 KiB
HTML
49 lines
2.3 KiB
HTML
<!doctype html>
|
|
<html lang="pt-BR">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover" />
|
|
|
|
<!-- Favicon -->
|
|
<link rel="icon" type="image/x-icon" href="/favicon.ico" />
|
|
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png" />
|
|
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png" />
|
|
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png" />
|
|
|
|
<!-- PWA Meta Tags -->
|
|
<link rel="manifest" href="/manifest.json" />
|
|
<meta name="theme-color" content="#1a365d" />
|
|
<meta name="mobile-web-app-capable" content="yes" />
|
|
|
|
<!-- iOS PWA Meta Tags -->
|
|
<meta name="apple-mobile-web-app-capable" content="yes" />
|
|
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
|
|
<meta name="apple-mobile-web-app-title" content="WebMoney" />
|
|
<meta name="format-detection" content="telephone=no" />
|
|
|
|
<!-- SEO Meta Tags -->
|
|
<meta name="description" content="WebMoney - Sistema de Gestão Financeira Pessoal. Controle suas finanças, gerencie contas, categorize transações e acompanhe seus gastos de forma inteligente." />
|
|
<meta name="keywords" content="gestão financeira, finanças pessoais, controle de gastos, orçamento, contas, transações" />
|
|
<meta name="author" content="WebMoney" />
|
|
|
|
<!-- Open Graph / Social Media -->
|
|
<meta property="og:type" content="website" />
|
|
<meta property="og:title" content="WebMoney - Gestão Financeira Pessoal" />
|
|
<meta property="og:description" content="Controle suas finanças de forma inteligente com o WebMoney." />
|
|
<meta property="og:image" content="/logo-512.png" />
|
|
<meta property="og:url" content="https://webmoney.cnxifly.com" />
|
|
|
|
<!-- Twitter Card -->
|
|
<meta name="twitter:card" content="summary_large_image" />
|
|
<meta name="twitter:title" content="WebMoney - Gestão Financeira Pessoal" />
|
|
<meta name="twitter:description" content="Controle suas finanças de forma inteligente com o WebMoney." />
|
|
<meta name="twitter:image" content="/logo-512.png" />
|
|
|
|
<title>WebMoney - Gestão Financeira</title>
|
|
</head>
|
|
<body>
|
|
<div id="root"></div>
|
|
<script type="module" src="/src/main.jsx"></script>
|
|
</body>
|
|
</html>
|