diff --git a/src/web/routes/dashboard.ts b/src/web/routes/dashboard.ts index 2388d1d..be66923 100644 --- a/src/web/routes/dashboard.ts +++ b/src/web/routes/dashboard.ts @@ -327,16 +327,54 @@ router.get('/', (req, res) => { .linkish:hover { text-decoration:underline; } .section-title { font-size:18px; font-weight:800; margin:0; letter-spacing:-0.02em; } .section-sub { color:var(--muted); margin:4px 0 0; font-size:13px; line-height:1.5; } + .overview-hero { display:flex; gap:16px; align-items:center; justify-content:space-between; padding:22px 24px; } + .overview-hero-main { display:flex; gap:16px; align-items:center; min-width:0; flex:1; } + .overview-avatar { width:64px; height:64px; border-radius:20px; object-fit:cover; border:1px solid rgba(255,255,255,0.12); box-shadow:0 16px 32px rgba(0,0,0,0.3); } + .overview-copy { min-width:0; flex:1; } + .overview-id { color:var(--muted); margin:6px 0 10px; font-size:13px; } + .overview-status { display:flex; align-items:center; gap:10px; white-space:nowrap; color:var(--muted-strong); font-weight:700; } + .status-dot { width:10px; height:10px; border-radius:50%; background:#22c55e; box-shadow:0 0 0 6px rgba(34,197,94,0.12); } + .overview-grid { display:grid; gap:16px; grid-template-columns:1.05fr 1.05fr 1fr; margin-top:16px; } + .overview-panel { min-height:350px; } + .overview-panel .section-title { font-size:17px; } + .overview-panel .detail-grid { margin-top:14px; grid-template-columns:repeat(2, minmax(0, 1fr)); } + .overview-stat { padding:14px 16px; } + .overview-stat-value { font-size:16px; font-weight:800; color:var(--text); } + .activity-list { display:flex; flex-direction:column; gap:12px; margin-top:14px; } + .activity-card { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:16px 18px; border:1px solid rgba(255,255,255,0.08); border-radius:18px; background:linear-gradient(180deg, rgba(255,255,255,0.045), rgba(255,255,255,0.025)); box-shadow:0 16px 32px rgba(0,0,0,0.24); } + .activity-card-main { display:flex; align-items:center; gap:12px; } + .activity-icon { width:42px; height:42px; border-radius:14px; display:flex; align-items:center; justify-content:center; font-size:18px; background:rgba(249,115,22,0.12); border:1px solid rgba(249,115,22,0.18); color:#ffd7b0; } + .activity-icon.commands { background:rgba(234,88,12,0.12); color:#fdba74; } + .activity-icon.automod { background:rgba(21,128,61,0.14); color:#86efac; border-color:rgba(34,197,94,0.16); } + .activity-value { font-size:18px; font-weight:800; color:var(--text); margin-top:2px; } + .activity-spark { width:92px; height:28px; border-radius:999px; position:relative; overflow:hidden; } + .activity-spark::before { content:''; position:absolute; inset:0; border-radius:999px; opacity:0.9; } + .activity-spark.messages::before { background:linear-gradient(135deg, transparent 0 10%, rgba(255,255,255,0) 10% 16%, rgba(255,176,102,0.95) 16% 20%, transparent 20% 36%, rgba(255,176,102,0.95) 36% 44%, transparent 44% 58%, rgba(255,176,102,0.8) 58% 65%, transparent 65%); } + .activity-spark.commands::before { background:linear-gradient(135deg, transparent 0 12%, rgba(168,85,247,0.9) 12% 18%, transparent 18% 34%, rgba(192,132,252,0.92) 34% 46%, transparent 46% 62%, rgba(168,85,247,0.72) 62% 70%, transparent 70%); } + .activity-spark.automod::before { background:linear-gradient(135deg, transparent 0 18%, rgba(74,222,128,0.86) 18% 24%, transparent 24% 42%, rgba(74,222,128,0.95) 42% 51%, transparent 51% 66%, rgba(34,197,94,0.78) 66% 74%, transparent 74%); } + .logs-panel .log-list { margin-top:14px; } + .panel-action { margin-top:18px; width:100%; justify-content:center; } + .panel-action.secondary-btn { display:flex; align-items:center; justify-content:center; gap:10px; } + .quick-actions { margin-top:16px; } + .quick-actions-grid { display:grid; grid-template-columns:repeat(6, minmax(0, 1fr)); gap:14px; margin-top:16px; } + .quick-action { text-align:left; padding:16px 16px 14px; border-radius:18px; border:1px solid rgba(255,255,255,0.08); background:linear-gradient(180deg, rgba(255,255,255,0.045), rgba(255,255,255,0.02)); box-shadow:0 16px 32px rgba(0,0,0,0.22); } + .quick-action-head { display:flex; align-items:center; gap:10px; margin-bottom:8px; font-weight:800; color:var(--text); } + .quick-action-icon { width:38px; height:38px; border-radius:14px; display:flex; align-items:center; justify-content:center; font-size:17px; background:rgba(249,115,22,0.14); color:#ffd7b0; border:1px solid rgba(249,115,22,0.18); } + .quick-action p { margin:0; color:var(--muted); font-size:12px; line-height:1.5; } .spinner { width:28px; height:28px; border:3px solid rgba(255,255,255,0.12); border-top-color:var(--accent); border-radius:50%; animation:spin .6s linear infinite; margin:12px auto; } @media (max-width: 1180px) { .layout { flex-direction:column; } .sidebar { width:100%; min-height:auto; position:relative; } .content { padding:22px 18px 40px; } + .overview-grid { grid-template-columns:1fr; } + .quick-actions-grid { grid-template-columns:repeat(3, minmax(0, 1fr)); } } @media (max-width: 900px) { .topbar { flex-direction:column; } .guild-select-shell { width:100%; min-width:0; } h1 { font-size:28px; } + .overview-hero { flex-direction:column; align-items:flex-start; } + .overview-hero-main { width:100%; } } @media (max-width: 720px) { .sidebar { padding:22px 14px 16px; } @@ -344,6 +382,9 @@ router.get('/', (req, res) => { .card { padding:18px; border-radius:20px; } .grid, .tickets-grid, .detail-grid { grid-template-columns:1fr; } .row, .inline, .form-row { flex-direction:column; align-items:stretch; } + .overview-panel .detail-grid, .quick-actions-grid { grid-template-columns:1fr; } + .activity-card { flex-direction:column; align-items:flex-start; } + .activity-spark { width:100%; } } @keyframes spin { to { transform:rotate(360deg); } } .loading-wrap { display:flex; flex-direction:column; align-items:center; gap:6px; padding:24px; color:var(--muted); font-size:13px; } @@ -366,40 +407,86 @@ router.get('/', (req, res) => {
-
- icon -
-

Guild

-

ID: -

-
+
+
+ icon +
+

Guild

+

ID: -

+
+
+
+
+ + Bot aktiv
-
Bot aktiv
-
-
+
+

Guild Infos

-
-
Owner
-
-
Erstellt
-
-
Member
-
-
Channels
-
-
Tickets offen
-
-
Tickets IP / Closed
- / -
+
+
Owner
-
+
Erstellt
-
+
Member
-
+
Channels
-
+
Tickets offen
-
+
Tickets IP / Closed
- / -
+
-
+

Activity

-
-
Messages (24h)
-
-
Commands (24h)
-
-
Automod (24h)
-
+
+
+
+
💬
+
+
Messages (24h)
+
-
+
+
+
+
+
+
+
⌘
+
+
Commands (24h)
+
-
+
+
+
+
+
+
+
🛡
+
+
Automod (24h)
+
-
+
+
+
+
+
-
+

Guild Logs

    +
    +

    Schnellzugriff

    +

    Wichtige Funktionen auf einen Blick

    +
    + + + + + + +
    +
    @@ -1317,6 +1404,19 @@ router.get('/', (req, res) => { let editingReactionRole = null; let supportLoginCache = {}; let eventsCache = []; + const MODULE_LABELS = { + ticketsEnabled: 'TICKETS', + automodEnabled: 'AUTOMOD', + musicEnabled: 'MUSIC', + welcomeEnabled: 'WELCOME', + dynamicVoiceEnabled: 'DYNAMICVOICE', + statuspageEnabled: 'STATUSPAGE', + birthdayEnabled: 'BIRTHDAY', + reactionRolesEnabled: 'REACTIONROLES', + serverStatsEnabled: 'SERVERSTATS', + eventsEnabled: 'EVENTS', + adminEnabled: 'ADMIN' + }; function activateSection(key) { sections.forEach((s) => s.classList.toggle('active', s.dataset.section === key)); @@ -1429,7 +1529,7 @@ router.get('/', (req, res) => { Object.entries(mods).forEach(([key, on]) => { const badge = document.createElement('span'); badge.className = 'badge' + (on ? ' active' : ''); - badge.textContent = key.replace('Enabled', ''); + badge.textContent = MODULE_LABELS[key] || key.replace('Enabled', '').toUpperCase(); guildModules.appendChild(badge); }); } @@ -2872,6 +2972,14 @@ router.get('/', (req, res) => { }); }); + document.querySelectorAll('[data-nav-target]').forEach((button) => { + button.addEventListener('click', () => { + const target = button.getAttribute('data-nav-target') || 'overview'; + activateSection(target); + history.replaceState(null, '', '#' + target); + }); + }); + document.querySelectorAll('.ticket-tab-btn').forEach((btn) => { btn.addEventListener('click', async () => { document.querySelectorAll('.ticket-tab-btn').forEach((b) => b.classList.remove('active'));