Нет описания правки |
Нет описания правки |
||
Строка 9: | Строка 9: | ||
.допуск-подсказка { | .допуск-подсказка { | ||
visibility: hidden; | visibility: hidden; | ||
max-width: | max-width: 80vw; /* не шире 80% экрана */ | ||
min-width: 220px; /* минимальная ширина */ | |||
background-color: #2a2a2a; /* тёмный фон */ | background-color: #2a2a2a; /* тёмный фон */ | ||
color: #f1f1f1; /* светлый текст */ | color: #f1f1f1; /* светлый текст */ | ||
text-align: left; | text-align: left; | ||
border-radius: 8px; | border-radius: 8px; | ||
padding: | padding: 8px 12px; /* комфортные отступы */ | ||
position: absolute; | position: absolute; | ||
z-index: 10; | z-index: 10; | ||
Строка 25: | Строка 24: | ||
transition: opacity 0.25s ease-in-out; | transition: opacity 0.25s ease-in-out; | ||
font-size: 85%; | font-size: 85%; | ||
line-height: 1. | line-height: 1.35; /* сбалансированная высота строк */ | ||
box-shadow: 0 4px 12px rgba(0,0,0,0.35); | box-shadow: 0 4px 12px rgba(0,0,0,0.35); | ||
word-wrap: break-word; | word-wrap: break-word; | ||
white-space: normal; /* перенос слов */ | |||
} | } | ||
Версия от 12:29, 30 августа 2025
.допуск-контейнер {
position: relative;
display: inline-block;
cursor: help;
font-weight: bold;
border-bottom: 1px dotted #000; /* пунктирное подчёркивание */
}
.допуск-подсказка {
visibility: hidden;
max-width: 80vw; /* не шире 80% экрана */
min-width: 220px; /* минимальная ширина */
background-color: #2a2a2a; /* тёмный фон */
color: #f1f1f1; /* светлый текст */
text-align: left;
border-radius: 8px;
padding: 8px 12px; /* комфортные отступы */
position: absolute;
z-index: 10;
bottom: 130%;
left: 50%;
transform: translateX(-50%);
opacity: 0;
transition: opacity 0.25s ease-in-out;
font-size: 85%;
line-height: 1.35; /* сбалансированная высота строк */
box-shadow: 0 4px 12px rgba(0,0,0,0.35);
word-wrap: break-word;
white-space: normal; /* перенос слов */
}
.допуск-подсказка::after {
content: "";
position: absolute;
top: 100%;
left: 50%;
margin-left: -6px;
border-width: 6px;
border-style: solid;
border-color: #2a2a2a transparent transparent transparent;
}
.допуск-контейнер:hover .допуск-подсказка {
visibility: visible;
opacity: 1;
}