Update default.html

Author: DevLabStudy

_layouts/default.html

@@ -3,7 +3,7 @@
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <meta name="description" content="DevLabStudy - Homelab documentation, Proxmox clusters, and Project Orbit. From DIY hardware to professional cloud solutions.">
+    <meta name="description" content="DevLabStudy - Homelab documentation, Proxmox clusters, and Project Orbit.">
     <title>DevLabStudy | {{ page.title }}</title>
     <link rel="icon" type="image/jpeg" href="/profileIcon_g3ffyg7edeeg1.jpeg">
     <link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;700;800&family=Inter:wght@400;600;700;900&display=swap" rel="stylesheet">
@@ -12,44 +12,37 @@
         body { font-family: 'Inter', sans-serif; background: var(--bg-body); color: var(--text-main); margin: 0; overflow-x: hidden; background-image: radial-gradient(circle at 1px 1px, rgba(255,255,255,0.015) 1px, transparent 0); background-size: 32px 32px; }
 
         .navbar { background: var(--bg-nav); border-bottom: 1px solid var(--border-color); padding: 22px 40px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; position: sticky; top: 0; z-index: 1000; }
-        .nav-left { display: flex; align-items: center; justify-content: flex-start; }
+        .nav-left { display: flex; align-items: center; }
         .nav-brand { font-size: 1.5rem; font-weight: 900; text-decoration: none; color: #fff; letter-spacing: -0.5px; }
-
         .nav-center { display: flex; justify-content: center; align-items: center; gap: 20px; }
         .nav-center a { text-decoration: none; color: var(--text-muted); font-weight: 600; font-size: 0.9rem; transition: 0.3s; }
         .nav-center a:hover, .nav-center a.active { color: var(--accent-blue); }
-
         .nav-right { display: flex; justify-content: flex-end; }
+        
         .dropdown { position: relative; display: inline-block; }
         .dropbtn { background: #111; color: #fff; padding: 8px 16px; border-radius: 6px; border: 1px solid rgba(255, 255, 255, 0.1); cursor: pointer; font-family: 'Inter', sans-serif; font-weight: 600; font-size: 0.9rem; }
-        
-        .dropdown-content { position: absolute; right: 0; top: 100%; padding-top: 15px; min-width: 180px; opacity: 0; visibility: hidden; transition: opacity 0.25s ease, visibility 0.25s ease; transition-delay: 0.5s; }
+        .dropdown-content { position: absolute; right: 0; top: 100%; padding-top: 15px; min-width: 180px; opacity: 0; visibility: hidden; transition: 0.25s ease; }
         .dropdown-links-wrapper { background: #0a0a0a; border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 6px; box-shadow: 0 10px 30px rgba(0,0,0,0.8); overflow: hidden; }
-
-        .dropdown-content a { display: flex; justify-content: space-between; align-items: center; color: #fff; padding: 12px 16px; text-decoration: none; font-size: 0.85rem; font-weight: 600; border-bottom: 1px solid rgba(255, 255, 255, 0.05); transition: color 0.2s, background 0.2s; }
+        .dropdown-content a { display: flex; justify-content: space-between; align-items: center; color: #fff; padding: 12px 16px; text-decoration: none; font-size: 0.85rem; font-weight: 600; border-bottom: 1px solid rgba(255, 255, 255, 0.05); }
         .dropdown-content a:hover { color: var(--accent-blue); background: rgba(255, 255, 255, 0.02); }
-        .dropdown:hover .dropdown-content { opacity: 1; visibility: visible; transition-delay: 0s; }
+        .dropdown:hover .dropdown-content { opacity: 1; visibility: visible; }
 
         .hero-header { max-width: 1000px; margin: 60px auto 40px auto; text-align: center; padding: 0 20px; }
-        .hero-title { font-size: 3.5rem; font-weight: 900; margin: 0; letter-spacing: -2px; line-height: 1; color: #fff; }
+        .hero-title { font-size: 3.5rem; font-weight: 900; margin: 0; letter-spacing: -2px; color: #fff; }
         .hero-title span { color: var(--accent-blue); }
 
         .dashboard { width: 100%; max-width: 1200px; padding: 0 40px; margin: 0 auto 40px auto; box-sizing: border-box; }
         .grid-container { display: grid; grid-template-columns: 240px 1px 1fr; gap: 50px; align-items: start; }
-        .vertical-divider { background: var(--border-color); width: 1px; height: 100%; min-height: 400px; }
-        .left-sidebar { display: flex; flex-direction: column; gap: 20px; position: sticky; top: 100px; }
+        .vertical-divider { background: var(--border-color); width: 1px; min-height: 400px; }
+        .left-sidebar { display: flex; flex-direction: column; gap: 20px; position: sticky; top: 100px; padding-right: 25px; }
 
         .card { background: rgba(10, 10, 10, 0.7); border: 1px solid var(--border-color); padding: 20px; border-radius: 12px; backdrop-filter: blur(10px); }
         .vinted-card { border-color: #00bfb2 !important; background: transparent !important; }
         .support-btn { display: block; text-decoration: none; padding: 12px; border-radius: 8px; font-weight: 800; font-size: 0.8rem; text-align: center; margin-top: 10px; transition: 0.3s; }
-        .do-badge { display: block; margin-top: 10px; transition: 0.3s; }
+        .do-badge { display: block; margin-top: 10px; }
         .do-badge img { width: 100%; border-radius: 8px; }
 
-        @media (max-width: 1024px) { 
-            .grid-container { grid-template-columns: 1fr; gap: 20px; } 
-            .vertical-divider { display: none; } 
-            .left-sidebar { position: static; }
-        }
+        @media (max-width: 1024px) { .grid-container { grid-template-columns: 1fr; } .vertical-divider { display: none; } .left-sidebar { padding-right: 0; position: static; } }
     </style>
 </head>
 <body>