Spaces:
Sleeping
Sleeping
| <html lang="pt-BR"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>IA Toolbox Hub</title> | |
| <script src="https://cdnjs.cloudflare.com/ajax/libs/alpinejs/2.8.2/alpine.js"></script> | |
| <script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/js/all.min.js"></script> | |
| <style> | |
| :root { | |
| --primary: #1d9bf0; | |
| --primary-dark: #1a8cd8; | |
| --background: #ffffff; | |
| --card-bg: #f7f9f9; | |
| --text: #0f1419; | |
| --text-secondary: #536471; | |
| --border: #eff3f4; | |
| --hover: #e8f5fd; | |
| } | |
| body { | |
| font-family: -apple-system, system-ui, sans-serif; | |
| background: var(--background); | |
| color: var(--text); | |
| margin: 0; | |
| line-height: 1.5; | |
| } | |
| .nav-fixed { | |
| background: rgba(255, 255, 255, 0.95); | |
| backdrop-filter: blur(12px); | |
| border-bottom: 1px solid var(--border); | |
| } | |
| .btn-twitter { | |
| background: var(--primary); | |
| color: white; | |
| transition: all 0.2s; | |
| font-weight: 600; | |
| } | |
| .btn-twitter:hover { | |
| background: var(--primary-dark); | |
| transform: scale(1.05); | |
| } | |
| .card { | |
| background: var(--card-bg); | |
| border: 1px solid var(--border); | |
| transition: all 0.2s; | |
| } | |
| .card:hover { | |
| background: var(--hover); | |
| transform: translateY(-2px); | |
| } | |
| .profile-image { | |
| border: 4px solid var(--primary); | |
| box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); | |
| } | |
| .verified { | |
| color: var(--primary); | |
| } | |
| .stat-number { | |
| color: var(--text); | |
| font-weight: 700; | |
| } | |
| .stat-label { | |
| color: var(--text-secondary); | |
| } | |
| </style> | |
| </head> | |
| <body class="min-h-screen"> | |
| <nav class="nav-fixed w-full z-50 py-3"> | |
| <div class="container mx-auto px-4 flex items-center justify-between"> | |
| <span class="text-2xl font-bold text-primary">IA Toolbox</span> | |
| <button class="btn-twitter px-6 py-2 rounded-full">Conectar</button> | |
| </div> | |
| </nav> | |
| <main class="container mx-auto px-4 pt-20 max-w-3xl"> | |
| <div class="card rounded-xl p-6 mb-8 shadow-sm"> | |
| <div class="flex items-start space-x-4"> | |
| <img src="https://media.licdn.com/dms/image/v2/D4D03AQE-v0C-qPJakQ/profile-displayphoto-shrink_200_200/profile-displayphoto-shrink_200_200/0/1731926431165?e=1737590400&v=beta&t=rTBD9bV8vOPCkmR5AXGZgQdH-7mbogEXZzCyO4Hiwr0" | |
| alt="Dheiver Santos" | |
| class="profile-image w-24 h-24 rounded-full"/> | |
| <div class="flex-1"> | |
| <div class="flex items-center space-x-2"> | |
| <h2 class="text-xl font-bold text-text">Dheiver Santos, PhD</h2> | |
| <i class="fas fa-check-circle verified"></i> | |
| </div> | |
| <p class="text-text-secondary font-medium">@IAToolbox</p> | |
| <div class="mt-3 space-y-2"> | |
| <div class="flex items-center space-x-2 text-text-secondary"> | |
| <i class="fas fa-graduation-cap text-primary"></i> | |
| <span>Doutor em IA/AM</span> | |
| </div> | |
| <div class="flex flex-wrap gap-4 mt-2"> | |
| <span> | |
| <span class="stat-number">200+</span> | |
| <span class="stat-label"> Artigos</span> | |
| </span> | |
| <span> | |
| <span class="stat-number">50k+</span> | |
| <span class="stat-label"> Leitores</span> | |
| </span> | |
| <span> | |
| <span class="stat-number">300+</span> | |
| <span class="stat-label"> Citações</span> | |
| </span> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="grid grid-cols-1 gap-4"> | |
| <div x-data="{ open: false }" | |
| class="card rounded-xl p-6 shadow-sm hover:shadow-md cursor-pointer" | |
| @click="open = !open"> | |
| <div class="flex items-center space-x-4"> | |
| <div class="bg-blue-50 p-3 rounded-full"> | |
| <i class="fas fa-microphone text-primary text-xl"></i> | |
| </div> | |
| <div class="flex-1"> | |
| <h3 class="font-bold text-text">Transcrição de Áudio</h3> | |
| <p x-show="open" | |
| x-transition:enter="transition ease-out duration-200" | |
| x-transition:enter-start="opacity-0 transform -translate-y-4" | |
| x-transition:enter-end="opacity-100 transform translate-y-0" | |
| class="mt-2 text-text-secondary"> | |
| Converta áudio em texto com alta precisão usando IA avançada | |
| </p> | |
| </div> | |
| <i class="fas fa-chevron-right text-text-secondary"></i> | |
| </div> | |
| </div> | |
| <div x-data="{ open: false }" | |
| class="card rounded-xl p-6 shadow-sm hover:shadow-md cursor-pointer" | |
| @click="open = !open"> | |
| <div class="flex items-center space-x-4"> | |
| <div class="bg-blue-50 p-3 rounded-full"> | |
| <i class="fas fa-language text-primary text-xl"></i> | |
| </div> | |
| <div class="flex-1"> | |
| <h3 class="font-bold text-text">Tradução Neural</h3> | |
| <p x-show="open" | |
| x-transition:enter="transition ease-out duration-200" | |
| x-transition:enter-start="opacity-0 transform -translate-y-4" | |
| x-transition:enter-end="opacity-100 transform translate-y-0" | |
| class="mt-2 text-text-secondary"> | |
| Traduções precisas entre múltiplos idiomas em tempo real | |
| </p> | |
| </div> | |
| <i class="fas fa-chevron-right text-text-secondary"></i> | |
| </div> | |
| </div> | |
| <div x-data="{ open: false }" | |
| class="card rounded-xl p-6 shadow-sm hover:shadow-md cursor-pointer" | |
| @click="open = !open"> | |
| <div class="flex items-center space-x-4"> | |
| <div class="bg-blue-50 p-3 rounded-full"> | |
| <i class="fas fa-robot text-primary text-xl"></i> | |
| </div> | |
| <div class="flex-1"> | |
| <h3 class="font-bold text-text">Chat IA</h3> | |
| <p x-show="open" | |
| x-transition:enter="transition ease-out duration-200" | |
| x-transition:enter-start="opacity-0 transform -translate-y-4" | |
| x-transition:enter-end="opacity-100 transform translate-y-0" | |
| class="mt-2 text-text-secondary"> | |
| Interaja com um assistente virtual avançado | |
| </p> | |
| </div> | |
| <i class="fas fa-chevron-right text-text-secondary"></i> | |
| </div> | |
| </div> | |
| </div> | |
| <footer class="mt-8 py-4 text-center text-sm text-text-secondary border-t border-border"> | |
| <p>© 2024 IA Toolbox Hub • Citação: Santos, D. (2024)</p> | |
| </footer> | |
| </main> | |
| </body> | |
| </html> |