MediaWiki:Gadget-SkinTest.css
From The Fifth City Wiki
Note: After publishing, you may have to bypass your browser's cache to see the changes.
- Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
- Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
- Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.
[data-fcw-theme='light'] { --body-bg-color: #1d1d1d; --body-bg-image: url(/w/images/0/00/Newnewgateheader.png); --main-text-color: #0d0903; --main-link-color: #266666; --alternate-link-color: #84d2d2; --dark-link-color: #266666; --bright-alternate-color: #a8f6f6; --text-bg-color: #bdb29e; --text-bg-image: url(/w/images/a/ad/Bg-paper-dark.png); --text-label-color: #756f65; --box-bg-color: #ded4c4; --box-bg-hover-color: #f5e9d6; --table-bg-color: #ded4c4; --table-bg-alt-color: #e7e4bc; --table-border-color: #756f65; --table-header-bg-color: #9c9078; --table-highlighted-bg-color: #d3d3d3; --heading-underline-color: #3a3a3a; --max-table-width: 100%; --ca-edit-bgimage: linear-gradient(transparent, transparent), url(/w/skins/Timeless/resources/images/pencil-grey.svg); --ca-history-bgimage: linear-gradient(transparent, transparent), url(/w/skins/Timeless/resources/images/clock-grey.svg); --external-link-color: #0c008f; --external-link-active-color: #8f0c00; --external-link-visited-color: #660099; --comment-details-text-color: #555; --fcw-logo: url('/w/resources/assets/change-your-logo-icon.svg'); --success-color: #14866d; --success-bg-color: #d5fdf4; --warning-color: #fc3; --warning-bg-color: #fef6e7; --error-color: #d33; --error-bg-color: #fee7e6; --message-color: #a2a9b1; --message-bg-color: #eaecf0; --invert-in-light: invert(1) hue-rotate(180deg); --invert-in-dark: none; } [data-fcw-theme='dark'] { --body-bg-color: #090b08; /* --body-bg-image: url(/w/images/d/d3/Skyline_background_gradient.png); */ --body-bg-image: url(/w/index.php?title=Special:Redirect/file/Skyline_background_gradient.png); --main-text-color: #bdb29e; --main-link-color: #84d2d2; --alternate-link-color: #84d2d2; --dark-alternate-color: #266666; --bright-alternate-color: #a8f6f6; --text-bg-color: #10140f; --text-bg-image: none; --text-label-color: #756f65; --box-bg-color: #1b2319; --box-bg-hover-color: #273a22; --table-bg-color: #1b2319; --table-bg-alt-color: #354521; --table-border-color: #756f65; --table-header-bg-color: #08210b; --table-highlighted-bg-color: #4e4500; --heading-underline-color: #42686b; --max-table-width: 100%; --ca-edit-bgimage: url(/w/skins/Timeless/resources/images/pencil-grey.png); --ca-history-bgimage: url(/w/skins/Timeless/resources/images/clock-grey.png); --external-link-color: #9e9eff; --external-link-active-color: #ff9e9e; --external-link-visited-color: #d0adf0; --comment-details-text-color: #978d7d; /* --fcw-logo: url('/w/index.php?title=Special:Redirect/file/Flwiki-logo-dark-mode.svg'); */ --fcw-logo: url('/w/resources/assets/change-your-logo-icon.svg'); --success-color: #14866d; --success-bg-color: #07382d; --warning-color: #fc3; --warning-bg-color: #382a00; --error-color: #d33; --error-bg-color: #461b1a; --message-color: #a2a9b1; --message-bg-color: #414242; --invert-in-light: none; --invert-in-dark: invert(1) hue-rotate(180deg); } .invert-in-light { filter: var(--invert-in-light, invert(1) hue-rotate(180deg)); } .invert-in-dark { filter: var(--invert-in-dark, none); } .mw-wiki-logo img { content: var( --fcw-logo, url('/w/resources/assets/change-your-logo-icon.svg') ); } .ts-inner, .mw-body .mw-parser-output > p, ul, li, h1, h2, h3, h4, h5, h6, caption { max-width: unset; } img { max-width: 100%; height: auto; } img.option-img { max-width: none; } .mw-option > div { min-width: 0; } @media screen and (min-width: 851px) { #mw-content-block, #mw-header { justify-content: center; } #personal h2 { padding: 7px 0 0 25px; } #personal .dropdown { border-width: 1px; } } @media screen and (min-width: 851px) and (max-width: 1099px) { #catlinks { margin: 1em 0; padding: 0.5em 1.5em; } } @media screen and (min-width: 1340px) { #mw-content-wrapper, #p-search, #mw-footer { flex: 1 1 800px; max-width: calc(100vw - 30em); min-width: unset; } #mw-content { padding: 3em; } #mw-footer-container { display: flex; justify-content: center; } #mw-footer { margin-top: 1em; padding: 2em 4em; } } .mw-body { overflow: visible; } .table-container { max-width: 100%; overflow: auto; } .article-table { display: block; margin: 1em 0; max-width: 100%; } .article-table caption { width: max-content; } .article-table.article-table-centered { margin: 1em auto; width: max-content; max-width: 100%; } .article-table.article-table-centered.mw-collapsed { display: table; width: 100%; } .article-table.article-table-centered caption { width: auto; } .article-table.floatright { margin: 1em 0; } .mw-body .mw-rcfilters-ui-changesListWrapperWidget .mw-changeslist-legend, .mw-changeslist-legend, .mw-body .mw-search-profile-tabs, .mw-body fieldset#mw-searchoptions, .article-table td, .wikitable td, .article-table tbody, .wikitable tbody, .mw-body .mw-datatable, .mw-body .mw-json, .mw-body .wikitable { background-color: #ded4c4; background-color: var(--table-bg-color, #ded4c4); border-color: #756f65; border-color: var(--table-border-color, #756f65); } .article-table th, .wikitable th { background-color: #9c9078; background-color: var(--table-header-bg-color, #9c9078); } .mw-datatable > tr > th, .mw-datatable > * > tr > th, .mw-json > tr > th, .mw-json > * > tr > th, .wikitable > tr > th, .wikitable > * > tr > th { background-color: #9c9078; background-color: var(--table-header-bg-color, #9c9078); padding-bottom: 9px; padding-top: 9px; } .mw-datatable > tr > th, .mw-datatable > * > tr > th, .mw-json > tr > th, .mw-json > * > tr > th, .wikitable > tr > th, .wikitable > tr > td, .wikitable > * > tr > th, .wikitable > * > tr > td { border-color: #756f65; border-color: var(--table-border-color, #756f65); } .mw-body .wikitable, .mw-body .mw-datatable { border-width: 1px; } th.fl-cell-highlighted, td.fl-cell-highlighted, .fl-cell-highlighted th, .fl-cell-highlighted td, .wikitable .fl-cell-highlighted, .article-table .fl-cell-highlighted, .fl-cell-highlighted { background-color: lightgrey; background-color: var(--table-highlighted-bg-color, lightgrey); font-weight: bold; } ul#filetoc, .toc, .mw-warning, .mw-dismissable-notice, #localNotice { background-color: #bdb29e; background-color: var(--text-bg-color, #bdb29e); border-color: #3a3a3a; border-color: var(--heading-underline-color, #3a3a3a); } body { font-family: Roboto, Arial, sans-serif; font-weight: 400; font-size:1.0em; line-height:1.5; background-color: #1d1d1d; background-color: var(--body-bg-color, #1d1d1d); } #mw-content-container { background-color: #1d1d1d; background-color: var(--body-bg-color, #1d1d1d); } @media only screen and (min-width: 1100px) { #mw-content-container { background-image: url(/w/images/0/00/Newnewgateheader.png); background-image: var( --body-bg-image, url(/w/images/0/00/Newnewgateheader.png) ); background-position: top 244px center; background-repeat: no-repeat; background-size: 200% auto; } } #mw-content, #mw-site-navigation, #mw-related-navigation, a.mw-selflink, .search-types .current a { color: #0d0903; color: var(--main-text-color, #0d0903); } a, a:visited, a:hover, a:visited:hover, .toctogglelabel { color: #266666; color: var(--main-link-color, #266666); } a.low-contrast-link { color: #84d2d2; color: var(--alternate-link-color, #84d2d2); text-decoration: underline; } .mw-body .mw-parser-output a.external { color: #0c008f; color: var(--external-link-color, #0c008f); } .mw-body .mw-parser-output a.external:active { color: #8f0c00; color: var(--external-link-active-color, #8f0c00); } .mw-body .mw-parser-output a.external:visited { color: #660099; color: var(--external-link-visited-color, #660099); } .mw-body .mw-parser-output a.external[href^="https://thefifthcity.wiki"], .mw-body .mw-parser-output a.external[href^="http://thefifthcity.wiki"] { color: #266666; color: var(--main-link-color, #266666); } .tools-inline li.selected { border-bottom-color: #266666; border-bottom-color: var(--main-link-color, #266666); } .tools-inline li.selected a { color: #3a3a3a; color: var(--heading-underline-color, #3a3a3a); } .tools-inline li a:hover { text-decoration: none; } .tools-inline li:hover { border-bottom-color: #3a3a3a; border-bottom-color: var(--heading-underline-color, #3a3a3a); } .tools-inline li { font-family: 'Roboto Slab', Georgia, Times, serif; font-weight: 700; text-transform: uppercase; } #ca-edit a, #ca-history a, #ca-watch a, #ca-unwatch a { background-position: left center; padding: 0 2px 0 22px; } .client-js #ca-edit a, .mw-editsection { background-image: var( --ca-edit-bgimage, url(/w/skins/Timeless/resources/images/pencil-grey.svg) ); } #ca-history a { background-image: var( --ca-history-bgimage, url(/w/skins/Timeless/resources/images/clock-grey.svg) ); } #mw-content { background-image: url(/w/images/a/ad/Bg-paper-dark.png); background-image: var(--text-bg-image, url(/w/images/a/ad/Bg-paper-dark.png)); background-color: #bdb29e; background-color: var(--text-bg-color, #bdb29e); background-repeat: repeat; border-width: 1px; border:solid #2b2b2e; border-width:1px 1px 0.2em; padding:3em; box-shadow:0 10px 12px 0 #2a2a2b,0 12px 26px 0 #2a2a2b } [data-darkreader-mode] #mw-content { background-image: none; } @media screen and (min-width: 1340px) { #mw-site-navigation .sidebar-chunk, #mw-related-navigation .sidebar-chunk { background-image: url(/w/images/a/ad/Bg-paper-dark.png); background-image: var( --text-bg-image, url(/w/images/a/ad/Bg-paper-dark.png) ); background-color: #bdb29e; background-color: var(--text-bg-color, #bdb29e); background-repeat: repeat; border-width: 1px; box-shadow: 0 1px 3px rgb(0 0 0 / 12%), 0 1px 2px rgb(0 0 0 / 24%); border: solid #2b2b2e; border-width: 1px 1px 0.2em; } [data-darkreader-mode] #mw-site-navigation .sidebar-chunk, [data-darkreader-mode] #mw-related-navigation .sidebar-chunk { background-image: none; } } @media screen and (min-width: 1100px) and (max-width: 1339px) { #mw-site-navigation .sidebar-chunk, #mw-related-navigation .sidebar-chunk { background-image: url(/w/images/a/ad/Bg-paper-dark.png); background-image: var( --text-bg-image, url(/w/images/a/ad/Bg-paper-dark.png) ); background-color: #bdb29e; background-color: var(--text-bg-color, #bdb29e); border: solid #2b2b2e; border-width: 1px 1px 0.2em; } } .mw-body h1, .mw-body h2, .mw-body h3, .mw-body h4, .mw-body h5, .mw-body h6, .mw-body dt, h1, h2, h3, h4, h5, h6 { font-weight: 400; font-family: 'Roboto Slab', Georgia, Times, serif; line-height: 1.125; margin: 0.5em 0 0.2em; } .mw-body h1, .mw-body h1.firstHeading { font-size: 2.4em; border-bottom: solid 1px; border-bottom-color: #3a3a3a; border-bottom-color: var(--heading-underline-color, #3a3a3a); } .mw-body h2 { font-size: 1.7em; border-bottom: solid 1px; border-bottom-color: #3a3a3a; border-bottom-color: var(--heading-underline-color, #3a3a3a); font-weight: 700; overflow: hidden; } .mw-body .mw-parser-output h1:after, .mw-body .mw-parser-output h2:after { display: none; } .mw-body .mw-parser-output h1, .mw-body .mw-parser-output h2 { border-bottom: solid 1px; border-bottom-color: #3a3a3a; border-bottom-color: var(--heading-underline-color, #3a3a3a); overflow: hidden; } .tocnumber { color: #3a3a3a; color: var(--heading-underline-color, #3a3a3a); } .mw-body .toctitle { border-bottom-color: #3a3a3a; border-bottom-color: var(--heading-underline-color, #3a3a3a); } .mw-body .toctitle h2 { border-bottom: none; } .toc { border-width: 1px; } .mw-body .mw-parser-output .toc ul { margin: 0.375em 0; } .mw-body .mw-parser-output .toc ul ul { margin-inline-start: 1.5em; } .mw-body h3 { font-weight: 400; font-size: 1.5em; } .mw-body h4 { font-weight: 400; font-size: 1.35em; } .mw-body h5 { font-weight: 400; font-size: 1.2em; } .mw-body h6 { font-weight: 700; font-size: 1.0em; } #mw-related-navigation .sidebar-chunk h3 { font-weight: 700; font-size: 1em; border-bottom-width: 1px; border-bottom-color: #3a3a3a; border-bottom-color: var(--heading-underline-color, #3a3a3a); } #mw-site-navigation .sidebar-chunk h3 { font-weight: 700; font-size: 1em; border-bottom-width: 1px; border-bottom-color: #3a3a3a; border-bottom-color: var(--heading-underline-color, #3a3a3a); } .mw-body .mw-parser-output p + p { margin: unset; margin-top: 1em; margin-bottom: 1em; } /*@media screen and (min-width: 851px) { .mw-wiki-logo.fallback { background-position: center bottom; } #p-logo { margin-bottom: -1em; } }*/ #mw-header-container, #searchInput, #p-logo-text a, .suggestions .suggestions-result, .suggestions-special .special-query { color: ghostwhite; } #searchInput::placeholder, .suggestions-special .special-label { color: silver; } .suggestions .suggestions-special, .suggestions .suggestions-results { border-bottom-width: 1px; } div.editOptions { border-color: #756f65; border-color: var(--table-border-color, #756f65); border-width: 0 1px 1px; background-color: #ded4c4; background-color: var(--box-bg-color, #ded4c4); } #pagehistory li.selected { background-color: #ded4c4; background-color: var(--box-bg-color, #ded4c4); color: #0d0903; color: var(--main-text-color, #0d0903); } #mw-history-search .oo-ui-iconElement-icon { filter: var(--invert-in-dark, none); } #mw-header-container,#mw-header-hack,#mw-header-nav-hack,.color-middle-container,.color-middle { background-color: #1b2319; } #mw-content-container { border-bottom: none; } /* todo: grab button with real background */ .cdx-button[href="https://www.mediawiki.org/"] img { background-color: white; } #mw-footer-container { border: none; box-shadow: none; } @media screen and (max-width: 850px) { #mw-content { box-shadow: none; border-bottom: none; } #mw-content-wrapper { background-color: #bdb29e; background-color: var(--text-bg-color, #bdb29e); } #catlinks { border: 1px solid #756f65; overflow: hidden; clear: both; padding: 1em; } #catlinks div { margin: 0em; } } @media screen and (min-width: 851px) and (max-width: 1099px) { #mw-content-wrapper { background-color: #bdb29e; background-color: var(--text-bg-color, #bdb29e); } #mw-content { box-shadow: none; border-bottom: none; } #catlinks { border: 1px solid #756f65; overflow: hidden; clear: both; padding: 1em; margin: 1em; } #catlinks div { margin: 0em; } } .fcw-theme-widget-container { margin-bottom: 1em; } #searchButton, #mw-searchButton { background-image: url("https://thefifthcity.wiki/w/skins/Timeless/resources/images/magnifying-glass2.svg"); } @media screen and (min-width: 851px) { #personal h2 { background-image: url("https://thefifthcity.wiki/w/skins/Timeless/resources/images/user-grey2.svg"); } } .tools-inline li[id^="ca-nstab-"] a, #ca-talk a, .tools-inline li a, #t-contributions a { background-image: none; padding: 0 2px 0 0; } @media screen and (max-width: 850px) { #ca-nstab-main a, #ca-talk a, #ca-purge a { display: inline; } #site-navigation h2 { background-image: url("/w/skins/Timeless/resources/images/menu2.svg"); } #site-tools h2 { background-image: url("/w/skins/Timeless/resources/images/settings2.svg"); } #user-tools h2 { background-image: url("/w/skins/Timeless/resources/images/user-large-grey2.svg"); } } #ca-watch a { background-image: url("/w/skins/Timeless/resources/images/un-star2.svg"); } #ca-unwatch a { background-image: url("/w/skins/Timeless/resources/images/un-star-f2.svg"); } figure[typeof~='mw:File/Thumb'] > figcaption { border: none; box-shadow: none; background-color: transparent; } figure[typeof~="mw:File/Thumb"] { border: none; box-shadow: none; background-color: transparent; } figure[typeof~="mw:File/Thumb"] > :not(figcaption) .mw-file-element { border: none; } .ext-WikiEditor-twopanes-pane1, .wikiEditor-ui-text { background-color: white; } .portable-infobox { background-color: #ded4c4; background-color: var(--table-bg-color, #ded4c4); } .wikitable, .editOptions { color: inherit; } .editCheckboxes { margin-bottom: 0.8em; } .mw-body-content .CodeMirror { color: black; } /* Advanced search field color */ .mw-body fieldset#mw-searchoptions { color: inherit !important; } /* Paragraphs in tables */ .article-table p + p { margin: .5em 0 .5em !important; } /**/ /* DC stuff onwards */ /**/ blockquote { /*width:66%;*/ border-left:4px solid #565646; margin:12px 40px; padding:0 0.4em 0 0.8em; font-size:20px; } #mw-footer-container { color: #9c9c9d; font-size:0.8em; border: none; box-shadow: none; } #mw-footer { padding-top:0.5em; padding-bottom:1em; } #mw-footer ul, #mw-footer li { margin:1em 0; list-style:none; padding:0; } #mw-footer .footer-icons { float:right; margin:0 0 0 1em; } #mw-footer .footer-icons li { margin:0 0 1em 0; } #mw-footer .footer-places li { display:inline; padding-right:1em; } #mw-footer #lastmod, #mw-footer #credits, #mw-footer #copyright { display:block; } #simpleSearch { box-shadow:inset 0 2px 4px 0 rgba(0,0,0,0.05); background: #39393c; position:relative; border:solid 1px #262626; color: #cececf; } @media screen and (min-width: 851px) and (max-width: 1099px) { .sidebar-chunk h2 { color: #e4e4e4; display: inline-block; } #mw-header-nav-hack { border-top:solid 2px #2b2b2e; } .color-right { background: #373737; } .color-middle { background: #1b2319; } } .color-left { height: 0.2em; background: #373737; float: none; width: auto; } .color-right { display: block; height: 0.2em; float: none; width: auto; } .color-middle { height: 0.2em; margin: 0em; } @media screen and (max-width: 850px) { .color-right { background: #1b2319; } } @media screen and (min-width: 1100px) /*and (max-width: 1339px)*/ { .color-right { background-color: #373737; } } @media screen and (min-width: 851px) and (max-width: 1099px) { #mw-site-navigation .sidebar-inner, #mw-related-navigation .sidebar-inner { border:solid #2b2b2e; background:#373737; } #mw-site-navigation .sidebar-inner h3, #mw-related-navigation .sidebar-inner h3 { color: #cececf; } div.sidebar-inner > div > div > ul > li > a:not(.new), div.sidebar-inner > div > h3 > a:not(.new) { color:#50bbc5 } .fcw-theme-widget-container { margin-bottom: 0.8em; } #mw-site-navigation .sidebar-chunk h2 span::after, #mw-related-navigation .sidebar-inner::after { border-bottom-color: #373737; } } @media screen and (min-width: 851px) { #personal .dropdown { border:solid #2b2b2e; background:#373737; } #personal .dropdown h3 { border-bottom: solid 2px #2b2b2e; } #personal .dropdown::after { border-bottom-color: #373737; } #personal-inner a:not(.new) { color:#50bbc5 } } @media screen and (max-width: 850px) { #menus-cover { background: #2b2b2e; } .sidebar-inner, .dropdown { border: solid #2b2b2e; background: #373737; } .fcw-theme-widget-container { margin-bottom: 1.2em; } .sidebar-inner h3 { color: #e4e4e4; } .sidebar-inner li a:not(.new), #personal-inner a:not(.new) { color: #50bbc5; } .dropdown h3 { border-bottom: solid 2px #2b2b2e; } } #mw-footer-container a { color: #2e97c6; } .suggestions { background:#39393c; box-shadow:0 2px 2px 1px rgba(0,0,0,0.05); } .suggestions .suggestions-special { background-color:#39393c; border:1px solid #262626; border-bottom-width:0.2em; padding:0.75em 2em; color:#cececf; } .suggestions .suggestions-results { background-color:#39393c; border:1px solid #262626; border-bottom-width:0.2em; } .suggestions .suggestions-result { color:#cececf; padding:0.65em 2em 0.35em; } .suggestions .suggestions-result.active { background-color:#373737; color:#cececf; } .suggestions a.mw-searchSuggest-link, .suggestions a.mw-searchSuggest-link:hover, .suggestions a.mw-searchSuggest-link:active, .suggestions a.mw-searchSuggest-link:focus { color:#000; text-decoration:none; } .suggestions-result.active a.mw-searchSuggest-link, .suggestions-result.active a.mw-searchSuggest-link:hover, .suggestions-result.active a.mw-searchSuggest-link:active, .suggestions-result.active a.mw-searchSuggest-link:focus { color:#fff; } .suggestions a.mw-searchSuggest-link .special-query { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .article-table th, .article-table td, .wikitable th, .wikitable td { padding:6px 12px; }