integration drop down übungen
This commit is contained in:
parent
c0093adb0f
commit
5f8beaf75f
2 changed files with 21 additions and 7 deletions
|
|
@ -147,3 +147,10 @@ body.dark #dark-mode-toggle { background: var(--accent); color: #0b1220; border-
|
|||
|
||||
body.dark .page p, body.dark .bio { color: rgba(226,232,240,0.8); }
|
||||
body.dark .skill { border-color: rgba(226,232,240,0.2); color: rgba(226,232,240,0.7); }
|
||||
|
||||
.dropdown { position: relative; }
|
||||
.dropdown-menu { display: none; position: absolute; top: 100%; left: 0; background: rgba(0,20,60,0.97); border: 1px solid rgba(255,255,255,0.07); min-width: 160px; z-index: 200; }
|
||||
.dropdown-menu li { list-style: none; }
|
||||
.dropdown-menu a { display: block; padding: 0.7rem 1.2rem; color: var(--text-muted); font-size: 0.85rem; letter-spacing: 0.08em; text-transform: uppercase; }
|
||||
.dropdown-menu a:hover { color: #fff; }
|
||||
.dropdown.open .dropdown-menu { display: block; }
|
||||
21
js/script.js
21
js/script.js
|
|
@ -1,4 +1,3 @@
|
|||
// Dark Mode
|
||||
document.addEventListener("DOMContentLoaded", () => {
|
||||
const toggle = document.getElementById("dark-mode-toggle");
|
||||
if (!toggle) return;
|
||||
|
|
@ -14,14 +13,22 @@ document.addEventListener("DOMContentLoaded", () => {
|
|||
localStorage.setItem("darkMode", isDark);
|
||||
updateToggle(toggle);
|
||||
});
|
||||
|
||||
document.querySelectorAll('.dropdown > a').forEach(btn => {
|
||||
btn.addEventListener('click', (e) => {
|
||||
e.preventDefault();
|
||||
btn.closest('.dropdown').classList.toggle('open');
|
||||
});
|
||||
});
|
||||
|
||||
document.addEventListener('click', (e) => {
|
||||
if (!e.target.closest('.dropdown')) {
|
||||
document.querySelectorAll('.dropdown').forEach(d => d.classList.remove('open'));
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
function updateToggle(toggle) {
|
||||
const isDark = document.body.classList.contains("dark");
|
||||
toggle.textContent = isDark ? "☀️ Light" : "🌙 Dark";
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
Loading…
Reference in a new issue