Module:WpInfobox/styles.css: Difference between revisions
Created page with "→{{pp|small=y}}: →* This TemplateStyles sheet deliberately does NOT include the full set of * infobox styles. We are still working to migrate all of the manual * infoboxes. See [[MediaWiki talk:Common.css/to do#Infobox]] * DO NOT ADD THEM HERE: →NOTE: This is maintained both here and in [[MediaWiki:Common.css]] until migration is complete. * Starting with bare minimum for the benefit of [[mw:Manual:Safemode]].: @media (min-width: 640px) { .infobox {..." |
No edit summary |
||
| (One intermediate revision by the same user not shown) | |||
| Line 1: | Line 1: | ||
.infobox-subbox { | .infobox-subbox { | ||
padding: 0; | |||
border: none; | |||
margin: -3px; | |||
width: auto; | |||
min-width: 100%; | |||
font-size: 100%; | |||
clear: none; | |||
float: none; | |||
background-color: transparent; | |||
color: inherit; | |||
} | } | ||
.infobox-3cols-child { | .infobox-3cols-child { | ||
margin: -3px; | |||
} | } | ||
.infobox .navbar { | .infobox .navbar { | ||
font-size: 100%; | |||
} | |||
.infobox-hiddenrow { | |||
display: none; | |||
} | } | ||
body.skin--responsive.skin--responsive .infobox .infobox-hiddenrow { | body.skin--responsive.skin--responsive .infobox .infobox-hiddenrow { | ||
display: none; | |||
} | |||
.infobox { | |||
border: 1px solid #a2a9b1; | |||
color: black; | |||
padding: 0.2em; | |||
font-size: 88%; | |||
line-height: 1.5em; | |||
border-spacing: 3px; | |||
margin: 0.5em 0; | |||
} | |||
.infobox-header { | |||
vertical-align: top; | |||
} | |||
.infobox-label { | |||
vertical-align: top; | |||
text-align: left; | |||
} | |||
.infobox-above { | |||
vertical-align: top; | |||
} | |||
.infobox-full-data { | |||
vertical-align: top; | |||
} | |||
.infobox-data { | |||
vertical-align: top; | |||
text-align: left; | |||
} | |||
.infobox-below { | |||
vertical-align: top; | |||
} | |||
.infobox-subheader { | |||
vertical-align: top; | |||
} | |||
.infobox-image { | |||
vertical-align: top; | |||
} | |||
.infobox-navbar { | |||
vertical-align: top; | |||
} | |||
.infobox th { | |||
vertical-align: top; | |||
text-align: left; | |||
} | |||
.infobox td { | |||
vertical-align: top; | |||
text-align: left; | |||
} | |||
.infobox .infobox-above { | |||
font-size: 125%; | |||
font-weight: bold; | |||
text-align: center; | |||
} | |||
.infobox .infobox-title { | |||
font-size: 125%; | |||
font-weight: bold; | |||
text-align: center; | |||
} | |||
.infobox caption { | |||
font-size: 125%; | |||
font-weight: bold; | |||
text-align: center; | |||
padding: 0.2em; | |||
} | |||
.infobox-title { | |||
padding: 0.2em; | |||
} | |||
.infobox .infobox-header { | |||
text-align: center; | |||
} | |||
.infobox .infobox-subheader { | |||
text-align: center; | |||
} | |||
.infobox .infobox-image { | |||
text-align: center; | |||
} | |||
.infobox .infobox-full-data { | |||
text-align: center; | |||
} | |||
.infobox .infobox-below { | |||
text-align: center; | |||
} | |||
.infobox .infobox-navbar { | |||
text-align: right; | |||
} | |||
@media (min-width: 640px) { | |||
.infobox { | |||
margin-left: 1em; | |||
float: right; | |||
clear: right; | |||
width: 22em; | |||
} | |||
} | } | ||
@media screen { | @media screen { | ||
html.skin-theme-clientpref-night .infobox-full-data:not(.notheme) > div:not(.notheme)[style] { | html.skin-theme-clientpref-night .infobox-full-data:not(.notheme) > div:not(.notheme)[style] { | ||
background: #1f1f23 !important; | background: #1f1f23 !important; | ||
color: #f8f9fa; | color: #f8f9fa; | ||
} | } | ||
| Line 66: | Line 156: | ||
html.skin-theme-clientpref-os .infobox-full-data:not(.notheme) > div:not(.notheme)[style] { | html.skin-theme-clientpref-os .infobox-full-data:not(.notheme) > div:not(.notheme)[style] { | ||
background: #1f1f23 !important; | background: #1f1f23 !important; | ||
color: #f8f9fa; | color: #f8f9fa; | ||
} | } | ||
} | } | ||
@media (min-width: 640px) { | @media (min-width: 640px) { | ||
body.skin--responsive .infobox-table { | body.skin--responsive .infobox-table { | ||
| Line 95: | Line 178: | ||
padding-left: inherit; | padding-left: inherit; | ||
padding-right: inherit; | padding-right: inherit; | ||
} | |||
} | |||
@media screen { | |||
.infobox { | |||
background-color: var(--background-color-neutral-subtle, #f8f9fa); | |||
} | |||
} | |||
@media (max-width: 640px) { | |||
.infobox { | |||
width: 100%; | |||
} | |||
.infobox .nowrap { | |||
white-space: normal; | |||
} | } | ||
} | } | ||