diff --git a/public/css/dashboard.css b/public/css/dashboard.css index 110b3d7..56b0f6b 100644 --- a/public/css/dashboard.css +++ b/public/css/dashboard.css @@ -105,24 +105,97 @@ body { display: inline-block; } +/* ============================================================================ + NAVIGATION BUTTONS - COMPLETE REDESIGN + ============================================================================ */ + +/* Base button styles */ +.btn { + display: inline-flex; + align-items: center; + gap: 0.5rem; + padding: 0.75rem 1.5rem; + border: none; + border-radius: 0.5rem; + font-weight: 600; + font-size: 0.9rem; + text-decoration: none; + cursor: pointer; + transition: all 0.3s ease; + white-space: nowrap; +} + +/* Primary button (Dashboard) */ .btn-primary { - background: linear-gradient(135deg, #00d4ff, #0891b2); + background: #2563eb; color: white; } .btn-primary:hover { + background: #1d4ed8; transform: translateY(-2px); - box-shadow: 0 10px 25px rgba(0, 212, 255, 0.3); + box-shadow: 0 4px 12px rgba(37, 99, 235, 0.4); } +/* Logout button */ .btn-logout { - background: linear-gradient(135deg, #dc3545, #c82333); + background: #dc2626; color: white; } .btn-logout:hover { + background: #b91c1c; transform: translateY(-2px); - box-shadow: 0 10px 25px rgba(220, 53, 69, 0.3); + box-shadow: 0 4px 12px rgba(220, 38, 38, 0.4); +} + +/* Mobile navigation container */ +.mobile-nav-buttons { + display: flex; + gap: 1rem; + align-items: center; + justify-content: flex-end; + margin: 1rem 0; + flex-wrap: wrap; + position: absolute; + top: 1rem; + right: 1rem; +} + +/* Login button */ +.admin-login-btn { + background: #f59e0b; + color: white; +} + +.admin-login-btn:hover { + background: #d97706; + transform: translateY(-2px); + box-shadow: 0 4px 12px rgba(245, 158, 11, 0.4); +} + +/* Dashboard button */ +.dashboard-btn { + background: #2563eb; + color: white; +} + +.dashboard-btn:hover { + background: #1d4ed8; + transform: translateY(-2px); + box-shadow: 0 4px 12px rgba(37, 99, 235, 0.4); +} + +/* Logout button */ +.logout-btn { + background: #dc2626; + color: white; +} + +.logout-btn:hover { + background: #b91c1c; + transform: translateY(-2px); + box-shadow: 0 4px 12px rgba(220, 38, 38, 0.4); } .dashboard-grid { diff --git a/public/css/leaderboard.css b/public/css/index.css similarity index 93% rename from public/css/leaderboard.css rename to public/css/index.css index 0f38426..05c5153 100644 --- a/public/css/leaderboard.css +++ b/public/css/index.css @@ -32,6 +32,70 @@ body { z-index: 1000; } +/* Mobile Navigation Buttons */ +.mobile-nav-buttons { + position: fixed; + top: 2rem; + right: 2rem; + display: flex; + gap: 1rem; + align-items: center; + z-index: 1000; +} + +.mobile-nav-buttons .admin-login-btn, +.mobile-nav-buttons .dashboard-btn, +.mobile-nav-buttons .logout-btn { + padding: 0.75rem 1.5rem; + border-radius: 0.5rem; + text-decoration: none; + font-weight: 600; + transition: all 0.3s ease; + border: none; + cursor: pointer; + display: inline-flex; + align-items: center; + gap: 0.5rem; + font-size: 0.9rem; +} + +.mobile-nav-buttons .admin-login-btn { + background: #f59e0b; + color: white; +} + +.mobile-nav-buttons .dashboard-btn { + background: #2563eb; + color: white; +} + +.mobile-nav-buttons .logout-btn { + background: #dc2626; + color: white; +} + +.mobile-nav-buttons .admin-login-btn:hover, +.mobile-nav-buttons .dashboard-btn:hover, +.mobile-nav-buttons .logout-btn:hover { + transform: translateY(-2px); + box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3); +} + +.mobile-nav-buttons .admin-login-btn:hover { + background: #d97706; + box-shadow: 0 4px 12px rgba(245, 158, 11, 0.4); +} + +.mobile-nav-buttons .dashboard-btn:hover { + background: #1d4ed8; + box-shadow: 0 4px 12px rgba(37, 99, 235, 0.4); +} + +.mobile-nav-buttons .logout-btn:hover { + background: #b91c1c; + box-shadow: 0 4px 12px rgba(220, 38, 38, 0.4); +} + .language-selector select { padding: 0.5rem 1rem; background: rgba(15, 23, 42, 0.9); diff --git a/public/dashboard.html b/public/dashboard.html index 0e98516..4703ca7 100644 --- a/public/dashboard.html +++ b/public/dashboard.html @@ -6,6 +6,7 @@