MediaWiki:Common.css: Difference between revisions

From TF2 Classified Wiki
Jump to navigation Jump to search
moving vector specific code to vector.css
Can we fix the tabber active color issue?
 
(37 intermediate revisions by 3 users not shown)
Line 1: Line 1:
@font-face
@font-face {
{
font-family:"TF2C";
font-family:"TF2C";
src: url(/misc/TF2C.woff2) format("woff2"),
src: url("/misc/TF2C.woff2") format("woff2"),
url(/misc/TF2C.woff) format("woff"),
url("/misc/TF2C.woff") format("woff"),
url(/misc/TF2C.ttf) format("truetype")
url("/misc/TF2C.ttf") format("truetype");
}
}
@font-face
 
{
@font-face {
font-family:"TF2C Build";
font-family:"TF2C Build";
src: url(/misc/TF2CBuild.woff2) format("woff2"),
src: url("/misc/TF2CBuild.woff2") format("woff2"),
url(/misc/TF2CBuild.woff) format("woff"),
url("/misc/TF2CBuild.woff") format("woff"),
url(/misc/TF2CBuild.ttf) format("truetype")
url("/misc/TF2CBuild.ttf") format("truetype");
}
}
@font-face
 
{
@font-face {
font-family:"TF2C Professor";
font-family:"TF2C Professor";
src: url(/misc/TF2CProfessor.woff2) format("woff2"),
src: url(/misc/TF2CProfessor.woff2) format("woff2"),
url(/misc/TF2CProfessor.woff) format("woff"),
url("/misc/TF2CProfessor.woff") format("woff"),
url(/misc/TF2CProfessor.ttf) format("truetype")
url("/misc/TF2CProfessor.ttf") format("truetype");
}
}
@font-face
 
{
@font-face {
font-family:"TF2C Secondary";
font-family:"TF2C Secondary";
src: url(/misc/TF2CSecondary.woff2) format("woff2"),
src: url("/misc/TF2CSecondary.woff2") format("woff2"),
url(/misc/TF2CSecondary.woff) format("woff"),
url("/misc/TF2CSecondary.woff") format("woff"),
url(/misc/TF2CSecondary.ttf) format("truetype")
url("/misc/TF2CSecondary.ttf") format("truetype");
}
}
.infobox
 
{
.infobox {
float:right;
float:right;
min-width:21em;
min-width:21em;
margin:0 0 1em 1em;
margin:0 0 1em 1em;
}
}
.infobox-title
.infobox-title {
{
font-size:21px;
font-size:21px;
text-align:center  
text-align:center  
}
}
.infobox-image
 
{
.infobox-image {
text-align:center
text-align:center
}
}
.infobox th
 
{
.infobox th {
text-align:center;
text-align:center;
vertical-align:top;
vertical-align:top;
font-family:"TF2C Build","TF2 Build",sans-serif;
font-family:"TF2C Build","TF2 Build",sans-serif;
text-transform:uppercase;
font-weight:normal;
font-weight:normal;
width:100%;
width:100%;
}
}
.killicon
 
{
.killicon {
vertical-align:middle;
vertical-align:middle;
height:40px;
height:40px;
Line 57: Line 56:
font-family:"Verdana",serif;
font-family:"Verdana",serif;
font-weight:bold;
font-weight:bold;
font-size:17px
font-size:17px;
}
}
.content .infobox caption
 
.content .infobox caption {
padding: 0;
}
.ambox
{
{
padding: 0;
margin:0 10%;
padding-right:1em;
}
}
@media screen
.ambox-image, .ambox-empty-cell
{
{
.infobox
border-left:10px solid #583A31;
{
padding: 2px 0 2px 0.5em;
}
@media screen {
.infobox, .ambox {
border:1px solid #583A31;
border:1px solid #583A31;
background-color:#E5E0DC
background-color:#E5E0DC;
}
}
.infobox th
 
{
.infobox th {
background-color:#583A31;
background-color:#583A31;
color:#D2CDC8
color:#D2CDC8;
}
}
.killicon
 
{
.killicon {
background-color:#F1E9CB;
background-color:#F1E9CB;
color:#38361E;
color:#38361E;
border-radius:5px
border-radius:5px;
}
}
}
}
@media print
@media print {
{
.infobox th {
.infobox th
{
background-color:#8E8E8E;
background-color:#8E8E8E;
}
}
.infobox
 
{
.infobox, .ambox {
border: 1px black solid;
border: 1px black solid;
}
.infobox, .ambox {
border-color:black;
}
}
}
}
.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","Verdana",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;
text-align:center;
line-height: 1.6em;
line-height: 1.6em;
}
}
.loadout-tooltip-name
 
{
.loadout-tooltip-name {
font-family:"TF2C Build","TF2 Build",sans-serif;
font-family:"TF2C Build","TF2 Build","Verdana",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 {
color:#FF4040;
}
}
.loadout-tooltip-negative
 
{
.tabber__tabs {
color:#FF4040
margin:auto;
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",sans-serif;
text-transform: uppercase;
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,.tabber__tab:hover,.tabber__tab--active:visited {
.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
 
{
@media print {
.tabber__tab
.tabber__tab {
{
display: none;
display: none;
}
}
}
}
.tabber__panel
 
{
.tabber__panel {
min-width: 0;
min-width: 0;
}
}
.quotation blockquote::before,
 
.quotation blockquote::after
.tabber__tab[aria-selected="true"], .tabber__tab[aria-selected="true"]:visited {
{
color: #e8d18c;
}
 
.quotation blockquote::before,.quotation blockquote::after {
font-size:5em;
font-size:5em;
line-height:0;
line-height:0;
Line 187: Line 201:
position:relative;
position:relative;
color:#292526;
color:#292526;
white-space:nowrap
white-space:nowrap;
}
}
.quotation blockquote::before
 
{
.quotation blockquote::before {
content:open-quote;
content:open-quote;
}
}
.quotation blockquote::after
 
{
.quotation blockquote::after {
content:close-quote;
content:close-quote;
}
}
.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;
border-right:2px #292526 solid;
border-right:2px #292526 solid;
padding:0px 16px;
padding:0 16px;
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 {
content:"— ";
}
 
.quotation cite {
text-align:right;
width:100%;
}
 
.page-Main_Page .external {
padding-right:0 !important;
background-image:unset !important;
}
}
.quotation cite:before
 
.mp-header {
font-family:"TF2C","TF2","Linux Libertine","Georgia","Times",serif !important;
text-transform:uppercase;
font-size:2.5em !important;
margin-top:10px !important;
}
 
.mp-topheader
{
{
content:""  
font-family: "TF2C","TF2","Linux Libertine","Georgia","Times",serif;
text-transform: uppercase;
text-align: center;
font-size: 38.4px;
}
}
.quotation cite
 
.mp-description
{
{
text-align:right;
text-align: center;
width:100%
}
 
.mp-classContainer
{
border-radius: 8px;
padding: 8px;
display: flex;
justify-content: space-around;
font-size: clamp(8px, 1vw, 20px);
text-align: center;
}
 
.mp-class a img
{
max-width: 100%;
width: 128px;
height: unset;
}
 
.mp-class a img:hover
{
filter: brightness(1.25);
}
 
.crits
{
background-image: url(/w/index.php?title=Special:Redirect/file/Killicon_crit.png);
background-size: 100% 100%;
}
 
.minicrits
{
background-image: url(/w/index.php?title=Special:Redirect/file/Killicon_minicrit.png);
background-size: 100% 100%;
}
 
.navbox ul, .navbox li
{
display:inline;
margin:0;
}
 
.navbox li:not(:last-child):after
{
content:" · ";
}
}

Latest revision as of 06:59, 24 July 2025

@font-face {
	font-family:"TF2C";
	src: url("/misc/TF2C.woff2") format("woff2"),
	url("/misc/TF2C.woff") format("woff"),
	url("/misc/TF2C.ttf") format("truetype");
}

@font-face {
	font-family:"TF2C Build";
	src: url("/misc/TF2CBuild.woff2") format("woff2"),
	url("/misc/TF2CBuild.woff") format("woff"),
	url("/misc/TF2CBuild.ttf") format("truetype");
}

@font-face {
	font-family:"TF2C Professor";
	src: url(/misc/TF2CProfessor.woff2) format("woff2"),
	url("/misc/TF2CProfessor.woff") format("woff"),
	url("/misc/TF2CProfessor.ttf") format("truetype");
}

@font-face {
	font-family:"TF2C Secondary";
	src: url("/misc/TF2CSecondary.woff2") format("woff2"),
	url("/misc/TF2CSecondary.woff") format("woff"),
	url("/misc/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 {
	text-align:center;
	vertical-align:top;
	font-family:"TF2C Build","TF2 Build",sans-serif;
	text-transform:uppercase;
	font-weight:normal;
	width:100%;
}

.killicon {
	vertical-align:middle;
	height:40px;
	color:#38361E;
	font-family:"Verdana",serif;
	font-weight:bold;
	font-size:17px;
}

.content .infobox caption {
	padding: 0;
}
.ambox
{
	margin:0 10%;
	padding-right:1em;
}
.ambox-image, .ambox-empty-cell
{
	border-left:10px solid #583A31;
	padding: 2px 0 2px 0.5em;
}
@media screen {
	.infobox, .ambox {
		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, .ambox {
		border: 1px black solid;
	}
	.infobox, .ambox {
		border-color:black;
	}
}

.loadout-tooltip-container {
	padding:10px;
	background-image:linear-gradient(#38332D,#221E1A);
	color:#221E1A;
	font-size:15px;
	font-family:"TF2C Secondary","TF2 Secondary","Verdana",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","Verdana",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;
}

.tabber__tabs {
	margin:auto;
	box-shadow:none;
}

.tabber__tab {
	background-color:#583A31;
	font-family:"TF2C Build","TF2 Build",sans-serif;
	text-transform: uppercase;
	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;
	}
}

.tabber__panel {
	min-width: 0;
}

.tabber__tab[aria-selected="true"], .tabber__tab[aria-selected="true"]:visited {
	color: #e8d18c;
}

.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:open-quote;
}

.quotation blockquote::after {
	content:close-quote;
}

.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:0 16px;
	margin-left:32px;
	max-width:50em;
	display:flex;
	flex-direction:column;
}

.quotation cite:before {
	content:"— ";
}

.quotation cite {
	text-align:right;
	width:100%;
}

.page-Main_Page .external {
	padding-right:0 !important;
	background-image:unset !important;
}

.mp-header {
	font-family:"TF2C","TF2","Linux Libertine","Georgia","Times",serif !important;
	text-transform:uppercase;
	font-size:2.5em !important;
	margin-top:10px !important;
}

.mp-topheader
{
	font-family: "TF2C","TF2","Linux Libertine","Georgia","Times",serif;
	text-transform: uppercase;
	text-align: center;
	font-size: 38.4px;
}

.mp-description
{
	text-align: center;
}

.mp-classContainer
{
	border-radius: 8px;
	padding: 8px;
	display: flex;
	justify-content: space-around;
	font-size: clamp(8px, 1vw, 20px);
	text-align: center;
}

.mp-class a img
{
	max-width: 100%;
	width: 128px;
	height: unset;
}

.mp-class a img:hover
{
	filter: brightness(1.25);
}

.crits
{
	background-image: url(/w/index.php?title=Special:Redirect/file/Killicon_crit.png);
	background-size: 100% 100%;
}

.minicrits
{
	background-image: url(/w/index.php?title=Special:Redirect/file/Killicon_minicrit.png);
	background-size: 100% 100%;
}

.navbox ul, .navbox li
{
	display:inline;
	margin:0;
}

.navbox li:not(:last-child):after
{
	content:" · ";
}