Spaces:
Running
Running
| <html lang="pt-BR"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Revisor ABNT - Ferramenta de Revisão Acadêmica</title> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> | |
| <script> | |
| tailwind.config = { | |
| theme: { | |
| extend: { | |
| colors: { | |
| academic: { | |
| blue: '#2C3E50', | |
| light: '#ECF0F1', | |
| accent: '#3498DB', | |
| dark: '#1A252F' | |
| } | |
| } | |
| } | |
| } | |
| } | |
| </script> | |
| <style> | |
| .editor-area { | |
| min-height: 500px; | |
| border: 1px solid #ddd; | |
| padding: 20px; | |
| background-color: white; | |
| line-height: 1.6; | |
| font-size: 16px; | |
| text-align: justify; | |
| } | |
| .suggestions-panel { | |
| max-height: 500px; | |
| overflow-y: auto; | |
| } | |
| .suggestion-item { | |
| transition: all 0.3s ease; | |
| } | |
| .suggestion-item:hover { | |
| background-color: #f0f7ff; | |
| } | |
| .progress-bar { | |
| transition: width 0.5s ease; | |
| } | |
| @media print { | |
| .no-print { | |
| display: none ; | |
| } | |
| .editor-area { | |
| border: none; | |
| padding: 0; | |
| } | |
| } | |
| .tooltip { | |
| position: relative; | |
| display: inline-block; | |
| } | |
| .tooltip .tooltiptext { | |
| visibility: hidden; | |
| width: 200px; | |
| background-color: #555; | |
| color: #fff; | |
| text-align: center; | |
| border-radius: 6px; | |
| padding: 5px; | |
| position: absolute; | |
| z-index: 1; | |
| bottom: 125%; | |
| left: 50%; | |
| margin-left: -100px; | |
| opacity: 0; | |
| transition: opacity 0.3s; | |
| } | |
| .tooltip:hover .tooltiptext { | |
| visibility: visible; | |
| opacity: 1; | |
| } | |
| </style> | |
| </head> | |
| <body class="bg-academic-light"> | |
| <header class="bg-academic-blue text-white shadow-lg"> | |
| <div class="container mx-auto px-4 py-6"> | |
| <div class="flex justify-between items-center"> | |
| <div class="flex items-center space-x-4"> | |
| <i class="fas fa-graduation-cap text-3xl text-accent"></i> | |
| <h1 class="text-2xl font-bold">Revisor ABNT</h1> | |
| </div> | |
| <nav class="hidden md:flex space-x-6"> | |
| <a href="#" class="hover:text-accent transition">Início</a> | |
| <a href="#" class="hover:text-accent transition">Recursos</a> | |
| <a href="#" class="hover:text-accent transition">Tutoriais</a> | |
| <a href="#" class="hover:text-accent transition">Sobre</a> | |
| </nav> | |
| <button class="md:hidden text-xl"> | |
| <i class="fas fa-bars"></i> | |
| </button> | |
| </div> | |
| </div> | |
| </header> | |
| <main class="container mx-auto px-4 py-8"> | |
| <div class="bg-white rounded-lg shadow-xl overflow-hidden mb-8"> | |
| <div class="bg-accent text-white px-6 py-4"> | |
| <h2 class="text-xl font-semibold">Revisor Acadêmico ABNT</h2> | |
| <p class="text-sm opacity-90">Revise seu trabalho acadêmico de acordo com as normas da ABNT</p> | |
| </div> | |
| <div class="p-6"> | |
| <div class="flex flex-wrap -mx-4"> | |
| <div class="w-full lg:w-2/3 px-4 mb-6 lg:mb-0"> | |
| <div class="flex justify-between items-center mb-4"> | |
| <div class="flex space-x-2"> | |
| <button class="bg-accent hover:bg-academic-blue text-white px-3 py-1 rounded tooltip"> | |
| <i class="fas fa-file-upload"></i> | |
| <span class="tooltiptext">Importar documento</span> | |
| </button> | |
| <button class="bg-gray-200 hover:bg-gray-300 px-3 py-1 rounded tooltip"> | |
| <i class="fas fa-file-export"></i> | |
| <span class="tooltiptext">Exportar documento</span> | |
| </button> | |
| <button class="bg-gray-200 hover:bg-gray-300 px-3 py-1 rounded tooltip"> | |
| <i class="fas fa-print"></i> | |
| <span class="tooltiptext">Imprimir</span> | |
| </button> | |
| </div> | |
| <div> | |
| <select class="border rounded px-3 py-1 text-sm"> | |
| <option>ABNT (Padrão)</option> | |
| <option>APA</option> | |
| <option>Vancouver</option> | |
| <option>IEEE</option> | |
| </select> | |
| </div> | |
| </div> | |
| <div class="editor-area rounded" id="editor" contenteditable="true"> | |
| <h1 class="text-2xl font-bold text-center mb-6">TÍTULO DO TRABALHO ACADÊMICO</h1> | |
| <p class="text-center mb-8">Nome completo do autor</p> | |
| <h2 class="text-xl font-semibold mb-4">1. INTRODUÇÃO</h2> | |
| <p class="mb-4">A introdução é a parte inicial do texto, onde devem constar a delimitação do assunto tratado, objetivos da pesquisa e outros elementos necessários para situar o tema do trabalho. Segundo a ABNT NBR 14724, a introdução deve apresentar o assunto do trabalho, os objetivos, a justificativa, o problema de pesquisa, a hipótese (quando couber), a metodologia utilizada e a estrutura do trabalho.</p> | |
| <h2 class="text-xl font-semibold mb-4">2. DESENVOLVIMENTO</h2> | |
| <p class="mb-4">O desenvolvimento é a parte principal do trabalho, que contém a exposição ordenada e pormenorizada do assunto. Divide-se em seções e subseções, que variam em função da abordagem do tema e do método. De acordo com a ABNT, o texto deve ser redigido em terceira pessoa do singular, com linguagem clara, objetiva e impessoal.</p> | |
| <h2 class="text-xl font-semibold mb-4">3. CONCLUSÃO</h2> | |
| <p>A conclusão deve apresentar uma síntese dos resultados do trabalho, respondendo aos objetivos e hipóteses levantadas na introdução. Não deve conter elementos novos não abordados no desenvolvimento. A ABNT recomenda que a conclusão seja breve e objetiva, destacando as principais contribuições do trabalho.</p> | |
| </div> | |
| <div class="mt-4 flex justify-between items-center"> | |
| <div class="text-sm text-gray-600"> | |
| <span id="word-count">0</span> palavras | <span id="character-count">0</span> caracteres | |
| </div> | |
| <button id="analyze-btn" class="bg-accent hover:bg-academic-blue text-white px-6 py-2 rounded-lg font-medium flex items-center"> | |
| <i class="fas fa-search mr-2"></i> Analisar Documento | |
| </button> | |
| </div> | |
| </div> | |
| <div class="w-full lg:w-1/3 px-4"> | |
| <div class="bg-white border rounded-lg shadow-sm overflow-hidden"> | |
| <div class="bg-gray-100 px-4 py-3 border-b"> | |
| <h3 class="font-medium text-academic-blue"> | |
| <i class="fas fa-lightbulb mr-2"></i> Sugestões e Correções | |
| </h3> | |
| </div> | |
| <div class="suggestions-panel p-4" id="suggestions-panel"> | |
| <div class="text-center py-8 text-gray-500" id="empty-suggestions"> | |
| <i class="fas fa-comment-dots text-3xl mb-3"></i> | |
| <p>Nenhuma sugestão disponível ainda.</p> | |
| <p class="text-sm mt-1">Clique em "Analisar Documento" para iniciar a revisão.</p> | |
| </div> | |
| <div id="suggestions-container" class="hidden"> | |
| <div class="mb-4"> | |
| <div class="flex justify-between items-center mb-2"> | |
| <h4 class="font-medium text-academic-blue">Resumo da Análise</h4> | |
| <span class="text-xs bg-accent text-white px-2 py-1 rounded">ABNT</span> | |
| </div> | |
| <div class="bg-blue-50 p-3 rounded text-sm"> | |
| <div class="flex justify-between mb-1"> | |
| <span>Formatação</span> | |
| <span>85% correto</span> | |
| </div> | |
| <div class="w-full bg-gray-200 rounded-full h-2.5"> | |
| <div class="progress-bar bg-blue-600 h-2.5 rounded-full" style="width: 85%"></div> | |
| </div> | |
| <div class="flex justify-between mb-1 mt-3"> | |
| <span>Normas ABNT</span> | |
| <span>72% correto</span> | |
| </div> | |
| <div class="w-full bg-gray-200 rounded-full h-2.5"> | |
| <div class="progress-bar bg-blue-600 h-2.5 rounded-full" style="width: 72%"></div> | |
| </div> | |
| <div class="flex justify-between mb-1 mt-3"> | |
| <span>Qualidade do Texto</span> | |
| <span>68% correto</span> | |
| </div> | |
| <div class="w-full bg-gray-200 rounded-full h-2.5"> | |
| <div class="progress-bar bg-blue-600 h-2.5 rounded-full" style="width: 68%"></div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="mb-4"> | |
| <h4 class="font-medium text-academic-blue mb-2">Principais Problemas Encontrados</h4> | |
| <div class="space-y-3"> | |
| <div class="suggestion-item bg-red-50 border-l-4 border-red-500 p-3 rounded-r text-sm cursor-pointer"> | |
| <div class="font-medium text-red-700">Formatação de títulos</div> | |
| <p class="text-gray-700">Os títulos das seções devem estar em negrito e alinhados à esquerda, sem ponto final.</p> | |
| </div> | |
| <div class="suggestion-item bg-yellow-50 border-l-4 border-yellow-500 p-3 rounded-r text-sm cursor-pointer"> | |
| <div class="font-medium text-yellow-700">Citações diretas</div> | |
| <p class="text-gray-700">Citações com mais de 3 linhas devem ter recuo de 4cm da margem esquerda, fonte tamanho 10 e espaçamento simples.</p> | |
| </div> | |
| <div class="suggestion-item bg-blue-50 border-l-4 border-blue-500 p-3 rounded-r text-sm cursor-pointer"> | |
| <div class="font-medium text-blue-700">Referências bibliográficas</div> | |
| <p class="text-gray-700">As referências devem ser listadas em ordem alfabética, com espaçamento simples entre linhas e duplo entre referências.</p> | |
| </div> | |
| </div> | |
| </div> | |
| <div> | |
| <h4 class="font-medium text-academic-blue mb-2">Sugestões de Melhoria</h4> | |
| <div class="space-y-3"> | |
| <div class="suggestion-item bg-green-50 border-l-4 border-green-500 p-3 rounded-r text-sm cursor-pointer"> | |
| <div class="font-medium text-green-700">Clareza no texto</div> | |
| <p class="text-gray-700">Considere reformular esta frase para torná-la mais clara e objetiva.</p> | |
| </div> | |
| <div class="suggestion-item bg-purple-50 border-l-4 border-purple-500 p-3 rounded-r text-sm cursor-pointer"> | |
| <div class="font-medium text-purple-700">Termos técnicos</div> | |
| <p class="text-gray-700">Este termo técnico deve ser definido na primeira vez que aparece no texto.</p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="bg-white border rounded-lg shadow-sm overflow-hidden mt-6"> | |
| <div class="bg-gray-100 px-4 py-3 border-b"> | |
| <h3 class="font-medium text-academic-blue"> | |
| <i class="fas fa-question-circle mr-2"></i> Ajuda Rápida ABNT | |
| </h3> | |
| </div> | |
| <div class="p-4"> | |
| <div class="space-y-3 text-sm"> | |
| <div class="flex items-start"> | |
| <div class="bg-accent text-white rounded-full w-6 h-6 flex items-center justify-center flex-shrink-0 mr-2">1</div> | |
| <p>Margens: 3cm superior e esquerda; 2cm inferior e direita.</p> | |
| </div> | |
| <div class="flex items-start"> | |
| <div class="bg-accent text-white rounded-full w-6 h-6 flex items-center justify-center flex-shrink-0 mr-2">2</div> | |
| <p>Fonte: Times New Roman ou Arial, tamanho 12 para texto principal.</p> | |
| </div> | |
| <div class="flex items-start"> | |
| <div class="bg-accent text-white rounded-full w-6 h-6 flex items-center justify-center flex-shrink-0 mr-2">3</div> | |
| <p>Espaçamento: 1,5 entre linhas no texto; simples em citações longas e referências.</p> | |
| </div> | |
| <div class="flex items-start"> | |
| <div class="bg-accent text-white rounded-full w-6 h-6 flex items-center justify-center flex-shrink-0 mr-2">4</div> | |
| <p>Paginação: números no canto superior direito, a 2cm da borda.</p> | |
| </div> | |
| </div> | |
| <button class="mt-4 text-sm text-accent hover:underline flex items-center"> | |
| <i class="fas fa-external-link-alt mr-1"></i> Ver guia completo da ABNT | |
| </button> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="bg-white rounded-lg shadow-xl overflow-hidden mb-8"> | |
| <div class="bg-academic-blue text-white px-6 py-4"> | |
| <h2 class="text-xl font-semibold">Modelos Prontos</h2> | |
| <p class="text-sm opacity-90">Selecione um modelo de trabalho acadêmico para começar</p> | |
| </div> | |
| <div class="p-6 grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6"> | |
| <div class="border rounded-lg overflow-hidden hover:shadow-md transition cursor-pointer"> | |
| <div class="bg-blue-100 p-4 text-center"> | |
| <i class="fas fa-file-alt text-4xl text-accent mb-3"></i> | |
| <h3 class="font-medium">TCC</h3> | |
| </div> | |
| <div class="p-4 border-t text-sm"> | |
| <p>Modelo completo de Trabalho de Conclusão de Curso com todas as seções necessárias.</p> | |
| <button class="mt-3 w-full bg-accent hover:bg-academic-blue text-white py-1 rounded text-sm"> | |
| Usar Modelo | |
| </button> | |
| </div> | |
| </div> | |
| <div class="border rounded-lg overflow-hidden hover:shadow-md transition cursor-pointer"> | |
| <div class="bg-green-100 p-4 text-center"> | |
| <i class="fas fa-scroll text-4xl text-green-600 mb-3"></i> | |
| <h3 class="font-medium">Artigo Científico</h3> | |
| </div> | |
| <div class="p-4 border-t text-sm"> | |
| <p>Estrutura padrão para artigos científicos com até 15 páginas.</p> | |
| <button class="mt-3 w-full bg-accent hover:bg-academic-blue text-white py-1 rounded text-sm"> | |
| Usar Modelo | |
| </button> | |
| </div> | |
| </div> | |
| <div class="border rounded-lg overflow-hidden hover:shadow-md transition cursor-pointer"> | |
| <div class="bg-purple-100 p-4 text-center"> | |
| <i class="fas fa-book text-4xl text-purple-600 mb-3"></i> | |
| <h3 class="font-medium">Monografia</h3> | |
| </div> | |
| <div class="p-4 border-t text-sm"> | |
| <p>Modelo completo para monografias de graduação e pós-graduação.</p> | |
| <button class="mt-3 w-full bg-accent hover:bg-academic-blue text-white py-1 rounded text-sm"> | |
| Usar Modelo | |
| </button> | |
| </div> | |
| </div> | |
| <div class="border rounded-lg overflow-hidden hover:shadow-md transition cursor-pointer"> | |
| <div class="bg-yellow-100 p-4 text-center"> | |
| <i class="fas fa-theater-masks text-4xl text-yellow-600 mb-3"></i> | |
| <h3 class="font-medium">Resenha</h3> | |
| </div> | |
| <div class="p-4 border-t text-sm"> | |
| <p>Estrutura para resenhas críticas e resumos acadêmicos.</p> | |
| <button class="mt-3 w-full bg-accent hover:bg-academic-blue text-white py-1 rounded text-sm"> | |
| Usar Modelo | |
| </button> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </main> | |
| <footer class="bg-academic-dark text-white py-8"> | |
| <div class="container mx-auto px-4"> | |
| <div class="grid grid-cols-1 md:grid-cols-3 gap-8"> | |
| <div> | |
| <h3 class="text-lg font-semibold mb-4">Revisor ABNT</h3> | |
| <p class="text-academic-light text-sm">Ferramenta completa para revisão e formatação de trabalhos acadêmicos de acordo com as normas da ABNT e outras normas técnicas.</p> | |
| </div> | |
| <div> | |
| <h3 class="text-lg font-semibold mb-4">Links Úteis</h3> | |
| <ul class="space-y-2 text-sm text-academic-light"> | |
| <li><a href="#" class="hover:text-accent transition">Normas ABNT</a></li> | |
| <li><a href="#" class="hover:text-accent transition">Tutoriais</a></li> | |
| <li><a href="#" class="hover:text-accent transition">Modelos de Trabalhos</a></li> | |
| <li><a href="#" class="hover:text-accent transition">Perguntas Frequentes</a></li> | |
| </ul> | |
| </div> | |
| <div> | |
| <h3 class="text-lg font-semibold mb-4">Contato</h3> | |
| <ul class="space-y-2 text-sm text-academic-light"> | |
| <li class="flex items-center"><i class="fas fa-envelope mr-2"></i> contato@revisorabnt.com</li> | |
| <li class="flex items-center"><i class="fas fa-phone mr-2"></i> (11) 1234-5678</li> | |
| <li class="flex items-center"><i class="fas fa-map-marker-alt mr-2"></i> São Paulo, SP</li> | |
| </ul> | |
| </div> | |
| </div> | |
| <div class="border-t border-academic-blue mt-8 pt-6 text-sm text-center text-academic-light"> | |
| <p>© 2023 Revisor ABNT. Todos os direitos reservados.</p> | |
| </div> | |
| </div> | |
| </footer> | |
| <script> | |
| document.addEventListener('DOMContentLoaded', function() { | |
| const editor = document.getElementById('editor'); | |
| const analyzeBtn = document.getElementById('analyze-btn'); | |
| const emptySuggestions = document.getElementById('empty-suggestions'); | |
| const suggestionsContainer = document.getElementById('suggestions-container'); | |
| const wordCountElement = document.getElementById('word-count'); | |
| const characterCountElement = document.getElementById('character-count'); | |
| // Contador de palavras e caracteres | |
| function updateCounts() { | |
| const text = editor.innerText; | |
| const words = text.trim() === '' ? 0 : text.trim().split(/\s+/).length; | |
| const characters = text.length; | |
| wordCountElement.textContent = words; | |
| characterCountElement.textContent = characters; | |
| } | |
| editor.addEventListener('input', updateCounts); | |
| updateCounts(); | |
| // Simular análise do documento | |
| analyzeBtn.addEventListener('click', function() { | |
| analyzeBtn.innerHTML = '<i class="fas fa-spinner fa-spin mr-2"></i> Analisando...'; | |
| analyzeBtn.disabled = true; | |
| // Simular tempo de análise | |
| setTimeout(function() { | |
| emptySuggestions.classList.add('hidden'); | |
| suggestionsContainer.classList.remove('hidden'); | |
| analyzeBtn.innerHTML = '<i class="fas fa-check mr-2"></i> Análise Concluída'; | |
| // Resetar botão após alguns segundos | |
| setTimeout(function() { | |
| analyzeBtn.innerHTML = '<i class="fas fa-sync-alt mr-2"></i> Reanalisar'; | |
| analyzeBtn.disabled = false; | |
| }, 3000); | |
| }, 2000); | |
| }); | |
| // Simular clique nas sugestões | |
| const suggestionItems = document.querySelectorAll('.suggestion-item'); | |
| suggestionItems.forEach(item => { | |
| item.addEventListener('click', function() { | |
| // Simular aplicação da sugestão | |
| this.classList.add('opacity-50'); | |
| const checkIcon = document.createElement('i'); | |
| checkIcon.className = 'fas fa-check ml-2 text-green-500'; | |
| const title = this.querySelector('.font-medium'); | |
| if (title && !title.querySelector('.fa-check')) { | |
| title.appendChild(checkIcon); | |
| } | |
| }); | |
| }); | |
| // Simular seleção de modelo | |
| const modelButtons = document.querySelectorAll('[class*="grid-cols-4"] button'); | |
| modelButtons.forEach(button => { | |
| button.addEventListener('click', function() { | |
| const modelTitle = this.closest('.border').querySelector('h3').textContent; | |
| alert(`Modelo "${modelTitle}" carregado com sucesso!`); | |
| }); | |
| }); | |
| }); | |
| </script> | |
| <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=Lewrybe/revisor-abnt" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> | |
| </html> |