Template:Infobox/styles.css: Difference between revisions

← Older edit

@@ Line 1: / Line 1: @@
-/* Wikipedia-style infobox (TemplateStyles, Minerva-safe) */
 table.infobox{
-   float:right; clear:right;
+   float:right;
-   border:1px solid #a2a9b1; background:#fff;
+  clear:right;
-   border-collapse:separate; border-spacing:0;
+  width:22em;
-   font-size:88%; line-height:1.5;
+  max-width:100%;
-  width: 280px; max-width: 100%;
+  margin:0 0 1em 1.4em;
-  margin:0 0 1em 1em;
+   border:1px solid #a2a9b1;
+   border-collapse:collapse;
+  background:#f8f9fa;
+  color:#202122;
+   font-size:88%;
+  line-height:1.5;
 }
 table.infobox .infobox-title{
-   background:#f8f9fa; text-align:center; font-weight:700;
+   padding:.45em .6em;
-   padding:.45em .6em; font-size:110%; border-bottom:1px solid #a2a9b1;
+  text-align:center;
+  font-weight:700;
+  font-size:125%;
+  color:#202122;
+  background:#eaecf0;
+  border:1px solid #a2a9b1;
+  border-width:0 0 1px;
+}
+table.infobox .infobox-image{
+   padding:.5em;
+  text-align:center;
+  background:#ffffff;
+}
+table.infobox .infobox-image img{
+  display:block;
+  max-width:100%;
+  height:auto;
+  margin:0 auto;
+  border:1px solid #c8ccd1;
+  border-radius:0;
+  box-shadow:none;
 }
-table.infobox .infobox-image{ text-align:center; padding:.6em; }
-table.infobox .infobox-image img{ max-width:100%; height:auto; border-radius:6px; }
 table.infobox .infobox-caption{
-   text-align:center; color:#54595d; font-size:90%; padding:0 .6em .5em;
+  padding:0 .6em .6em;
+   text-align:center;
+  color:#54595d;
+  font-size:95%;
+  background:#ffffff;
+}
+table.infobox th,
+table.infobox td{
+  padding:.35em .6em;
+  border:1px solid #eaecf0;
+  vertical-align:top;
+}
+table.infobox th{
+  width:35%;
+  text-align:left;
+  color:#202122;
+  background:#eaecf0;
+  font-weight:600;
+}
+table.infobox td{
+  color:#202122;
+  background:#ffffff;
 }
-table.infobox th, table.infobox td{
+table.infobox td a.external{
-   padding:.4em .6em; border-top:1px solid #eaecf0; vertical-align:top;
+   overflow-wrap:anywhere;
 }
-table.infobox th{ text-align:left; background:#f8f9fa; width:38%; }
+@media (max-width:980px){
-table.infobox .infobox-below{
+  table.infobox{
-  text-align:center; padding:.5em .6em; background:#f8f9fa; border-top:1px solid #a2a9b1;
+    float:none;
+    width:100%;
+    margin:0 0 1em;
+  }
 }
+@media (max-width:720px){
-/* Mobile (Minerva): full-width, no float */
+   table.infobox{
-@media (max-width:900px){
+    font-size:84%;
-   table.infobox{ float:none; margin:0 0 1em 0; width:100%; }
+    line-height:1.4;
+  }
+  table.infobox .infobox-title{
+    padding:.38em .5em;
+    font-size:112%;
+  }
+  table.infobox .infobox-image{
+    padding:.35em;
+  }
+  table.infobox th,
+  table.infobox td{
+    padding:.3em .45em;
+  }
 }