refactor: reorganiza projeto em legacy/ apos remocao de login
- Move paginas de auth (signin, signup, nextauth) para legacy/auth/ - Move Landing Page para legacy/landing/ - Move dashboard.jsx.bak para legacy/ - Adiciona README documentando backup e deps necessarias - Nenhuma rota ativa depende de NextAuth; app abre direto no dashboard - Deps (next-auth, prisma-adapter, bcryptjs) mantidas para nao quebrar backup - Build Next.js validado (10 rotas, sem rotas de auth/landing)
This commit is contained in:
Carlos
@@ -0,0 +1,27 @@
|
||||
# Legacy / Backup
|
||||
|
||||
Esta pasta contém código **preservado** da fase de autenticação e da Landing Page.
|
||||
**Nenhum arquivo aqui participa do build do Next.js** (estão fora de `pages/`).
|
||||
|
||||
Mantido para reativação futura sem perda de histórico (conforme decisão de 2026-07-11).
|
||||
|
||||
## Estrutura
|
||||
- `legacy/auth/` → telas de login/cadastro e configuração NextAuth
|
||||
- `legacy/landing/` → Landing Page original (era a rota `/`)
|
||||
- `legacy/dashboard.jsx.bak` → cópia de `pages/dashboard.jsx` antes da remoção do `useSession`
|
||||
|
||||
## Dependências necessárias para reativar o auth
|
||||
Os arquivos em `legacy/auth/` importam:
|
||||
- `next-auth` ^4.24.0
|
||||
- `@next-auth/prisma-adapter` ^1.0.7
|
||||
- `bcryptjs` ^2.4.3
|
||||
- `@prisma/client` (já usado pelo app ativo)
|
||||
|
||||
> Estas dependências permanecem em `package.json` **exatamente para não quebrar este backup**.
|
||||
> Nenhuma rota ativa (fora de `legacy/`) as utiliza.
|
||||
|
||||
## Como reativar
|
||||
1. Mover `legacy/auth/*` de volta para `pages/` (ex.: `signin.jsx`, `signup.jsx`, `api/auth/[...nextauth].js`).
|
||||
2. Mover `legacy/landing/index.jsx` para `pages/index.jsx` (ou `pages/landing.jsx` + ajustar redirect).
|
||||
3. Restaurar `SessionProvider` em `pages/_app.jsx` e imports de `useSession` onde necessário.
|
||||
4. `npm install` (garante que as deps acima estão presentes) e `npm run build`.
|
||||
@@ -0,0 +1,9 @@
|
||||
# Auth Legacy
|
||||
|
||||
Arquivos preservados do fluxo de login (NextAuth):
|
||||
|
||||
- `signin.jsx` — tela de login; usa `signIn` de `next-auth/react`
|
||||
- `signup.jsx` — tela de cadastro; faz POST para `/api/auth/register`
|
||||
- `nextauth.js` — configuração do NextAuth (CredentialsProvider + Prisma + bcrypt)
|
||||
|
||||
Nenhum destes é compilado pelo Next.js enquanto estiver fora de `pages/`.
|
||||
@@ -0,0 +1,62 @@
|
||||
// API DE AUTENTICAÇÃO DESATIVADA TEMPORARIAMENTE (2026-07-11)
|
||||
// Arquivo PRESERVADO para reativação futura. Nenhum componente/chamada
|
||||
// ativa depende desta rota após a remoção do fluxo de login.
|
||||
import NextAuth from "next-auth"
|
||||
import CredentialsProvider from "next-auth/providers/credentials"
|
||||
import { PrismaClient } from "@prisma/client"
|
||||
import bcrypt from "bcryptjs"
|
||||
|
||||
const prisma = new PrismaClient()
|
||||
|
||||
export default NextAuth({
|
||||
providers: [
|
||||
CredentialsProvider({
|
||||
name: "Credentials",
|
||||
credentials: {
|
||||
username: { label: "Username", type: "text" },
|
||||
password: { label: "Password", type: "password" }
|
||||
},
|
||||
async authorize(credentials) {
|
||||
if (!credentials?.username || !credentials?.password) return null
|
||||
const user = await prisma.user.findUnique({
|
||||
where: { username: credentials.username }
|
||||
})
|
||||
if (!user) return null
|
||||
const isValid = await bcrypt.compare(credentials.password, user.password)
|
||||
if (!isValid) return null
|
||||
return {
|
||||
id: user.id,
|
||||
username: user.username,
|
||||
email: user.email,
|
||||
name: user.name,
|
||||
// optional: role, image, etc.
|
||||
}
|
||||
}
|
||||
})
|
||||
],
|
||||
secret: process.env.NEXTAUTH_SECRET,
|
||||
session: {
|
||||
strategy: "jwt",
|
||||
maxAge: 30 * 24 * 60 * 60 // 30 days
|
||||
},
|
||||
callbacks: {
|
||||
async jwt({ token, user }) {
|
||||
if (user) {
|
||||
token.id = user.id
|
||||
token.username = user.username
|
||||
token.email = user.email
|
||||
token.name = user.name
|
||||
}
|
||||
return token
|
||||
},
|
||||
async session({ session, token }) {
|
||||
if (token) {
|
||||
session.user.id = token.id
|
||||
session.user.username = token.username
|
||||
session.user.email = token.email
|
||||
session.user.name = token.name
|
||||
}
|
||||
return session
|
||||
}
|
||||
}
|
||||
})
|
||||
@@ -0,0 +1,87 @@
|
||||
// LOGIN DESATIVADO TEMPORARIAMENTE (2026-07-11)
|
||||
// Arquivo PRESERVADO para reativação futura. Nada neste app o referencia
|
||||
// ativamente (sem links, sem SessionProvider, sem getSession).
|
||||
import { useState } from "react"
|
||||
import { useRouter } from "next/router"
|
||||
import { signIn } from "next-auth/react"
|
||||
|
||||
export default function SignIn() {
|
||||
const [username, setUsername] = useState("")
|
||||
const [password, setPassword] = useState("")
|
||||
const [error, setError] = useState("")
|
||||
const [loading, setLoading] = useState(false)
|
||||
const router = useRouter()
|
||||
|
||||
const handleSubmit = async (e) => {
|
||||
e.preventDefault()
|
||||
setError("")
|
||||
setLoading(true)
|
||||
|
||||
try {
|
||||
const result = await signIn("credentials", {
|
||||
username,
|
||||
password,
|
||||
redirect: false,
|
||||
callbackUrl: "/dashboard"
|
||||
})
|
||||
|
||||
if (result?.ok) {
|
||||
router.push("/dashboard")
|
||||
router.refresh()
|
||||
} else {
|
||||
setError(result?.error || "Erro ao entrar")
|
||||
}
|
||||
} catch (err) {
|
||||
setError("Erro de conexão")
|
||||
} finally {
|
||||
setLoading(false)
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="min-h-screen bg-gray-50 flex items-center justify-center">
|
||||
<div className="bg-white p-8 rounded-lg shadow-md w-96">
|
||||
<h2 className="text-2xl font-bold mb-6">Entrar - 1000Apps</h2>
|
||||
|
||||
{error && (
|
||||
<div className="bg-red-100 text-red-700 p-3 rounded mb-4">
|
||||
{error}
|
||||
</div>
|
||||
)}
|
||||
|
||||
<form onSubmit={handleSubmit} className="space-y-4">
|
||||
<input
|
||||
type="text"
|
||||
placeholder="Nome de usuário"
|
||||
value={username}
|
||||
onChange={(e) => setUsername(e.target.value)}
|
||||
className="w-full p-2 border rounded"
|
||||
required
|
||||
/>
|
||||
<input
|
||||
type="password"
|
||||
placeholder="Senha"
|
||||
value={password}
|
||||
onChange={(e) => setPassword(e.target.value)}
|
||||
className="w-full p-2 border rounded"
|
||||
required
|
||||
/>
|
||||
<button
|
||||
type="submit"
|
||||
disabled={loading}
|
||||
className="w-full bg-blue-600 text-white py-2 rounded-lg disabled:opacity-50"
|
||||
>
|
||||
{loading ? "Entrando..." : "Entrar"}
|
||||
</button>
|
||||
</form>
|
||||
|
||||
<p className="text-center mt-4 text-sm">
|
||||
Não tem conta?{" "}
|
||||
<a href="/signup" className="text-blue-600 hover:underline">
|
||||
Cadastrar
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,104 @@
|
||||
// CADASTRO DESATIVADO TEMPORARIAMENTE (2026-07-11)
|
||||
// Arquivo PRESERVADO para reativação futura. Não há mais link ativo para cá.
|
||||
import { useState } from "react"
|
||||
import { useRouter } from "next/router"
|
||||
|
||||
export default function SignUp() {
|
||||
const [username, setUsername] = useState("")
|
||||
const [password, setPassword] = useState("")
|
||||
const [confirmPassword, setConfirmPassword] = useState("")
|
||||
const [error, setError] = useState("")
|
||||
const [loading, setLoading] = useState(false)
|
||||
const router = useRouter()
|
||||
|
||||
const handleSubmit = async (e) => {
|
||||
e.preventDefault()
|
||||
setError("")
|
||||
setLoading(true)
|
||||
try {
|
||||
if (password !== confirmPassword) {
|
||||
setError("Senhas não coincidem")
|
||||
return
|
||||
}
|
||||
|
||||
if (password.length < 6) {
|
||||
setError("Senha deve ter pelo menos 6 caracteres")
|
||||
return
|
||||
}
|
||||
|
||||
const res = await fetch("/api/auth/register", {
|
||||
method: "POST",
|
||||
headers: { "Content-Type": "application/json" },
|
||||
body: JSON.stringify({ username, password })
|
||||
})
|
||||
|
||||
const data = await res.json()
|
||||
|
||||
if (res.ok) {
|
||||
router.push("/signin")
|
||||
} else {
|
||||
setError(data.error || "Erro ao cadastrar")
|
||||
}
|
||||
} catch (err) {
|
||||
setError("Erro de conexão")
|
||||
} finally {
|
||||
setLoading(false)
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="min-h-screen bg-gray-50 flex items-center justify-center">
|
||||
<div className="bg-white p-8 rounded-lg shadow-md w-96">
|
||||
<h2 className="text-2xl font-bold mb-6">Cadastrar - 1000Apps</h2>
|
||||
|
||||
{error && (
|
||||
<div className="mb-4 bg-red-100 text-red-700 p-3 rounded">
|
||||
{error}
|
||||
</div>
|
||||
)}
|
||||
|
||||
<form onSubmit={handleSubmit} className="space-y-4">
|
||||
<input
|
||||
type="text"
|
||||
placeholder="Nome de usuário"
|
||||
className="w-full p-2 border rounded"
|
||||
value={username}
|
||||
onChange={(e) => setUsername(e.target.value)}
|
||||
required
|
||||
/>
|
||||
<input
|
||||
type="password"
|
||||
placeholder="Senha"
|
||||
className="w-full p-2 border rounded"
|
||||
value={password}
|
||||
onChange={(e) => setPassword(e.target.value)}
|
||||
required
|
||||
minLength={6}
|
||||
/>
|
||||
<input
|
||||
type="password"
|
||||
placeholder="Confirmar senha"
|
||||
className="w-full p-2 border rounded"
|
||||
value={confirmPassword}
|
||||
onChange={(e) => setConfirmPassword(e.target.value)}
|
||||
required
|
||||
/>
|
||||
<button
|
||||
type="submit"
|
||||
disabled={loading}
|
||||
className="w-full bg-green-600 text-white py-2 rounded-lg disabled:opacity-50"
|
||||
>
|
||||
{loading ? "Cadastrando..." : "Cadastrar"}
|
||||
</button>
|
||||
</form>
|
||||
|
||||
<p className="text-center mt-4 text-sm">
|
||||
Já tem conta?{" "}
|
||||
<a href="/signin" className="text-blue-600 hover:underline">
|
||||
Entrar
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,175 @@
|
||||
import { useSession, signOut } from "next-auth/react"
|
||||
import { useRouter } from "next/router"
|
||||
import { useState, useEffect } from "react"
|
||||
import AvatarSelector from "../components/AvatarSelector"
|
||||
import CategoryMenu from "../components/CategoryMenu"
|
||||
|
||||
// Apps organizados por categoria
|
||||
const ALL_APPS = [
|
||||
// Produtividade
|
||||
{ id: 1, name: "Tendências Semanais", desc: "Notícias em alta • Top 100", path: "/apps/trendsnews", icon: "📈", category: "produtividade", favorite: false },
|
||||
{ id: 2, name: "Conversor", desc: "Conversão de unidades", path: "/apps/converter", icon: "🔄", category: "produtividade", favorite: false },
|
||||
{ id: 3, name: "Calculadora", desc: "Calculos rápidos", path: "/apps/calculator", icon: "🧮", category: "produtividade", favorite: false },
|
||||
|
||||
// Utilidades
|
||||
{ id: 4, name: "Relógio", desc: "Relógio mundial", path: "/apps/clock", icon: "⏰", category: "utilidades", favorite: false },
|
||||
{ id: 5, name: "Gerador Senhas", desc: "Senhas seguras", path: "/apps/password-generator", icon: "🔐", category: "utilidades", favorite: false },
|
||||
{ id: 6, name: "QR Code", desc: "Gerador QR", path: "/apps/qrcode", icon: "📱", category: "utilidades", favorite: false },
|
||||
{ id: 7, name: "Cronômetro", desc: "Tempo e alarmes", path: "/apps/timer", icon: "⏱️", category: "utilidades", favorite: false },
|
||||
|
||||
// Games
|
||||
{ id: 8, name: "Jogo da Velha", desc: "Jogo da velha clássico 2 jogadores", path: "/apps/tictactoe", icon: "⭕", category: "games", favorite: false },
|
||||
{ id: 14, name: "Expedição Gold", path: "/apps/expedicao", icon: "🗺️", category: "games", desc: "Expedições para conquistar ouro" },
|
||||
{ id: 15, name: "Human City", path: "/apps/humancity", icon: "🏙️", category: "games", desc: "Simulação de cidade estilo Sims" },
|
||||
{ id: 16, name: "Aurea", path: "/apps/aurea", icon: "👑", category: "games", desc: "Simulador de vida e riqueza" },
|
||||
{ id: 17, name: "TerraVerse", path: "/apps/terraverse", icon: "🌍", category: "games", desc: "Game de realidade aumentada" },
|
||||
|
||||
// Ferramentas
|
||||
{ id: 9, name: "Editor Texto", desc: "Texto simples", path: "/apps/text-editor", icon: "📝", category: "ferramentas", favorite: false },
|
||||
{ id: 10, name: "Conversor Moedas", desc: "Câmbio em tempo real", path: "/apps/currency", icon: "💱", category: "ferramentas", favorite: false },
|
||||
|
||||
// Educação
|
||||
{ id: 11, name: "Dicionário", desc: "Significados", path: "/apps/dictionary", icon: "📖", category: "educacao", favorite: false },
|
||||
{ id: 12, name: "Tradutor", desc: "Multi-idiomas", path: "/apps/translator", icon: "🌐", category: "educacao", favorite: false },
|
||||
|
||||
// Esportes
|
||||
{ id: 13, name: "Copa do Mundo 2026", desc: "Tabela, grupos, notícias", path: "/apps/worldcup2026", icon: "⚽", category: "esportes", favorite: false }
|
||||
]
|
||||
|
||||
export default function Dashboard() {
|
||||
const { data: session } = useSession()
|
||||
const router = useRouter()
|
||||
const [selectedAvatar, setSelectedAvatar] = useState("😀")
|
||||
const [selectedCategory, setSelectedCategory] = useState("all")
|
||||
const [favorites, setFavorites] = useState([])
|
||||
const [apps, setApps] = useState(ALL_APPS)
|
||||
|
||||
// Carregar favoritos do localStorage
|
||||
useEffect(() => {
|
||||
const savedFavorites = localStorage.getItem("favorites")
|
||||
const savedAvatar = localStorage.getItem("selectedAvatar")
|
||||
if (savedFavorites) {
|
||||
setFavorites(JSON.parse(savedFavorites))
|
||||
}
|
||||
if (savedAvatar) {
|
||||
setSelectedAvatar(savedAvatar)
|
||||
}
|
||||
}, [])
|
||||
|
||||
// Salvar favoritos no localStorage
|
||||
useEffect(() => {
|
||||
localStorage.setItem("favorites", JSON.stringify(favorites))
|
||||
}, [favorites])
|
||||
|
||||
// Salvar avatar no localStorage
|
||||
useEffect(() => {
|
||||
localStorage.setItem("selectedAvatar", selectedAvatar)
|
||||
}, [selectedAvatar])
|
||||
|
||||
const toggleFavorite = (appId) => {
|
||||
setFavorites(prev =>
|
||||
prev.includes(appId)
|
||||
? prev.filter(id => id !== appId)
|
||||
: [...prev, appId]
|
||||
)
|
||||
}
|
||||
|
||||
// Filtrar apps
|
||||
const filteredApps = selectedCategory === "all"
|
||||
? apps
|
||||
: apps.filter(app => app.category === selectedCategory)
|
||||
|
||||
// Apps favoritos
|
||||
const favoriteApps = apps.filter(app => favorites.includes(app.id))
|
||||
|
||||
return (
|
||||
<div className="min-h-screen bg-gray-50">
|
||||
{/* Header */}
|
||||
<nav className="bg-white shadow-lg p-4 flex justify-between items-center">
|
||||
<div className="flex items-center gap-4">
|
||||
<h1 className="text-2xl font-bold">1000Apps</h1>
|
||||
<span className="text-xs bg-green-100 text-green-800 px-2 py-1 rounded-full font-semibold">FREE</span>
|
||||
</div>
|
||||
<div className="flex items-center gap-4">
|
||||
<AvatarSelector selectedAvatar={selectedAvatar} onSelect={setSelectedAvatar} />
|
||||
<span className="text-gray-600">Olá, {session?.user?.name || session?.user?.username || "usuário"}!</span>
|
||||
<button onClick={() => signOut()} className="text-red-600 hover:underline font-medium">Sair</button>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<main className="max-w-6xl mx-auto p-6">
|
||||
{/* Favoritos Section */}
|
||||
{favorites.length > 0 && (
|
||||
<div className="mb-8">
|
||||
<h2 className="text-2xl font-bold text-gray-800 mb-4 flex items-center gap-2">
|
||||
<span>⭐</span> Favoritos
|
||||
</h2>
|
||||
<div className="grid grid-cols-2 md:grid-cols-4 gap-4">
|
||||
{favoriteApps.map(app => (
|
||||
<button
|
||||
key={app.id}
|
||||
onClick={() => router.push(app.path)}
|
||||
className="bg-white rounded-xl p-6 shadow-md hover:shadow-lg transition-all text-left hover:scale-105 cursor-pointer border-2 border-yellow-200"
|
||||
>
|
||||
<div className="text-3xl mb-2">{app.icon}</div>
|
||||
<h3 className="font-semibold text-gray-800 text-sm">{app.name}</h3>
|
||||
<p className="text-xs text-gray-500 mt-1">{app.desc}</p>
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Category Filter */}
|
||||
<CategoryMenu selectedCategory={selectedCategory} onSelect={setSelectedCategory} />
|
||||
|
||||
{/* Apps Grid */}
|
||||
<div className="mb-6">
|
||||
<h2 className="text-3xl font-bold text-gray-800 mb-2">
|
||||
{selectedCategory === "all" ? "Todos os Apps" :
|
||||
selectedCategory === "produtividade" ? "Produtividade" :
|
||||
selectedCategory === "utilidades" ? "Utilidades" :
|
||||
selectedCategory === "games" ? "Games" :
|
||||
selectedCategory === "ferramentas" ? "Ferramentas" :
|
||||
selectedCategory === "educacao" ? "Educação" :
|
||||
selectedCategory === "entretenimento" ? "Entretenimento" :
|
||||
selectedCategory === "esportes" ? "Esportes" : "Apps"}
|
||||
</h2>
|
||||
<p className="text-gray-500">
|
||||
{selectedCategory === "all"
|
||||
? `${apps.length} apps disponíveis`
|
||||
: `${filteredApps.length} apps nesta categoria`}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-2 md:grid-cols-4 gap-4">
|
||||
{filteredApps.map(app => (
|
||||
<div key={app.id} className="relative">
|
||||
<button
|
||||
onClick={() => router.push(app.path)}
|
||||
className="bg-white rounded-xl p-6 shadow-md hover:shadow-lg transition-all text-left hover:scale-105 cursor-pointer w-full"
|
||||
>
|
||||
<div className="text-3xl mb-2">{app.icon}</div>
|
||||
<h3 className="font-semibold text-gray-800 text-sm">{app.name}</h3>
|
||||
<p className="text-xs text-gray-500 mt-1">{app.desc}</p>
|
||||
</button>
|
||||
<button
|
||||
onClick={() => toggleFavorite(app.id)}
|
||||
className="absolute top-2 right-2 text-lg"
|
||||
title={favorites.includes(app.id) ? "Remover dos favoritos" : "Adicionar aos favoritos"}
|
||||
>
|
||||
{favorites.includes(app.id) ? "⭐" : "☆"}
|
||||
</button>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</main>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export async function getServerSideProps() {
|
||||
return {
|
||||
props: {},
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,7 @@
|
||||
# Landing Legacy
|
||||
|
||||
- `index.jsx` — Landing Page original (era a rota `/` antes da remoção do login).
|
||||
- Estilos inline + classes em `styles/globals.css` (ex.: `card-hover`).
|
||||
- Não participa do build enquanto estiver fora de `pages/`.
|
||||
|
||||
Para reativar: mover para `pages/index.jsx` (e remover o redirect atual em `pages/index.jsx`).
|
||||
@@ -0,0 +1,143 @@
|
||||
// LANDING PAGE — DESATIVADA TEMPORARIAMENTE (2026-07-11)
|
||||
// Motivo: remoção do fluxo de login; app agora abre direto no dashboard.
|
||||
// Arquivo PRESERVADO para reativação futura. Não foi apagado componente,
|
||||
// asset ou estilo. Para reativar: renomear para pages/index.jsx.
|
||||
// Updated: force rebuild for cache invalidation
|
||||
export default function Home() {
|
||||
return (
|
||||
<div className="bg-gray-50 min-h-screen">
|
||||
{/* Header */}
|
||||
<header className="bg-white shadow-sm">
|
||||
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-4 flex justify-between items-center">
|
||||
<h1 className="text-2xl font-bold text-gray-900">1000Apps</h1>
|
||||
<div className="space-x-4">
|
||||
<a href="/signin" className="text-gray-600 hover:text-gray-900 font-medium">Entrar</a>
|
||||
<a href="/signup" className="bg-blue-600 text-white px-4 py-2 rounded-lg font-medium hover:bg-blue-700 transition">Cadastrar</a>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
{/* Hero Section */}
|
||||
<section className="bg-gradient-to-r from-blue-600 to-purple-600 text-white py-20">
|
||||
<div className="max-w-4xl mx-auto px-4 text-center">
|
||||
<h2 className="text-5xl font-bold mb-6">Seu Canivete Suíço Digital</h2>
|
||||
<p className="text-xl mb-8 opacity-90">
|
||||
Mais de 1000 ferramentas úteis, games e produtividade - tudo online, sem instalar nada!
|
||||
</p>
|
||||
<div className="flex justify-center space-x-4">
|
||||
<a href="/signup" className="bg-white text-blue-600 px-8 py-3 rounded-lg font-semibold text-lg hover:bg-gray-100 transition">Começar Grátis</a>
|
||||
<a href="#apps" className="border border-white text-white px-8 py-3 rounded-lg font-semibold text-lg hover:bg-white/10 transition">Explorar Apps</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* Categories */}
|
||||
<section id="apps" className="py-16 px-4">
|
||||
<div className="max-w-6xl mx-auto">
|
||||
<h3 className="text-3xl font-bold text-center mb-12 text-gray-800">Categorias</h3>
|
||||
|
||||
<div className="grid md:grid-cols-3 gap-8">
|
||||
<div className="bg-white rounded-xl p-8 card-hover transition transform hover:-translate-y-1">
|
||||
<div className="w-14 h-14 bg-blue-100 rounded-lg flex items-center justify-center mb-4">
|
||||
<svg className="w-8 h-8 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M9 5l7 7-7 7" />
|
||||
</svg>
|
||||
</div>
|
||||
<h4 className="text-xl font-semibold mb-2">Produtividade</h4>
|
||||
<p className="text-gray-600 mb-4">Ferramentas para otimizar seu tempo e trabalho</p>
|
||||
<span className="text-blue-600 font-medium">Ver apps →</span>
|
||||
</div>
|
||||
|
||||
<div className="bg-white rounded-xl p-8 card-hover transition transform hover:-translate-y-1">
|
||||
<div className="w-14 h-14 bg-green-100 rounded-lg flex items-center justify-center mb-4">
|
||||
<svg className="w-8 h-8 text-green-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M11 4a2 2 0 114 0v5a2 2 0 01-2 2H7a2 2 0 00-2-2V6a2 2 0 012-2h2z" />
|
||||
</svg>
|
||||
</div>
|
||||
<h4 className="text-xl font-semibold mb-2">Utilidades</h4>
|
||||
<p className="text-gray-600 mb-4">Ferramentas práticas para o dia a dia</p>
|
||||
<span className="text-green-600 font-medium">Ver apps →</span>
|
||||
</div>
|
||||
|
||||
<div className="bg-white rounded-xl p-8 card-hover transition transform hover:-translate-y-1">
|
||||
<div className="w-14 h-14 bg-purple-100 rounded-lg flex items-center justify-center mb-4">
|
||||
<svg className="w-8 h-8 text-purple-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M14.752 12.795a7.95 7.95 0 001.904-5.452 7.95 7.95 0 00-7.95 7.95A7.95 7.95 0 0012.795 14.752" />
|
||||
</svg>
|
||||
</div>
|
||||
<h4 className="text-xl font-semibold mb-2">Games</h4>
|
||||
<p className="text-gray-600 mb-4">Diversão rápida e envolvente</p>
|
||||
<span className="text-purple-600 font-medium">Ver apps →</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* Features */}
|
||||
<section className="bg-gray-100 py-16 px-4">
|
||||
<div className="max-w-6xl mx-auto">
|
||||
<h3 className="text-3xl font-bold text-center mb-12 text-gray-800">Por que 1000Apps?</h3>
|
||||
|
||||
<div className="grid md:grid-cols-2 lg:grid-cols-4 gap-6">
|
||||
<div className="text-center">
|
||||
<div className="w-16 h-16 bg-blue-600 rounded-full flex items-center justify-center mx-auto mb-4">
|
||||
<span className="text-2xl font-bold text-white">01</span>
|
||||
</div>
|
||||
<h5 className="font-semibold mb-2">Nada para Instalar</h5>
|
||||
<p className="text-sm text-gray-600">Tudo rodando direto no navegador</p>
|
||||
</div>
|
||||
|
||||
<div className="text-center">
|
||||
<div className="w-16 h-16 bg-green-600 rounded-full flex items-center justify-center mx-auto mb-4">
|
||||
<span className="text-2xl font-bold text-white">02</span>
|
||||
</div>
|
||||
<h5 className="font-semibold mb-2">Sempre Atualizado</h5>
|
||||
<p className="text-sm text-gray-600">Conteúdo fresco todo dia</p>
|
||||
</div>
|
||||
|
||||
<div className="text-center">
|
||||
<div className="w-16 h-16 bg-purple-600 rounded-full flex items-center justify-center mx-auto mb-4">
|
||||
<span className="text-2xl font-bold text-white">03</span>
|
||||
</div>
|
||||
<h5 className="font-semibold mb-2">Curadoria Inteligente</h5>
|
||||
<p className="text-sm text-gray-600">Só apps úteis e testados</p>
|
||||
</div>
|
||||
|
||||
<div className="text-center">
|
||||
<div className="w-16 h-16 bg-orange-600 rounded-full flex items-center justify-center mx-auto mb-4">
|
||||
<span className="text-2xl font-bold text-white">04</span>
|
||||
</div>
|
||||
<h5 className="font-semibold mb-2">Grátis para Sempre</h5>
|
||||
<p className="text-sm text-gray-600">Acesso completo sem pagar nada</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* CTA Final */}
|
||||
<section className="py-20 px-4">
|
||||
<div className="max-w-3xl mx-auto text-center">
|
||||
<h3 className="text-4xl font-bold mb-4 text-gray-900">Pronto para começar?</h3>
|
||||
<p className="text-lg text-gray-600 mb-8">
|
||||
Junte-se a milhares de usuários que já economizam tempo com 1000Apps
|
||||
</p>
|
||||
<a href="/signup" className="inline-block bg-blue-600 text-white px-10 py-4 rounded-lg font-semibold text-xl hover:bg-blue-700 transition transform hover:scale-105">
|
||||
Criar Conta Grátis
|
||||
</a>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* Footer */}
|
||||
<footer className="bg-gray-900 text-white py-8 px-4">
|
||||
<div className="max-w-6xl mx-auto text-center">
|
||||
<p className="mb-4">© 2026 1000Apps. Todos os direitos reservados.</p>
|
||||
<div className="space-x-6 text-sm">
|
||||
<a href="#" className="hover:text-gray-300">Termos</a>
|
||||
<a href="#" className="hover:text-gray-300">Privacidade</a>
|
||||
<a href="#" className="hover:text-gray-300">Contato</a>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user