|
|
| Строка 327: |
Строка 327: |
| .mw-babel-box-level-N { | | .mw-babel-box-level-N { |
| display: none; | | display: none; |
| }
| |
|
| |
| /* Анимация для сдвига вниз остальных кнопок */
| |
| .dropdown.active ~ .dropdown {
| |
| transform: translateY(100%);
| |
| transition: transform 0.3s ease-in-out;
| |
| }
| |
|
| |
| /* Контейнер для всех кнопок */
| |
| .dropdown-container {
| |
| display: flex;
| |
| flex-direction: column;
| |
| gap: 5px; /* Отступ между кнопками */
| |
| width: 500px; /* Можно изменить ширину */
| |
| }
| |
|
| |
| /* Контейнер выпадающего списка */
| |
| .dropdown {
| |
| position: relative;
| |
| display: inline-block;
| |
| }
| |
|
| |
| /* Кнопка для открытия списка */
| |
| .dropbtn {
| |
| background-color: black;
| |
| color: white;
| |
| padding: 10px 15px;
| |
| font-size: 30px;
| |
| border: none;
| |
| cursor: pointer;
| |
| border-radius: 5px;
| |
| min-width: 500px;
| |
| text-align: -webkit-center;
| |
| }
| |
|
| |
| /* Контейнер списка (изначально скрыт) */
| |
| .dropdown-content {
| |
| display: block; /* Скрываем через height, а не display */
| |
| text-aling: center;
| |
| overflow: hidden;
| |
| max-height: 0;
| |
| opacity: 0;
| |
| transition: max-height 0.3s ease-out, opacity 0.3s ease-out;
| |
|
| |
| }
| |
|
| |
| /* Стиль для ссылок внутри списка */
| |
| .dropdown-content a {
| |
| color: black;
| |
| text-aling: center;
| |
| padding: 10px 15px;
| |
| text-decoration: none;
| |
| display: block;
| |
| font-size: 25px;
| |
| }
| |
|
| |
| /* Эффект наведения на ссылки */
| |
| .dropdown-content a:hover {
| |
| background-color: #f1f1f1;
| |
| }
| |
|
| |
|
| |
| /* Показываем список при клике (нужен JS) */
| |
| .dropdown.active .dropdown-content {
| |
| max-hight: 500px;
| |
| opacity: 1;
| |
| } | | } |