diff --git a/app.py b/app.py index 1d61da1..b180e05 100644 --- a/app.py +++ b/app.py @@ -1876,6 +1876,23 @@ def public_frontend(): .filter-toggle-btn.has-active .badge { display:block; } .filter-collapsed { display:none; } + /* Offcanvas navigation */ + .nav-toggle { background:none; border:none; color:#fff; font-size:1.3rem; cursor:pointer; padding:0.3rem 0.4rem; line-height:1; margin-right:0.5rem; transition:opacity 0.2s; } + .nav-toggle:hover { opacity:0.7; } + .offcanvas-backdrop { position:fixed; inset:0; background:rgba(0,0,0,0.4); z-index:200; opacity:0; pointer-events:none; transition:opacity 0.3s ease; } + .offcanvas-backdrop.open { opacity:1; pointer-events:auto; } + .offcanvas-nav { position:fixed; top:0; left:0; width:280px; height:100%; height:100dvh; background:#fff; z-index:201; transform:translateX(-100%); transition:transform 0.3s cubic-bezier(0.4,0,0.2,1); box-shadow:4px 0 24px rgba(0,0,0,0.15); display:flex; flex-direction:column; } + .offcanvas-nav.open { transform:translateX(0); } + .offcanvas-nav-header { background:#20228a; color:#fff; padding:1.2rem 1.5rem; display:flex; align-items:center; justify-content:space-between; } + .offcanvas-nav-header .nav-logo { font-weight:800; font-size:1rem; } + .offcanvas-nav-header .nav-close { background:none; border:none; color:#fff; font-size:1.4rem; cursor:pointer; line-height:1; } + .offcanvas-nav-links { list-style:none; padding:1rem 0; flex:1; } + .offcanvas-nav-links li { } + .offcanvas-nav-links a { display:block; padding:0.75rem 1.5rem; color:#1a1a2e; text-decoration:none; font-size:0.95rem; font-weight:500; transition:background 0.15s; } + .offcanvas-nav-links a:hover { background:#f0ede6; } + .offcanvas-nav-links .nav-section { padding:0.5rem 1.5rem 0.2rem; font-size:0.7rem; font-weight:700; text-transform:uppercase; letter-spacing:0.05em; color:#888; } + .offcanvas-nav-footer { padding:1rem 1.5rem; border-top:1px solid #e0ddd6; font-size:0.75rem; color:#888; } + /* Main grid — masonry (CSS columns) */ .main-grid { max-width:1300px; margin:1.5rem auto; padding:0 1rem; column-count:4; column-gap:1.2rem; } @@ -2057,6 +2074,7 @@ def public_frontend():
@@ -2477,6 +2495,42 @@ def public_frontend():
input.addEventListener('keydown', e => { if (e.key === 'Enter') send(); });
})();
+
+
+
+
+
+