6369
редагувань
MediaWiki:Common.css: відмінності між версіями
нема опису редагування
Admin (обговорення | внесок) Немає опису редагування |
Admin (обговорення | внесок) Немає опису редагування |
||
| Рядок 2337: | Рядок 2337: | ||
.mcc-filter-select { font-size: 12px !important; padding: 6px 22px 6px 8px !important; } | .mcc-filter-select { font-size: 12px !important; padding: 6px 22px 6px 8px !important; } | ||
.mcc-filter-count { display: none !important; } | .mcc-filter-count { display: none !important; } | ||
} | |||
/* ── CSS — вставити в кінець Common.css ── */ | |||
/* ════════════════════════════════════════ | |||
1+2. LAYOUT — таблиці не виїжджають за r-box | |||
Контент між l-box і r-box, без правого відступу | |||
════════════════════════════════════════ */ | |||
@media screen and (min-width: 1000px) { | |||
.banner-container, | |||
.content, | |||
.pre-content, | |||
.post-content, | |||
#mw-content-text, | |||
.overlay-header { | |||
margin-left: 250px !important; | |||
margin-right: 300px !important; | |||
max-width: none !important; | |||
width: auto !important; | |||
} | |||
} | |||
/* Прибираємо будь-які right-side shadows/gradients */ | |||
.mcc-scroll-outer::after { | |||
display: none !important; | |||
} | |||
/* ════════════════════════════════════════ | |||
3. R-BOX NAV — не перекривається header | |||
top: висота header | |||
════════════════════════════════════════ */ | |||
.r-box, | |||
.tournament-box, | |||
.series-box { | |||
top: 56px !important; | |||
bottom: 0 !important; | |||
height: calc(100vh - 56px) !important; | |||
max-height: none !important; | |||
overflow-y: auto !important; | |||
} | |||
/* Nav всередині r-box — sticky щоб завжди вгорі */ | |||
.r-box > .player-nav, | |||
.r-box > .tournament-nav, | |||
.r-box > .series-nav, | |||
.tournament-box > .tournament-nav, | |||
.series-box > .series-nav { | |||
position: sticky !important; | |||
top: 0 !important; | |||
z-index: 5 !important; | |||
} | |||
/* ════════════════════════════════════════ | |||
4. BIO ПІД ЗАГОЛОВКОМ | |||
Перший параграф — стиль підзаголовка | |||
════════════════════════════════════════ */ | |||
/* Приховуємо перший <p> в основному контенті, | |||
бо JS перемістить його під h1 */ | |||
.mcc-hero-sub { | |||
font-size: 13.5px !important; | |||
color: rgba(183,180,191,0.70) !important; | |||
line-height: 1.62 !important; | |||
margin: 5px 0 14px !important; | |||
font-family: 'Manrope', sans-serif !important; | |||
max-width: 820px !important; | |||
display: block !important; | |||
} | |||
/* ════════════════════════════════════════ | |||
5. PAGE-ACTIONS-MENU — внизу сторінки | |||
════════════════════════════════════════ */ | |||
.page-actions-menu { | |||
position: fixed !important; | |||
bottom: 0 !important; | |||
left: 250px !important; /* після l-box */ | |||
right: 300px !important; /* перед r-box */ | |||
z-index: 90 !important; | |||
background: rgba(12,11,18,0.96) !important; | |||
backdrop-filter: blur(10px) !important; | |||
-webkit-backdrop-filter: blur(10px) !important; | |||
border-top: 1px solid rgba(255,255,255,0.07) !important; | |||
border-bottom: none !important; | |||
display: flex !important; | |||
align-items: center !important; | |||
padding: 0 16px !important; | |||
margin: 0 !important; | |||
height: 40px !important; | |||
} | |||
.page-actions-menu__list { | |||
display: flex !important; | |||
align-items: center !important; | |||
gap: 0 !important; | |||
list-style: none !important; | |||
margin: 0 !important; | |||
padding: 0 !important; | |||
border: none !important; | |||
width: 100% !important; | |||
} | |||
.page-actions-menu__list-item { | |||
border-bottom: none !important; | |||
} | |||
.page-actions-menu .cdx-button { | |||
color: rgba(255,255,255,0.30) !important; | |||
background: transparent !important; | |||
border: none !important; | |||
font-size: 12px !important; | |||
font-family: 'Manrope', sans-serif !important; | |||
padding: 4px 12px !important; | |||
height: 32px !important; | |||
min-height: 0 !important; | |||
border-radius: 4px !important; | |||
transition: color .15s, background .15s !important; | |||
display: flex !important; | |||
align-items: center !important; | |||
gap: 5px !important; | |||
} | |||
.page-actions-menu .cdx-button:hover { | |||
color: rgba(255,255,255,0.70) !important; | |||
background: rgba(255,255,255,0.06) !important; | |||
} | |||
/* Іконки — маленькі, видимі */ | |||
.page-actions-menu .minerva-icon { | |||
display: inline-flex !important; | |||
width: 14px !important; | |||
height: 14px !important; | |||
opacity: .5 !important; | |||
flex-shrink: 0 !important; | |||
} | |||
.page-actions-menu span:not(.minerva-icon) { | |||
font-size: 12px !important; | |||
} | |||
/* Dropdown з bottom */ | |||
.page-actions-overflow-list.toggle-list__list--drop-down { | |||
bottom: 100% !important; | |||
top: auto !important; | |||
margin-bottom: 4px !important; | |||
} | |||
.toggle-list__list { | |||
background: rgba(16,14,24,0.98) !important; | |||
border: 1px solid rgba(255,255,255,0.10) !important; | |||
border-radius: 6px !important; | |||
box-shadow: 0 -8px 24px rgba(0,0,0,0.5) !important; | |||
padding: 4px !important; | |||
} | |||
.toggle-list-item__anchor { | |||
color: rgba(255,255,255,0.65) !important; | |||
font-size: 13px !important; | |||
font-family: 'Manrope', sans-serif !important; | |||
padding: 7px 12px !important; | |||
border-radius: 4px !important; | |||
display: flex !important; | |||
align-items: center !important; | |||
gap: 8px !important; | |||
white-space: nowrap !important; | |||
} | |||
.toggle-list-item__anchor:hover { | |||
background: rgba(255,255,255,0.08) !important; | |||
color: #fff !important; | |||
text-decoration: none !important; | |||
} | |||
.toggle-list-item { border-bottom: none !important; } | |||
/* Відступ знизу для контенту (щоб page-actions не перекривав) */ | |||
.mw-body { | |||
padding-bottom: 56px !important; | |||
} | |||
/* На мобільних — ховаємо або повна ширина */ | |||
@media (max-width: 999px) { | |||
.page-actions-menu { | |||
left: 0 !important; | |||
right: 0 !important; | |||
} | |||
.mw-body { | |||
padding-bottom: 50px !important; | |||
} | |||
} | } | ||