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

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

@@ Строка 982: / Строка 982: @@
      display: block;
      margin-top: 20px;
+}
+.card-body {
+    padding: 15px;
+    background-color: #ffffff; /* Белый фон */
+    font-family: 'Arial', sans-serif;
+    font-size: 14px;
+    color: #333333; /* Темно-серый текст */
+}
+.card-info {
+    margin-top: 10px;
 }
 .card-info .item {
-    display: block;
      background-color: #f7f7f7; /* Легкий серый фон */
-     padding: 15px;
+     padding: 10px;
-     margin-bottom: 12px;
+     margin-bottom: 8px;
-     border-radius: 8px;
+     border-radius: 6px; /* Закругленные углы */
-     box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* Тень для выделения */
+    display: flex;
-     transition: background-color 0.3s ease; /* Плавное изменение фона при наведении */
+     justify-content: space-between; /* Разделяем метку и значение по бокам */
+    font-weight: normal;
+     transition: background-color 0.2s ease;
 }
 .card-info .item:hover {
-     background-color: #e0e0e0; /* Более темный фон при наведении */
+     background-color: #e0e0e0; /* Темный фон при наведении */
 }
 .card-info .label {
      font-weight: bold;
-     color: #212121; /* Черный цвет для заголовков */
+     color: #212121; /* Черный для заголовков */
 }
 .card-info .value {
-    font-size: 16px;
+     color: #333333; /* Темно-серый для значений */
-     color: #333333; /* Тёмно-серый для значений */
+     text-align: right; /* Выравнивание значений по правому краю */
-}
-.card-info .info-popup {
-    display: none;
-    position: absolute;
-    top: 10px;
-    left: 50%;
-     transform: translateX(-50%);
-    background-color: #212121; /* Черный фон для всплывающего окна */
-    color: #ffffff; /* Белый текст */
-    padding: 10px;
-    border-radius: 8px;
-    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
-    width: 200px;
-    font-size: 14px;
-    z-index: 10;
-}
-.card-info .item:hover .info-popup {
-    display: block; /* Показываем всплывающее окно при наведении */
 }