fix(navbar): responsive navbar scaling, 1240px drawer collapse, flex-shrink fix and mobile spacing v2.2.1

This commit is contained in:
Alex Mueller 2026-09-12 22:02:54 +02:00
parent b6aede1fc4
commit a058cc8920
9 changed files with 182 additions and 98 deletions

View file

@ -5,7 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Admin Panel | IT-Praxisportal</title>
<link rel="icon" type="image/svg+xml" href="assets/favicon.svg">
<link rel="stylesheet" href="assets/style.css">
<link rel="stylesheet" href="assets/style.css?v=2.2.1">
<style>
body {
background: #090d16;
@ -438,7 +438,7 @@
</div>
</div>
<script src="assets/app_auth.js?v=2.1.0"></script>
<script src="assets/app_auth.js?v=2.2.1"></script>
<script>
let ALL_USERS = [];

View file

@ -350,9 +350,13 @@
if (guestBtn) guestBtn.style.display = 'none'; // Gast-Button permanent ausblenden
if (loggedIn && user) {
document.body.classList.add('logged-in');
if (userSpan) {
userSpan.style.display = 'inline-flex';
userSpan.innerHTML = `👤 ${escapeHtml(user.name || user.email)}`;
userSpan.style.cursor = 'pointer';
userSpan.title = 'Zum Kurs-Dashboard wechseln';
userSpan.onclick = () => { window.location.href = 'dashboard.html'; };
}
if (loginBtn) {
loginBtn.style.display = 'inline-flex';
@ -369,7 +373,7 @@
}
if (registerBtn) {
registerBtn.style.display = 'inline-flex';
registerBtn.innerHTML = '<span class="btn-text-desktop">💻 Zum Kurs-Dashboard</span><span class="btn-text-mobile">💻 Dashboard</span>';
registerBtn.innerHTML = '<span class="btn-text-desktop">💻 Zum Kurs-Dashboard</span><span class="btn-text-mobile">Dashboard</span>';
registerBtn.style.background = '#10b981';
registerBtn.removeAttribute('onclick');
registerBtn.onclick = (e) => {
@ -407,10 +411,18 @@
landingUserName.innerText = user.name || user.email.split('@')[0];
}
}
if (navDashLink) navDashLink.style.display = 'inline-flex';
if (navDashLink) navDashLink.style.display = 'none'; // Keine doppelte Schaltfläche in Desktop-Leiste
if (mobDashLink) mobDashLink.style.display = 'flex';
const mobLogoutBtn = document.getElementById('mobile-drawer-logout-btn');
if (mobLogoutBtn) mobLogoutBtn.style.display = 'flex';
const mobDrawerAuthActions = document.getElementById('mobile-drawer-auth-actions');
if (mobDrawerAuthActions) mobDrawerAuthActions.style.display = 'none';
} else {
if (userSpan) userSpan.style.display = 'none';
document.body.classList.remove('logged-in');
if (userSpan) {
userSpan.style.display = 'none';
userSpan.onclick = null;
}
if (loginBtn) {
loginBtn.style.display = 'inline-flex';
loginBtn.innerText = '🔑 Anmelden';
@ -421,10 +433,15 @@
}
if (registerBtn) {
registerBtn.style.display = 'inline-flex';
registerBtn.innerHTML = '<span class="btn-text-desktop">✨ Kostenlos registrieren</span><span class="btn-text-mobile">✨ Registrieren</span>';
registerBtn.innerHTML = '<span class="btn-text-desktop">✨ Kostenlos registrieren</span><span class="btn-text-mobile">Starten</span>';
registerBtn.style.background = '#0284c7';
registerBtn.onclick = () => window.openAuthModal('register', { allowClose: true });
}
const mobDrawerAuthActions = document.getElementById('mobile-drawer-auth-actions');
if (mobDrawerAuthActions) mobDrawerAuthActions.style.display = 'flex';
if (mobDashLink) mobDashLink.style.display = 'none';
const mobLogoutBtn = document.getElementById('mobile-drawer-logout-btn');
if (mobLogoutBtn) mobLogoutBtn.style.display = 'none';
if (heroPrimaryCta) {
heroPrimaryCta.innerHTML = '<span>🚀 Jetzt kostenlos registrieren</span>';
heroPrimaryCta.onclick = (e) => {
@ -449,6 +466,8 @@
if (landingBanner) landingBanner.style.display = 'none';
if (navDashLink) navDashLink.style.display = 'none';
if (mobDashLink) mobDashLink.style.display = 'none';
const mobLogoutBtn = document.getElementById('mobile-drawer-logout-btn');
if (mobLogoutBtn) mobLogoutBtn.style.display = 'none';
}
// 🔒 Strikter Rollen-Filter für Dozenten- und Admin-Funktionen

View file

@ -1054,41 +1054,50 @@ textarea:focus {
.portal-header-bar {
position: sticky;
top: 0;
z-index: 50;
background: rgba(15, 23, 42, 0.85);
z-index: 100;
background: rgba(15, 23, 42, 0.94);
backdrop-filter: blur(16px);
-webkit-backdrop-filter: blur(16px);
border-bottom: 1px solid rgba(255, 255, 255, 0.08);
padding: 12px 24px;
padding: 10px 20px;
width: 100%;
box-sizing: border-box;
}
.portal-nav-container {
max-width: 1280px;
max-width: 1320px;
margin: 0 auto;
display: flex;
justify-content: space-between;
align-items: center;
gap: 16px;
flex-wrap: nowrap;
width: 100%;
box-sizing: border-box;
}
.portal-brand {
display: flex;
align-items: center;
gap: 12px;
gap: 10px;
text-decoration: none;
color: white;
flex-shrink: 0;
min-width: 0;
white-space: nowrap;
}
.portal-brand-logo {
width: 38px;
height: 38px;
border-radius: 10px;
width: 34px;
height: 34px;
border-radius: 9px;
background: linear-gradient(135deg, rgba(56, 189, 248, 0.2), rgba(37, 99, 235, 0.2));
border: 1px solid rgba(56, 189, 248, 0.4);
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0 0 15px rgba(56, 189, 248, 0.15);
flex-shrink: 0;
}
.portal-brand-title {
@ -1096,38 +1105,51 @@ textarea:focus {
font-weight: 800;
letter-spacing: -0.4px;
color: #f8fafc;
line-height: 1.2;
line-height: 1;
white-space: nowrap;
flex-shrink: 0;
}
.portal-brand-badge {
font-size: 0.68rem;
font-size: 0.65rem;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.8px;
background: linear-gradient(90deg, #0284c7, #2563eb);
color: white;
padding: 2px 6px;
padding: 2px 7px;
border-radius: 4px;
margin-left: 6px;
vertical-align: middle;
white-space: nowrap;
flex-shrink: 0;
}
.portal-nav-links {
display: flex;
align-items: center;
gap: 20px;
gap: 10px;
flex-shrink: 0;
white-space: nowrap;
}
.portal-nav-link {
color: #94a3b8;
text-decoration: none;
font-size: 0.88rem;
font-size: 0.83rem;
font-weight: 600;
transition: color 0.15s ease;
white-space: nowrap;
padding: 4px 7px;
border-radius: 6px;
transition: all 0.15s ease;
display: inline-flex;
align-items: center;
gap: 5px;
}
.portal-nav-link:hover, .portal-nav-link.active {
color: #38bdf8;
background: rgba(56, 189, 248, 0.08);
}
.portal-hero {
@ -1481,26 +1503,35 @@ html, body {
max-width: 100vw;
}
/* Tablet & Smaller Desktop Navigation Collapse */
@media (max-width: 1240px) {
.portal-nav-links {
display: none !important;
}
.mobile-menu-toggle {
display: inline-flex !important;
align-items: center;
justify-content: center;
}
}
@media (max-width: 768px) {
.portal-container {
padding: 0 16px !important;
}
.portal-header-bar {
padding: 10px 14px;
padding: 9px 14px;
}
.portal-brand-logo {
width: 30px;
height: 30px;
width: 32px;
height: 32px;
}
.portal-brand-title {
font-size: 1rem;
}
.portal-nav-links {
display: none !important;
font-size: 1.05rem;
white-space: nowrap !important;
}
.portal-hero {
@ -1744,34 +1775,50 @@ html, body {
display: none !important; /* Hide alpha badge on small mobile screens */
}
#nav-btn-login {
display: none !important; /* Im mobilen Drawer Menü verfügbar */
/* Logged-in State on Mobile: Clean single-line header with user badge + hamburger */
body.logged-in #nav-btn-login,
body.logged-in #nav-btn-register,
#nav-btn-logout {
display: none !important; /* All actions available via mobile drawer */
}
/* Logged-out State on Mobile: Hide Anmelden button from top header, keep Starten + hamburger */
body:not(.logged-in) #nav-btn-login {
display: none !important;
}
#nav-btn-register {
padding: 6px 10px !important;
padding: 5px 9px !important;
font-size: 0.78rem !important;
white-space: nowrap !important;
}
#nav-profile-pill {
display: none !important; /* Im mobilen Drawer Menü verfügbar */
display: inline-flex !important;
align-items: center;
gap: 4px;
padding: 4px 8px !important;
max-width: 110px;
flex-shrink: 1;
overflow: hidden;
background: rgba(255, 255, 255, 0.08) !important;
border-radius: 99px;
}
#nav-auth-user {
display: none !important;
display: inline-block !important;
font-size: 0.76rem !important;
max-width: 80px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap !important;
color: #38bdf8 !important;
}
#nav-auth-role {
display: none !important;
}
#nav-btn-logout {
padding: 6px 10px !important;
font-size: 0.78rem !important;
white-space: nowrap !important;
}
.portal-stats-bar {
grid-template-columns: repeat(2, 1fr) !important;
gap: 8px !important;
@ -1782,6 +1829,43 @@ html, body {
}
}
/* Ultra-compact Mobile Screen adjustments (<= 400px e.g. iPhone SE, 375px, 360px, 320px) */
@media (max-width: 400px) {
.portal-header-bar {
padding: 7px 8px !important;
}
.portal-nav-container {
gap: 6px !important;
}
.portal-brand {
gap: 6px !important;
}
.portal-brand-logo {
width: 28px !important;
height: 28px !important;
}
.portal-brand-title {
font-size: 0.90rem !important;
}
#nav-auth-user {
max-width: 70px !important;
font-size: 0.72rem !important;
}
#nav-profile-pill {
max-width: 95px !important;
padding: 3px 6px !important;
}
#nav-btn-register {
padding: 4px 7px !important;
font-size: 0.72rem !important;
}
.mobile-menu-toggle {
width: 32px !important;
height: 32px !important;
font-size: 1.05rem !important;
}
}
/* Mobile Drawer & Hamburger Menu */
.mobile-menu-toggle {
display: none;
@ -1789,10 +1873,13 @@ html, body {
border: 1px solid rgba(255, 255, 255, 0.15);
color: #f8fafc;
font-size: 1.2rem;
padding: 6px 10px;
width: 36px;
height: 36px;
padding: 0;
border-radius: 8px;
cursor: pointer;
line-height: 1;
flex-shrink: 0;
transition: background 0.15s ease;
}
@ -1800,14 +1887,6 @@ html, body {
background: rgba(255, 255, 255, 0.15);
}
@media (max-width: 768px) {
.mobile-menu-toggle {
display: inline-flex;
align-items: center;
justify-content: center;
}
}
.mobile-drawer {
background: #090d16;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);

View file

@ -6,7 +6,7 @@
<title>IT-Praxisportal | Lernbereich &amp; Kurs-Dashboard</title>
<link rel="icon" type="image/svg+xml" href="assets/favicon.svg">
<meta name="description" content="Dein persönlicher IT-Lernbereich: 16 Fachdisziplinen, 264 Module, Monaco Web-IDE, KMK-Lernfelder und IHK-Prüfungsvorbereitung.">
<link rel="stylesheet" href="assets/style.css">
<link rel="stylesheet" href="assets/style.css?v=2.2.1">
<style>
.portal-container {
max-width: 1240px;
@ -274,11 +274,15 @@
<a href="#overview" class="mobile-drawer-link" onclick="toggleMobileMenu()">🚀 Übersicht</a>
<a href="#katalog" class="mobile-drawer-link" onclick="toggleMobileMenu()">📚 Meine Kurse</a>
<a href="#ihk-section" class="mobile-drawer-link" onclick="toggleMobileMenu()">🎓 IHK AP1 &amp; AP2 Prüfung</a>
<a href="workspace.html?course=python" class="mobile-drawer-link" onclick="toggleMobileMenu()">💻 Web-IDE starten</a>
<a href="#zertifikate-section" class="mobile-drawer-link" onclick="toggleMobileMenu()">🏆 Meine Zertifikate</a>
<a href="index.html?view=landing" class="mobile-drawer-link" onclick="toggleMobileMenu()">🌐 Zur Startseite</a>
<a href="impressum.html" class="mobile-drawer-link" onclick="toggleMobileMenu()">⚖️ Impressum</a>
<a href="datenschutz.html" class="mobile-drawer-link" onclick="toggleMobileMenu()">🔒 Datenschutzerklärung</a>
<a href="teacher.html" class="mobile-drawer-link" id="mobile-drawer-teacher-link" style="display: none;">👨‍🏫 Dozenten-Portal</a>
<a href="admin.html" class="mobile-drawer-link" id="mobile-drawer-admin-link" style="display: none; color: #f87171; font-weight: 800;">🛡️ Admin-Panel</a>
<button type="button" class="mobile-drawer-link" style="color: #f87171; background: rgba(239, 68, 68, 0.12); border: 1px solid rgba(239, 68, 68, 0.25); text-align: left; cursor: pointer; border-radius: 6px; padding: 10px 14px; margin-top: 8px; font-weight: 700; width: 100%; display: flex; align-items: center; gap: 8px; font-size: 0.9rem;" onclick="if(confirm('Möchtest du dich wirklich abmelden?')) window.AUTH.logout();">
🚪 Abmelden
</button>
</div>
<!-- 2. DASHBOARD WELCOME & LIVE METRICS -->
@ -1185,7 +1189,7 @@
</footer>
<!-- Scripts -->
<script src="assets/app_auth.js?v=2.1.0"></script>
<script src="assets/app_auth.js?v=2.2.1"></script>
<script src="assets/it_ausbildungen_manifest.js?v=2.1.0"></script>
<script src="assets/courses_manifest.js?v=2.1.0"></script>
<script src="assets/certificate.js?v=2.1.0"></script>

View file

@ -6,7 +6,7 @@
<title>Datenschutzerklärung | IT-Praxisportal</title>
<meta name="description" content="Datenschutzerklärung des IT-Praxisportals: Transparente Informationen zur DSGVO-konformen Datenverarbeitung, Zero-Tracking-Prinzip und Betroffenenrechte.">
<link rel="icon" type="image/svg+xml" href="assets/favicon.svg">
<link rel="stylesheet" href="assets/style.css">
<link rel="stylesheet" href="assets/style.css?v=2.2.1">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;600;700&display=swap" rel="stylesheet">
@ -22,7 +22,7 @@
</div>
<div>
<span class="portal-brand-title">IT-Praxisportal</span>
<span class="portal-brand-badge">Praxis &bull; IHK &bull; Web-IDE</span>
<span class="portal-brand-badge">Datenschutz</span>
</div>
</a>
@ -276,7 +276,7 @@
</footer>
<!-- Scripts -->
<script src="assets/app_auth.js?v=2.1.0"></script>
<script src="assets/app_auth.js?v=2.2.1"></script>
<script>
function toggleMobileMenu() {
const drawer = document.getElementById('portal-mobile-drawer');

View file

@ -6,7 +6,7 @@
<title>Impressum | IT-Praxisportal</title>
<meta name="description" content="Gesetzliche Anbieterkennzeichnung und rechtliche Hinweise des IT-Praxisportals gemäß § 5 DDG und § 18 MStV.">
<link rel="icon" type="image/svg+xml" href="assets/favicon.svg">
<link rel="stylesheet" href="assets/style.css">
<link rel="stylesheet" href="assets/style.css?v=2.2.1">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;600;700&display=swap" rel="stylesheet">
@ -22,7 +22,7 @@
</div>
<div>
<span class="portal-brand-title">IT-Praxisportal</span>
<span class="portal-brand-badge">Praxis &bull; IHK &bull; Web-IDE</span>
<span class="portal-brand-badge">Impressum</span>
</div>
</a>
@ -230,7 +230,7 @@
</footer>
<!-- Scripts -->
<script src="assets/app_auth.js?v=2.1.0"></script>
<script src="assets/app_auth.js?v=2.2.1"></script>
<script>
function toggleMobileMenu() {
const drawer = document.getElementById('portal-mobile-drawer');

View file

@ -10,8 +10,8 @@
<meta property="og:description" content="Interaktives IT-Praxisportal mit Monaco Web-IDE, 216+ Modulen und 90-Minuten IHK-Prüfungssimulation. Kostenlos registrieren und Kurse im Dashboard wählen.">
<meta property="og:type" content="website">
<meta property="og:url" content="https://alpha.it-praxisportal.de/">
<link rel="stylesheet" href="assets/style.css">
<script src="assets/app_auth.js?v=2.1.0"></script>
<link rel="stylesheet" href="assets/style.css?v=2.2.1">
<script src="assets/app_auth.js?v=2.2.1"></script>
<script>
// Sofortige automatische Weiterleitung für angemeldete Nutzer direkt ins Dashboard
(function autoRedirectLoggedInUser() {
@ -270,15 +270,14 @@
<a href="#features-ide" class="portal-nav-link">💻 Web-IDE</a>
<a href="#ihk-section" class="portal-nav-link">🎓 IHK Prüfung</a>
<a href="#zielgruppen" class="portal-nav-link">👥 Für wen?</a>
<a href="dashboard.html" class="portal-nav-link" id="nav-dashboard-link" style="display: none; color: #34d399; font-weight: 800; background: rgba(52, 211, 153, 0.12); padding: 5px 12px; border-radius: 6px; border: 1px solid rgba(52, 211, 153, 0.3);">💻 Zum Kurs-Dashboard &rarr;</a>
<a href="teacher.html" class="portal-nav-link" id="nav-teacher-link" style="display: none;">👨‍🏫 Dozenten</a>
<a href="admin.html" class="portal-nav-link" id="nav-admin-link" style="display: none; color: #f87171; font-weight: 800;">🛡️ Admin</a>
</nav>
<div style="display: flex; align-items: center; gap: 8px;">
<span id="nav-auth-user" style="display: none; font-size: 0.82rem; font-weight: 700; color: #38bdf8; background: rgba(56, 189, 248, 0.1); padding: 4px 10px; border-radius: 99px; border: 1px solid rgba(56, 189, 248, 0.2);"></span>
<button type="button" class="btn" id="nav-btn-login" style="padding: 6px 12px; font-size: 0.82rem; background: rgba(255,255,255,0.12); color: white; border: 1px solid rgba(255,255,255,0.2);" onclick="window.openAuthModal('login', { allowClose: true })">🔑 Anmelden</button>
<button type="button" class="btn" id="nav-btn-register" style="padding: 6px 12px; font-size: 0.82rem; background: #0284c7; color: white;" onclick="window.openAuthModal('register', { allowClose: true })"><span class="btn-text-desktop">✨ Kostenlos registrieren</span><span class="btn-text-mobile">Starten</span></button>
<div style="display: flex; align-items: center; gap: 8px; flex-shrink: 0;">
<span id="nav-auth-user" style="display: none; font-size: 0.82rem; font-weight: 700; color: #38bdf8; background: rgba(56, 189, 248, 0.1); padding: 4px 10px; border-radius: 99px; border: 1px solid rgba(56, 189, 248, 0.2); white-space: nowrap;"></span>
<button type="button" class="btn" id="nav-btn-login" style="padding: 6px 12px; font-size: 0.82rem; background: rgba(255,255,255,0.12); color: white; border: 1px solid rgba(255,255,255,0.2); white-space: nowrap;" onclick="window.openAuthModal('login', { allowClose: true })">🔑 Anmelden</button>
<button type="button" class="btn" id="nav-btn-register" style="padding: 6px 12px; font-size: 0.82rem; background: #0284c7; color: white; white-space: nowrap;" onclick="window.openAuthModal('register', { allowClose: true })"><span class="btn-text-desktop">✨ Kostenlos registrieren</span><span class="btn-text-mobile">Starten</span></button>
<button type="button" id="portal-mobile-menu-btn" class="mobile-menu-toggle" aria-label="Menü umschalten" onclick="toggleMobileMenu()">
<span>☰</span>
</button>
@ -288,6 +287,16 @@
<!-- Mobile Navigation Drawer -->
<div id="portal-mobile-drawer" class="mobile-drawer" style="display: none;">
<!-- Auth-Aktionen für mobile/tablet Besucher -->
<div id="mobile-drawer-auth-actions" style="display: flex; flex-direction: column; gap: 8px; margin-bottom: 12px; padding-bottom: 12px; border-bottom: 1px solid rgba(255, 255, 255, 0.1);">
<button type="button" class="mobile-drawer-link" id="mobile-drawer-login-btn" style="color: #38bdf8; background: rgba(56, 189, 248, 0.1); border: 1px solid rgba(56, 189, 248, 0.25); text-align: left; cursor: pointer; border-radius: 6px; padding: 10px 14px; font-weight: 700; width: 100%; display: flex; align-items: center; gap: 8px; font-size: 0.9rem;" onclick="toggleMobileMenu(); window.openAuthModal('login', { allowClose: true });">
🔑 Anmelden
</button>
<button type="button" class="mobile-drawer-link" id="mobile-drawer-register-btn" style="color: #ffffff; background: #0284c7; border: 1px solid #0284c7; text-align: left; cursor: pointer; border-radius: 6px; padding: 10px 14px; font-weight: 700; width: 100%; display: flex; align-items: center; gap: 8px; font-size: 0.9rem;" onclick="toggleMobileMenu(); window.openAuthModal('register', { allowClose: true });">
✨ Kostenlos registrieren
</button>
</div>
<a href="#hero" class="mobile-drawer-link" onclick="toggleMobileMenu()">🚀 Start &amp; Übersicht</a>
<a href="#was-du-bekommst" class="mobile-drawer-link" onclick="toggleMobileMenu()">💎 Was du bekommst</a>
<a href="#dashboard-spotlight" class="mobile-drawer-link" onclick="toggleMobileMenu()">📊 Features &amp; Vorschau</a>
@ -298,6 +307,9 @@
<a href="dashboard.html" class="mobile-drawer-link" id="mobile-drawer-dash-link" style="display: none; color: #34d399; font-weight: 800; background: rgba(52, 211, 153, 0.1); padding: 8px 12px; border-radius: 6px; border: 1px solid rgba(52, 211, 153, 0.3);">💻 Zum Kurs-Dashboard &rarr;</a>
<a href="teacher.html" class="mobile-drawer-link" id="mobile-drawer-teacher-link" style="display: none;">👨‍🏫 Dozenten-Portal</a>
<a href="admin.html" class="mobile-drawer-link" id="mobile-drawer-admin-link" style="display: none; color: #f87171; font-weight: 800;">🛡️ Admin-Panel</a>
<button type="button" class="mobile-drawer-link" id="mobile-drawer-logout-btn" style="display: none; color: #f87171; background: rgba(239, 68, 68, 0.12); border: 1px solid rgba(239, 68, 68, 0.25); text-align: left; cursor: pointer; border-radius: 6px; padding: 10px 14px; margin-top: 8px; font-weight: 700; width: 100%; align-items: center; gap: 8px; font-size: 0.9rem;" onclick="if(confirm('Möchtest du dich wirklich abmelden?')) window.AUTH.logout();">
🚪 Abmelden
</button>
</div>
<!-- 2. HIGH-CONVERTING HERO SECTION -->
@ -855,36 +867,6 @@
}, 100);
});
}
document.addEventListener('DOMContentLoaded', () => {
// Prüfe Benutzer-Status
if (window.AUTH && window.AUTH.isLoggedIn()) {
const user = window.AUTH.getUser();
const banner = document.getElementById('landing-logged-in-banner');
const userNameEl = document.getElementById('landing-user-name');
const dashLink = document.getElementById('nav-dashboard-link');
const mobDashLink = document.getElementById('mobile-drawer-dash-link');
const mobTeacherLink = document.getElementById('mobile-drawer-teacher-link');
const mobAdminLink = document.getElementById('mobile-drawer-admin-link');
if (dashLink) dashLink.style.display = 'inline-flex';
if (mobDashLink) mobDashLink.style.display = 'flex';
if (user) {
if (user.role === 'admin') {
if (mobAdminLink) mobAdminLink.style.display = 'flex';
if (mobTeacherLink) mobTeacherLink.style.display = 'flex';
} else if (user.role === 'teacher') {
if (mobTeacherLink) mobTeacherLink.style.display = 'flex';
}
}
if (banner && user) {
banner.style.display = 'flex';
if (userNameEl) userNameEl.innerText = user.name || user.email.split('@')[0];
}
}
});
</script>
</body>
</html>

View file

@ -5,7 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Dozenten-Dashboard | IT-Praxisportal</title>
<link rel="icon" type="image/svg+xml" href="assets/favicon.svg">
<link rel="stylesheet" href="assets/style.css">
<link rel="stylesheet" href="assets/style.css?v=2.2.1">
<style>
.class-card {
background: #ffffff;
@ -279,7 +279,7 @@
</div>
</div>
<script src="assets/app_auth.js?v=2.1.0"></script>
<script src="assets/app_auth.js?v=2.2.1"></script>
<script src="assets/courses_manifest.js?v=2.1.0"></script>
<script src="assets/it_ausbildungen_manifest.js?v=2.1.0"></script>

View file

@ -5,7 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>IT-Praxisportal Web-IDE | Interaktiver Arbeitsbereich</title>
<link rel="icon" type="image/svg+xml" href="assets/favicon.svg">
<link rel="stylesheet" href="assets/style.css">
<link rel="stylesheet" href="assets/style.css?v=2.2.1">
<style>
body {
margin: 0;
@ -354,7 +354,7 @@
<script src="assets/gamification.js"></script>
<script src="assets/interpreter.js"></script>
<script src="assets/certificate.js?v=2.1.0"></script>
<script src="assets/app_auth.js?v=2.1.0"></script>
<script src="assets/app_auth.js?v=2.2.1"></script>
<script src="assets/parsons.js"></script>
<script src="assets/code_guard.js"></script>
<script src="assets/runners/runner_registry.js"></script>