MediaWiki:Gadget-ms-Tardis.css: Difference between revisions
From Tardis Wiki, the free Doctor Who reference
(switching some colors out) |
No edit summary |
||
(155 intermediate revisions by 6 users not shown) | |||
Line 1: | Line 1: | ||
/* ============================ | /* ============================ | ||
Tardis.css v. | Tardis.css v. 2.0 | ||
Month of last major change: | Month of last major change: Feb 2024 | ||
This page styles custom elements | This page styles custom elements | ||
Line 9: | Line 9: | ||
Tardis, you'll find the styling here. | Tardis, you'll find the styling here. | ||
============================ */ | ============================ */ | ||
/* ====================== | /* ====================== | ||
Line 18: | Line 19: | ||
======================= | ======================= | ||
Clearly owes a debt to | Clearly owes a debt to | ||
memoryalpha. | memoryalpha.fandom.com, | ||
who were riffin' off of | who were riffin' off of | ||
en.wikipedia | en.wikipedia | ||
Line 27: | Line 28: | ||
+++++++++++++++++++++++ */ | +++++++++++++++++++++++ */ | ||
div#article-type { | div#article-type { | ||
border:1px solid | border: 1px solid var(--accent-1); | ||
padding:5px; | padding: 5px; | ||
letter-spacing:.5px; | letter-spacing: .5px; | ||
text-align:left; | text-align: left; | ||
min-height:55px; | min-height: 55px; | ||
margin:0px 0px 10px 0px; | min-width: 528.5px; | ||
margin: 0px 0px 10px 0px; | |||
} | } | ||
div#article-type p { | div#article-type p { | ||
margin-left:205px; | margin-left: 205px; | ||
line-height:11px; | line-height: 11px; | ||
font-size:11px; | font-size: 11px; | ||
text-align:left; | text-align: left; | ||
font-weight:normal; | font-weight: normal; | ||
font-style:normal; | font-style: normal; | ||
} | |||
div#type-title { | |||
margin-left: 205px; | |||
font-size: 18pt; | |||
line-height: 16pt; | |||
} | } | ||
Line 47: | Line 54: | ||
+++++++++++++++++++ */ | +++++++++++++++++++ */ | ||
div.type-realworld { | div.type-realworld { | ||
margin:auto auto auto auto; | margin: auto auto auto auto; | ||
top:0px; | top: 0px; | ||
max-height:55px; | max-height: 55px; | ||
background: url(https:// | background: url(https://tardis.wiki/w/images/Tardis_Images/d/d8/SmallClapper.jpg) no-repeat; | ||
z-index:5; | z-index: 5; | ||
} | } | ||
div.type-nc { | div.type-nc { | ||
background: url(https: //tardis.wiki/w/images/Tardis_Images/f/f1/Journal200px.png) no-repeat; | |||
background: url(https:// | z-index: 5; | ||
z-index:5; | |||
} | } | ||
div.type-disambig { | div.type-disambig { | ||
max-height:55px; | max-height: 55px; | ||
background: | background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/a/af/Transferring.jpg) no-repeat; | ||
z-index:5; | z-index: 5; | ||
} | } | ||
div.type-inuse { | div.type-inuse { | ||
background: | background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/e/e0/Inuse200px.jpg) no-repeat; | ||
z-index:5; | z-index: 5; | ||
} | } | ||
div.type-update { | div.type-update { | ||
margin-left:180px; | margin-left: 180px; | ||
background: | background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/3/37/Update200px.jpg) no-repeat; | ||
z-index:5; | z-index: 5; | ||
} | } | ||
div.type-cleanup { | div.type-cleanup { | ||
background: | background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/5/58/Thirteen_repairing_timeship.jpg) no-repeat; | ||
} | |||
div.type-listy { | |||
background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/3/3a/Explain_explain_Journey%27s_End.jpg) no-repeat; | |||
} | } | ||
div.type-delete { | div.type-delete { | ||
background: | background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/6/6b/Delete200px.jpg) no-repeat; | ||
z-index:5; | z-index: 5; | ||
} | } | ||
div.type-oou { | div.type-oou { | ||
background: | background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/6/63/Oou200px.jpg) no-repeat; | ||
z-index:5; | z-index: 5; | ||
} | } | ||
div.type-rename { | div.type-rename { | ||
background: | background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/1/1e/Rename200px.jpg) no-repeat; | ||
z-index:5; | z-index: 5; | ||
} | |||
div.type-merge { | |||
background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/9/99/Merging_Tremaster.jpg); | |||
background-repeat: no-repeat; | |||
background-size: 200px 200px; | |||
background-position: 0 0; | |||
z-index: 5; | |||
} | } | ||
div.type-spoiler { | div.type-spoiler { | ||
background: | background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/7/7f/Spoiler200px.jpg) no-repeat; | ||
z-index:5; | z-index: 5; | ||
} | } | ||
div.type-conjecture { | div.type-conjecture { | ||
background: | background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/c/c3/Conjecture200px.jpg) no-repeat; | ||
z-index:5; | z-index: 5; | ||
} | } | ||
div.type-talk { | div.type-talk { | ||
background: | background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/b/b4/Talk200px.jpg) no-repeat; | ||
z-index:5; | z-index: 5; | ||
} | } | ||
div.type-unprod { | div.type-unprod { | ||
background: | background: rgba(var(--contrast-color-1--rgb),0.4) url(https: //tardis.wiki/w/images/Tardis_Images/f/f2/Unprod.png) no-repeat; | ||
z-index:5; | z-index: 5; | ||
} | } | ||
div.type-doctorwhich { | div.type-doctorwhich { | ||
background: | background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/a/af/WhichDoctor.jpg) no-repeat; | ||
z-index:5; | z-index: 5; | ||
} | } | ||
div.type-nonfiction { | div.type-nonfiction { | ||
background: | background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/2/26/Nonfiction.png) no-repeat; | ||
z-index:5; | z-index: 5; | ||
} | } | ||
div.type-prefix { | div.type-prefix { | ||
background: | background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/d/d5/Prefix.png) no-repeat; | ||
z-index:5; | z-index: 5; | ||
background-size:200px 90px; | background-size: 200px 90px; | ||
background-position:left top; | background-position: left top; | ||
} | } | ||
div.type- | div.type-demonym { | ||
background- | background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/c/c6/Demonym200px.jpg) no-repeat; | ||
background- | z-index: 5; | ||
background-position: 0px -20px | |||
} | |||
/* =============== | |||
STUBS | |||
=============== */ | |||
.stub-type, | |||
#stub-type { | |||
float: left; | |||
margin-right: 12px; | |||
margin-top: 5px; | |||
} | } | ||
.stub-type + .stub-type + .stub-type, | |||
#stub-type + .stub-type + .stub-type, | |||
#stub-type + #stub-type + .stub-type, | |||
#stub-type + #stub-type + #stub-type, | |||
#stub-type + .stub-type + #stub-type, | |||
.stub-type + #stub-type + .stub-type, | |||
.stub-type + #stub-type + #stub-type, | |||
.stub-type + .stub-type + #stub-type { | |||
clear: left; | |||
} | } | ||
/* This is for the small, right-floating boxes, | /* This is for the small, right-floating | ||
boxes, like DisconNav */ | |||
div#inline-box-rt { | div#inline-box-rt { | ||
float:right; | float: right; | ||
padding:10px; | padding: 10px; | ||
text-align: center; | text-align: center; | ||
border:1px solid | border: 1px solid var(--accent-1); | ||
width:250px; | width: 250px; | ||
margin:10px; | margin: 10px; | ||
line-height:1.1em; | line-height: 1.1em; | ||
font-size:.8em; | font-size: .8em; | ||
font-weight:400; | font-weight: 400; | ||
font-style:normal; | font-style: normal; | ||
background-color:transparent ; | background-color: transparent ; | ||
color: #fff; | |||
} | } | ||
/* This is for the small, left-floating | /* This is for the small, left-floating | ||
boxes, like section cleanup */ | boxes, like section cleanup */ | ||
div#inline-box { | div#inline-box { | ||
float:left; | float: left; | ||
padding:10px; | padding: 10px; | ||
text-align: center; | text-align: center; | ||
border:1px solid | border: 1px solid var(--accent-7); | ||
width:250px; | width: 250px; | ||
margin:10px; | margin: 10px 14px 10px 10px; | ||
line-height:1.1em; | line-height: 1.1em; | ||
font-size:.8em; | font-size: .8em; | ||
font-weight:400; | font-weight: 400; | ||
font-style:normal; | font-style: normal; | ||
background-color:transparent; | background-color: transparent; | ||
color: var(--text-color); | |||
} | } | ||
div#inline-box p, | div#inline-box p, | ||
div#inline-box-rt p { | div#inline-box-rt p { | ||
line-height:.9em; | line-height: .9em; | ||
font-size:.8em; | font-size: .8em; | ||
font-weight:normal; | font-weight: normal; | ||
font-style:normal; | font-style: normal; | ||
color: | color: var(--text-color-2); | ||
} | } | ||
/* DIVs used in "messages" (as in the delete temp) */ | /* DIVs used in "messages" (as in the delete temp) */ | ||
Line 182: | Line 209: | ||
background-color: #401F22; | background-color: #401F22; | ||
border: 1px solid #660000; | border: 1px solid #660000; | ||
font-family: "Maven Pro","Nunito","Rubik",sans-serif; | |||
color: #FF0000; | color: #FF0000; | ||
font-weight: bold; | font-weight: bold; | ||
margin: 2em 0 1em; | margin: 2em 0 1em; | ||
padding: .5em 1em; | padding: .5em 1em; | ||
margin-top:auto; | margin-top: auto; | ||
margin-bottom:auto; | margin-bottom: auto; | ||
text-align: justify; | text-align: justify; | ||
} | } | ||
Line 193: | Line 221: | ||
.copyright-notice { | .copyright-notice { | ||
background-color: transparent; | background-color: transparent; | ||
border: 1px solid | border: 1px solid var(--accent-1); | ||
font-family: "Maven Pro","Nunito","Rubik",sans-serif; | |||
color: #000; | color: #000; | ||
padding: .5em 1em; | padding: .5em 1em; | ||
margin: auto; | margin: auto; | ||
width:80%; | width: 80%; | ||
line-height:110%; | line-height: 110%; | ||
font-size:95%; | font-size: 95%; | ||
text-align: justify; | text-align: justify; | ||
} | } | ||
Line 209: | Line 238: | ||
background-color: #401F22; | background-color: #401F22; | ||
border: 1px solid #CC0000; | border: 1px solid #CC0000; | ||
font-family: "Maven Pro","Nunito","Rubik",sans-serif; | |||
color: #FFFFFF; | color: #FFFFFF; | ||
margin: 2em 10% 1em 10%; | margin: 2em 10% 1em 10%; | ||
padding: .5em 1em; | padding: .5em 1em; | ||
text-align: justify; | text-align: justify; | ||
font-size:smaller; | font-size: smaller; | ||
} | } | ||
div.header-notice#fa { | div.header-notice#fa { | ||
Line 232: | Line 262: | ||
font-weight: bold; | font-weight: bold; | ||
border-bottom: 1px solid #666; | border-bottom: 1px solid #666; | ||
} | |||
.tr-tit { | |||
font-family: "Maven Pro","Nunito","Rubik",sans-serif!important; | |||
font-weight: bold; | |||
} | } | ||
/* ============ | /* ============ | ||
Line 244: | Line 278: | ||
.wikipedia-info, | .wikipedia-info, | ||
div#wikipedia-info { | div#wikipedia-info { | ||
float: left; | |||
margin-right: 5px; | |||
margin-top: 15px; | |||
float:left; | |||
margin-right:5px; | |||
margin-top:15px; | |||
} | } | ||
/* This places {{protect}} and {{lock}} | /* This places {{protect}} and {{lock}} | ||
Line 259: | Line 287: | ||
.protect, | .protect, | ||
div#protect { | div#protect { | ||
float:left; | float: left; | ||
margin-right:5px; | margin-right: 5px; | ||
margin-top:15px; | margin-top: 15px; | ||
} | } | ||
.type-of-article, | .type-of-article, | ||
div#type-of-article { | div#type-of-article { | ||
float:left; | float: left; | ||
margin-right:5px; | margin-right: 5px; | ||
margin-top:15px; | margin-top: 15px; | ||
} | } | ||
/* ======================= | /* ======================= | ||
SHORTCUTS | SHORTCUTS | ||
the little boxes that say | the little boxes that say | ||
T:WHATEVER | T: WHATEVER | ||
in the upper right hand corner | in the upper right hand corner | ||
of pages | of pages | ||
Line 283: | Line 311: | ||
div.shortcut { | div.shortcut { | ||
float:right; | float: right; | ||
background:transparent; | background: transparent; | ||
border:1px solid | border: 1px solid var(--accent-4); | ||
padding: 0.65em; | padding: 0.65em; | ||
margin: 10px 10px 10px 10px; | margin: 10px 10px 10px 10px; | ||
text-align: center; | text-align: center; | ||
font-size:smaller; | font-size: smaller; | ||
font-weight:bold; | font-weight: bold; | ||
width: auto; | width: auto; | ||
} | } | ||
Line 298: | Line 326: | ||
=============== */ | =============== */ | ||
.timeline a:visited, | .timeline a: visited, | ||
.timeline a:link { | .timeline a: link { | ||
color:#ccdfff | color: #ccdfff | ||
} | } | ||
.timeline a:hover { | .timeline a: hover { | ||
color:#fff9d4; | color: #fff9d4; | ||
background:none; | background: none; | ||
} | } | ||
.timeline { | .timeline { | ||
color:#fff; | color: #fff; | ||
background: #012c57; | background: #012c57; | ||
background: -moz-linear-gradient(top, #012c57 0%, #012c57 35%, #4e7dab 100%); | background: -moz-linear-gradient(top, #012c57 0%, #012c57 35%, #4e7dab 100%); | ||
Line 316: | Line 344: | ||
background: -ms-linear-gradient(top, #012c57 0%,#012c57 35%,#4e7dab 100%); | background: -ms-linear-gradient(top, #012c57 0%,#012c57 35%,#4e7dab 100%); | ||
background: linear-gradient(top, #012c57 0%,#012c57 35%,#4e7dab 100%); | background: linear-gradient(top, #012c57 0%,#012c57 35%,#4e7dab 100%); | ||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#012c57', endColorstr='#4e7dab',GradientType=0 ); | filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#012c57', endColorstr='#4e7dab',GradientType=0 ); | ||
overflow: visible; | overflow: visible; | ||
border-color:transparent; | border-color: transparent; | ||
text-align: center; | text-align: center; | ||
font-size: 0.85em; | font-size: 0.85em; | ||
Line 324: | Line 352: | ||
clear: right; | clear: right; | ||
width: 250px!important; | width: 250px!important; | ||
min-width:250px!important; | min-width: 250px!important; | ||
margin-bottom: 10px; | margin-bottom: 10px; | ||
margin-right: 10px; | margin-right: 10px; | ||
Line 341: | Line 369: | ||
#glow { | #glow { | ||
background-color: transparent; | background-color: transparent; | ||
border: 1px solid | border: 1px solid var(--accent-1); | ||
padding: .5em 1em; | padding: .5em 1em; | ||
margin:auto; | margin: auto; | ||
width:95%; | width: 95%; | ||
line-height:110%; | line-height: 110%; | ||
font-size:95%; | font-size: 95%; | ||
text-align:justify; | text-align: justify; | ||
-moz-box-shadow: -0px 0px 40px | -moz-box-shadow: -0px 0px 40px var(--accent-4); | ||
-webkit-box-shadow: -0px 0px 40px | -webkit-box-shadow: -0px 0px 40px var(--accent-4); | ||
-ms-box-shadow: -0px 0px 40px | -ms-box-shadow: -0px 0px 40px var(--accent-4); | ||
-o-box-shadow: -0px 0px 40px | -o-box-shadow: -0px 0px 40px var(--accent-4); | ||
box-shadow: -0px 0px 40px | box-shadow: -0px 0px 40px var(--accent-4); | ||
} | } | ||
#quote-nom { | #quote-nom { | ||
background-color: transparent; | background-color: transparent; | ||
border: 1px solid | border: 1px solid var(--accent-1); | ||
margin-right: 260px; | margin-right: 260px; | ||
padding: .5em 1em; | padding: .5em 1em; | ||
vertical-align: middle; | vertical-align: middle; | ||
margin-left:auto; | margin-left: auto; | ||
margin-right:auto; | margin-right: auto; | ||
line-height:110%; | line-height: 110%; | ||
font-size:95%; | font-size: 95%; | ||
text-align: justify; | text-align: justify; | ||
-moz-box-shadow: inset -0px 0px 25px 4px | -moz-box-shadow: inset -0px 0px 25px 4px var(--accent-4); | ||
-webkit-box-shadow: inset -0px 0px 25px 4px | -webkit-box-shadow: inset -0px 0px 25px 4px var(--accent-4); | ||
-ms-box-shadow: inset -0px 0px 25px 4px | -ms-box-shadow: inset -0px 0px 25px 4px var(--accent-4); | ||
-o-box-shadow: inset -0px 0px 25px 4px | -o-box-shadow: inset -0px 0px 25px 4px var(--accent-4); | ||
box-shadow: inset -0px 0px 25px #e5c076 4px; | box-shadow: inset -0px 0px 25px #e5c076 4px; | ||
} | } | ||
#license { | #license { | ||
background-color: transparent; | background-color: transparent; | ||
border: | border: solid 2px #8495b3; | ||
border-radius: 14px; | |||
margin: auto; | margin: auto; | ||
padding: .5em 1em; | padding: .5em 1em; | ||
width:80%; | width: 80%; | ||
line-height:110%; | line-height: 110%; | ||
font-size:95%; | font-size: 95%; | ||
font-family: "Rubik"; | font-family: "Rubik"; | ||
text-align: left; | text-align: left; | ||
position: relative; | |||
left: -1px; | |||
} | |||
#license + #license { | |||
margin-top: 7.04px; | |||
} | |||
#license h1 { | |||
margin-top: 11.62px; | |||
} | |||
#license h1:after { | |||
border-bottom: solid 4px #1a2e53; | |||
border-bottom: solid 2px #6f8cc1; | |||
margin-top: 10px; | |||
} | |||
#license a img { | |||
position: relative; | |||
top: -2.82px; | |||
} | } | ||
.smw-editpage-help, | |||
#box { | #box { | ||
font-weight:normal; | font-weight: normal; | ||
background-color: | background-color: var(--primary-9); | ||
border: 1px solid | border: 1px solid var(--primary-3); | ||
color:inherit; | color: inherit; | ||
font-family:"Rubik"; | font-family: "Maven Pro","Nunito","Rubik",sans-serif; | ||
padding: | padding: 16px; | ||
margin-top: | margin-top: 13px; | ||
margin-bottom:25px; | margin-bottom: 25px; | ||
margin-left:auto; | margin-left: auto; | ||
margin-right:auto; | margin-right: auto; | ||
font-size:95%; | padding-bottom: 21px; | ||
font-size: 95%; | |||
} | } | ||
#box-rt { | #box-rt { | ||
font-weight:normal; | font-weight: normal; | ||
background-color:transparent; | background-color: transparent; | ||
border: 2px solid | border: 2px solid var(--accent-1); | ||
color:#000; | color: #000; | ||
font-family:"Rubik"; | font-family: "Maven Pro","Nunito","Rubik",sans-serif; | ||
padding:10px; | padding: 10px; | ||
margin-top:25px; | margin-top: 25px; | ||
margin-bottom:25px; | margin-bottom: 25px; | ||
margin-left:auto; | margin-left: auto; | ||
margin-right:auto; | margin-right: auto; | ||
font-size:95%; | font-size: 95%; | ||
} | } | ||
#box-lt { | #box-lt { | ||
font-weight:normal; | font-weight: normal; | ||
background-color:transparent; | background-color: transparent; | ||
border: 1px solid | border: 1px solid var(--accent-1); | ||
color:#000; | color: #000; | ||
font-family:"Rubik"; | font-family: "Maven Pro","Nunito","Rubik",sans-serif; | ||
padding:10px; | padding: 10px; | ||
margin:25px auto 25px auto; | margin: 25px auto 25px auto; | ||
font-size:95%; | font-size: 95%; | ||
} | } | ||
#th { | #th { | ||
font-family: Adelle, 'Cambria', 'Book Antiqua','Calisto MT','Lucida Bright',Georgia,'DejaVu Serif',serif; | font-family: Adelle, 'Cambria', 'Book Antiqua','Calisto MT','Lucida Bright',Georgia,'DejaVu Serif',serif; | ||
font-size:1.8em; | font-size: 1.8em; | ||
line-height:1.2em; | line-height: 1.2em; | ||
font-style:italic; | font-style: italic; | ||
color:#000; | color: #000; | ||
font-weight:bold; | font-weight: bold; | ||
} | } | ||
.error, #error { | .error, #error { | ||
color:#000; | color: #000; | ||
font-weight:bold; | font-weight: bold; | ||
} | } | ||
.error, #error, | .error, #error, | ||
#tech, .tech { | #tech, .tech { | ||
width:95%; | width: 95%; | ||
font-weight:normal; | font-weight: normal; | ||
background-color:transparent; | background-color: transparent; | ||
border: 1px solid | border: 1px solid var(--accent-1); | ||
font-family:"Rubik"; | font-family: "Maven Pro","Nunito","Rubik",sans-serif; | ||
padding:10px; | padding: 10px; | ||
margin-top:25px; | margin-top: 25px; | ||
margin-bottom:25px; | margin-bottom: 25px; | ||
margin-left:auto; | margin-left: auto; | ||
margin-right:auto; | margin-right: auto; | ||
font-size:95%; | font-size: 95%; | ||
} | |||
:root.theme-dark #tech, | |||
:root.theme-dark .tech { | |||
border-color: #1a2e53!important; | |||
background-color: #081d3f!important; | |||
} | |||
:root.theme-dark .ns-3 #tech + #tech { | |||
background-color: #132b55!important; | |||
} | } | ||
#mainpage-highlight { | #mainpage-highlight { | ||
margin-bottom:15px; | margin-bottom: 15px; | ||
padding:5px; | padding: 5px; | ||
background-color: transparent; | background-color: transparent; | ||
border:1px solid #e5c076; | border: 1px solid #e5c076; | ||
} | } | ||
#crewtop { | #crewtop { | ||
background:transparent; | background: transparent; | ||
-moz-border-radius:50% 50% 0% 0% / 5% 5% 0% 0%; | -moz-border-radius: 50% 50% 0% 0% / 5% 5% 0% 0%; | ||
-webkit-border-radius:50% 50% 0% 0% / 5% 5% 0% 0%; | -webkit-border-radius: 50% 50% 0% 0% / 5% 5% 0% 0%; | ||
-ms-border-radius:50% 50% 0% 0% / 5% 5% 0% 0%; | -ms-border-radius: 50% 50% 0% 0% / 5% 5% 0% 0%; | ||
-o-border-radius:50% 50% 0% 0% / 5% 5% 0% 0%; | -o-border-radius: 50% 50% 0% 0% / 5% 5% 0% 0%; | ||
border-radius:50% 50% 0% 0% / 5% 5% 0% 0%; | border-radius: 50% 50% 0% 0% / 5% 5% 0% 0%; | ||
border:3px solid | border: 3px solid var(--accent-1); | ||
clear:both; | clear: both; | ||
width:auto; | width: auto; | ||
margin-left:auto; | margin-left: auto; | ||
margin-right:auto; | margin-right: auto; | ||
margin-bottom:10px; | margin-bottom: 10px; | ||
padding:10px; | padding: 10px; | ||
font-size:.90em; | font-size: .90em; | ||
line-height:.95em; | line-height: .95em; | ||
font-family : "Rubik"; | font-family: "Maven Pro","Nunito","Rubik",sans-serif; | ||
} | } | ||
#crew { | #crew { | ||
background:transparent; | background: transparent; | ||
-webkit-border-radius: 0px 0px 10px 10px; | -webkit-border-radius: 0px 0px 10px 10px; | ||
-moz-border-radius: 0px 0px 10px 10px; | -moz-border-radius: 0px 0px 10px 10px; | ||
Line 494: | Line 534: | ||
-o-border-radius: 0px 0px 10px 10px; | -o-border-radius: 0px 0px 10px 10px; | ||
border-radius: 0px 0px 10px 10px; | border-radius: 0px 0px 10px 10px; | ||
clear:both; | clear: both; | ||
width:auto; | width: auto; | ||
padding:11px; | padding: 11px; | ||
border:2px solid | border: 2px solid var(--accent-1); | ||
margin-left:auto; | margin-left: auto; | ||
margin-right:auto; | margin-right: auto; | ||
font-size: 0.80em; | font-size: 0.80em; | ||
line-height:.90em; | line-height: .90em; | ||
font-family : "Rubik"; | font-family: "Maven Pro","Nunito","Rubik",sans-serif; | ||
} | |||
:root.theme-dark .skin-timeless #crewtop, | |||
:root.theme-dark .skin-timeless #crew { | |||
background: var(--primary-25); | |||
border-color: var(--contrast-color-3); /* var(--primary-21) */ | |||
box-shadow: 22vw 0 22vw var(--primary-24) inset; | |||
} | |||
:root.theme-dark .skin-timeless #crewtop tr > td:only-child > hr { | |||
border-color: var(--primary-7); | |||
} | |||
#crew p { | |||
margin-bottom: 0px; | |||
} | } | ||
.stitched { | .stitched { | ||
Line 508: | Line 561: | ||
margin: 10px; | margin: 10px; | ||
line-height: 100%; | line-height: 100%; | ||
border: 1px solid | border: 1px solid var(--accent-1); | ||
-webkit-border-radius: 10px 0px 0px 10px; | -webkit-border-radius: 10px 0px 0px 10px; | ||
-moz-border-radius: 10px 0px 0px 10px; | -moz-border-radius: 10px 0px 0px 10px; | ||
Line 515: | Line 568: | ||
border-radius: 10px 0px 0px 10px; | border-radius: 10px 0px 0px 10px; | ||
font-weight: normal; | font-weight: normal; | ||
font-family : "Rubik"; | font-family: "Maven Pro","Nunito","Rubik",sans-serif; | ||
} | } | ||
.key, #key { | .key, #key { | ||
font-size:.9em; | font-size: .9em; | ||
background-color:inherit; | background-color: inherit; | ||
border: 1pt outset | border: 1pt outset var(--accent-1); | ||
text-align:center; | text-align: center; | ||
vertical-align:middle; | vertical-align: middle; | ||
padding:2px; | padding: 2px; | ||
margin:2px; | margin: 2px; | ||
font-weight:bold; | font-weight: bold; | ||
font-family:"Rubik"; | font-family: "Maven Pro","Nunito","Rubik",sans-serif; | ||
} | } | ||
#block { | #block { | ||
display:block; | display: block; | ||
height:30px; | height: 30px; | ||
width:100px; | width: 100px; | ||
border:1px solid | border: 1px solid var(--accent-1); | ||
margin:5px | margin: 5px; | ||
} | } | ||
/* Dabtag and mosbox */ | /* Dabtag and mosbox */ | ||
.dabtag, | .dabtag, | ||
#dabtag { | #dabtag { | ||
border:2px solid | border: 2px solid var(--accent-1); | ||
-webkit-border-radius: 0; | -webkit-border-radius: 0; | ||
-moz-border-radius: 0; | -moz-border-radius: 0; | ||
Line 547: | Line 598: | ||
-ms-border-radius: 0; | -ms-border-radius: 0; | ||
border-radius: 0; | border-radius: 0; | ||
overflow:hidden; | overflow: hidden; | ||
font-size: 0.80em; | font-size: 0.80em; | ||
line-height:.95em | line-height: .95em; | ||
display: inline-block; | |||
display:inline-block; | width: 276px; /* this is precise width of two stub tags */ | ||
width:276px; /* this is precise width of two stub tags */ | margin-top: 10px; | ||
margin-top:10px; | margin-bottom: 10px; | ||
margin-bottom:10px; | margin-right: 17px!important; /*overrides the div.dabtag elsewhere */ | ||
margin-right:17px!important; /*overrides the div.dabtag elsewhere */ | float: left; | ||
float:left; | line-height: 130%; | ||
line-height:130%; | font-family: "Maven Pro","Nunito","Rubik",sans-serif; | ||
clear: left; | |||
} | |||
.dabtag, #dabtag { | |||
padding-top: 1px; | |||
background: none; | |||
border: 2px solid var(--accent-1); | |||
width: 274px; | |||
border-radius: 3px 3px 8px 4px; | |||
} | |||
/*improves formatting on smaller screen sizes*/ | |||
.dabtag + p, #dabtag + p { | |||
word-wrap: normal; | |||
} | } | ||
#mosbox { | #mosbox { | ||
font-family: "Rubik"; | font-family: "Maven Pro","Nunito","Rubik",sans-serif; | ||
text-transform:none; | text-transform: none; | ||
letter-spacing:0px; | letter-spacing: 0px; | ||
line-height:120%; | line-height: 120%; | ||
word-break:normal; | word-break: normal; | ||
font-size:16px; | font-size: 16px; | ||
word-wrap:break-word; | word-wrap: break-word; | ||
} | } | ||
#mos-summary { | #mos-summary { | ||
font-style:italic; | font-style: italic; | ||
margin: 25px; | margin: 25px; | ||
border-bottom: 2px solid #b0b0b0; | border-bottom: 2px solid #b0b0b0; | ||
font-size:150%; | font-size: 150%; | ||
padding:10px; | padding: 10px; | ||
font-weight:normal; | font-weight: normal; | ||
line-height:150%; | line-height: 150%; | ||
font-family: Adelle, 'Cambria', 'Book Antiqua','Calisto MT','Lucida Bright',Georgia,'DejaVu Serif',serif; | font-family: Adelle, 'Cambria', 'Book Antiqua','Calisto MT','Lucida Bright',Georgia,'DejaVu Serif',serif; | ||
} | } | ||
.mosheadcolor { | .mosheadcolor { | ||
color:#000; | color: #000; | ||
} | } | ||
.moscolor { | .moscolor { | ||
color:#000; | color: #000; | ||
} | } | ||
Line 590: | Line 656: | ||
.dpl3 { | .dpl3 { | ||
vertical-align:top; | vertical-align: top; | ||
width:100%; | width: 100%; | ||
margin:0 auto; | margin: 0 auto; | ||
} | |||
/* ========================== | |||
Equally sized table widths | |||
========================== */ | |||
table.twelve-equal-columns, | |||
table.eight-equal-columns, | |||
table.five-equal-columns, | |||
table.four-equal-columns { | |||
table-layout: fixed; | |||
width: 100%!important; /*!important is necassary*/ | |||
} | |||
td.twelve-equal-columns { | |||
width: 8.33333333333333%; | |||
} | |||
td.eight-equal-columns { | |||
width: 12.5%; | |||
} | |||
td.five-equal-columns { | |||
width: 20%; | |||
} | |||
td.four-equal-columns { | |||
width: 25%; | |||
} | |||
/* ====================== | |||
Collapsible navfoboxes | |||
====================== */ | |||
/*using : has() would improve this template but it doesn't work on Firefox yet. De-comment this selector when https: //developer.mozilla.org/en-US/docs/Web/CSS/: has#browser_compatibility says that firefox support exists */ | |||
.collapsible-navfobox aside: has(div.mw-collapsed) { | |||
margin-bottom: 1px; | |||
} | |||
.collapsible-navfobox h2: has(div.mw-collapsed) { | |||
padding: 0px!important; | |||
border-top: none!important; | |||
} | |||
.collapsible-navfobox nav: has(div.mw-collapsed) { | |||
padding-top: 0px!important; | |||
} | |||
.collapsible-navfobox .portable-infobox .pi-header: nth-child(n+3): has(div.mw-collapsed) { | |||
margin-top: 0px; | |||
} | |||
/* Firefox workaround */ | |||
@media all and (min--moz-device-pixel-ratio: 0) { | |||
.collapsible-navfobox aside { | |||
margin-bottom: 1px; | |||
} | |||
.collapsible-navfobox h2 { | |||
padding: 0px!important; | |||
border-top: none!important; | |||
} | |||
.collapsible-navfobox nav { | |||
padding-top: 0px!important; | |||
} | |||
.collapsible-navfobox .portable-infobox .pi-header: nth-child(n+3) { | |||
margin-top: 0px; | |||
} | |||
} | |||
/* NWLH */ | |||
.NWLH a.external { | |||
background: none; | |||
padding-right: 0; | |||
} | |||
/* making the last tab default for some tabbed galleries in infoboxes */ | |||
.default-last-tab .wds-tabs .wds-tabs__tab: first-child { | |||
order: 9999; | |||
} | |||
/* {{Pullout}} */ | |||
.pullout-wrapper { | |||
float: right; | |||
display: flex; | |||
margin-top: 8px; | |||
margin-bottom: 12.6px; | |||
position: relative; | |||
z-index: 20; | |||
} | |||
.pullout-handle { | |||
background-color: var(--accent-2); | |||
border-radius: 24px 0px 0px 24px; | |||
width: 40px; | |||
height: 56px; | |||
padding-left: 14px; | |||
font-size: 2em; | |||
color: var(--primary-1); | |||
transition: background-color 1s, width 1s; | |||
} | |||
.pullout-handle: hover { | |||
background-color: var(--accent-1); | |||
width: 55px; | |||
} | |||
.pullout-content { | |||
border: 1px solid var(--accent-1); | |||
} | |||
.pullout-content div#article-type { | |||
margin: 0px; | |||
max-width: 38em; | |||
} | |||
.pullout-left-arrow { | |||
display: none; | |||
} | |||
@media screen and (min-width: 851px) { | |||
.pullout-content div#article-type { | |||
min-width: 47vw; | |||
max-width: 54.82em; | |||
position: relative; | |||
border-right: solid 1em var(--accent-26); | |||
} | |||
.mw-parser-output:has(.dabtag) > .pullout-wrapper > .pullout-content div#article-type { | |||
max-width: unset; | |||
} | |||
} | |||
/* {{subpage tabs}} */ | |||
/* see also: Template:Subpage tabs/styles.css for non-colour styles */ | |||
.subpage-tabs-main { | |||
border: 2px solid var(--accent-2); | |||
color: var(--alt-text-color); | |||
} | |||
.subpage-tabs-tab { | |||
background-color: var(--accent-6); | |||
} | |||
.subpage-tabs-main a, .subpage-tabs-main a: visited, .subpage-tabs-main a: hover, .subpage-tabs-main a: hover: visited { | |||
color: var(--alt-text-color); | |||
} | |||
.RW-box { | |||
border: 1px solid var(--accent-1); | |||
padding: 5px; | |||
margin-top: 2px; | |||
} | |||
/* ===================== | |||
CSS for wip templates | |||
===================== */ | |||
/* content warning templates on [[User: Bongolium500/Sandbox 9]]*/ | |||
div.type-trigger { | |||
background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/7/79/Trigger_Template_200px.jpg) no-repeat; | |||
z-index: 5; | |||
} | |||
/* recent releases homepage module */ | |||
div.mainpage-box-recent div.recent-release-box { | |||
border: var(--accent-1) 2px solid; | |||
background: var(--primary-2); | |||
margin: 3px; | |||
border-radius: 25px; | |||
} | |||
div.mainpage-box-recent { | |||
border: var(--accent-1) 2px solid; | |||
background: var(--accent-1); | |||
border-radius: 28px; | |||
} | |||
.mainpage-box-recent .read-more-button { | |||
background: var(--accent-1); | |||
color: var(--primary-1); | |||
padding: 7px 50px 5px 50px; | |||
border-radius: 15px; | |||
transition: background 0.5s, color 0.5s; | |||
transition-timing-function: ease; | |||
} | |||
.mainpage-box-recent .read-more-button: hover { | |||
background: var(--accent-3); | |||
color: var(--primary-2); | |||
} | |||
.mainpage-box-recent .floatright, | |||
.mainpage-box-recent .floatleft { | |||
margin: 0px; | |||
} | |||
.mainpage-box-recent .floatright img { | |||
border-radius: 0px 24px 24px 0px; | |||
} | |||
.mainpage-box-recent .floatleft img { | |||
border-radius: 24px 0px 0px 24px; | |||
} | |||
.mainpage-box-recent p { | |||
margin-bottom: 10px; | |||
display: inherit!important; /*required to get the paragraph under the read more button to show up. This is needed so that the button has some space before the bottom of the box. */ | |||
} | |||
.mainpage-box-recent p+p { | |||
margin-top: 12px; | |||
} | |||
/* adapted from https: //stackoverflow.com/a/37120036 by Jacob G under CC-BY-SA 4.0 */ | |||
.horizontal-line { | |||
background: linear-gradient(transparent 42.5%, var(--accent-1) 42.5%, var(--accent-1) 57.5%, transparent 57.5%); | |||
padding: 5px; | |||
width: 35px; | |||
display: inline-flex; | |||
margin: 0px 5px; | |||
} | |||
/* {{TriggerImage}} */ | |||
.trigger { | |||
position: relative; | |||
} | |||
.trigger p.trigger-warning { | |||
position: absolute; | |||
width: 180px; | |||
text-align: center; | |||
padding: 15px 0; | |||
z-index: 0; | |||
} | |||
.trigger a.image { | |||
padding: 55px 0; | |||
z-index: 1; | |||
position: relative; | |||
border: var(--accent-1) 2px solid; | |||
} | |||
.trigger img { | |||
visibility: hidden; | |||
} | |||
/* [[User:Bongolium500/The Faceless Ones (TV story)/Home media]] */ | |||
.home-media-timeline-table { | |||
float: left; | |||
min-width: 320px; | |||
margin-right: 20px !important; | |||
} | |||
.home-media-easytimeline-wrapper { | |||
margin-left: 330px; | |||
} | |||
.home-media-easytimeline-wrapper .mw-collapsible-toggle { | |||
float: left; | |||
} | |||
.home-media-nav-table th a, | |||
.home-media-release-table th a, | |||
.home-media-features-table th a { | |||
color: var(--alt-text-color); | |||
text-decoration: underline; | |||
} | |||
.home-media-nav-table { | |||
float: right; | |||
clear: right; | |||
} | |||
.home-media-features-table { | |||
width: 100%; | |||
} | |||
.home-media-features-table .home-media-features-table-center { | |||
float: center; | |||
} | |||
.home-media-features-table .home-media-features-table-right { | |||
float: right; | |||
} | |||
.home-media-age-ratings-table { | |||
float: right; | |||
clear: right; | |||
} | |||
.compact-section-toc { | |||
text-align: center; | |||
width: 50%; | |||
word-wrap: break-word; | |||
border: 1px solid var(--accent-1); | |||
padding: 10px; | |||
margin-bottom: 15px; | |||
margin-left: auto; | |||
margin-right: auto; | |||
font-size: 95%; | |||
} | |||
.back-box { | |||
float: right; | |||
border: 1px solid var(--accent-1); | |||
padding: 0.65em; | |||
margin: 10px 10px 10px 10px; | |||
text-align: center; | |||
font-size: smaller; | |||
font-weight: bold; | |||
} | } |
Latest revision as of 08:21, 24 November 2024
/* ============================
Tardis.css v. 2.0
Month of last major change: Feb 2024
This page styles custom elements
which exist only here at Tardis.
If the base selector is unique to
Tardis, you'll find the styling here.
============================ */
/* ======================
TOP-OF-PAGE BANNERS
which identify the type
of article or give other
important messages about
the article as a whole
=======================
Clearly owes a debt to
memoryalpha.fandom.com,
who were riffin' off of
en.wikipedia
=======================
+++++++++++++++++++++++
Base frame
+++++++++++++++++++++++ */
div#article-type {
border: 1px solid var(--accent-1);
padding: 5px;
letter-spacing: .5px;
text-align: left;
min-height: 55px;
min-width: 528.5px;
margin: 0px 0px 10px 0px;
}
div#article-type p {
margin-left: 205px;
line-height: 11px;
font-size: 11px;
text-align: left;
font-weight: normal;
font-style: normal;
}
div#type-title {
margin-left: 205px;
font-size: 18pt;
line-height: 16pt;
}
/* +++++++++++++++++++
Various article types
+++++++++++++++++++ */
div.type-realworld {
margin: auto auto auto auto;
top: 0px;
max-height: 55px;
background: url(https://tardis.wiki/w/images/Tardis_Images/d/d8/SmallClapper.jpg) no-repeat;
z-index: 5;
}
div.type-nc {
background: url(https: //tardis.wiki/w/images/Tardis_Images/f/f1/Journal200px.png) no-repeat;
z-index: 5;
}
div.type-disambig {
max-height: 55px;
background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/a/af/Transferring.jpg) no-repeat;
z-index: 5;
}
div.type-inuse {
background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/e/e0/Inuse200px.jpg) no-repeat;
z-index: 5;
}
div.type-update {
margin-left: 180px;
background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/3/37/Update200px.jpg) no-repeat;
z-index: 5;
}
div.type-cleanup {
background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/5/58/Thirteen_repairing_timeship.jpg) no-repeat;
}
div.type-listy {
background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/3/3a/Explain_explain_Journey%27s_End.jpg) no-repeat;
}
div.type-delete {
background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/6/6b/Delete200px.jpg) no-repeat;
z-index: 5;
}
div.type-oou {
background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/6/63/Oou200px.jpg) no-repeat;
z-index: 5;
}
div.type-rename {
background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/1/1e/Rename200px.jpg) no-repeat;
z-index: 5;
}
div.type-merge {
background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/9/99/Merging_Tremaster.jpg);
background-repeat: no-repeat;
background-size: 200px 200px;
background-position: 0 0;
z-index: 5;
}
div.type-spoiler {
background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/7/7f/Spoiler200px.jpg) no-repeat;
z-index: 5;
}
div.type-conjecture {
background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/c/c3/Conjecture200px.jpg) no-repeat;
z-index: 5;
}
div.type-talk {
background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/b/b4/Talk200px.jpg) no-repeat;
z-index: 5;
}
div.type-unprod {
background: rgba(var(--contrast-color-1--rgb),0.4) url(https: //tardis.wiki/w/images/Tardis_Images/f/f2/Unprod.png) no-repeat;
z-index: 5;
}
div.type-doctorwhich {
background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/a/af/WhichDoctor.jpg) no-repeat;
z-index: 5;
}
div.type-nonfiction {
background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/2/26/Nonfiction.png) no-repeat;
z-index: 5;
}
div.type-prefix {
background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/d/d5/Prefix.png) no-repeat;
z-index: 5;
background-size: 200px 90px;
background-position: left top;
}
div.type-demonym {
background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/c/c6/Demonym200px.jpg) no-repeat;
z-index: 5;
background-position: 0px -20px
}
/* ===============
STUBS
=============== */
.stub-type,
#stub-type {
float: left;
margin-right: 12px;
margin-top: 5px;
}
.stub-type + .stub-type + .stub-type,
#stub-type + .stub-type + .stub-type,
#stub-type + #stub-type + .stub-type,
#stub-type + #stub-type + #stub-type,
#stub-type + .stub-type + #stub-type,
.stub-type + #stub-type + .stub-type,
.stub-type + #stub-type + #stub-type,
.stub-type + .stub-type + #stub-type {
clear: left;
}
/* This is for the small, right-floating
boxes, like DisconNav */
div#inline-box-rt {
float: right;
padding: 10px;
text-align: center;
border: 1px solid var(--accent-1);
width: 250px;
margin: 10px;
line-height: 1.1em;
font-size: .8em;
font-weight: 400;
font-style: normal;
background-color: transparent ;
color: #fff;
}
/* This is for the small, left-floating
boxes, like section cleanup */
div#inline-box {
float: left;
padding: 10px;
text-align: center;
border: 1px solid var(--accent-7);
width: 250px;
margin: 10px 14px 10px 10px;
line-height: 1.1em;
font-size: .8em;
font-weight: 400;
font-style: normal;
background-color: transparent;
color: var(--text-color);
}
div#inline-box p,
div#inline-box-rt p {
line-height: .9em;
font-size: .8em;
font-weight: normal;
font-style: normal;
color: var(--text-color-2);
}
/* DIVs used in "messages" (as in the delete temp) */
div.warning {
background-color: #401F22;
border: 1px solid #660000;
font-family: "Maven Pro","Nunito","Rubik",sans-serif;
color: #FF0000;
font-weight: bold;
margin: 2em 0 1em;
padding: .5em 1em;
margin-top: auto;
margin-bottom: auto;
text-align: justify;
}
div.header-notice,
.copyright-notice {
background-color: transparent;
border: 1px solid var(--accent-1);
font-family: "Maven Pro","Nunito","Rubik",sans-serif;
color: #000;
padding: .5em 1em;
margin: auto;
width: 80%;
line-height: 110%;
font-size: 95%;
text-align: justify;
}
div.header-notice table {
background-color: transparent;
padding: 1px;
}
div.notice {
background-color: #401F22;
border: 1px solid #CC0000;
font-family: "Maven Pro","Nunito","Rubik",sans-serif;
color: #FFFFFF;
margin: 2em 10% 1em 10%;
padding: .5em 1em;
text-align: justify;
font-size: smaller;
}
div.header-notice#fa {
width: auto;
font-size: inherit;
}
div.notice p,
div.header-notice p,
div.warning p {
line-height: 120%;
}
div span.msg-title {
display: block;
width: 100%;
color: #FFD942;
text-align: center;
font-size: 150%;
font-weight: bold;
border-bottom: 1px solid #666;
}
.tr-tit {
font-family: "Maven Pro","Nunito","Rubik",sans-serif!important;
font-weight: bold;
}
/* ============
Wikipediainfo
and Image links tags
============
This puts {{wikipediainfo}}
on the top left side of the page */
#wikipedia-info,
.wikipedia-info,
div#wikipedia-info {
float: left;
margin-right: 5px;
margin-top: 15px;
}
/* This places {{protect}} and {{lock}}
underneath {{wikipediainfo}} in case
they're ever on the same page together. */
.protect,
div#protect {
float: left;
margin-right: 5px;
margin-top: 15px;
}
.type-of-article,
div#type-of-article {
float: left;
margin-right: 5px;
margin-top: 15px;
}
/* =======================
SHORTCUTS
the little boxes that say
T: WHATEVER
in the upper right hand corner
of pages
=======================
Base style probably originated
at en.wikipedia, but has spread
to some of the larger Wikia
wikis like Wookiee, The Vault and MA
======================== */
div.shortcut {
float: right;
background: transparent;
border: 1px solid var(--accent-4);
padding: 0.65em;
margin: 10px 10px 10px 10px;
text-align: center;
font-size: smaller;
font-weight: bold;
width: auto;
}
/* ===============
TIMELINE
=============== */
.timeline a: visited,
.timeline a: link {
color: #ccdfff
}
.timeline a: hover {
color: #fff9d4;
background: none;
}
.timeline {
color: #fff;
background: #012c57;
background: -moz-linear-gradient(top, #012c57 0%, #012c57 35%, #4e7dab 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#012c57), color-stop(35%,#012c57), color-stop(100%,#4e7dab));
background: -webkit-linear-gradient(top, #012c57 0%,#012c57 35%,#4e7dab 100%);
background: -o-linear-gradient(top, #012c57 0%,#012c57 35%,#4e7dab 100%);
background: -ms-linear-gradient(top, #012c57 0%,#012c57 35%,#4e7dab 100%);
background: linear-gradient(top, #012c57 0%,#012c57 35%,#4e7dab 100%);
filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#012c57', endColorstr='#4e7dab',GradientType=0 );
overflow: visible;
border-color: transparent;
text-align: center;
font-size: 0.85em;
float: right;
clear: right;
width: 250px!important;
min-width: 250px!important;
margin-bottom: 10px;
margin-right: 10px;
}
/* =========================
SPECIAL STYLES
mainly used in template design
=========================
These designs are all unique
to tardis.wikia.com and were
created by CzechOut
========================= */
#editpage-specialchars,
#glow {
background-color: transparent;
border: 1px solid var(--accent-1);
padding: .5em 1em;
margin: auto;
width: 95%;
line-height: 110%;
font-size: 95%;
text-align: justify;
-moz-box-shadow: -0px 0px 40px var(--accent-4);
-webkit-box-shadow: -0px 0px 40px var(--accent-4);
-ms-box-shadow: -0px 0px 40px var(--accent-4);
-o-box-shadow: -0px 0px 40px var(--accent-4);
box-shadow: -0px 0px 40px var(--accent-4);
}
#quote-nom {
background-color: transparent;
border: 1px solid var(--accent-1);
margin-right: 260px;
padding: .5em 1em;
vertical-align: middle;
margin-left: auto;
margin-right: auto;
line-height: 110%;
font-size: 95%;
text-align: justify;
-moz-box-shadow: inset -0px 0px 25px 4px var(--accent-4);
-webkit-box-shadow: inset -0px 0px 25px 4px var(--accent-4);
-ms-box-shadow: inset -0px 0px 25px 4px var(--accent-4);
-o-box-shadow: inset -0px 0px 25px 4px var(--accent-4);
box-shadow: inset -0px 0px 25px #e5c076 4px;
}
#license {
background-color: transparent;
border: solid 2px #8495b3;
border-radius: 14px;
margin: auto;
padding: .5em 1em;
width: 80%;
line-height: 110%;
font-size: 95%;
font-family: "Rubik";
text-align: left;
position: relative;
left: -1px;
}
#license + #license {
margin-top: 7.04px;
}
#license h1 {
margin-top: 11.62px;
}
#license h1:after {
border-bottom: solid 4px #1a2e53;
border-bottom: solid 2px #6f8cc1;
margin-top: 10px;
}
#license a img {
position: relative;
top: -2.82px;
}
.smw-editpage-help,
#box {
font-weight: normal;
background-color: var(--primary-9);
border: 1px solid var(--primary-3);
color: inherit;
font-family: "Maven Pro","Nunito","Rubik",sans-serif;
padding: 16px;
margin-top: 13px;
margin-bottom: 25px;
margin-left: auto;
margin-right: auto;
padding-bottom: 21px;
font-size: 95%;
}
#box-rt {
font-weight: normal;
background-color: transparent;
border: 2px solid var(--accent-1);
color: #000;
font-family: "Maven Pro","Nunito","Rubik",sans-serif;
padding: 10px;
margin-top: 25px;
margin-bottom: 25px;
margin-left: auto;
margin-right: auto;
font-size: 95%;
}
#box-lt {
font-weight: normal;
background-color: transparent;
border: 1px solid var(--accent-1);
color: #000;
font-family: "Maven Pro","Nunito","Rubik",sans-serif;
padding: 10px;
margin: 25px auto 25px auto;
font-size: 95%;
}
#th {
font-family: Adelle, 'Cambria', 'Book Antiqua','Calisto MT','Lucida Bright',Georgia,'DejaVu Serif',serif;
font-size: 1.8em;
line-height: 1.2em;
font-style: italic;
color: #000;
font-weight: bold;
}
.error, #error {
color: #000;
font-weight: bold;
}
.error, #error,
#tech, .tech {
width: 95%;
font-weight: normal;
background-color: transparent;
border: 1px solid var(--accent-1);
font-family: "Maven Pro","Nunito","Rubik",sans-serif;
padding: 10px;
margin-top: 25px;
margin-bottom: 25px;
margin-left: auto;
margin-right: auto;
font-size: 95%;
}
:root.theme-dark #tech,
:root.theme-dark .tech {
border-color: #1a2e53!important;
background-color: #081d3f!important;
}
:root.theme-dark .ns-3 #tech + #tech {
background-color: #132b55!important;
}
#mainpage-highlight {
margin-bottom: 15px;
padding: 5px;
background-color: transparent;
border: 1px solid #e5c076;
}
#crewtop {
background: transparent;
-moz-border-radius: 50% 50% 0% 0% / 5% 5% 0% 0%;
-webkit-border-radius: 50% 50% 0% 0% / 5% 5% 0% 0%;
-ms-border-radius: 50% 50% 0% 0% / 5% 5% 0% 0%;
-o-border-radius: 50% 50% 0% 0% / 5% 5% 0% 0%;
border-radius: 50% 50% 0% 0% / 5% 5% 0% 0%;
border: 3px solid var(--accent-1);
clear: both;
width: auto;
margin-left: auto;
margin-right: auto;
margin-bottom: 10px;
padding: 10px;
font-size: .90em;
line-height: .95em;
font-family: "Maven Pro","Nunito","Rubik",sans-serif;
}
#crew {
background: transparent;
-webkit-border-radius: 0px 0px 10px 10px;
-moz-border-radius: 0px 0px 10px 10px;
-ms-border-radius: 0px 0px 10px 10px;
-o-border-radius: 0px 0px 10px 10px;
border-radius: 0px 0px 10px 10px;
clear: both;
width: auto;
padding: 11px;
border: 2px solid var(--accent-1);
margin-left: auto;
margin-right: auto;
font-size: 0.80em;
line-height: .90em;
font-family: "Maven Pro","Nunito","Rubik",sans-serif;
}
:root.theme-dark .skin-timeless #crewtop,
:root.theme-dark .skin-timeless #crew {
background: var(--primary-25);
border-color: var(--contrast-color-3); /* var(--primary-21) */
box-shadow: 22vw 0 22vw var(--primary-24) inset;
}
:root.theme-dark .skin-timeless #crewtop tr > td:only-child > hr {
border-color: var(--primary-7);
}
#crew p {
margin-bottom: 0px;
}
.stitched {
padding: 5px 10px;
margin: 10px;
line-height: 100%;
border: 1px solid var(--accent-1);
-webkit-border-radius: 10px 0px 0px 10px;
-moz-border-radius: 10px 0px 0px 10px;
-ms-border-radius: 10px 0px 0px 10px;
-o-border-radius: 10px 0px 0px 10px;
border-radius: 10px 0px 0px 10px;
font-weight: normal;
font-family: "Maven Pro","Nunito","Rubik",sans-serif;
}
.key, #key {
font-size: .9em;
background-color: inherit;
border: 1pt outset var(--accent-1);
text-align: center;
vertical-align: middle;
padding: 2px;
margin: 2px;
font-weight: bold;
font-family: "Maven Pro","Nunito","Rubik",sans-serif;
}
#block {
display: block;
height: 30px;
width: 100px;
border: 1px solid var(--accent-1);
margin: 5px;
}
/* Dabtag and mosbox */
.dabtag,
#dabtag {
border: 2px solid var(--accent-1);
-webkit-border-radius: 0;
-moz-border-radius: 0;
-o-border-radius: 0;
-ms-border-radius: 0;
border-radius: 0;
overflow: hidden;
font-size: 0.80em;
line-height: .95em;
display: inline-block;
width: 276px; /* this is precise width of two stub tags */
margin-top: 10px;
margin-bottom: 10px;
margin-right: 17px!important; /*overrides the div.dabtag elsewhere */
float: left;
line-height: 130%;
font-family: "Maven Pro","Nunito","Rubik",sans-serif;
clear: left;
}
.dabtag, #dabtag {
padding-top: 1px;
background: none;
border: 2px solid var(--accent-1);
width: 274px;
border-radius: 3px 3px 8px 4px;
}
/*improves formatting on smaller screen sizes*/
.dabtag + p, #dabtag + p {
word-wrap: normal;
}
#mosbox {
font-family: "Maven Pro","Nunito","Rubik",sans-serif;
text-transform: none;
letter-spacing: 0px;
line-height: 120%;
word-break: normal;
font-size: 16px;
word-wrap: break-word;
}
#mos-summary {
font-style: italic;
margin: 25px;
border-bottom: 2px solid #b0b0b0;
font-size: 150%;
padding: 10px;
font-weight: normal;
line-height: 150%;
font-family: Adelle, 'Cambria', 'Book Antiqua','Calisto MT','Lucida Bright',Georgia,'DejaVu Serif',serif;
}
.mosheadcolor {
color: #000;
}
.moscolor {
color: #000;
}
/* ==============
DPL formats
============== */
.dpl3 {
vertical-align: top;
width: 100%;
margin: 0 auto;
}
/* ==========================
Equally sized table widths
========================== */
table.twelve-equal-columns,
table.eight-equal-columns,
table.five-equal-columns,
table.four-equal-columns {
table-layout: fixed;
width: 100%!important; /*!important is necassary*/
}
td.twelve-equal-columns {
width: 8.33333333333333%;
}
td.eight-equal-columns {
width: 12.5%;
}
td.five-equal-columns {
width: 20%;
}
td.four-equal-columns {
width: 25%;
}
/* ======================
Collapsible navfoboxes
====================== */
/*using : has() would improve this template but it doesn't work on Firefox yet. De-comment this selector when https: //developer.mozilla.org/en-US/docs/Web/CSS/: has#browser_compatibility says that firefox support exists */
.collapsible-navfobox aside: has(div.mw-collapsed) {
margin-bottom: 1px;
}
.collapsible-navfobox h2: has(div.mw-collapsed) {
padding: 0px!important;
border-top: none!important;
}
.collapsible-navfobox nav: has(div.mw-collapsed) {
padding-top: 0px!important;
}
.collapsible-navfobox .portable-infobox .pi-header: nth-child(n+3): has(div.mw-collapsed) {
margin-top: 0px;
}
/* Firefox workaround */
@media all and (min--moz-device-pixel-ratio: 0) {
.collapsible-navfobox aside {
margin-bottom: 1px;
}
.collapsible-navfobox h2 {
padding: 0px!important;
border-top: none!important;
}
.collapsible-navfobox nav {
padding-top: 0px!important;
}
.collapsible-navfobox .portable-infobox .pi-header: nth-child(n+3) {
margin-top: 0px;
}
}
/* NWLH */
.NWLH a.external {
background: none;
padding-right: 0;
}
/* making the last tab default for some tabbed galleries in infoboxes */
.default-last-tab .wds-tabs .wds-tabs__tab: first-child {
order: 9999;
}
/* {{Pullout}} */
.pullout-wrapper {
float: right;
display: flex;
margin-top: 8px;
margin-bottom: 12.6px;
position: relative;
z-index: 20;
}
.pullout-handle {
background-color: var(--accent-2);
border-radius: 24px 0px 0px 24px;
width: 40px;
height: 56px;
padding-left: 14px;
font-size: 2em;
color: var(--primary-1);
transition: background-color 1s, width 1s;
}
.pullout-handle: hover {
background-color: var(--accent-1);
width: 55px;
}
.pullout-content {
border: 1px solid var(--accent-1);
}
.pullout-content div#article-type {
margin: 0px;
max-width: 38em;
}
.pullout-left-arrow {
display: none;
}
@media screen and (min-width: 851px) {
.pullout-content div#article-type {
min-width: 47vw;
max-width: 54.82em;
position: relative;
border-right: solid 1em var(--accent-26);
}
.mw-parser-output:has(.dabtag) > .pullout-wrapper > .pullout-content div#article-type {
max-width: unset;
}
}
/* {{subpage tabs}} */
/* see also: Template:Subpage tabs/styles.css for non-colour styles */
.subpage-tabs-main {
border: 2px solid var(--accent-2);
color: var(--alt-text-color);
}
.subpage-tabs-tab {
background-color: var(--accent-6);
}
.subpage-tabs-main a, .subpage-tabs-main a: visited, .subpage-tabs-main a: hover, .subpage-tabs-main a: hover: visited {
color: var(--alt-text-color);
}
.RW-box {
border: 1px solid var(--accent-1);
padding: 5px;
margin-top: 2px;
}
/* =====================
CSS for wip templates
===================== */
/* content warning templates on [[User: Bongolium500/Sandbox 9]]*/
div.type-trigger {
background: rgba(var(--contrast-color-1--rgb),.04) url(https: //tardis.wiki/w/images/Tardis_Images/7/79/Trigger_Template_200px.jpg) no-repeat;
z-index: 5;
}
/* recent releases homepage module */
div.mainpage-box-recent div.recent-release-box {
border: var(--accent-1) 2px solid;
background: var(--primary-2);
margin: 3px;
border-radius: 25px;
}
div.mainpage-box-recent {
border: var(--accent-1) 2px solid;
background: var(--accent-1);
border-radius: 28px;
}
.mainpage-box-recent .read-more-button {
background: var(--accent-1);
color: var(--primary-1);
padding: 7px 50px 5px 50px;
border-radius: 15px;
transition: background 0.5s, color 0.5s;
transition-timing-function: ease;
}
.mainpage-box-recent .read-more-button: hover {
background: var(--accent-3);
color: var(--primary-2);
}
.mainpage-box-recent .floatright,
.mainpage-box-recent .floatleft {
margin: 0px;
}
.mainpage-box-recent .floatright img {
border-radius: 0px 24px 24px 0px;
}
.mainpage-box-recent .floatleft img {
border-radius: 24px 0px 0px 24px;
}
.mainpage-box-recent p {
margin-bottom: 10px;
display: inherit!important; /*required to get the paragraph under the read more button to show up. This is needed so that the button has some space before the bottom of the box. */
}
.mainpage-box-recent p+p {
margin-top: 12px;
}
/* adapted from https: //stackoverflow.com/a/37120036 by Jacob G under CC-BY-SA 4.0 */
.horizontal-line {
background: linear-gradient(transparent 42.5%, var(--accent-1) 42.5%, var(--accent-1) 57.5%, transparent 57.5%);
padding: 5px;
width: 35px;
display: inline-flex;
margin: 0px 5px;
}
/* {{TriggerImage}} */
.trigger {
position: relative;
}
.trigger p.trigger-warning {
position: absolute;
width: 180px;
text-align: center;
padding: 15px 0;
z-index: 0;
}
.trigger a.image {
padding: 55px 0;
z-index: 1;
position: relative;
border: var(--accent-1) 2px solid;
}
.trigger img {
visibility: hidden;
}
/* [[User:Bongolium500/The Faceless Ones (TV story)/Home media]] */
.home-media-timeline-table {
float: left;
min-width: 320px;
margin-right: 20px !important;
}
.home-media-easytimeline-wrapper {
margin-left: 330px;
}
.home-media-easytimeline-wrapper .mw-collapsible-toggle {
float: left;
}
.home-media-nav-table th a,
.home-media-release-table th a,
.home-media-features-table th a {
color: var(--alt-text-color);
text-decoration: underline;
}
.home-media-nav-table {
float: right;
clear: right;
}
.home-media-features-table {
width: 100%;
}
.home-media-features-table .home-media-features-table-center {
float: center;
}
.home-media-features-table .home-media-features-table-right {
float: right;
}
.home-media-age-ratings-table {
float: right;
clear: right;
}
.compact-section-toc {
text-align: center;
width: 50%;
word-wrap: break-word;
border: 1px solid var(--accent-1);
padding: 10px;
margin-bottom: 15px;
margin-left: auto;
margin-right: auto;
font-size: 95%;
}
.back-box {
float: right;
border: 1px solid var(--accent-1);
padding: 0.65em;
margin: 10px 10px 10px 10px;
text-align: center;
font-size: smaller;
font-weight: bold;
}