5494
редагування
MediaWiki:Common.css: відмінності між версіями
нема опису редагування
Admin (обговорення | внесок) Немає опису редагування |
Admin (обговорення | внесок) Немає опису редагування |
||
| Рядок 1208: | Рядок 1208: | ||
.page-Перша_статистика .mw-parser-output { | .page-Перша_статистика .mw-parser-output { | ||
overflow-x: auto !important; | overflow-x: auto !important; | ||
} | |||
/* boom */ | |||
/* ==================================================== */ | |||
/* PLAYER TABS - LIQUIPEDIA STYLE */ | |||
/* ==================================================== */ | |||
.player-tabs { | |||
display: flex; | |||
border-bottom: 2px solid #3a3a4a; | |||
margin-bottom: 20px; | |||
margin-top: 20px; | |||
gap: 0; | |||
} | |||
.player-tab { | |||
padding: 12px 24px; | |||
cursor: pointer; | |||
color: #888; | |||
font-size: 14px; | |||
font-weight: 500; | |||
border-bottom: 2px solid transparent; | |||
margin-bottom: -2px; | |||
transition: all 0.2s ease; | |||
user-select: none; | |||
} | |||
.player-tab:hover { | |||
color: #fff; | |||
background: rgba(255, 255, 255, 0.05); | |||
} | |||
.player-tab.active { | |||
color: #fff; | |||
border-bottom-color: #a19ce0; | |||
background: rgba(161, 156, 224, 0.1); | |||
} | |||
.player-tab-content { | |||
display: none; | |||
} | |||
.player-tab-content.active { | |||
display: block; | |||
animation: fadeIn 0.3s ease; | |||
} | |||
@keyframes fadeIn { | |||
from { opacity: 0; transform: translateY(10px); } | |||
to { opacity: 1; transform: translateY(0); } | |||
} | |||
.tab-loader { | |||
text-align: center; | |||
padding: 40px; | |||
color: #888; | |||
font-size: 14px; | |||
} | |||
.tab-loader::before { | |||
content: ''; | |||
display: block; | |||
width: 32px; | |||
height: 32px; | |||
margin: 0 auto 16px; | |||
border: 3px solid rgba(161, 156, 224, 0.2); | |||
border-top-color: #a19ce0; | |||
border-radius: 50%; | |||
animation: spin 1s linear infinite; | |||
} | |||
@keyframes spin { | |||
to { transform: rotate(360deg); } | |||
} | |||
/* Мобільна версія */ | |||
@media (max-width: 768px) { | |||
.player-tabs { | |||
flex-wrap: wrap; | |||
} | |||
.player-tab { | |||
padding: 10px 16px; | |||
font-size: 13px; | |||
flex: 1; | |||
text-align: center; | |||
} | |||
} | } | ||