teste-1-11 / index.html
Rwhehhehe's picture
Add 3 files
d1762fb verified
<!DOCTYPE html><html lang="pt-BR">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Jornal Oliveira</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f1f1f1;
margin: 0;
padding: 0;
}
header {
background-color: #222;
color: white;
padding: 15px;
text-align: center;
font-family: "Old English Text MT", serif;
font-size: 32px;
}
nav {
display: flex;
justify-content: center;
gap: 10px;
padding: 10px;
background-color: #444;
}
nav button {
padding: 10px;
background-color: white;
border: none;
cursor: pointer;
}
section {
padding: 20px;
}
.hidden {
display: none;
}
.article {
background-color: white;
padding: 10px;
margin-bottom: 10px;
border-radius: 8px;
}
.approved {
border-left: 4px solid green;
}
.editor-buttons button {
margin-right: 5px;
}
</style>
</head>
<body>
<header>Jornal Oliveira</header> <nav id="menu" class="hidden">
<button onclick="showSection('inicio')">Início</button>
<button onclick="showSection('avaliacao')">Avaliação</button>
<button onclick="showSection('sugestoes')">Sugestões</button>
<button id="btnEnviar" class="hidden" onclick="showSection('enviar')">Enviar Matéria</button>
<button id="btnEditor" class="hidden" onclick="showSection('editor')">Painel do Editor</button>
</nav> <section id="login">
<h2>Login</h2>
<input type="text" id="senha" placeholder="Digite a senha" />
<button onclick="verificarSenha()">Entrar</button>
</section> <section id="inicio" class="hidden">
<h2>Bem-vindo ao Jornal Oliveira</h2>
<div id="listaArtigos"></div>
</section> <section id="avaliacao" class="hidden">
<h2>Avaliação</h2>
<textarea placeholder="Deixe sua avaliação"></textarea>
</section> <section id="sugestoes" class="hidden">
<h2>Sugestões</h2>
<textarea placeholder="Deixe sua sugestão"></textarea>
</section> <section id="enviar" class="hidden">
<h2>Enviar Matéria</h2>
<input type="text" id="titulo" placeholder="Título" /><br />
<input type="text" id="lide" placeholder="Lide (resumo)" /><br />
<textarea id="corpo" placeholder="Corpo da matéria"></textarea><br />
<input type="text" id="autor" placeholder="Nome do autor" /><br />
<input type="text" id="participantes" placeholder="Outros participantes" /><br />
<input type="date" id="data" /><br />
<select id="categoria">
<option>Notícias da Escola</option>
<option>Entrevistas</option>
<option>Opinião</option>
<option>Cultura e Arte</option>
<option>Esportes</option>
<option>Humor</option>
<option>Você Sabia?</option>
<option>Projetos e Grêmios</option>
<option>Fala Estudante</option>
<option>Investigação</option>
</select><br />
<button onclick="enviarMateria()">Enviar</button>
</section> <section id="editor" class="hidden">
<h2>Painel do Editor</h2>
<div id="painelEditor"></div>
</section> <script>
let artigos = JSON.parse(localStorage.getItem("artigos")) || [];
function verificarSenha() {
const senha = document.getElementById("senha").value;
document.getElementById("login").classList.add("hidden");
document.getElementById("menu").classList.remove("hidden");
document.getElementById("inicio").classList.remove("hidden");
if (senha === "BRJORNAL") {
document.getElementById("btnEnviar").classList.remove("hidden");
} else if (senha === "BRJORNALEDITOR") {
document.getElementById("btnEditor").classList.remove("hidden");
}
listarArtigos();
}
function showSection(id) {
document.querySelectorAll("section").forEach(sec => sec.classList.add("hidden"));
document.getElementById(id).classList.remove("hidden");
if (id === "inicio") listarArtigos();
if (id === "editor") mostrarPainelEditor();
}
function enviarMateria() {
const artigo = {
titulo: document.getElementById("titulo").value,
lide: document.getElementById("lide").value,
corpo: document.getElementById("corpo").value,
autor: document.getElementById("autor").value,
participantes: document.getElementById("participantes").value,
data: document.getElementById("data").value,
categoria: document.getElementById("categoria").value,
aprovado: false
};
artigos.push(artigo);
localStorage.setItem("artigos", JSON.stringify(artigos));
alert("Matéria enviada para aprovação!");
}
function listarArtigos() {
const lista = document.getElementById("listaArtigos");
lista.innerHTML = "";
artigos.filter(a => a.aprovado).forEach((a, i) => {
lista.innerHTML += `<div class="article approved">
<h3>${a.titulo}</h3>
<p><strong>Lide:</strong> ${a.lide}</p>
<p><strong>Autor:</strong> ${a.autor}</p>
<p><strong>Data:</strong> ${a.data}</p>
<details><summary>Leia mais</summary>
<p>${a.corpo}</p>
</details>
</div>`;
});
}
function mostrarPainelEditor() {
const painel = document.getElementById("painelEditor");
painel.innerHTML = "";
artigos.forEach((a, i) => {
painel.innerHTML += `<div class="article">
<h3>${a.titulo}</h3>
<p><strong>Autor:</strong> ${a.autor}</p>
<p><strong>Categoria:</strong> ${a.categoria}</p>
<div class="editor-buttons">
<button onclick="aprovar(${i})">Aprovar</button>
<button onclick="recusar(${i})">Recusar</button>
<button onclick="apagar(${i})">Apagar</button>
</div>
</div>`;
});
}
function aprovar(index) {
artigos[index].aprovado = true;
salvar();
mostrarPainelEditor();
}
function recusar(index) {
artigos[index].aprovado = false;
salvar();
mostrarPainelEditor();
}
function apagar(index) {
artigos.splice(index, 1);
salvar();
mostrarPainelEditor();
}
function salvar() {
localStorage.setItem("artigos", JSON.stringify(artigos));
listarArtigos();
}
</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=Rwhehhehe/teste-1-11" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
</html>