MediaWiki:Common.css: Difference between revisions

← Older edit Newer edit →

@@ Line 1: / Line 1: @@
 /* ============================================================
-    PORTABLE INFOBOX - KH STYLE (COMPACT VERSION)
+    PORTABLE INFOBOX - KH STYLE (COMPACT & ALIGNED)
     ============================================================ */
@@ Line 7: / Line 7: @@
      background-color: #ffffff !important;
      border: 2px solid #003366 !important;
-     width: 280px !important; /* Slightly narrower to match smaller text */
+     width: 280px !important;
      float: right !important;
      clear: right !important;
@@ Line 15: / Line 15: @@
      font-family: "Georgia", serif !important;
      overflow: hidden !important;
-    line-height: 1.4 !important; /* Tighter line spacing */
 }
-/* 1. THE TITLE - Scaled down from 20px to 16px */
+/* 1. THE TITLE (Compact) */
 body.mediawiki .pi-title {
      background-color: #003366 !important;
@@ Line 29: / Line 28: @@
 }
-/* 2. SECTION HEADERS - Scaled down to 10px */
+/* 2. SECTION HEADERS (Compact) */
 body.mediawiki .pi-header {
      background-color: #4a4a4a !important;
@@ Line 43: / Line 42: @@
 }
-/* 3. IMAGE AREA */
+/* 3. THE DATA ROW (Flexbox fix for same-line alignment) */
-body.mediawiki .pi-image {
+body.mediawiki .pi-data {
-     display: block !important;
+     display: flex !important;
-     background-color: #f8f9fa !important;
+     flex-flow: row nowrap !important;
-     text-align: center !important;
+     align-items: stretch !important;
-     padding: 5px !important;
+     border-bottom: 1px solid #eeeeee !important;
 }
-body.mediawiki .pi-image img {
+/* 4. DATA LABELS (Compact & Aligned) */
-    max-width: 100% !important;
-    height: auto !important;
-}
-/* 4. DATA LABELS & VALUES - Scaled down to 11px */
 body.mediawiki .pi-data-label {
      background-color: #f2f2f2 !important;
@@ Line 63: / Line 57: @@
      padding: 6px 10px !important;
      font-size: 11px !important;
+    flex: 0 0 40% !important; /* Label takes 40% width */
+    border-right: 1px solid #dddddd !important;
 }
+/* 5. DATA VALUES (Compact & Aligned) */
 body.mediawiki .pi-data-value {
      background-color: #ffffff !important;
@@ Line 70: / Line 67: @@
      padding: 6px 10px !important;
      font-size: 11px !important;
+    flex: 1 !important; /* Value fills remaining space */
+}
+/* 6. IMAGE AREA */
+body.mediawiki .pi-image {
+    display: block !important;
+    background-color: #f8f9fa !important;
+    text-align: center !important;
+    padding: 5px !important;
+}
+body.mediawiki .pi-image img {
+    max-width: 100% !important;
+    height: auto !important;
 }
-/* 5. LISTS */
+/* 7. LISTS */
 body.mediawiki .pi-data-value ul {
      margin: 0 !important;