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

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

@@ Строка 949: / Строка 949: @@
 .card:hover {
      transform: scale(1.05);
-}
-/* Содержимое карточки */
-.card-body {
-    padding: 15px;
-    text-align: left;
 }
@@ Строка 976: / Строка 970: @@
 }
+.card-body {
+    padding: 20px;
+    background-color: #ffffff; /* Белый фон для чистоты */
+    font-family: 'Arial', sans-serif; /* Читаемый шрифт */
+    font-size: 16px;
+    color: #333333; /* Темно-серый для текста */
+}
 .card-info {
-     display: grid;
+     display: block;
-     grid-template-columns: 1fr 2fr; /* Делаем два столбца */
+     margin-top: 20px;
-     grid-gap: 10px; /* Добавляем отступы между колонками */
+}
-     margin-top: 15px;
-     font-family: 'Poppins', sans-serif;
+.card-info .item {
-    font-size: 16px;
+    display: block;
-     color: #333;
+     background-color: #f7f7f7; /* Легкий серый фон */
+    padding: 15px;
+     margin-bottom: 12px;
+    border-radius: 8px;
+     box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* Тень для выделения */
+    transition: background-color 0.3s ease; /* Плавное изменение фона при наведении */
+}
+.card-info .item:hover {
+     background-color: #e0e0e0; /* Более темный фон при наведении */
 }
 .card-info .label {
      font-weight: bold;
-     color: #495057; /* Темно-серый для заголовков */
+     color: #212121; /* Черный цвет для заголовков */
-    background-color: #f8f9fa; /* Легкий фон для заголовков */
-    padding: 5px;
-    border-radius: 5px;
 }
 .card-info .value {
-     color: #007bff; /* Синий для значений */
+    font-size: 16px;
-     font-weight: normal;
+     color: #333333; /* Тёмно-серый для значений */
-     padding: 5px;
+}
-     background-color: #e9ecef; /* Светлый фон для значений */
-     border-radius: 5px;
+.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; /* Показываем всплывающее окно при наведении */
 }