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 {
position: relative;
border: 1px solid #4d4d4d;
border-radius: 6px;
background: rgba(45, 45, 45, 0.6);
transition: all 0.3s ease;
min-height: 60px;
overflow: visible;
padding: 0;
z-index: 1;
}
/* Эффект затухания */
.hover-cell::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(77, 157, 224, 0);
transition: background 0.5s ease-out;
z-index: 0;
border-radius: inherit;
}
/* Кликабельная область (увеличена на 10% для перекрытия) */
.hover-cell .cell-link {
position: absolute;
top: -5%;
left: -5%;
right: -5%;
bottom: -5%;
width: 110%;
height: 110%;
display: flex;
align-items: center;
justify-content: center;
padding: 12px;
box-sizing: border-box;
text-decoration: none !important;
color: inherit !important;
z-index: 2;
transform: scale(1);
transition: inherit;
}
/* Эффект наведения */
.hover-cell:hover {
transform: scale(1.03);
z-index: 10;
background: rgba(35, 65, 95, 0.8);
box-shadow: 0 0 0 2px #4d9de0;
}
.hover-cell:hover::before {
background: rgba(77, 157, 224, 0.15);
}
/* Синхронное увеличение ссылки */
.hover-cell:hover .cell-link {
transform: scale(1.03);
}
/* Стили для текста ссылки */
.hover-cell .cell-link a {
display: flex;
align-items: center;
justify-content: center;
height: 120%;
width: 120%;
text-decoration: none !important;
color: inherit !important;
}
/* Разделитель колонок */
.column-divider {
position: relative;
}
.column-divider::after {
content: "";
position: absolute;
top: 0;
right: -5px;
height: 100%;
width: 2px;
background: #707070;
z-index: 1;
}
/* Центрирование содержимого */
.center-content {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
}