MediaWiki:Common.css: Difference between revisions

← Older edit

@@ Line 410: / Line 410: @@
 }
-/* ==== MOBILE LOGO FIX (GLOBAL) ==== */
+/* === Mobile Infobox Layout Fix === */
-@media screen and (max-width: 768px) {
+@media (max-width: 768px) {
+   /* Force infoboxes to drop below text and use full width */
-   /* Center and resize the logo on mobile */
+   .infobox {
-   .mw-logo,
+    float: none !important;
-  .mw-wiki-logo,
+    margin: 1em auto !important;
-  .minerva-logo {
+    width: 100% !important;
+    max-width: 100% !important;
+    clear: both !important;
      display: block !important;
-    margin: 0 auto !important;
-    max-width: 160px !important;
-    height: auto !important;
    }
-   /* Ensure the header wraps content cleanly */
+   /* Slight padding and center alignment for aesthetics */
-   .minerva-header,
+   .infobox th,
-   .mw-header {
+   .infobox td {
-     display: flex !important;
+     padding: 0.4em !important;
-    flex-direction: column !important;
-    align-items: center !important;
-    justify-content: center !important;
    }
-   /* Push menu/search below the logo */
+   /* Make sure text wraps nicely */
-   .minerva-header .header-menu,
+   .infobox td,
-   .minerva-header .menu,
+   .infobox th {
-  .minerva-header .search-box,
+     word-wrap: break-word !important;
-  .minerva-header .minerva-icon {
-     order: 2 !important;
-    margin-top: 0.5em !important;
-    text-align: center !important;
    }
+}
+/* === Desktop: show full wordmark === */
+.mw-logo-icon { display: none !important; }
+.mw-logo-wordmark { display: inline-block !important; }
-  /* Prevent overlap caused by absolute positioning */
+/* === Mobile (under 768px): hide wordmark, show square icon === */
-   .minerva-header .minerva-logo,
+@media (max-width: 768px) {
-   .minerva-header .mw-logo {
+   .mw-logo-wordmark { display: none !important; }
-     position: static !important;
+   .mw-logo-icon {
+     display: inline-block !important;
+    content: url("https://untenables.com/images/2/26/Favicon.png");
+    width: 42px;
+    height: auto;
+    margin-top: 4px;
    }
 }