MediaWiki:Common.css: Difference between revisions

← Older edit

@@ Line 75: / Line 75: @@
      background-color: #fff !important;
 }
-/* ---------------------------------------------------------- */
-/* MAIN PAGE SPACING FIX                                      */
-/* ---------------------------------------------------------- */
-/* Remove unwanted top spacing on the main page */
-body.page-Main_Page .mw-body,
-body.page-Main_Page #content {
-    margin-top: 0 !important;
-    padding-top: 0 !important;
-}
-/* Ensure consistent spacing on main page content */
-body.page-Main_Page .mw-body-content {
-    padding-top: 0 !important;
-}
-.infobox {
-    width: 300px;
-    font-size: 90%;
-    line-height: 1.5em;
-    border: 1px solid #aaa;
-    background: #f9f9f9;
-    float: right;
-    margin: 0 0 1em 1em;
-}
-.infobox caption {
-    background: #e1f5fe;
-    color: black;
-    font-weight: bold;
-    text-align: center;
-    padding: 5px;
-}
-.infobox th {
-    background: #e0e0e0;
-    padding: 4px;
-    text-align: left;
-}
-.infobox td {
-    padding: 4px;
-}
-/* ---------------------------------------------------------- */
-/* MAIN PAGE SPACING FIX  lokesh                                    */
-/* ---------------------------------------------------------- */
-/* CSS placed here will be applied to all skins */
 .mw-parser-output > :first-child {
    margin-top: 0 !important;
@@ Line 1,313: / Line 1,265: @@
 body.page-Main_Page #firstHeading {
      display: none;
+}
+/* ========== MOBILE-ONLY INFOBOX FIX (DESKTOP SAFE) ========== */
+@media (max-width: 600px) {
+    /* Make infobox width fit mobile */
+    .infobox {
+        width: 100% !important;
+        max-width: 100% !important;
+        margin: 0 auto !important;
+        font-size: 14px !important;
+    }
+    /* Image auto-resizes on mobile only */
+    .infobox img {
+        max-width: 100% !important;
+        height: auto !important;
+    }
+    /* Left label column */
+    .infobox th {
+        width: 40% !important;      /* Slightly bigger label space */
+        padding: 6px !important;
+        background: #e0e0e0 !important;
+        word-break: break-word !important;
+    }
+    /* Right value column */
+    .infobox td {
+        padding: 6px !important;
+        word-break: break-word !important;
+    }
+    /* Header title spacing */
+    .infobox caption {
+        font-size: 18px !important;
+        padding: 8px !important;
+    }
 }