Add files via upload

Author: bernardoyt1093-wq

index.html

@@ -69,4 +69,4 @@ <h3>Comunidade</h3>
     <script src="script.js"></script>
 
 </body>
-</html>
+</html>

script.js

@@ -1,40 +1,43 @@
-// CONTROLE DO TEMA
-const themeBtn = document.getElementById('theme-button');
-themeBtn.addEventListener('click', () => {
-    const html = document.documentElement;
-    const isLight = html.getAttribute('data-theme') === 'light';
-    html.setAttribute('data-theme', isLight ? 'dark' : 'light');
-    themeBtn.textContent = isLight ? "Modo Claro" : "Modo Escuro";
-});
-
-// CONTEÚDO DAS PRÁTICAS
-const aulas = {
-    1: { t: "Variáveis", c: "let mestre = 'Bernardo';\nconsole.log('Professor: ' + mestre);" },
-    2: { t: "Funções", c: "function acao(){ return 'Codando...'; }\nconsole.log(acao());" },
-    3: { t: "Lógica", c: "let nota = 10;\nif(nota >= 7) console.log('Aprovado!');" }
+const aulasConteudo = {
+    1: {
+        titulo: "Praticando Variáveis",
+        codigo: "let curso = 'JS Master';\nconsole.log('Bem-vindo ao ' + curso);"
+    },
+    2: {
+        titulo: "Praticando Funções",
+        codigo: "function saudacao(nome) {\n  return 'Olá ' + nome;\n}\nconsole.log(saudacao('Bernardo'));"
+    },
+    3: {
+        titulo: "Praticando Lógica",
+        codigo: "let pontos = 80;\nif(pontos >= 50) {\n  console.log('Aprovado!');\n} else {\n  console.log('Reprovado');\n}"
+    }
 };
 
 function verAula(id) {
-    const local = document.getElementById('tutorial-texto');
-    const item = aulas[id];
-    local.innerHTML = `
-        <div class="card">
-            <h3>Desafio: ${item.t}</h3>
-            <textarea id="codigo-editor">${item.c}</textarea>
-            <button onclick="rodar()" class="btn-primary" style="margin-top:10px;">Executar Código</button>
-            <div id="console-output">> Aguardando...</div>
-        </div>`;
+    const area = document.getElementById('tutorial-texto');
+    const aula = aulasConteudo[id];
+
+    area.innerHTML = `
+        <div style="background: #1e293b; padding: 20px; border-radius: 12px; border: 2px solid #f7df1e; margin-bottom: 30px;">
+            <h2 style="color: #f7df1e; font-family: 'Playwrite IE Sj', cursive;">${aula.titulo}</h2>
+            <textarea id="codigo-editor" style="width:100%; height:100px; background:#000; color:#4ade80; font-family:monospace; padding:10px; margin:10px 0;">${aula.codigo}</textarea>
+            <button onclick="executarCodigo()" class="btn-primary">▶ Executar</button>
+            <div id="console-output" style="background:#000; color:#fff; padding:10px; margin-top:10px; border-radius:5px; font-family:monospace;">> Aguardando...</div>
+        </div>
+    `;
     window.scrollTo({top: 0, behavior: 'smooth'});
 }
 
-function rodar() {
+function executarCodigo() {
     const cod = document.getElementById('codigo-editor').value;
     const out = document.getElementById('console-output');
     out.innerHTML = "";
     try {
-        const originalLog = console.log;
+        const log = console.log;
         console.log = (m) => { out.innerHTML += "> " + m + "<br>"; };
         eval(cod);
-        console.log = originalLog;
-    } catch(e) { out.innerHTML = "Erro: " + e.message; }
-}
+        console.log = log;
+    } catch (e) {
+        out.innerHTML = "<span style='color:red;'>Erro: " + e.message + "</span>";
+    }
+}