MediaWiki:Common.css: различия между версиями
Внешний вид
LePacko (обсуждение | вклад) Нет описания правки Метка: отменено |
LePacko (обсуждение | вклад) Нет описания правки Метка: ручная отмена |
||
| Строка 1: | Строка 1: | ||
/* Размещённый здесь CSS будет применяться ко всем темам оформления */ | /* Размещённый здесь CSS будет применяться ко всем темам оформления */ | ||
/* Основные стили таблицы */ | /* Основные стили для таблицы */ | ||
.table-container { | .table-container { | ||
width: 60%; | width: 60%; | ||
| Строка 14: | Строка 14: | ||
} | } | ||
.table-header-cell { | .table-header-cell { | ||
text-align: center; | text-align: center; | ||
| Строка 24: | Строка 23: | ||
} | } | ||
.table-group-header { | .table-group-header { | ||
text-align: center; | text-align: center; | ||
| Строка 33: | Строка 31: | ||
} | } | ||
/* | /* Стили для ячеек с эффектом при наведении */ | ||
.hover-cell { | .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: 1px solid #4d4d4d; | ||
border-radius: 6px; | border-radius: 6px; | ||
background: rgba(45, 45, 45, 0.6); | background: rgba(45, 45, 45, 0.6); | ||
transition: all 0.3s ease; | transition: all 0.3s ease; | ||
cursor: pointer; | |||
color: #e0e0e0; | |||
padding: 0; | 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%; | |||
} | |||
/* ыыаааа наведение 668 раз уже меня заебало блять мама роди назад я уже жалею, что сюда полез */ | |||
.hover-cell { | |||
position: relative; | |||
padding: 0; | |||
border: 1px solid #4d4d4d; | |||
border-radius: 6px; | |||
background: rgba(45, 45, 45, 0.6); | |||
transition: all 0.3s ease; | |||
min-height: 60px; | |||
height: auto; | |||
overflow: visible; | |||
} | } | ||
.hover-cell::before { | .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; | |||
} | |||
.hover-cell .cell-link { | |||
position: absolute; | position: absolute; | ||
top: 0; | top: 0; | ||
| Строка 54: | Строка 126: | ||
right: 0; | right: 0; | ||
bottom: 0; | bottom: 0; | ||
display: flex; | display: flex; | ||
align-items: center; | align-items: center; | ||
| Строка 81: | Строка 138: | ||
} | } | ||
.hover-cell:hover { | .hover-cell:hover { | ||
transform: scale(1.03); | |||
background: rgba(35, 65, 95, 0.8); | |||
box-shadow: 0 0 0 1px rgba(77, 157, 224, 0.3); | |||
} | } | ||
.hover-cell:hover::before { | .hover-cell:hover::before { | ||
background: rgba(77, 157, 224, 0.15); | |||
} | } | ||
.hover-cell .cell-link a { | .hover-cell .cell-link a { | ||
display: flex; | |||
align-items: center; | |||
justify-content: center; | |||
height: 100%; | |||
width: 100%; | |||
text-decoration: none !important; | |||
color: inherit !important; | |||
} | } | ||
.hover-cell:hover .cell-link { | |||
. | transform: scale(1.05); | ||
. | |||
. | |||
height: 100%; | height: 100%; | ||
} | } | ||
Версия от 13:10, 2 июля 2025
/* Размещённый здесь 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%;
}
/* ыыаааа наведение 668 раз уже меня заебало блять мама роди назад я уже жалею, что сюда полез */
.hover-cell {
position: relative;
padding: 0;
border: 1px solid #4d4d4d;
border-radius: 6px;
background: rgba(45, 45, 45, 0.6);
transition: all 0.3s ease;
min-height: 60px;
height: auto;
overflow: visible;
}
.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;
}
.hover-cell .cell-link {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
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);
background: rgba(35, 65, 95, 0.8);
box-shadow: 0 0 0 1px rgba(77, 157, 224, 0.3);
}
.hover-cell:hover::before {
background: rgba(77, 157, 224, 0.15);
}
.hover-cell .cell-link a {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
width: 100%;
text-decoration: none !important;
color: inherit !important;
}
.hover-cell:hover .cell-link {
transform: scale(1.05);
height: 100%;
}