Sidebar: remove WA logo, fix mobile (no scroll, compact icons, hide admin/dividers)

- Remove sidebar-logo WA text
- Mobile: icons 32px, gap 2px, overflow hidden (no horizontal scroll)
- Hide dividers on mobile
- Hide admin link on mobile
- Compact bottom bar fits all 16 tools
This commit is contained in:
treamz 2026-03-22 10:41:16 +03:00
parent 53b01aa711
commit 102b62986f
2 changed files with 8 additions and 5 deletions

View File

@ -71,11 +71,15 @@ body {
/* Mobile bottom bar */ /* Mobile bottom bar */
@media(max-width:640px) { @media(max-width:640px) {
.sidebar { position:fixed;top:auto;bottom:0;left:0;width:100%;height:52px;flex-direction:row;justify-content:center;padding:0 16px;border-right:none;border-top:1px solid var(--surface-600);gap:0 } .sidebar { position:fixed;top:auto;bottom:0;left:0;width:100%;height:52px;flex-direction:row;justify-content:center;padding:0 8px;border-right:none;border-top:1px solid var(--surface-600);gap:0 }
.sidebar-logo { display:none } .sidebar-logo { display:none }
.sidebar-nav { flex-direction:row;gap:4px;flex:none } .sidebar-nav { flex-direction:row;gap:2px;flex:1;justify-content:center;overflow:hidden }
.sidebar-bottom { margin-top:0;margin-left:auto;flex-direction:row } .sidebar-divider { display:none }
.sidebar-link.active::before { left:50%;top:auto;bottom:-6px;transform:translateX(-50%);width:20px;height:3px;border-radius:3px 3px 0 0 } .sidebar-link { width:32px;height:32px;border-radius:6px }
.sidebar-link svg { width:18px;height:18px }
.sidebar-link.active::before { left:50%;top:auto;bottom:-6px;transform:translateX(-50%);width:16px;height:2px;border-radius:2px 2px 0 0 }
.sidebar-bottom { margin-top:0;margin-left:auto;flex-direction:row;flex-shrink:0 }
.sidebar-admin-link { display:none !important }
.main-content { margin-left:0;padding-bottom:60px } .main-content { margin-left:0;padding-bottom:60px }
} }

View File

@ -87,7 +87,6 @@ function initSidebar(activeId) {
const nav = document.createElement('nav'); const nav = document.createElement('nav');
nav.className = 'sidebar'; nav.className = 'sidebar';
nav.innerHTML = ` nav.innerHTML = `
<div class="sidebar-logo">WA</div>
<div class="sidebar-nav"> <div class="sidebar-nav">
${linksHtml} ${linksHtml}
</div> </div>