MediaWiki:Common.css: Difference between revisions
made sidebar navigation sticky while scrolling |
added mobile nav drawer styling |
||
| Line 905: | Line 905: | ||
display: none !important; | display: none !important; | ||
} | } | ||
/* Sidebar becomes a slide-in drawer, opened via #mobile-nav-toggle | |||
(added by Common.js). Off-screen by default. */ | |||
#mw-panel { | #mw-panel { | ||
position: | position: fixed !important; | ||
top: 0 !important; | |||
left: 0 !important; | |||
width: 240px !important; | |||
max-width: 80vw !important; | |||
height: 100vh !important; | |||
overflow-y: auto !important; | |||
background: #f1e7d3 !important; | |||
box-shadow: 2px 0 12px rgba(0, 0, 0, 0.4) !important; | |||
z-index: 500 !important; | |||
padding: 60px 15px 20px 15px !important; | |||
box-sizing: border-box !important; | |||
transform: translateX(-100%); | |||
transition: transform 0.25s ease; | |||
} | |||
#mw-panel.mobile-nav-open { | |||
transform: translateX(0); | |||
} | } | ||
#p-logo { | #p-logo { | ||
| Line 919: | Line 937: | ||
margin-bottom: 2px !important; | margin-bottom: 2px !important; | ||
} | } | ||
#mobile-nav-toggle { | |||
display: block !important; | |||
position: fixed; | |||
top: 10px; | |||
left: 10px; | |||
z-index: 600; | |||
background: #3d2b1f; | |||
color: #f1e7d3; | |||
border: 2px solid #b3a07d; | |||
border-radius: 4px; | |||
padding: 8px 14px; | |||
font-size: 1.1em; | |||
font-family: 'Inter', sans-serif; | |||
cursor: pointer; | |||
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.4); | |||
} | |||
#mobile-nav-backdrop { | |||
display: none; | |||
position: fixed; | |||
inset: 0; | |||
background: rgba(0, 0, 0, 0.45); | |||
z-index: 400; | |||
} | |||
#mobile-nav-backdrop.mobile-nav-open { | |||
display: block; | |||
} | |||
} | |||
/* Hamburger toggle/backdrop only exist for the mobile drawer; keep them | |||
fully inert on desktop widths. */ | |||
#mobile-nav-toggle, #mobile-nav-backdrop { | |||
display: none; | |||
} | } | ||