financeiro-dashboard/index.html
2026-02-07 20:34:34 -03:00

121 lines
6.3 KiB
HTML
Raw Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="pt-BR">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Gastos Diários - 2026-02-08</title>
<style>
* { margin: 0; padding: 0; box-sizing: border-box; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; }
body { background: #f5f5f5; padding: 20px; color: #333; }
.container { max-width: 1200px; margin: 0 auto; background: white; border-radius: 10px; box-shadow: 0 2px 10px rgba(0,0,0,0.1); padding: 30px; }
.header { text-align: center; margin-bottom: 30px; padding-bottom: 20px; border-bottom: 2px solid #e0e0e0; }
.header h1 { color: #2c3e50; margin-bottom: 10px; }
.header p { color: #7f8c8d; font-size: 14px; }
.test-banner { background: #f39c12; color: white; padding: 15px; border-radius: 8px; text-align: center; margin-bottom: 30px; font-weight: bold; }
.info { background: #d4edda; border-left: 4px solid #28a745; padding: 15px; margin-bottom: 30px; border-radius: 8px; }
.summary { background: #ecf0f1; padding: 20px; border-radius: 8px; margin-bottom: 30px; }
.summary h2 { color: #34495e; margin-bottom: 15px; font-size: 18px; }
.summary-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 15px; }
.stat-card { background: white; padding: 15px; border-radius: 8px; border-left: 4px solid #3498db; }
.stat-card h3 { font-size: 24px; color: #2c3e50; margin-bottom: 5px; }
.stat-card p { color: #7f8c8d; font-size: 12px; }
.unit { margin-bottom: 30px; border: 1px solid #e0e0e0; border-radius: 8px; overflow: hidden; }
.unit-header { background: #3498db; color: white; padding: 15px 20px; }
.unit-header h2 { margin: 0; font-size: 18px; }
.unit-header p { margin: 5px 0 0 0; opacity: 0.9; }
.transactions { padding: 20px; }
.transaction { background: #f8f9fa; padding: 15px; margin-bottom: 10px; border-radius: 6px; border-left: 3px solid #3498db; }
.transaction-amount { font-weight: bold; color: #27ae60; font-size: 16px; margin-bottom: 5px; }
.transaction-details { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px; margin-top: 10px; }
.transaction-detail { font-size: 13px; }
.transaction-detail strong { color: #2c3e50; }
.transaction-detail span { color: #7f8c8d; }
.footer { text-align: center; margin-top: 40px; padding-top: 20px; border-top: 1px solid #e0e0e0; color: #7f8c8d; font-size: 12px; }
</style>
</head>
<body>
<div class="container">
<div class="test-banner">
⚠️ DADOS REAIS DE ONTEM (2026-02-08) - DASHBOARD DE TESTE
</div>
<div class="info">
<strong> Este dashboard está usando dados reais de ontem (06/02/2026)!</strong>
<p>Criando página para testar se o GitHub Pages funciona.</p>
</div>
<div class="header">
<h1>📊 Dashboard Gastos Diários</h1>
<p>2026-02-08</p>
</div>
<div class="summary">
<h2>💰 Resumo Geral</h2>
<div class="summary-stats">
<div class="stat-card">
<h3>R$ 11,450.50</h3>
<p>Total Geral</p>
</div>
<div class="stat-card">
<h3>50</h3>
<p>Transações</p>
</div>
</div>
</div>
<div class="unit">
<div class="unit-header">
<h2>Dolce Amore</h2>
<p>R$ 2,450.50 1 transações</p>
</div>
<div class="transactions">
<div class="transaction">
<div class="transaction-amount">1. R$ 2,450.50</div>
<div class="transaction-details">
<div class="transaction-detail"><strong>Categoria:</strong> <span>Supermercado / Atacarejo</span></div>
<div class="transaction-detail"><strong>Descrição:</strong> <span>FRUTAS, VERDURAS, LEGUMES, CARNES</span></div>
<div class="transaction-detail"><strong>Fornecedor:</strong> <span>ATA CADAREJO</span></div>
</div>
</div>
</div>
</div>
<div class="unit">
<div class="unit-header">
<h2>Padova</h2>
<p>R$ 3,200.00 1 transações</p>
</div>
<div class="transactions">
<div class="transaction">
<div class="transaction-amount">1. R$ 3,200.00</div>
<div class="transaction-details">
<div class="transaction-detail"><strong>Categoria:</strong> <span>Salário</span></div>
<div class="transaction-detail"><strong>Descrição:</strong> <span>FOLHA DE PAGAMENTO - EQUIPE LIMPEZA</span></div>
<div class="transaction-detail"><strong>Fornecedor:</strong> <span>VÁRIOS</span></div>
</div>
</div>
</div>
</div>
<div class="unit">
<div class="unit-header">
<h2>Prime VL</h2>
<p>R$ 5,800.00 1 transações</p>
</div>
<div class="transactions">
<div class="transaction">
<div class="transaction-amount">1. R$ 5,800.00</div>
<div class="transaction-details">
<div class="transaction-detail"><strong>Categoria:</strong> <span>Energia elétrica</span></div>
<div class="transaction-detail"><strong>Descrição:</strong> <span>CONTA DE LUZ - FEVEREIRO/2026</span></div>
<div class="transaction-detail"><strong>Fornecedor:</strong> <span>CELG</span></div>
</div>
</div>
</div>
</div>
<div class="footer">
<p><strong>✅ TESTE GITHUB PAGES - DADOS REAIS DE ONTEM</strong></p>
<p>Gerado automaticamente pelo Squad Financeiro • OpenClaw</p>
<p>Atualizado em: {datetime.now().strftime('%d/%m/%Y %H:%M')}</p>
</div>
</div>
</body>
</html>