MediaWiki:Citizen.css: различия между версиями

← Предыдущая правка Следующая правка →

@@ Строка 170: / Строка 170: @@
 /* Контейнер для всех кнопок */
 .dropdown-container {
-    display: flex;
+ display: flex;            /* располагаем категории в линию */
-    flex-direction: column;
+  justify-content: center;  /* выравнивание по центру */
-    gap: 5px; /* Отступ между кнопками */
+  gap: 20px;                /* расстояние между категориями */
-    width: 500px; /* Можно изменить ширину */
+  background: #fff;         /* фон */
+  padding: 10px;
+  border-bottom: 2px solid #ccc;
 }
 /* Контейнер выпадающего списка */
+/* Подменю */
 .dropdown {
-    position: relative;
+  position: relative;
-    display: inline-block;
 }
 /* Кнопка для открытия списка */
 .dropbtn {
-    background-color: black;
+   cursor: pointer;
-    color: white;
+  padding: 8px 16px;
-    padding: 10px 15px;
+  font-weight: bold;
-    font-size: 30px;
+  background: #f5f5f5;
-    cursor: pointer;
+  border: 1px solid #ccc;
-    border-radius: 5px;
+  border-radius: 6px;
-    min-width: 500px;
+  transition: all 0.2s ease;
-    text-align: -webkit-center;
+}
+.dropbtn:hover {
+  background: #e0e0e0;
+  transform: scale(1.05);
 }
 /* Контейнер списка (изначально скрыт) */
 .dropdown-content {
-    display: block; /* Скрываем через height, а не display */
+ display: none;
-    text-aling: center;
+  position: absolute;
-    overflow: hidden;
+  top: 100%;    /* появляется под кнопкой */
-    max-height: 0;
+  left: 0;
-    opacity: 0;
+  background: #fff;
-    transition: max-height 0.3s ease-out, opacity 0.3s ease-out;
+  min-width: 180px;
+  border: 1px solid #ccc;
+  border-radius: 6px;
+  padding: 10px;
+  flex-direction: column;
+  box-shadow: 0 4px 6px rgba(0,0,0,0.1);
 }
@@ Строка 222: / Строка 232: @@
 /* Показываем список при клике (нужен JS) */
-.dropdown.active .dropdown-content {
+.dropdown:hover .dropdown-content {
-    max-hight: 500px;
+  display: flex;
-    opacity: 1;
 }