Шаблон:Рамочка/style.css: различия между версиями
Материал из SpaceOnyx
Дополнительные действия
Neyran (обсуждение | вклад) Нет описания правки |
Neyran (обсуждение | вклад) Нет описания правки |
||
| Строка 1: | Строка 1: | ||
/* Основные стили рамки */ | /* Основные стили рамки */ | ||
.рамка { | .рамка { | ||
display: | display: block; /* ← было flex. Убираем flex с контейнера, чтобы карточка не зависела от родителя-flex */ | ||
box-sizing: border-box; | |||
width: 100%; /* занять всю ширину родителя */ | |||
max-width: 100%; | max-width: 100%; | ||
min-width: 300px | min-width: 0; /* ← сняли 300px — оно конфликтовало с узкими родителями */ | ||
margin: 0.5em 0 5px 0; | margin: 0.5em 0 5px 0; | ||
border: 1px solid #465298; | border: 1px solid #465298; | ||
padding: 2px; | padding: 2px; | ||
border-radius: 3px; | border-radius: 3px; | ||
overflow: hidden; | overflow: hidden; | ||
} | } | ||
| Строка 22: | Строка 19: | ||
/* Заголовок рамки */ | /* Заголовок рамки */ | ||
.рамка-заголовок { | .рамка-заголовок { | ||
display: block; | display: block; /* ← явный block */ | ||
box-sizing: border-box; | |||
box-sizing: border-box; /* ← | width: 100%; /* ← на всю ширину родителя */ | ||
background-color: #465298; | background-color: #465298; | ||
border-radius: 3px; | border-radius: 3px; | ||
| Строка 41: | Строка 38: | ||
line-height: 1; | line-height: 1; | ||
min-height: 0; | min-height: 0; | ||
width: 100%; | width: 100%; /* ← явный 100% */ | ||
box-sizing: border-box; | box-sizing: border-box; | ||
} | } | ||
| Строка 49: | Строка 46: | ||
padding: 0; | padding: 0; | ||
color: #fff; | color: #fff; | ||
flex: 1 1 auto; | flex: 1 1 auto; | ||
min-width: 0; | min-width: 0; | ||
line-height: 1; | line-height: 1; | ||
font-size: 0.95em; | font-size: 0.95em; | ||
| Строка 92: | Строка 89: | ||
} | } | ||
/* Развёрнуто — стрелка вниз */ | |||
.рамка:not(.mw-collapsed) .рамка-кнопка::before { | .рамка:not(.mw-collapsed) .рамка-кнопка::before { | ||
content: "▼"; | content: "▼"; | ||
} | } | ||
/* Свёрнуто — стрелка влево */ | |||
.рамка.mw-collapsed .рамка-кнопка::before { | .рамка.mw-collapsed .рамка-кнопка::before { | ||
content: "◀"; | content: "◀"; | ||
| Строка 102: | Строка 101: | ||
/* Содержимое рамки */ | /* Содержимое рамки */ | ||
.рамка-содержимое { | .рамка-содержимое { | ||
display: block; /* ← явный block */ | |||
box-sizing: border-box; | |||
width: 100%; /* ← на всю ширину родителя */ | |||
padding: 5px 8px; | padding: 5px 8px; | ||
} | } | ||
Версия от 22:22, 12 сентября 2026
/* Основные стили рамки */
.рамка {
display: block; /* ← было flex. Убираем flex с контейнера, чтобы карточка не зависела от родителя-flex */
box-sizing: border-box;
width: 100%; /* занять всю ширину родителя */
max-width: 100%;
min-width: 0; /* ← сняли 300px — оно конфликтовало с узкими родителями */
margin: 0.5em 0 5px 0;
border: 1px solid #465298;
padding: 2px;
border-radius: 3px;
overflow: hidden;
}
.рамка .wikitable {
margin: 0 !important;
}
/* Заголовок рамки */
.рамка-заголовок {
display: block; /* ← явный block */
box-sizing: border-box;
width: 100%; /* ← на всю ширину родителя */
background-color: #465298;
border-radius: 3px;
text-align: center;
cursor: pointer;
padding: 6px 8px;
line-height: 1;
}
.рамка-заголовок-контент {
display: flex;
justify-content: space-between;
align-items: center;
text-align: left;
margin: 0;
line-height: 1;
min-height: 0;
width: 100%; /* ← явный 100% */
box-sizing: border-box;
}
.рамка-название {
margin: 0;
padding: 0;
color: #fff;
flex: 1 1 auto;
min-width: 0;
line-height: 1;
font-size: 0.95em;
white-space: normal;
overflow-wrap: anywhere;
word-break: break-word;
}
/* Кнопка сворачивания */
.рамка-кнопка {
color: #fff;
cursor: pointer;
font-size: 0 !important;
display: inline-flex;
align-items: center;
justify-content: center;
width: 14px;
height: 14px;
padding: 0;
margin: 0;
background: transparent;
border-radius: 2px;
text-decoration: none !important;
user-select: none;
line-height: 1;
box-sizing: border-box;
vertical-align: middle;
flex: 0 0 auto;
transition: background 0.15s ease;
}
.рамка-кнопка:hover {
background: rgba(0, 0, 0, 0.22);
}
.рамка-кнопка::before {
font-size: 10px;
line-height: 1;
color: #fff;
display: block;
}
/* Развёрнуто — стрелка вниз */
.рамка:not(.mw-collapsed) .рамка-кнопка::before {
content: "▼";
}
/* Свёрнуто — стрелка влево */
.рамка.mw-collapsed .рамка-кнопка::before {
content: "◀";
}
/* Содержимое рамки */
.рамка-содержимое {
display: block; /* ← явный block */
box-sizing: border-box;
width: 100%; /* ← на всю ширину родителя */
padding: 5px 8px;
}
.рамка-содержимое p:first-child {
margin-top: 0;
}
.рамка-содержимое p:last-child {
margin-bottom: 0;
}
/* Стили для MediaWiki collapsible */
.mw-collapsible-toggle {
display: inline-block;
user-select: none;
line-height: 1;
}
.mw-collapsible-text {
font-size: 0.9em;
}
@media screen and (max-width: 751px) {
.рамка {
min-width: 0;
}
}