MediaWiki:Common.css: Difference between revisions

← Older edit Newer edit →

@@ Line 1: / Line 1: @@
 /* CSS placed here will be applied to all skins */
-/* Wikipedia-style Infobox */
+/* Infobox styling */
 .infobox {
      border: 1px solid #a2a9b1;
+    border-spacing: 3px;
      background-color: #f8f9fa;
      color: black;
-     margin: 0 0 0.5em 1em;
+     margin: 0.5em 0 0.5em 1em;
      padding: 0.2em;
      float: right;
@@ Line 12: / Line 13: @@
      font-size: 88%;
      line-height: 1.5em;
+    width: 22em;
 }
-.infobox th, .infobox td {
+.infobox-title {
+    font-size: 125%;
+    font-weight: bold;
+    text-align: center;
+    background-color: #d3d3d3;
+    padding: 0.2em;
+}
+.infobox-above {
+    font-size: 110%;
+    text-align: center;
+    background-color: #e6e6e6;
+    padding: 0.2em;
+}
+.infobox-image {
+    text-align: center;
+    padding: 0.2em;
+}
+.infobox th {
+    vertical-align: top;
+    white-space: nowrap;
+    text-align: left;
      padding: 0.2em 0.4em;
+    background-color: #f0f0f0;
 }
-.infobox > tbody > tr > th {
-    text-align: left;
+.infobox td {
      vertical-align: top;
-     width: 33%;
+     padding: 0.2em 0.4em;
-    background-color: #f8f9fa;
 }
-.infobox caption {
+.infobox-header {
+    text-align: center;
+    background-color: #d3d3d3;
      font-weight: bold;
-     font-size: 110%;
+     padding: 0.2em;
-     padding: 0.4em;
+}
+.infobox-below {
+    text-align: center;
+    background-color: #e6e6e6;
+     padding: 0.2em;
 }
-.infobox .mergedrow th {
-    padding-right: 1em;
+/* Mobile responsiveness */
+@media screen and (max-width: 640px) {
+    .infobox {
+        width: 100%;
+        margin: 0.5em 0;
+        float: none;
+    }
 }
 @import url('https://en.wikipedia.org/w/load.php?modules=mediawiki.skinning.elements|ext.TemplateStyles.styles&only=styles');