sidebar test
All checks were successful
Deploy / trigger (push) Successful in 21s

This commit is contained in:
2026-04-29 11:02:25 +02:00
parent fe6d5901a2
commit d101b22ac1
3 changed files with 41 additions and 33 deletions

View File

@@ -26,35 +26,22 @@
<li><a href="team.html"><i class="fa-solid fa-users"></i> Il Team</a></li>
</ul>
</nav>
<div class="container" style="margin-top: 100px;">
<h1>Area Divulgativa</h1>
<div class="sezioni-appunti">
<button class="btn-appunto" onclick="showfile('documentazione/sicurezza_informatica.md')">Introduzione</button>
<button class="btn-appunto" onclick="showfile('documentazione/crittografia.md')">Crittografia</button>
</div>
<body>
<div class="main-wrapper">
<aside class="sidebar">
<h3>Indice Appunti</h3>
<nav>
<button class="btn-appunto" onclick="showfile('crittografia.md', this)">Crittografia</button>
</nav>
</aside>
<main class="content-area">
<div id="markdown-content" class="appunti-style">
<p>Seleziona un argomento per visualizzare gli appunti.</p>
<h1>Seleziona un argomento</h1>
<p>Clicca a sinistra per caricare gli appunti.</p>
</div>
</main>
</div>
<script>
async function showfile(filename) {
const container = document.getElementById('markdown-content');
container.innerHTML = "<p>Caricamento in corso...</p>";
try {
const response = await fetch(filename);
if (!response.ok) throw new Error("File non trovato");
const markdownRaw = await response.text();
container.innerHTML = marked.parse(markdownRaw);
container.scrollIntoView({ behavior: 'smooth' });
} catch (error) {
container.innerHTML = "<p style='color: red;'>Errore nel caricamento della pagina.</p>";
console.error(error);
}
}
</script>
</body>
<script src="index.js"></script>
</body>

View File

@@ -0,0 +1,21 @@
// Utilizzata la libreria marked per trasformare markdown in html
async function showfile(filename, target) {
const bottoni = document.querySelectorAll('.btn-appunto');
bottoni.forEach(b => b.classList.remove('active'));
if(target) target.classList.add('active');
const container = document.getElementById('markdown-content');
container.innerHTML = "<p>Caricamento in corso...</p>";
try {
const response = await fetch(filename);
if (!response.ok) throw new Error("File non trovato");
const markdownRaw = await response.text();
container.innerHTML = marked.parse(markdownRaw);
} catch (error) {
container.innerHTML = "<p style='color:red'>Errore nel caricamento dell'appunto.</p>";
}
}

View File

@@ -295,11 +295,11 @@ footer a {
}
.appunti-style h1, .appunti-style h2, .appunti-style h3 {
color: #4db8ff; /* Il blu "CryptoSeals" */
color: #4db8ff;
margin-top: 1.5em;
}
/* Stile per i blocchi di codice (molto comuni in crittografia) */
/* Stile per i blocchi di codice */
.appunti-style pre {
background: #000;
padding: 15px;