6202
редагування
MediaWiki:Common.css: відмінності між версіями
нема опису редагування
Admin (обговорення | внесок) Немає опису редагування |
Admin (обговорення | внесок) Немає опису редагування |
||
| Рядок 1261: | Рядок 1261: | ||
/* ==================================================== */ | /* ==================================================== */ | ||
/* МОБІЛЬНА ВЕРСІЯ - | /* МОБІЛЬНА ВЕРСІЯ - ПОШУК ТА КОМПАКТНИЙ ХЕДЕР */ | ||
/* ==================================================== */ | /* ==================================================== */ | ||
/* Кнопка пошуку */ | |||
.mobile-search-btn { | |||
display: none; | |||
align-items: center; | |||
justify-content: center; | |||
width: 36px; | |||
height: 36px; | |||
background: rgba(255, 255, 255, 0.1); | |||
border-radius: 8px; | |||
cursor: pointer; | |||
margin-left: auto; | |||
flex-shrink: 0; | |||
transition: background 0.2s; | |||
} | |||
.mobile-search-btn:hover { | |||
background: rgba(255, 255, 255, 0.2); | |||
} | |||
.mobile-search-btn svg { | |||
display: block; | |||
} | |||
/* Overlay пошуку */ | |||
.mobile-search-overlay { | |||
display: none; | |||
position: fixed; | |||
top: 0; | |||
left: 0; | |||
right: 0; | |||
bottom: 0; | |||
z-index: 1001; | |||
background: rgba(21, 21, 31, 0.98); | |||
padding: 12px; | |||
align-items: flex-start; | |||
gap: 10px; | |||
} | |||
.mobile-search-overlay.active { | |||
display: flex; | |||
} | |||
.mobile-search-overlay input { | |||
flex: 1; | |||
padding: 14px 16px; | |||
font-size: 16px; | |||
border: 1px solid rgba(255, 255, 255, 0.15); | |||
border-radius: 10px; | |||
background: #23232c; | |||
color: white; | |||
outline: none; | |||
} | |||
.mobile-search-overlay input:focus { | |||
border-color: #a19ce0; | |||
} | |||
.mobile-search-overlay input::placeholder { | |||
color: rgba(255, 255, 255, 0.4); | |||
} | |||
.mobile-search-close { | |||
width: 44px; | |||
height: 44px; | |||
display: flex; | |||
align-items: center; | |||
justify-content: center; | |||
font-size: 28px; | |||
color: #888; | |||
cursor: pointer; | |||
flex-shrink: 0; | |||
border-radius: 10px; | |||
background: rgba(255, 255, 255, 0.05); | |||
} | |||
.mobile-search-close:hover { | |||
color: white; | |||
background: rgba(255, 255, 255, 0.1); | |||
} | |||
@media (max-width: 768px) { | @media (max-width: 768px) { | ||
/* Показуємо кнопку пошуку */ | |||
.mobile-search-btn { | |||
display: flex; | |||
} | |||
/* Ховаємо стандартну форму пошуку */ | |||
.minerva-header .minerva-search-form { | |||
display: none !important; | |||
} | |||
/* Ховаємо стандартну іконку */ | |||
.minerva-header #searchIcon { | |||
display: none !important; | |||
} | |||
/* | /* Компактніший хедер */ | ||
.header-container.header-chrome { | .header-container.header-chrome { | ||
padding: 6px 12px !important; | padding: 6px 12px !important; | ||
| Рядок 1273: | Рядок 1367: | ||
.minerva-header { | .minerva-header { | ||
padding: 4px 0 !important; | padding: 4px 0 !important; | ||
gap: | gap: 10px !important; | ||
} | } | ||
.minerva-header .branding-box a::before { | .minerva-header .branding-box a::before { | ||
width: 28px !important; | width: 28px !important; | ||
| Рядок 1282: | Рядок 1375: | ||
} | } | ||
.minerva-header .branding-box a span { | .minerva-header .branding-box a span { | ||
font-size: | font-size: 14px !important; | ||
} | } | ||
.mw-body { | .mw-body { | ||
padding-top: 52px !important; | padding-top: 52px !important; | ||
| Рядок 1368: | Рядок 1384: | ||
} | } | ||
@media (max-width: 400px) { | @media (max-width: 400px) { | ||
.minerva-header .branding-box a span { | .minerva-header .branding-box a span { | ||
display: none !important; | display: none !important; | ||
} | } | ||
} | } | ||