MediaWiki:Common.css: Difference between revisions
Jump to navigation
Jump to search
Technochips (talk | contribs) fixed weird width alignments |
Technochips (talk | contribs) good printing |
||
| Line 1: | Line 1: | ||
@font-face | @font-face | ||
{ | { | ||
font-family: "TF2C"; | font-family:"TF2C"; | ||
src: url( | src:url(https://wiki.tf2classic.com/fonts/TF2C.woff2) format("woff2"), | ||
url(https://wiki.tf2classic.com/fonts/TF2C.woff) format("woff"), | |||
url(https://wiki.tf2classic.com/fonts/TF2C.ttf) format("truetype") | |||
} | } | ||
@font-face | @font-face | ||
{ | { | ||
font-family: "TF2C Build"; | font-family:"TF2C Build"; | ||
src: url( | src:url(https://wiki.tf2classic.com/fonts/TF2CBuild.woff2) format("woff2"), | ||
url(https://wiki.tf2classic.com/fonts/TF2CBuild.woff) format("woff"), | |||
url(https://wiki.tf2classic.com/fonts/TF2CBuild.ttf) format("truetype") | |||
} | } | ||
@font-face | @font-face | ||
{ | { | ||
font-family: "TF2C Professor"; | font-family:"TF2C Professor"; | ||
src: url( | src:url(https://wiki.tf2classic.com/fonts/TF2CProfessor.woff2) format("woff2"), | ||
url(https://wiki.tf2classic.com/fonts/TF2CProfessor.woff) format("woff"), | |||
url(https://wiki.tf2classic.com/fonts/TF2CProfessor.ttf) format("truetype") | |||
} | } | ||
@font-face | @font-face | ||
{ | { | ||
font-family: "TF2C Secondary"; | font-family:"TF2C Secondary"; | ||
src: url( | src:url(https://wiki.tf2classic.com/fonts/TF2CSecondary.woff2) format("woff2"), | ||
url(https://wiki.tf2classic.com/fonts/TF2CSecondary.woff) format("woff"), | |||
url(https://wiki.tf2classic.com/fonts/TF2CSecondary.ttf) format("truetype") | |||
} | } | ||
.infobox | |||
.infobox { | { | ||
float:right; | |||
float: right; | min-width:21em; | ||
width: 21em; | margin:0 0 1em 1em; | ||
margin: 0 0 1em 1em | |||
} | } | ||
.infobox-title { | .infobox-title | ||
font-size: 21px; | { | ||
text-align: center | font-size:21px; | ||
text-align:center | |||
} | } | ||
.infobox-image { | .infobox-image | ||
text-align: center | { | ||
text-align:center | |||
} | } | ||
.infobox th { | .infobox th | ||
{ | |||
vertical-align: top | vertical-align:top; | ||
vertical-align:top; | |||
font-family: "TF2C Build", "TF2 Build", sans-serif; | font-family:"TF2C Build","TF2 Build",sans-serif; | ||
font-weight: normal; | font-weight:normal; | ||
width:100%; | |||
} | } | ||
.killicon | .killicon | ||
{ | { | ||
vertical-align:middle; | |||
vertical-align: middle; | height:40px; | ||
height: 40px; | color:#38361E; | ||
color: #38361E; | font-family:"Verdana",serif; | ||
font-family: "Verdana", serif; | font-weight:bold; | ||
font-weight: bold; | font-size:17px | ||
font-size: 17px; | } | ||
border-radius: 5px; | @media screen | ||
{ | |||
.infobox | |||
{ | |||
border:1px solid #583A31; | |||
background-color:#E5E0DC | |||
} | |||
.infobox th | |||
{ | |||
background-color:#583A31; | |||
color:#D2CDC8 | |||
} | |||
.killicon | |||
{ | |||
background-color:#F1E9CB; | |||
color:#38361E; | |||
border-radius:5px | |||
} | |||
} | |||
@media print | |||
{ | |||
.infobox th | |||
{ | |||
background-color:#8E8E8E; | |||
} | |||
.infobox | |||
{ | |||
border: 1px black solid; | |||
} | |||
} | } | ||
.loadout-tooltip-container | .loadout-tooltip-container | ||
{ | { | ||
padding: 10px; | padding:10px; | ||
background-image: linear-gradient(#38332D, #221E1A); | background-image:linear-gradient(#38332D,#221E1A); | ||
color: #221E1A | color:#221E1A; | ||
font-size:15px; | |||
font-size: 15px; | font-family:"TF2C Secondary","TF2 Secondary",sans-serif; | ||
font-family: "TF2C Secondary", "TF2 Secondary", sans-serif; | border-radius:5px | ||
border-radius: 5px | |||
} | } | ||
.loadout-tooltip-container p | .loadout-tooltip-container p | ||
{ | { | ||
margin: 0 !important; | margin:0 !important; | ||
text-align:center; | |||
line-height: 1.6em; | |||
} | } | ||
.loadout-tooltip-name | .loadout-tooltip-name | ||
{ | { | ||
font-family: "TF2C Build", "TF2 Build", sans-serif; | font-family:"TF2C Build","TF2 Build",sans-serif; | ||
font-size: 18px; | font-size:18px; | ||
color: #B2B2B2 | color:#B2B2B2 | ||
} | } | ||
.loadout-tooltip-type | .loadout-tooltip-type | ||
{ | { | ||
color: #756B5E | color:#756B5E | ||
} | } | ||
.loadout-tooltip-neutral | .loadout-tooltip-neutral | ||
{ | { | ||
color: #EBE2CA | color:#EBE2CA | ||
} | } | ||
.loadout-tooltip-positive | .loadout-tooltip-positive | ||
{ | { | ||
color: #99CCE1 | color:#99CCE1 | ||
} | } | ||
.loadout-tooltip-negative | .loadout-tooltip-negative | ||
{ | { | ||
color: #FF4040 | color:#FF4040 | ||
} | } | ||
#mw-indicator-mw-helplink a | #mw-indicator-mw-helplink a | ||
| Line 116: | Line 135: | ||
padding-left:0.8em; | padding-left:0.8em; | ||
height:auto; | height:auto; | ||
line-height: 49.4px; | line-height:49.4px | ||
} | |||
#firstHeading | |||
{ | |||
font-family:"TF2C","TF2","Linux Libertine","Georgia","Times",serif; | |||
font-size:2.4em; | |||
border-bottom:0.2em dotted; | |||
} | } | ||
@media screen | |||
{ | { | ||
background-color: #583A31; | #firstHeading | ||
{ | |||
padding-left:0.3em; | |||
margin-left:0.1em; | |||
padding-top:0.4em; | |||
border-radius: | color: #D2CDC8; | ||
} | |||
#content | |||
{ | |||
background-color:#583A31; | |||
color:#D2CDC8; | |||
padding:0; | |||
border:none; | |||
box-shadow:0 10px 10px rgba(0,0,0,0.5); | |||
border-radius:8px 0 0 8px | |||
} | |||
#bodyContent | |||
{ | |||
background-color:#D2CDC8; | |||
color:black; | |||
padding:0.25em 1em 1em 1em; | |||
border-radius:0 0 0 8px; | |||
background-image:linear-gradient(rgba(0,0,0,0.5),transparent 10px) | |||
} | |||
} | } | ||
body | |||
{ | { | ||
background-color: # | background-color:#292526 | ||
} | |||
@media print | |||
{ | |||
body, #content | |||
{ | |||
background-color: white; | |||
color: black; | |||
} | |||
} | } | ||
.vector-menu-tabs ul | .vector-menu-tabs ul | ||
{ | { | ||
margin-left:1em | margin-left:1em | ||
} | } | ||
.vector-menu-tabs li | .vector-menu-tabs li | ||
| Line 144: | Line 190: | ||
background:none; | background:none; | ||
margin-right:0.25em; | margin-right:0.25em; | ||
padding-top: 10px | padding-top:10px | ||
} | } | ||
.vector-menu-tabs li a, .vector-menu-dropdown-noicon h3 | .vector-menu-tabs li a, | ||
.vector-menu-dropdown-noicon h3 | |||
{ | { | ||
font-family: "TF2C Build", "TF2 Build", sans-serif; | font-family:"TF2C Build","TF2 Build",sans-serif; | ||
font-size: 16px; | font-size:16px; | ||
height:29px; | height:29px; | ||
padding: 6px 8px | padding:6px 8px | ||
} | } | ||
.vector-menu-tabs li a | .vector-menu-tabs li a | ||
{ | { | ||
background:#1F1B1A; | background:#1F1B1A; | ||
border-radius: 8px 8px 0 0 | border-radius:8px 8px 0 0 | ||
} | } | ||
.vector-menu-tabs .selected a, .vector-menu-tabs .selected a:visited | .vector-menu-tabs .selected a, | ||
.vector-menu-tabs .selected a:visited | |||
{ | { | ||
background:#583A31; | background:#583A31; | ||
color:#D2CDC8 | color:#D2CDC8 | ||
} | } | ||
.vector-menu-tabs, .vector-menu-tabs a, #mw-head .vector-menu-dropdown h3 | .vector-menu-tabs, | ||
.vector-menu-tabs a, | |||
#mw-head .vector-menu-dropdown h3 | |||
{ | { | ||
background:none | background:none | ||
} | } | ||
.vector-menu-tabs .mw-watchlink.icon a::before | .vector-menu-tabs .mw-watchlink.icon a::before | ||
{ | { | ||
top:0.3em | top:0.3em | ||
} | } | ||
.vector-menu-dropdown | .vector-menu-dropdown | ||
{ | { | ||
padding-top: 10px | padding-top:10px | ||
} | } | ||
#mw-head .vector-menu-dropdown h3 | #mw-head .vector-menu-dropdown h3 | ||
{ | { | ||
height: inherit | height:inherit | ||
} | } | ||
.vector-menu-dropdown h3::after | .vector-menu-dropdown h3::after | ||
{ | { | ||
top: 0 | top:0 | ||
} | } | ||
.vector-menu-tabs .mw-watchlink.icon a | .vector-menu-tabs .mw-watchlink.icon a | ||
{ | { | ||
padding-top: 29px | padding-top:29px | ||
} | } | ||
.vector-menu-tabs .selected | .vector-menu-tabs .selected | ||
{ | { | ||
background: none | background:none | ||
} | } | ||
#mw-page-base | #mw-page-base | ||
{ | { | ||
background: linear-gradient(rgba(0,0,0,0.5),transparent 75%, #292526), | background:linear-gradient(rgba(0,0,0,0.5),transparent 75%,#292526),repeating-linear-gradient(115deg,transparent,transparent 5px,#34312C 5px,#34312C 16px) | ||
} | } | ||
.vector-menu-portal h3 | .vector-menu-portal h3 | ||
{ | { | ||
background:none; | background:none; | ||
border-bottom: 0.2em dotted #D2CDC8 | border-bottom:0.2em dotted #D2CDC8 | ||
} | } | ||
.vector-menu-portal .vector-menu-content li a, .mw-footer ul li a, #p-personal div ul li a | .vector-menu-portal .vector-menu-content li a, | ||
.mw-footer ul li a, | |||
#p-personal div ul li a | |||
{ | { | ||
color: #e8d18c | color:#e8d18c | ||
} | } | ||
.vector-menu-portal .vector-menu-content li a:visited, .mw-footer ul li a:visited, #p-personal div ul li a:visited | .vector-menu-portal .vector-menu-content li a:visited, | ||
.mw-footer ul li a:visited, | |||
#p-personal div ul li a:visited | |||
{ | { | ||
color: #ae9573 | color:#ae9573 | ||
} | } | ||
#p-personal div ul li a.new | #p-personal div ul li a.new | ||
{ | { | ||
color: #dd3333 | color:#dd3333 | ||
} | } | ||
#p-personal div ul li a.new:visited | #p-personal div ul li a.new:visited | ||
{ | { | ||
color: #a55858 | color:#a55858 | ||
} | } | ||
.mw-footer li, .vector-menu-portal h3, .vector-menu-tabs li a, .vector-menu-dropdown-noicon h3 | .mw-footer li, | ||
.vector-menu-portal h3, | |||
.vector-menu-tabs li a, | |||
.vector-menu-dropdown-noicon h3 | |||
{ | { | ||
color: #D2CDC8 | color:#D2CDC8 | ||
} | } | ||
.toc, .toccolours, .catlinks, div.thumbinner { | @media screen | ||
{ | |||
.toc, | |||
.toccolours, | |||
.catlinks, | |||
div.thumbinner | |||
{ | |||
background-color:#E5E0DC | |||
} | |||
} | } | ||
.tabber__tabs | .tabber__tabs | ||
{ | { | ||
margin:auto; | margin:auto; | ||
box-shadow:none | box-shadow:none | ||
} | } | ||
.tabber__tab | .tabber__tab | ||
{ | { | ||
background-color:#583A31; | background-color:#583A31; | ||
font-family: "TF2C Build", "TF2 Build"; | font-family:"TF2C Build","TF2 Build"; | ||
box-shadow:none; | box-shadow:none; | ||
font-weight:normal; | font-weight:normal; | ||
margin:1px | margin:1px | ||
} | } | ||
.tabber__tab, .tabber__tab:visited | .tabber__tab, | ||
.tabber__tab:visited | |||
{ | { | ||
color: #E5E0DC; | color:#E5E0DC; | ||
box-shadow:none | box-shadow:none | ||
} | } | ||
.tabber__tab--active, .tabber__tab:hover, .tabber__tab--active:visited | .tabber__tab--active, | ||
.tabber__tab:hover, | |||
.tabber__tab--active:visited | |||
{ | { | ||
color: #e8d18c; | color:#e8d18c; | ||
box-shadow:none | box-shadow:none | ||
} | } | ||
.tabber__tab[title="RED"] | .tabber__tab[title="RED"] | ||
{ | { | ||
background-color: #C63E3E | background-color:#C63E3E | ||
} | } | ||
.tabber__tab[title="BLU"] | .tabber__tab[title="BLU"] | ||
{ | { | ||
background-color: #59788C | background-color:#59788C | ||
} | } | ||
.tabber__tab[title="GRN"] | .tabber__tab[title="GRN"] | ||
{ | { | ||
background-color: #3C9D46 | background-color:#3C9D46 | ||
} | } | ||
.tabber__tab[title="YLW"] | .tabber__tab[title="YLW"] | ||
{ | { | ||
background-color: #DA9D28; | background-color:#DA9D28 | ||
} | |||
@media print | |||
{ | |||
.tabber__tab | |||
{ | |||
display: none; | |||
} | |||
} | } | ||
.quotation blockquote::before, .quotation blockquote::after { | .quotation blockquote::before, | ||
.quotation blockquote::after | |||
{ | |||
font-size:5em; | font-size:5em; | ||
line-height:0; | line-height:0; | ||
| Line 274: | Line 345: | ||
position:relative; | position:relative; | ||
color:#292526; | color:#292526; | ||
white-space:nowrap | white-space:nowrap | ||
} | } | ||
.quotation blockquote::before { | .quotation blockquote::before | ||
content:"“" | { | ||
content:"“" | |||
} | } | ||
.quotation blockquote::after { | .quotation blockquote::after | ||
content:"”" | { | ||
content:"”" | |||
} | } | ||
.quotation blockquote { | .quotation blockquote | ||
{ | |||
border:none; | border:none; | ||
margin:0; | margin:0; | ||
padding:0; | padding:0; | ||
display:flex | display:flex | ||
} | } | ||
.quotation blockquote p { | .quotation blockquote p | ||
{ | |||
margin:1em; | margin:1em; | ||
text-align:justify | text-align:justify | ||
} | } | ||
.quotation { | .quotation | ||
{ | |||
width:auto; | width:auto; | ||
border-left:2px #292526 solid; | border-left:2px #292526 solid; | ||
| Line 299: | Line 375: | ||
margin-left:32px; | margin-left:32px; | ||
max-width:50em; | max-width:50em; | ||
display: flex; | display:flex; | ||
flex-direction: column | flex-direction:column | ||
} | } | ||
.quotation cite:before { | .quotation cite:before | ||
content:"— " | { | ||
content:"— " | |||
} | } | ||
.quotation cite { | .quotation cite | ||
text-align: right; | { | ||
width: 100% | text-align:right; | ||
width:100% | |||
} | } | ||
Revision as of 17:56, 5 May 2022
@font-face
{
font-family:"TF2C";
src:url(https://wiki.tf2classic.com/fonts/TF2C.woff2) format("woff2"),
url(https://wiki.tf2classic.com/fonts/TF2C.woff) format("woff"),
url(https://wiki.tf2classic.com/fonts/TF2C.ttf) format("truetype")
}
@font-face
{
font-family:"TF2C Build";
src:url(https://wiki.tf2classic.com/fonts/TF2CBuild.woff2) format("woff2"),
url(https://wiki.tf2classic.com/fonts/TF2CBuild.woff) format("woff"),
url(https://wiki.tf2classic.com/fonts/TF2CBuild.ttf) format("truetype")
}
@font-face
{
font-family:"TF2C Professor";
src:url(https://wiki.tf2classic.com/fonts/TF2CProfessor.woff2) format("woff2"),
url(https://wiki.tf2classic.com/fonts/TF2CProfessor.woff) format("woff"),
url(https://wiki.tf2classic.com/fonts/TF2CProfessor.ttf) format("truetype")
}
@font-face
{
font-family:"TF2C Secondary";
src:url(https://wiki.tf2classic.com/fonts/TF2CSecondary.woff2) format("woff2"),
url(https://wiki.tf2classic.com/fonts/TF2CSecondary.woff) format("woff"),
url(https://wiki.tf2classic.com/fonts/TF2CSecondary.ttf) format("truetype")
}
.infobox
{
float:right;
min-width:21em;
margin:0 0 1em 1em;
}
.infobox-title
{
font-size:21px;
text-align:center
}
.infobox-image
{
text-align:center
}
.infobox th
{
vertical-align:top;
vertical-align:top;
font-family:"TF2C Build","TF2 Build",sans-serif;
font-weight:normal;
width:100%;
}
.killicon
{
vertical-align:middle;
height:40px;
color:#38361E;
font-family:"Verdana",serif;
font-weight:bold;
font-size:17px
}
@media screen
{
.infobox
{
border:1px solid #583A31;
background-color:#E5E0DC
}
.infobox th
{
background-color:#583A31;
color:#D2CDC8
}
.killicon
{
background-color:#F1E9CB;
color:#38361E;
border-radius:5px
}
}
@media print
{
.infobox th
{
background-color:#8E8E8E;
}
.infobox
{
border: 1px black solid;
}
}
.loadout-tooltip-container
{
padding:10px;
background-image:linear-gradient(#38332D,#221E1A);
color:#221E1A;
font-size:15px;
font-family:"TF2C Secondary","TF2 Secondary",sans-serif;
border-radius:5px
}
.loadout-tooltip-container p
{
margin:0 !important;
text-align:center;
line-height: 1.6em;
}
.loadout-tooltip-name
{
font-family:"TF2C Build","TF2 Build",sans-serif;
font-size:18px;
color:#B2B2B2
}
.loadout-tooltip-type
{
color:#756B5E
}
.loadout-tooltip-neutral
{
color:#EBE2CA
}
.loadout-tooltip-positive
{
color:#99CCE1
}
.loadout-tooltip-negative
{
color:#FF4040
}
#mw-indicator-mw-helplink a
{
font-family:"TF2C","TF2","Linux Libertine","Georgia","Times",serif;
color:#D2CDC8 !important;
font-size:38px;
margin-top:0.4em;
padding-right:0.3em;
padding-left:0.8em;
height:auto;
line-height:49.4px
}
#firstHeading
{
font-family:"TF2C","TF2","Linux Libertine","Georgia","Times",serif;
font-size:2.4em;
border-bottom:0.2em dotted;
}
@media screen
{
#firstHeading
{
padding-left:0.3em;
margin-left:0.1em;
padding-top:0.4em;
color: #D2CDC8;
}
#content
{
background-color:#583A31;
color:#D2CDC8;
padding:0;
border:none;
box-shadow:0 10px 10px rgba(0,0,0,0.5);
border-radius:8px 0 0 8px
}
#bodyContent
{
background-color:#D2CDC8;
color:black;
padding:0.25em 1em 1em 1em;
border-radius:0 0 0 8px;
background-image:linear-gradient(rgba(0,0,0,0.5),transparent 10px)
}
}
body
{
background-color:#292526
}
@media print
{
body, #content
{
background-color: white;
color: black;
}
}
.vector-menu-tabs ul
{
margin-left:1em
}
.vector-menu-tabs li
{
background:none;
margin-right:0.25em;
padding-top:10px
}
.vector-menu-tabs li a,
.vector-menu-dropdown-noicon h3
{
font-family:"TF2C Build","TF2 Build",sans-serif;
font-size:16px;
height:29px;
padding:6px 8px
}
.vector-menu-tabs li a
{
background:#1F1B1A;
border-radius:8px 8px 0 0
}
.vector-menu-tabs .selected a,
.vector-menu-tabs .selected a:visited
{
background:#583A31;
color:#D2CDC8
}
.vector-menu-tabs,
.vector-menu-tabs a,
#mw-head .vector-menu-dropdown h3
{
background:none
}
.vector-menu-tabs .mw-watchlink.icon a::before
{
top:0.3em
}
.vector-menu-dropdown
{
padding-top:10px
}
#mw-head .vector-menu-dropdown h3
{
height:inherit
}
.vector-menu-dropdown h3::after
{
top:0
}
.vector-menu-tabs .mw-watchlink.icon a
{
padding-top:29px
}
.vector-menu-tabs .selected
{
background:none
}
#mw-page-base
{
background:linear-gradient(rgba(0,0,0,0.5),transparent 75%,#292526),repeating-linear-gradient(115deg,transparent,transparent 5px,#34312C 5px,#34312C 16px)
}
.vector-menu-portal h3
{
background:none;
border-bottom:0.2em dotted #D2CDC8
}
.vector-menu-portal .vector-menu-content li a,
.mw-footer ul li a,
#p-personal div ul li a
{
color:#e8d18c
}
.vector-menu-portal .vector-menu-content li a:visited,
.mw-footer ul li a:visited,
#p-personal div ul li a:visited
{
color:#ae9573
}
#p-personal div ul li a.new
{
color:#dd3333
}
#p-personal div ul li a.new:visited
{
color:#a55858
}
.mw-footer li,
.vector-menu-portal h3,
.vector-menu-tabs li a,
.vector-menu-dropdown-noicon h3
{
color:#D2CDC8
}
@media screen
{
.toc,
.toccolours,
.catlinks,
div.thumbinner
{
background-color:#E5E0DC
}
}
.tabber__tabs
{
margin:auto;
box-shadow:none
}
.tabber__tab
{
background-color:#583A31;
font-family:"TF2C Build","TF2 Build";
box-shadow:none;
font-weight:normal;
margin:1px
}
.tabber__tab,
.tabber__tab:visited
{
color:#E5E0DC;
box-shadow:none
}
.tabber__tab--active,
.tabber__tab:hover,
.tabber__tab--active:visited
{
color:#e8d18c;
box-shadow:none
}
.tabber__tab[title="RED"]
{
background-color:#C63E3E
}
.tabber__tab[title="BLU"]
{
background-color:#59788C
}
.tabber__tab[title="GRN"]
{
background-color:#3C9D46
}
.tabber__tab[title="YLW"]
{
background-color:#DA9D28
}
@media print
{
.tabber__tab
{
display: none;
}
}
.quotation blockquote::before,
.quotation blockquote::after
{
font-size:5em;
line-height:0;
font-family:"Linux Libertine","Georgia","Times",serif;
top:0.4em;
position:relative;
color:#292526;
white-space:nowrap
}
.quotation blockquote::before
{
content:"“"
}
.quotation blockquote::after
{
content:"”"
}
.quotation blockquote
{
border:none;
margin:0;
padding:0;
display:flex
}
.quotation blockquote p
{
margin:1em;
text-align:justify
}
.quotation
{
width:auto;
border-left:2px #292526 solid;
border-right:2px #292526 solid;
padding:0px 16px;
margin-left:32px;
max-width:50em;
display:flex;
flex-direction:column
}
.quotation cite:before
{
content:"— "
}
.quotation cite
{
text-align:right;
width:100%
}