MediaWiki:Common.css: відмінності між версіями

MediaWiki:Common.css (переглянути вихідний код)

Версія за 15:19, 21 квітня 2024

147 байтів вилучено , 21 квітня 2024

нема опису редагування

Admin

Бюрократи, Адміністратори інтерфейсу, Адміністратори

3415

редагувань

@@ Рядок 310: / Рядок 310: @@
 }
-/* Main Page Columns Layout */
+/* Setup for the main page columns */
-.main-page-container {
-    display: flex;          /* Uses flexbox to layout children horizontally */
-    justify-content: space-between; /* Distributes space between columns */
-    flex-wrap: wrap;       /* Allows items to wrap onto next line as needed */
-}
 .main-page-column {
-     flex: 1 1 calc(33% - 10px); /* Flex grow, shrink and basis */
+     float: left;
-     box-sizing: border-box;
+    width: calc(33.333% - 10px); /* accounts for margin */
+     margin-right: 15px; /* space between columns */
      height: 160px;
      text-align: center;
-     background-color: #f8f9fa;
+     box-sizing: border-box;
-    border: 1px solid #ccc;
      padding: 10px;
-     margin-right: 15px; /* Margin between columns */
+     background-color: #f8f9fa; /* Light gray background */
+    border: 1px solid #ccc; /* Gray border */
 }
 .main-page-column:last-child {
-     margin-right: 0; /* No margin on the right for the last column */
+     margin-right: 0; /* removes margin on the last column */
 }
 @media (max-width: 760px) {
-    .main-page-container {
-        flex-direction: column; /* Stacks columns vertically on small screens */
-    }
      .main-page-column {
-         margin-right: 0; /* Resets margin for mobile view */
+         float: none;
-         margin-bottom: 15px; /* Space between stacked columns */
+         width: 100%; /* full width on small screens */
-        flex-basis: 100%; /* Takes full width on small screens */
+        margin-right: 0;
-    }
+         margin-bottom: 15px; /* space between stacked columns */
-    .main-page-column:last-child {
-         margin-bottom: 0; /* No bottom margin for the last item */
      }
+}
+/* Styling for the images and links to ensure alignment and spacing */
+.main-page-column img {
+    margin-bottom: 10px; /* space between the icon and text */
+}
+.main-page-column a {
+    text-decoration: none; /* optional: removes underline from links */
+    color: black; /* optional: sets text color */
 }