|
Tags: Mobile edit Mobile web edit Advanced mobile edit |
| Line 1: |
Line 1: |
| /* Dark-mode-safe styling for Template:Infobox settlement. */ | | /* {{pp|small=y}} */ |
| .infobox.ib-settlement,
| |
| .ib-settlement { | | .ib-settlement { |
| | width: 23em; |
| | max-width: 100%; |
| border-collapse: collapse; | | border-collapse: collapse; |
| line-height: 1.2em; | | line-height: 1.2em; |
| color: var(--color-base, #202122);
| |
| } | | } |
|
| |
|
| @media (min-width: 640px) { | | /* Fix mobile stretching */ |
| | @media (max-width: 640px) { |
| .infobox.ib-settlement, | | .infobox.ib-settlement, |
| .ib-settlement { | | .ib-settlement { |
| width: 23em; | | width: 23em; |
| | max-width: calc(100% - 1em); |
| | float: none; |
| | clear: both; |
| | margin-left: auto; |
| | margin-right: auto; |
| } | | } |
| } | | } |
|
| |
|
| .infobox.ib-settlement td,
| | /* TODO split definitions to appropriate class names when live from HTML element */ |
| .infobox.ib-settlement th,
| |
| .ib-settlement td, | | .ib-settlement td, |
| .ib-settlement th { | | .ib-settlement th { |
| border-top: 1px solid var(--border-color-base, #a2a9b1); | | border-top: 1px solid #a2a9b1; |
| padding: 0.4em 0.6em; | | padding: 0.4em 0.6em 0.4em 0.6em; |
| vertical-align: top;
| |
| } | | } |
|
| |
|
| .infobox.ib-settlement .mergedtoprow .infobox-full-data,
| |
| .infobox.ib-settlement .mergedtoprow .infobox-header,
| |
| .infobox.ib-settlement .mergedtoprow .infobox-data,
| |
| .infobox.ib-settlement .mergedtoprow .infobox-label,
| |
| .infobox.ib-settlement .mergedtoprow .infobox-below,
| |
| .ib-settlement .mergedtoprow .infobox-full-data, | | .ib-settlement .mergedtoprow .infobox-full-data, |
| .ib-settlement .mergedtoprow .infobox-header, | | .ib-settlement .mergedtoprow .infobox-header, |
| Line 33: |
Line 32: |
| .ib-settlement .mergedtoprow .infobox-label, | | .ib-settlement .mergedtoprow .infobox-label, |
| .ib-settlement .mergedtoprow .infobox-below { | | .ib-settlement .mergedtoprow .infobox-below { |
| border-top: 1px solid var(--border-color-base, #a2a9b1); | | border-top: 1px solid #a2a9b1; |
| padding: 0.4em 0.6em 0.2em 0.6em; | | padding: 0.4em 0.6em 0.2em 0.6em; |
| } | | } |
|
| |
|
| .infobox.ib-settlement .mergedrow .infobox-full-data,
| |
| .infobox.ib-settlement .mergedrow .infobox-data,
| |
| .infobox.ib-settlement .mergedrow .infobox-label,
| |
| .ib-settlement .mergedrow .infobox-full-data, | | .ib-settlement .mergedrow .infobox-full-data, |
| .ib-settlement .mergedrow .infobox-data, | | .ib-settlement .mergedrow .infobox-data, |
| Line 47: |
Line 43: |
| } | | } |
|
| |
|
| .infobox.ib-settlement .mergedbottomrow .infobox-full-data,
| |
| .infobox.ib-settlement .mergedbottomrow .infobox-data,
| |
| .infobox.ib-settlement .mergedbottomrow .infobox-label,
| |
| .ib-settlement .mergedbottomrow .infobox-full-data, | | .ib-settlement .mergedbottomrow .infobox-full-data, |
| .ib-settlement .mergedbottomrow .infobox-data, | | .ib-settlement .mergedbottomrow .infobox-data, |
| .ib-settlement .mergedbottomrow .infobox-label { | | .ib-settlement .mergedbottomrow .infobox-label { |
| border-top: 0; | | border-top: 0; |
| border-bottom: 1px solid var(--border-color-base, #a2a9b1); | | border-bottom: 1px solid #a2a9b1; |
| padding: 0 0.6em 0.4em 0.6em; | | padding: 0 0.6em 0.4em 0.6em; |
| } | | } |
|
| |
|
| .infobox.ib-settlement .infobox-label,
| |
| .infobox.ib-settlement .infobox-data,
| |
| .infobox.ib-settlement .infobox-full-data,
| |
| .ib-settlement .infobox-label,
| |
| .ib-settlement .infobox-data,
| |
| .ib-settlement .infobox-full-data {
| |
| background-color: transparent;
| |
| color: var(--color-base, #202122);
| |
| }
| |
|
| |
| .infobox.ib-settlement .maptable,
| |
| .ib-settlement .maptable { | | .ib-settlement .maptable { |
| border: 0; | | border: 0; |
| Line 74: |
Line 56: |
| } | | } |
|
| |
|
| .infobox.ib-settlement .infobox-header,
| |
| .infobox.ib-settlement .infobox-below,
| |
| .ib-settlement .infobox-header, | | .ib-settlement .infobox-header, |
| .ib-settlement .infobox-below { | | .ib-settlement .infobox-below { |
| Line 81: |
Line 61: |
| } | | } |
|
| |
|
| .infobox.ib-settlement .infobox-above,
| |
| .ib-settlement .infobox-above { | | .ib-settlement .infobox-above { |
| font-size: 125%; | | font-size: 125%; |
| line-height: 1.3em; | | line-height: 1.3em; |
| text-align: center;
| |
| } | | } |
|
| |
|
| .infobox.ib-settlement .infobox-above,
| | .ib-settlement .infobox-subheader { |
| .infobox.ib-settlement .infobox-subheader,
| | background-color: #cddeff; |
| .infobox.ib-settlement .infobox-header,
| | color: inherit; |
| .infobox.ib-settlement .infobox-below,
| |
| .ib-settlement .infobox-above,
| |
| .ib-settlement .infobox-subheader,
| |
| .ib-settlement .infobox-header,
| |
| .ib-settlement .infobox-below {
| |
| background-color: var(--background-color-progressive-subtle, #eaf3ff); | |
| color: var(--color-base, #202122); | |
| font-weight: bold; | | font-weight: bold; |
| }
| |
|
| |
| .infobox.ib-settlement .infobox-subheader,
| |
| .ib-settlement .infobox-subheader {
| |
| text-align: center;
| |
| } | | } |
|
| |
|
| Line 134: |
Line 100: |
| font-weight: normal; | | font-weight: normal; |
| display: inline; | | display: inline; |
| }
| |
|
| |
| .infobox.ib-settlement img,
| |
| .ib-settlement img {
| |
| max-width: 100%;
| |
| height: auto;
| |
| }
| |
|
| |
| .infobox.ib-settlement a:link,
| |
| .infobox.ib-settlement a:visited,
| |
| .ib-settlement a:link,
| |
| .ib-settlement a:visited {
| |
| color: var(--color-progressive, #36c);
| |
| }
| |
|
| |
| .infobox.ib-settlement a.new:link,
| |
| .infobox.ib-settlement a.new:visited,
| |
| .ib-settlement a.new:link,
| |
| .ib-settlement a.new:visited {
| |
| color: var(--color-destructive, #d33);
| |
| }
| |
|
| |
| @media screen {
| |
| html.skin-theme-clientpref-night .infobox.ib-settlement,
| |
| html.skin-theme-clientpref-night .ib-settlement,
| |
| body.skin-theme-clientpref-night .infobox.ib-settlement,
| |
| body.skin-theme-clientpref-night .ib-settlement {
| |
| background-color: #1e1e1e;
| |
| color: #ffffff;
| |
| border-color: #444;
| |
| }
| |
|
| |
| html.skin-theme-clientpref-night .infobox.ib-settlement td,
| |
| html.skin-theme-clientpref-night .infobox.ib-settlement th,
| |
| html.skin-theme-clientpref-night .ib-settlement td,
| |
| html.skin-theme-clientpref-night .ib-settlement th,
| |
| body.skin-theme-clientpref-night .infobox.ib-settlement td,
| |
| body.skin-theme-clientpref-night .infobox.ib-settlement th,
| |
| body.skin-theme-clientpref-night .ib-settlement td,
| |
| body.skin-theme-clientpref-night .ib-settlement th {
| |
| border-color: #444;
| |
| }
| |
|
| |
| html.skin-theme-clientpref-night .ib-settlement .infobox-above,
| |
| html.skin-theme-clientpref-night .ib-settlement .infobox-title,
| |
| html.skin-theme-clientpref-night .ib-settlement .infobox-header,
| |
| html.skin-theme-clientpref-night .ib-settlement .infobox-subheader,
| |
| html.skin-theme-clientpref-night .ib-settlement caption,
| |
| body.skin-theme-clientpref-night .ib-settlement .infobox-above,
| |
| body.skin-theme-clientpref-night .ib-settlement .infobox-title,
| |
| body.skin-theme-clientpref-night .ib-settlement .infobox-header,
| |
| body.skin-theme-clientpref-night .ib-settlement .infobox-subheader,
| |
| body.skin-theme-clientpref-night .ib-settlement caption {
| |
| background-color: #1B223D !important;
| |
| color: #ffffff !important;
| |
| border-color: #3a506b !important;
| |
| }
| |
|
| |
| html.skin-theme-clientpref-night .ib-settlement .infobox-above *,
| |
| html.skin-theme-clientpref-night .ib-settlement .infobox-title *,
| |
| html.skin-theme-clientpref-night .ib-settlement .infobox-header *,
| |
| html.skin-theme-clientpref-night .ib-settlement .infobox-subheader *,
| |
| html.skin-theme-clientpref-night .ib-settlement caption *,
| |
| body.skin-theme-clientpref-night .ib-settlement .infobox-above *,
| |
| body.skin-theme-clientpref-night .ib-settlement .infobox-title *,
| |
| body.skin-theme-clientpref-night .ib-settlement .infobox-header *,
| |
| body.skin-theme-clientpref-night .ib-settlement .infobox-subheader *,
| |
| body.skin-theme-clientpref-night .ib-settlement caption * {
| |
| color: #ffffff !important;
| |
| }
| |
|
| |
| html.skin-theme-clientpref-night .infobox.ib-settlement .infobox-label,
| |
| html.skin-theme-clientpref-night .infobox.ib-settlement .infobox-data,
| |
| html.skin-theme-clientpref-night .infobox.ib-settlement .infobox-full-data,
| |
| html.skin-theme-clientpref-night .ib-settlement .infobox-label,
| |
| html.skin-theme-clientpref-night .ib-settlement .infobox-data,
| |
| html.skin-theme-clientpref-night .ib-settlement .infobox-full-data,
| |
| body.skin-theme-clientpref-night .infobox.ib-settlement .infobox-label,
| |
| body.skin-theme-clientpref-night .infobox.ib-settlement .infobox-data,
| |
| body.skin-theme-clientpref-night .infobox.ib-settlement .infobox-full-data,
| |
| body.skin-theme-clientpref-night .ib-settlement .infobox-label,
| |
| body.skin-theme-clientpref-night .ib-settlement .infobox-data,
| |
| body.skin-theme-clientpref-night .ib-settlement .infobox-full-data {
| |
| background-color: #1e1e1e;
| |
| color: #ffffff !important;
| |
| }
| |
|
| |
| html.skin-theme-clientpref-night .infobox.ib-settlement a:link,
| |
| html.skin-theme-clientpref-night .infobox.ib-settlement a:visited,
| |
| html.skin-theme-clientpref-night .ib-settlement a:link,
| |
| html.skin-theme-clientpref-night .ib-settlement a:visited,
| |
| body.skin-theme-clientpref-night .infobox.ib-settlement a:link,
| |
| body.skin-theme-clientpref-night .infobox.ib-settlement a:visited,
| |
| body.skin-theme-clientpref-night .ib-settlement a:link,
| |
| body.skin-theme-clientpref-night .ib-settlement a:visited {
| |
| color: #88ccff;
| |
| }
| |
|
| |
| html.skin-theme-clientpref-night .infobox.ib-settlement a.new:link,
| |
| html.skin-theme-clientpref-night .infobox.ib-settlement a.new:visited,
| |
| html.skin-theme-clientpref-night .ib-settlement a.new:link,
| |
| html.skin-theme-clientpref-night .ib-settlement a.new:visited,
| |
| body.skin-theme-clientpref-night .infobox.ib-settlement a.new:link,
| |
| body.skin-theme-clientpref-night .infobox.ib-settlement a.new:visited,
| |
| body.skin-theme-clientpref-night .ib-settlement a.new:link,
| |
| body.skin-theme-clientpref-night .ib-settlement a.new:visited {
| |
| color: #ff7a7a;
| |
| }
| |
|
| |
| html.skin-theme-clientpref-night .mw-parser-output .infobox.ib-settlement .infobox-above,
| |
| html.skin-theme-clientpref-night .mw-parser-output .infobox.ib-settlement .infobox-subheader,
| |
| html.skin-theme-clientpref-night .mw-parser-output .infobox.ib-settlement .infobox-header,
| |
| html.skin-theme-clientpref-night .mw-parser-output .infobox.ib-settlement .infobox-label,
| |
| body.skin-theme-clientpref-night .mw-parser-output .infobox.ib-settlement .infobox-above,
| |
| body.skin-theme-clientpref-night .mw-parser-output .infobox.ib-settlement .infobox-subheader,
| |
| body.skin-theme-clientpref-night .mw-parser-output .infobox.ib-settlement .infobox-header,
| |
| body.skin-theme-clientpref-night .mw-parser-output .infobox.ib-settlement .infobox-label {
| |
| color: #ffffff !important;
| |
| }
| |
|
| |
| @media (prefers-color-scheme: dark) {
| |
| html.skin-theme-clientpref-os .infobox.ib-settlement,
| |
| html.skin-theme-clientpref-os .ib-settlement {
| |
| background-color: #1e1e1e;
| |
| color: #ffffff;
| |
| border-color: #444;
| |
| }
| |
|
| |
| html.skin-theme-clientpref-os .infobox.ib-settlement td,
| |
| html.skin-theme-clientpref-os .infobox.ib-settlement th,
| |
| html.skin-theme-clientpref-os .ib-settlement td,
| |
| html.skin-theme-clientpref-os .ib-settlement th {
| |
| border-color: #444;
| |
| }
| |
|
| |
| html.skin-theme-clientpref-os .ib-settlement .infobox-above,
| |
| html.skin-theme-clientpref-os .ib-settlement .infobox-title,
| |
| html.skin-theme-clientpref-os .ib-settlement .infobox-header,
| |
| html.skin-theme-clientpref-os .ib-settlement .infobox-subheader,
| |
| html.skin-theme-clientpref-os .ib-settlement caption {
| |
| background-color: #1B223D !important;
| |
| color: #ffffff !important;
| |
| border-color: #3a506b !important;
| |
| }
| |
|
| |
| html.skin-theme-clientpref-os .ib-settlement .infobox-above *,
| |
| html.skin-theme-clientpref-os .ib-settlement .infobox-title *,
| |
| html.skin-theme-clientpref-os .ib-settlement .infobox-header *,
| |
| html.skin-theme-clientpref-os .ib-settlement .infobox-subheader *,
| |
| html.skin-theme-clientpref-os .ib-settlement caption * {
| |
| color: #ffffff !important;
| |
| }
| |
|
| |
| html.skin-theme-clientpref-os .infobox.ib-settlement .infobox-label,
| |
| html.skin-theme-clientpref-os .infobox.ib-settlement .infobox-data,
| |
| html.skin-theme-clientpref-os .infobox.ib-settlement .infobox-full-data,
| |
| html.skin-theme-clientpref-os .ib-settlement .infobox-label,
| |
| html.skin-theme-clientpref-os .ib-settlement .infobox-data,
| |
| html.skin-theme-clientpref-os .ib-settlement .infobox-full-data {
| |
| background-color: #1e1e1e;
| |
| color: #ffffff !important;
| |
| }
| |
|
| |
| html.skin-theme-clientpref-os .infobox.ib-settlement a:link,
| |
| html.skin-theme-clientpref-os .infobox.ib-settlement a:visited,
| |
| html.skin-theme-clientpref-os .ib-settlement a:link,
| |
| html.skin-theme-clientpref-os .ib-settlement a:visited {
| |
| color: #88ccff;
| |
| }
| |
|
| |
| html.skin-theme-clientpref-os .infobox.ib-settlement a.new:link,
| |
| html.skin-theme-clientpref-os .infobox.ib-settlement a.new:visited,
| |
| html.skin-theme-clientpref-os .ib-settlement a.new:link,
| |
| html.skin-theme-clientpref-os .ib-settlement a.new:visited {
| |
| color: #ff7a7a;
| |
| }
| |
|
| |
| html.skin-theme-clientpref-os .mw-parser-output .infobox.ib-settlement .infobox-above,
| |
| html.skin-theme-clientpref-os .mw-parser-output .infobox.ib-settlement .infobox-subheader,
| |
| html.skin-theme-clientpref-os .mw-parser-output .infobox.ib-settlement .infobox-header,
| |
| html.skin-theme-clientpref-os .mw-parser-output .infobox.ib-settlement .infobox-label {
| |
| color: #ffffff !important;
| |
| }
| |
| }
| |
| }
| |
|
| |
| @media (max-width: 640px) {
| |
| .infobox.ib-settlement,
| |
| .ib-settlement {
| |
| width: 100%;
| |
| float: none;
| |
| clear: both;
| |
| margin-left: 0;
| |
| margin-right: 0;
| |
| }
| |
| }
| |
|
| |
| html.skin-theme-clientpref-night .mw-parser-output .ib-settlement th.infobox-label,
| |
| body.skin-theme-clientpref-night .mw-parser-output .ib-settlement th.infobox-label,
| |
| html.skin-theme-clientpref-os .mw-parser-output .ib-settlement th.infobox-label {
| |
| color: #ffffff !important;
| |
| } | | } |