From 0ab52bcfe40cedcaa800707241e54ce50d6983bc Mon Sep 17 00:00:00 2001 From: Erik Silva Date: Sun, 7 Dec 2025 03:06:48 -0300 Subject: [PATCH] feat: institutional site dark mode --- README.md | 4 + frontend-aggios.app/app/globals.css | 62 +-- frontend-aggios.app/app/layout.tsx | 32 +- frontend-aggios.app/app/page.tsx | 490 +++++++++--------- .../components/ThemeToggle.tsx | 33 ++ frontend-aggios.app/package-lock.json | 210 +++----- frontend-aggios.app/package.json | 6 +- frontend-aggios.app/tailwind.config.js | 9 + 8 files changed, 410 insertions(+), 436 deletions(-) create mode 100644 frontend-aggios.app/components/ThemeToggle.tsx create mode 100644 frontend-aggios.app/tailwind.config.js diff --git a/README.md b/README.md index 1e874b5..50439dc 100644 --- a/README.md +++ b/README.md @@ -6,6 +6,10 @@ Aplicação Aggios Projeto em desenvolvimento. +### Atualização recente + +- 07/12/2025: Site institucional (`frontend-aggios.app`) atualizado com suporte completo a dark mode baseado em Tailwind CSS v4 e `next-themes`. + ## Como Usar Para configurar e executar o projeto, consulte a documentação em `docs/`. diff --git a/frontend-aggios.app/app/globals.css b/frontend-aggios.app/app/globals.css index 9363d23..66f8dbc 100644 --- a/frontend-aggios.app/app/globals.css +++ b/frontend-aggios.app/app/globals.css @@ -1,57 +1,49 @@ +@config "../tailwind.config.js"; @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Open+Sans:wght@400;600;700&family=Fira+Code:wght@400&display=swap'); @import url('https://cdn.jsdelivr.net/npm/remixicon@4.0.0/fonts/remixicon.css'); @import "tailwindcss"; -:root { - --background: #ffffff; - --foreground: #171717; +/* Configuração global */ +* { + @apply border-zinc-200 dark:border-zinc-800; +} - /* Design System Colors - Somente Gradientes */ - --gradient: linear-gradient(90deg, #FF3A05, #FF0080); - --gradient-text: linear-gradient(to right, #FF3A05, #FF0080); - --gradient-hover: linear-gradient(135deg, #FF3A05, #FF0080); - - /* Text Colors */ - --text-primary: #171717; - --text-secondary: #7D7D7D; - --text-light: #A3A3A3; - - /* UI Colors */ - --border: #E5E5E5; - --surface: #FAFAFA; - - /* Fonts */ - --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', Arial, sans-serif; - --font-heading: 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; - --font-mono: 'Fira Code', ui-monospace, SFMono-Regular, 'SF Mono', Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace; +html { + @apply antialiased; } body { - background: var(--background); - color: var(--foreground); - font-family: var(--font-sans); + @apply bg-white dark:bg-zinc-950 text-zinc-900 dark:text-zinc-100; + font-family: 'Inter', system-ui, sans-serif; scroll-behavior: smooth; + transition: background-color 0.3s ease, color 0.3s ease; } -/* Gradient text utility */ +.font-heading { + font-family: 'Open Sans', system-ui, sans-serif; +} + +.font-mono { + font-family: 'Fira Code', ui-monospace, monospace; +} + +/* Classes do design system - gradientes sempre visíveis */ .gradient-text { - background: var(--gradient-text); + background: linear-gradient(135deg, #FF3A05, #FF0080); -webkit-background-clip: text; - -webkit-text-fill-color: transparent; background-clip: text; + -webkit-text-fill-color: transparent; } -/* Gradient utilities */ -.gradient-bg { - background: var(--gradient); +.bg-linear-to-r { + background: linear-gradient(to right, #FF3A05, #FF0080); } -.gradient-hover-bg { - background: var(--gradient-hover); +.bg-linear-to-br { + background: linear-gradient(to bottom right, #FF3A05, #FF0080); } -/* Focus states */ +/* Estados de foco */ *:focus-visible { - outline: 2px solid #FF3A05; - outline-offset: 2px; + @apply outline-2 outline-offset-2 outline-orange-500; } \ No newline at end of file diff --git a/frontend-aggios.app/app/layout.tsx b/frontend-aggios.app/app/layout.tsx index f7fa87e..8c80ade 100644 --- a/frontend-aggios.app/app/layout.tsx +++ b/frontend-aggios.app/app/layout.tsx @@ -1,20 +1,16 @@ import type { Metadata } from "next"; -import { Geist, Geist_Mono } from "next/font/google"; import "./globals.css"; - -const geistSans = Geist({ - variable: "--font-geist-sans", - subsets: ["latin"], -}); - -const geistMono = Geist_Mono({ - variable: "--font-geist-mono", - subsets: ["latin"], -}); +import { ThemeProvider } from "next-themes"; export const metadata: Metadata = { - title: "Create Next App", - description: "Generated by create next app", + title: "Aggios - Plataforma de Gestão Financeira", + description: "A plataforma completa para gestão de agências e clientes. Controle financeiro, relatórios inteligentes e muito mais.", + keywords: "gestão financeira, agências, relatórios, dashboard, controle financeiro", + openGraph: { + title: "Aggios - Transforme sua gestão financeira", + description: "A plataforma completa para gestão de agências e clientes.", + type: "website", + }, }; export default function RootLayout({ @@ -23,11 +19,11 @@ export default function RootLayout({ children: React.ReactNode; }>) { return ( - - - {children} + + + + {children} + ); diff --git a/frontend-aggios.app/app/page.tsx b/frontend-aggios.app/app/page.tsx index 7c081b7..ae6f14d 100644 --- a/frontend-aggios.app/app/page.tsx +++ b/frontend-aggios.app/app/page.tsx @@ -1,28 +1,30 @@ import Image from "next/image"; import Link from "next/link"; +import ThemeToggle from "@/components/ThemeToggle"; export default function Home() { return ( <> {/* Header */} -
+
A
- aggios + aggios
- + + Entrar @@ -33,265 +35,267 @@ export default function Home() {
- {/* Hero Section */} -
-
-
-
- - - Plataforma de Gestão Financeira - -
+
+ {/* Hero Section */} +
+
+
+
+ + + Plataforma de Gestão Financeira + +
-

- Transforme sua
- gestão financeira -

+

+ Transforme sua
+ gestão financeira +

-

- A plataforma completa para gestão de agências e clientes. - Controle financeiro, relatórios inteligentes e muito mais. -

+

+ A plataforma completa para gestão de agências e clientes. + Controle financeiro, relatórios inteligentes e muito mais. +

-
- - - Começar Grátis - - - - Ver Demo - +
+ + + Começar Grátis + + + + Ver Demo + +
-
-
+
- {/* Features Section */} -
-
-
-

- Recursos que fazem a diferença -

-

- Ferramentas poderosas para simplificar sua gestão e impulsionar seus resultados. -

-
- -
-
-
- -
-

Dashboard Inteligente

-

Visualize todos os seus dados financeiros em tempo real com gráficos e métricas intuitivas.

+ {/* Features Section */} +
+
+
+

+ Recursos que fazem a diferença +

+

+ Ferramentas poderosas para simplificar sua gestão e impulsionar seus resultados. +

-
-
- -
-

Gestão de Clientes

-

Organize e acompanhe todos os seus clientes com informações detalhadas e histórico completo.

-
- -
-
- -
-

Relatórios Avançados

-

Gere relatórios detalhados e personalizados para tomar decisões mais assertivas.

-
- -
-
- -
-

Segurança Total

-

Seus dados protegidos com criptografia de ponta e backup automático na nuvem.

-
- -
-
- -
-

Acesso Mobile

-

Gerencie seu negócio de qualquer lugar com nossa plataforma responsiva e intuitiva.

-
- -
-
- -
-

Suporte 24/7

-

Conte com nossa equipe especializada sempre que precisar, em qualquer horário.

-
-
-
-
- - {/* Pricing Section */} -
-
-
-

- Planos para todos os tamanhos -

-

- Escolha o plano ideal para sua agência e comece a transformar sua gestão hoje mesmo. -

-
- -
- {/* Plano Básico */} -
-
-

Básico

-
- R$ 29 - /mês +
+
+
+
-

Perfeito para começar

+

Dashboard Inteligente

+

Visualize todos os seus dados financeiros em tempo real com gráficos e métricas intuitivas.

-
    -
  • - - Até 10 clientes -
    • -
  • - - Dashboard básico -
    • -
  • - - Relatórios mensais -
    • -
  • - - Suporte por email -
    • -
- - - Começar Grátis - -
- - {/* Plano Pro */} -
-
-
- - Mais Popular +
+
+
-

Pro

-
- R$ 79 - /mês -
-

Para agências em crescimento

+

Gestão de Clientes

+

Organize e acompanhe todos os seus clientes com informações detalhadas e histórico completo.

-
    -
  • - - Até 100 clientes -
    • -
  • - - Dashboard completo -
    • -
  • - - Relatórios ilimitados -
    • -
  • - - Suporte prioritário -
    • -
  • - - API integrations -
    • -
- - - Começar Agora - -
- - {/* Plano Enterprise */} -
-
-

Enterprise

-
- R$ 199 - /mês +
+
+
-

Para grandes agências

+

Relatórios Avançados

+

Gere relatórios detalhados e personalizados para tomar decisões mais assertivas.

-
    -
  • - - Clientes ilimitados -
    • -
  • - - Dashboard personalizado -
    • -
  • - - Relatórios avançados -
    • -
  • - - Suporte dedicado -
    • -
  • - - White label -
    • -
+
+
+ +
+

Segurança Total

+

Seus dados protegidos com criptografia de ponta e backup automático na nuvem.

+
- - Falar com Vendas - +
+
+ +
+

Acesso Mobile

+

Gerencie seu negócio de qualquer lugar com nossa plataforma responsiva e intuitiva.

+
+ +
+
+ +
+

Suporte 24/7

+

Conte com nossa equipe especializada sempre que precisar, em qualquer horário.

+
-
-
+ - {/* CTA Section */} -
-
-
-

- Pronto para começar? -

-

- Junte-se a centenas de agências que já transformaram sua gestão com a Aggios. -

+ {/* Pricing Section */} +
+
+
+

+ Planos para todos os tamanhos +

+

+ Escolha o plano ideal para sua agência e comece a transformar sua gestão hoje mesmo. +

+
-
- - - Começar Grátis Agora - - - - Falar com Especialista - +
+ {/* Plano Básico */} +
+
+

Básico

+
+ R$ 29 + /mês +
+

Perfeito para começar

+
+ +
    +
  • + + Até 10 clientes +
    • +
  • + + Dashboard básico +
    • +
  • + + Relatórios mensais +
    • +
  • + + Suporte por email +
    • +
+ + + Começar Grátis + +
+ + {/* Plano Pro */} +
+
+
+ + Mais Popular +
+

Pro

+
+ R$ 79 + /mês +
+

Para agências em crescimento

+
+ +
    +
  • + + Até 100 clientes +
    • +
  • + + Dashboard completo +
    • +
  • + + Relatórios ilimitados +
    • +
  • + + Suporte prioritário +
    • +
  • + + API integrations +
    • +
+ + + Começar Agora + +
+ + {/* Plano Enterprise */} +
+
+

Enterprise

+
+ R$ 199 + /mês +
+

Para grandes agências

+
+ +
    +
  • + + Clientes ilimitados +
    • +
  • + + Dashboard personalizado +
    • +
  • + + Relatórios avançados +
    • +
  • + + Suporte dedicado +
    • +
  • + + White label +
    • +
+ + + Falar com Vendas + +
-
-
+
+ + {/* CTA Section */} +
+
+
+

+ Pronto para começar? +

+

+ Junte-se a centenas de agências que já transformaram sua gestão com a Aggios. +

+ +
+ + + Começar Grátis Agora + + + + Falar com Especialista + +
+
+
+
+ {/* Footer */} -