MediaWiki:Common.css
Внешний вид
Замечание: Возможно, после публикации вам придётся очистить кэш своего браузера, чтобы увидеть изменения.
- Firefox / Safari: Удерживая клавишу Shift, нажмите на панели инструментов Обновить либо нажмите Ctrl+F5 или Ctrl+R (⌘+R на Mac)
- Google Chrome: Нажмите Ctrl+Shift+R (⌘+Shift+R на Mac)
- Edge: Удерживая Ctrl, нажмите Обновить либо нажмите Ctrl+F5
- Opera: Нажмите Ctrl+F5.
/* Размещённый здесь CSS будет применяться ко всем темам оформления */
/* Основные стили для таблицы */
.table-container {
width: 60%;
margin: 2em auto;
}
.wikitable.hover-table {
width: 100%;
border-collapse: separate;
border-spacing: 10px;
background: transparent;
}
.table-header-cell {
text-align: center;
padding: 15px;
font-size: 1.5em;
font-weight: bold;
border: 1px solid #3a3a3a;
border-radius: 8px;
}
.table-group-header {
text-align: center;
padding: 10px;
font-weight: bold;
border-bottom: 2px solid #4d4d4d;
margin-bottom: 10px;
}
/* Стили для ячеек с эффектом при наведении */
.hover-cell {
text-align: center;
padding: 12px;
border: 1px solid #4d4d4d;
border-radius: 6px;
transition: all 0.3s ease;
background: rgba(40, 40, 40, 0.5);
display: block;
}
.hover-cell:hover {
transform: scale(1.03);
border-color: #4d9de0;
background: rgba(30, 60, 90, 0.7);
box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}
/* Стили кнопок-ячеек */
.cell-button {
display: block;
width: 100%;
padding: 15px;
text-align: center;
border: 1px solid #4d4d4d;
border-radius: 6px;
background: rgba(45, 45, 45, 0.6);
transition: all 0.3s ease;
cursor: pointer;
color: #e0e0e0;
text-decoration: none !important;
font-size: 1.1em;
margin-bottom: 10px;
}
.cell-button:hover {
transform: scale(1.03);
border-color: #4d9de0;
background: rgba(35, 65, 95, 0.8);
box-shadow: 0 4px 12px rgba(0,0,0,0.2);
color: #ffffff;
}
/* Убираем стандартное оформление ссылок */
.cell-button a {
color: inherit !important;
text-decoration: none !important;
display: block;
height: 100%;
width: 100%;
}
/* Дополнительные стили */
.column-divider {
border-right: 2px solid #707070 !important;
}
.center-content {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
}
/* Основные исправления для точного эффекта наведения х2 */
.hover-cell {
position: relative;
padding: 0;
border: 1px solid #4d4d4d !important;
border-radius: 6px;
background-clip: padding-box;
overflow: hidden;
}
.hover-cell .cell-link {
display: block;
width: 100%;
height: 100%;
padding: 12px;
text-decoration: none !important;
color: inherit;
box-sizing: border-box;
transition: all 0.3s ease;
background: rgba(45, 45, 45, 0.6);
border-radius: 5px;
}
/* Эффект наведения */
.hover-cell .cell-link:hover {
transform: scale(1.01);
background: rgba(35, 65, 95, 0.8);
box-shadow: inset 0 0 0 2px #4d9de0;
}
/* Фикс для ссылок */
.hover-cell .cell-link a {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
width: 100%;
text-decoration: none !important;
color: inherit !important;
}