|
|
| Line 1: |
Line 1: |
| /* CSS placed here will be applied to all skins */
| |
| /* Silver Jubilee scheme
| |
| :root {
| |
| --main-bg-color: #c8c9ca; /*was d0d1d2*/
| |
| --lighter-bg-color: #e1e2e3;
| |
| --main-color: #111;
| |
| --non-red-link-color: #2667a1;
| |
| --trim-color: #2667a1;
| |
| --minor-link: #88898a;
| |
| --banner-fix: brightness(100%) sepia(1) hue-rotate(178deg) brightness(55%) saturate(155%)
| |
| }
| |
| */
| |
|
| |
| /* Standard colors */
| |
| :root {
| |
| --main-bg-color: #222;
| |
| --darker-bg-color: #333;
| |
| --main-color: #fff;
| |
| --non-red-link-color: #990;
| |
| --trim-color: #990;
| |
| }
| |
|
| |
| body {
| |
| background-color: #222;
| |
| color: #fff;;
| |
| }
| |
|
| |
| p {
| |
| color: #fff;
| |
| }
| |
|
| |
| div#mw-head {
| |
| background-color: #222;
| |
| }
| |
|
| |
| div#mainContent, div#side, div#footer {
| |
| background-color: #222;
| |
| }
| |
|
| |
| div.vectorTabs span > a {
| |
| background-color: #222;
| |
| color: #990;
| |
| }
| |
|
| |
| div.vectorTabs {
| |
| background-image: none;
| |
| background-color: #990;
| |
| }
| |
|
| |
| div.vectorMenu h3 a {
| |
| background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAACMCAIAAAAyWVTYAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH3gkSEjAndg7eHAAAABRJREFUKM9j+P+fgYmBYRSPYqIwAIsuAxUaCAlMAAAAAElFTkSuQmCC);
| |
| }
| |
|
| |
| div#content {
| |
| color: #fff;;
| |
| background-color: #222;
| |
| border-color: #990;
| |
| }
| |
|
| |
| #mw-panel.collapsible-nav .portal {
| |
| background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIwAAAABCAIAAACDjNFvAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH3gkSEjYnIFR5mgAAABBJREFUGNNj/P+fYRQMcgAARzACALHHhMYAAAAASUVORK5CYII=);
| |
| }
| |
|
| |
| h1, h2, h3, h4, h5, h6 {
| |
| border-color: #990;
| |
| }
| |
|
| |
| h1, h2, h3, h4, h5, h6 {
| |
| color: #990;
| |
| }
| |
|
| |
| div#mw-panel div.portal div.body ul li a, a {
| |
| color: #990;
| |
| }
| |
|
| |
| div#mw-panel div.portal div.body ul li a:visited, a:visited {
| |
| color: #990;
| |
| }
| |
|
| |
| div.vectorTabs li.selected a, div.vectorTabs li.selected a:visited {
| |
| color: var(--minor-link);
| |
| }
| |
|
| |
| div.editOptions {
| |
| color: #333;
| |
| background-color: #999;
| |
| }
| |
|
| |
| div.editOptions a:visited {
| |
| color: #222;
| |
| }
| |
|
| |
| div#editpage-copywarn a {
| |
| color: #36c;
| |
| }
| |
|
| |
| span.editHelp a {
| |
| color: #36c;
| |
| }
| |
|
| |
| div.thumbcaption {
| |
| color: #000 !important;
| |
| }
| |
|
| |
| table.wikitable {
| |
| background-color: #222;
| |
| color: #fff;
| |
| }
| |
|
| |
| table.wikitable thead tr th, table.wikitable tbody tr th {
| |
| background-color: var(--darker-bg-color);
| |
| color: #fff;;
| |
| font-weight: bold;
| |
| }
| |
|
| |
| /* TABLE: WIKI-SIDEBAR */
| |
| table.sidebar {
| |
| background-color: #f7f7f7;
| |
| border: 1px solid #000000;
| |
| border-collapse:collapse;
| |
| font-size: 95%;
| |
| color: #000000;
| |
| clear: right;
| |
| float: right;
| |
| width: 200px;
| |
| margin-left: 1.5em;
| |
| margin-right: 0em;
| |
| }
| |
| table.sidebar tr th {
| |
| background-color: #c7c7c7;
| |
| border: 1px outset #000000;
| |
| text-align: center;
| |
| font-weight: bold;
| |
| }
| |
| table.sidebar tr.header th.header {
| |
| background-color: #c7c7c7;
| |
| border: 1px outset #000000;
| |
| text-align: center;
| |
| font-weight: bold;
| |
| }
| |
| table.sidebar td.class {
| |
| background-color: #222;
| |
| border-collapse: collapse;
| |
| font-variant: small-caps;
| |
| font-size: large;
| |
| color: #990;
| |
| margin: 1em 0 0 1em;
| |
| line-height: 130%;
| |
| font-weight: bold;
| |
| text-align: center;
| |
| border: 1px outset #000000;
| |
| }
| |
| table.sidebar td.class a:link {
| |
| color: #222 !important;
| |
| text-decoration: none;
| |
| }
| |
| table.sidebar td.class a:hover {
| |
| color: #ffffff !important;
| |
| text-decoration: none;
| |
| }
| |
| table.sidebar td.classname {
| |
| background-color: #222;
| |
| border-collapse: collapse;
| |
| font-variant: small-caps;
| |
| font-size: 125%;
| |
| color: #edad00;
| |
| margin: 1em 0 0 1em;
| |
| line-height: 140%;
| |
| font-weight: bold;
| |
| text-align: center;
| |
| border: 1px outset #000000;
| |
| }
| |
| table.sidebar td.film {
| |
| background-color: #c7c7c7;
| |
| border-collapse: collapse;
| |
| font-variant: small-caps;
| |
| color: #000000;
| |
| margin: 1em 0 0 1em;
| |
| line-height: 130%;
| |
| font-weight: bold;
| |
| text-align: center;
| |
| border: 1px outset #000000;
| |
| }
| |
| table.sidebar td.image {
| |
| background-color: #222;
| |
| color: #aecdee;
| |
| text-align: center;
| |
| border: 1px outset #222;
| |
| }
| |
| table.sidebar td.name {
| |
| background-color: #f7f7f7;
| |
| border-collapse: collapse;
| |
| font-variant: small-caps;
| |
| font-size: 140%;
| |
| color: #000000;
| |
| margin: 1em 0 0 1em;
| |
| line-height: 130%;
| |
| font-weight: bold;
| |
| text-align: center;
| |
| border: 1px outset #000000;
| |
| }
| |
| table.sidebar td.arc {
| |
| border-collapse: collapse;
| |
| font-variant: small-caps;
| |
| font-size: 100%;
| |
| color: #000000;
| |
| margin: 1em 0 0 1em;
| |
| line-height: 130%;
| |
| font-weight: bold;
| |
| text-align: center;
| |
| border: 1px outset #000000;
| |
| }
| |
| table.sidebar td.left {
| |
| background-color: #222;
| |
| color: #fff;
| |
| line-height: 130%;
| |
| text-align: right;
| |
| border: 1px outset #222;
| |
| }
| |
| table.sidebar td.left a:link {
| |
| color: #ffffff;
| |
| text-decoration: none;
| |
| }
| |
| table.sidebar td.left a:hover {
| |
| color: #aecdee;
| |
| text-decoration: none;
| |
| }
| |
| table.sidebar td.right {
| |
| background-color: #f7f7f7;
| |
| color: #000000;
| |
| line-height: 130%;
| |
| text-align: left;
| |
| border: 1px outset #000000;
| |
| }
| |
| table.sidebar td.righta {
| |
| background-color: #f7f7f7;
| |
| color: #000000;
| |
| line-height: 130%;
| |
| text-align: left;
| |
| border: 1px outset #000000;
| |
| }
| |
| table.sidebar td.rightb {
| |
| background-color: #c7c7c7;
| |
| color: #000000;
| |
| line-height: 130%;
| |
| text-align: left;
| |
| border: 1px outset #000000;
| |
| }
| |
|
| |
| /* DEPRECATED: Use td.left instead! */
| |
| table.wiki-sidebar td.odd {
| |
| width: 35%;
| |
| font-weight: bold;
| |
| text-align: right;
| |
| }
| |
| table.wiki-sidebar td.sb-both {
| |
| text-align: center;
| |
| padding-left: 0;
| |
| padding-right: 0;
| |
| }
| |
| table.wiki-sidebar td.sb-both img {
| |
| display:block;
| |
| /*force new line after img in sidebar */
| |
| border: 0px outset #aaaaaa;
| |
| margin: 0;
| |
| padding-left: 0;
| |
| padding-right: 0;
| |
| }
| |
| table.wiki-sidebar td.sb-left {
| |
| width: 35%;
| |
| font-weight: bold;
| |
| text-align: right;
| |
| background-color: #f7f7f7;
| |
| border: 0px outset #aaaaaa;
| |
| }
| |
| table.wiki-sidebar td.sb-right {
| |
| background-color: #f7f7f7;
| |
|
| |
| #nav li a {
| |
| background-color: #000000;
| |
| border-top: none;
| |
| border-left: 1px solid #ddd;
| |
| }
| |
|
| |
| a.external.text {
| |
| color: #0b4f6c;
| |
| }
| |
|
| |
| a.external.text:visited {
| |
| color: #36b;
| |
| }
| |
|
| |
| a {
| |
| color: #990 !important;
| |
| }
| |
|
| |
| .wikiEditor-ui-toolbar .tabs, .wikiEditor-ui-toolbar .section-main {
| |
| height: auto;
| |
| }
| |
|
| |
| /* ============================================================
| |
| TENTH FLEET WIKI — MAIN PAGE STYLES
| |
| Paste at the BOTTOM of MediaWiki:Common.css, after whatever is
| |
| already there. Everything is nested under .tf-mainpage so it
| |
| cannot affect any other page on the wiki.
| |
|
| |
| Before pasting: search the existing Common.css for "tf-" to
| |
| confirm none of these class names are already in use.
| |
| ============================================================ */
| |
|
| |
| .tf-mainpage { | | .tf-mainpage { |
| --tf-black: #0B0B0D; | | --tf-black: #0B0B0D; |
| Line 319: |
Line 9: |
| --tf-muted: #9A9792; | | --tf-muted: #9A9792; |
| --tf-border: #2A2A2C; | | --tf-border: #2A2A2C; |
| | | |
| background: var(--tf-black); | | background: var(--tf-black); |
| color: var(--tf-text); | | color: var(--tf-text); |
| Line 326: |
Line 16: |
| overflow: hidden; | | overflow: hidden; |
| } | | } |
| | | |
| /* Corner flash — the single deliberate red accent */ | | /* Corner flash — the single deliberate red accent */ |
| .tf-mainpage .tf-flash { | | .tf-mainpage .tf-flash { |
| Line 336: |
Line 26: |
| background: var(--tf-red); | | background: var(--tf-red); |
| } | | } |
| | | |
| /* Hero: crest, wordmark, motto */ | | /* Hero: crest, wordmark, motto */ |
| .tf-mainpage .tf-hero { | | .tf-mainpage .tf-hero { |
| Line 363: |
Line 53: |
| background: var(--tf-gold); | | background: var(--tf-gold); |
| } | | } |
| | | |
| /* Four-section navigation grid */ | | /* Four-section navigation grid */ |
| .tf-mainpage .tf-navgrid { | | .tf-mainpage .tf-navgrid { |
| Line 394: |
Line 84: |
| line-height: 1.5; | | line-height: 1.5; |
| } | | } |
| | | |
| /* Featured article / news / roster columns */ | | /* Featured article / news / roster columns */ |
| .tf-mainpage .tf-content { | | .tf-mainpage .tf-content { |
| Line 419: |
Line 109: |
| line-height: 1.65; | | line-height: 1.65; |
| color: var(--tf-text); | | color: var(--tf-text); |
| | } |
| | /* Neutralize the FeaturedArticle template's own table styling |
| | (text-align: right; font-variant: small-caps) so it matches |
| | the rest of the page instead of the legacy layout. */ |
| | .tf-mainpage .tf-featured table { |
| | width: 100%; |
| | background: transparent; |
| | border: none; |
| | } |
| | .tf-mainpage .tf-featured td { |
| | text-align: left !important; |
| | font-variant: normal !important; |
| | padding: 0; |
| | } |
| | .tf-mainpage .tf-featured img { |
| | border-radius: 4px; |
| | margin: 0 14px 8px 0; |
| | } |
| | /* Override the sitewide h1-h6 olive accent for just this box, |
| | since the template renders its title as a real <h1>. */ |
| | .tf-mainpage .tf-featured h1 { |
| | font-size: 18px !important; |
| | text-align: left !important; |
| | color: var(--tf-gold) !important; |
| | border-bottom: none !important; |
| | margin: 0 0 8px 0 !important; |
| } | | } |
| .tf-mainpage .tf-newsitem { | | .tf-mainpage .tf-newsitem { |
| Line 457: |
Line 173: |
| color: var(--tf-gold); | | color: var(--tf-gold); |
| } | | } |
| | | |
| /* Footer motto repeat */ | | /* Footer motto repeat */ |
| .tf-mainpage .tf-footer { | | .tf-mainpage .tf-footer { |
| Line 468: |
Line 184: |
| color: var(--tf-muted); | | color: var(--tf-muted); |
| } | | } |
| | | |
| /* Mobile: stack everything to one column below 700px */ | | /* Mobile: stack everything to one column below 700px */ |
| @media (max-width: 700px) { | | @media (max-width: 700px) { |