Hosting and domain costs until October 2024 have been generously sponsored by dumptruck_ds. Thank you!

Difference between revisions of "MediaWiki:Common.css"

From Quake Wiki

(Collapsible tables)
(integrating starbuck's css, local image paths)
Line 1: Line 1:
 
/** CSS placed here will be applied to all skins */
 
/** CSS placed here will be applied to all skins */
  
@import url("https://dl.dropbox.com/u/7216632/quakewiki/quakewiki.css");
+
/* QuakeWiki Custom Style by Starbuck
 +
=========================================================================== */
  
 +
/* Imports */
 +
@import url('http://fonts.googleapis.com/css?family=Open+Sans:300,400,500,700');   
 +
 +
/* General Page Nonsense */
 +
body {
 +
margin: 10px;
 +
color: #333;
 +
background: none;
 +
/* line-height: 150% !important; */
 +
}
 +
html {
 +
background-image: url(/w/images/5/5b/Background-concrete.jpg);
 +
background-repeat: no-repeat, repeat;
 +
background-position: top left;
 +
}
 +
 +
#wikia_header { background :none !important; }
 +
 +
a { color: #456abd; }
 +
a:visited { color: #8160a9 }
 +
 +
ul { list-style-image: none; list-style-type: circle; }
 +
li.new a, a.new { color :#bb341a !important; }
 +
 +
input:focus {
 +
    outline:none;
 +
}
 +
 +
#wiki_logo { background-image: url(/w/images/8/89/Logo2.png) !important; margin: -50px 0 -10px -10px; }
 +
 +
hr { color: #ddd; background-color: #ddd; margin: 5px 0 20px 0;}
 +
div.noarticletext, #catlinks { color: inherit; border: 1px solid #ddd; background: #f9f9f9;}
 +
 +
.dark_text_1 { color: #555; }
 +
/* =========================================================================== */
 +
 +
/* Please Can We Use A Nice Font */
 +
body, .page_bar, .page_tabs, .compact_page_tabs li, .sidebox #navigation ul {
 +
font-family: 'Open Sans' !important;
 +
}
 +
 +
.page article { font-size: 100%; }
 +
/* More Type Fixes */
 +
.hover-navigation .menu-item { font-weight: normal !important; }
 +
 +
/* Headings */
 +
h1, h2, h3, h4, h5, h6 {
 +
border-bottom: 1px solid #ddd !important;
 +
padding-bottom: 0.35em !important;
 +
margin-bottom: 15px !important;
 +
}
 +
 +
 +
/* #editform .editOptions { clear: both; overflow: hidden; } */
 +
 +
/* =========================================================================== */
 +
 +
/* Backgrounds */
 +
.color2 { background: inherit; }
 +
.color1 { background: url(/w/images/7/77/Background-concrete2.jpg) top left repeat #5e5540; }
 +
 +
/* Awful Background Strip Thing The Logo Goes On */
 +
#background_strip { background: none; border: none; display: none; }
 +
#wikia_header { border: none; }
 +
 +
/* Page Layout Classes */
 +
.page article { padding: 20px !important; }
 +
.page { font: 13px 'Open Sans' sans-serif !important; }
 +
 +
/* header menu */
 +
#headerMenuUser ul { background: #fff;}
 +
#userData span, #userData span a { font-weight: normal; font-size: 13px; text-shadow: 0px 1px 1px #fff;}
 +
#userData { right: 20px; clear: both; }
 +
#userData a.wikia-button { margin-top: -5px; box-shadow: 0px 1px 1px #000; }
 +
 +
/* That Bar At The Top */
 +
.page_bar {
 +
margin: 0px 0px !important;
 +
font-size: 13px;
 +
-webkit-box-shadow: inset 0 -3px 4px rgba(0, 0, 0, 0.2);
 +
/*-moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
 +
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);} */
 +
}
 +
 +
ul.page_tabs li, .page_bar {
 +
-webkit-border-radius: 4px 4px 0 0;
 +
-moz-border-radius: 4px 4px 0 0;
 +
border-radius: 4px 4px 0 0;
 +
}
 +
 +
#wikia_page, .sidebox {
 +
-webkit-border-radius: 6px;
 +
-moz-border-radius: 6px;
 +
border-radius: 6px;
 +
border: none;
 +
margin-bottom: 20px;
 +
}
 +
 +
div#userloginForm form, div#userlogin form#userlogin2, div.noarticletext, fieldset, #catlinks {
 +
-webkit-border-radius: 4px;
 +
-moz-border-radius: 4px;
 +
border-radius: 4px;
 +
}
 +
 +
 +
#wikia_page, .sidebox { box-shadow: 0px 2px 4px #5e5540; }
 +
 +
ul.page_tabs .selected a { color: #333; text-decoration: none; cursor: normal; }
 +
 +
#page_controls a { color: #fff !important; text-shadow: 0px 2px 1px #000;}
 +
#page_controls li { margin: 0px 15px 0px 5px !important; }
 +
.page_bar .page_tabs li.selected { font-weight: normal; }
 +
.page_bar .page_buttons li.selected { background: none; }
 +
.page_bar .page_buttons a { margin-left: 4px; }
 +
 +
/* User Masthead / Accent */
 +
.accent { background: none; }
 +
#user_masthead h2 { font-weight: normal; border: none !important; margin-left: 10px; }
 +
body.masthead-regular #page_controls a { color: red; text-shadow: none !important; color: #333 !important; }
 +
#user_masthead_scorecard { padding: 8px; font-size: 48px; }
 +
#user_masthead_tabs li.color1 { background: none;}
 +
 +
/* =========================================================================== */
 +
 +
/* Sidebox */
 +
.sidebox {
 +
padding: 0 !important;
 +
margin-right: 20px;
 +
}
 +
 +
#monaco_shrinkwrap_main.with_left_sidebar #page_wrapper { left: 218px; }
 +
.sidebox #navigation li { padding: 3px; }
 +
.sidebox #link_box li { padding: 6px 4px; }
 +
.sidebox #link_box li a { color: #5e5540 !important; }
 +
.sidebox #link_box.color2 { background: url(/w/images/b/b1/Background-concrete3.jpg) top left repeat #e1dbd1; }
 +
.sidebox #link_box.color2  {
 +
-webkit-border-radius: 4px !important;
 +
-moz-border-radius: 4px !important;
 +
border-radius: 4px !important;
 +
border: none;
 +
font-weight: normal !important;
 +
font-size: 11px !important;
 +
}
 +
.sidebox #link_box.color2 a {text-shadow: 0px 2px 2px #fff;}
 +
.hover-navigation em { right: 8px; top: 3px; color: #999;}
 +
 +
#link_box_dynamic .link_box_dynamic_item {padding: 5px; font-weight: normal; }
 +
#link_box_dynamic img#dynamic-links-add-image-img { margin-right: 4px; }
 +
 +
/* Footer */
 +
.article_footer td { padding: 20px !important;}
 +
.article_footer ul.actions li { min-width: 160px; margin-right: 10px; }
 +
 +
/* Forms and Buttons */
 +
/* =========================================================================== */
 +
 +
/* Button */
 +
a.wikia-button, span.wikia-button a, input[type="submit"], input[type="reset"], input[type="button"], button {
 +
border: none !important;
 +
color: #ffffff !important;
 +
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25) !important;
 +
background-color: #006dcc;
 +
background-image: -moz-linear-gradient(top, #0088cc, #0044cc);
 +
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0044cc));
 +
background-image: -webkit-linear-gradient(top, #0088cc, #0044cc);
 +
background-image: -o-linear-gradient(top, #0088cc, #0044cc);
 +
background-image: linear-gradient(to bottom, #0088cc, #0044cc);
 +
background-repeat: repeat-x;
 +
border-color: #0044cc #0044cc #002a80;
 +
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
 +
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff0088cc', endColorstr='#ff0044cc', GradientType=0);
 +
filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
 +
/* btn */
 +
display: inline-block;
 +
padding: 4px 8px;
 +
margin: 5px;
 +
font-size: 12px !important;
 +
font-weight: normal !important;
 +
line-height: 18px;
 +
text-align: center;
 +
vertical-align: middle;
 +
cursor: pointer;
 +
-webkit-border-radius: 4px;
 +
-moz-border-radius: 4px;
 +
border-radius: 4px;
 +
height: auto !important;
 +
outline: none;
 +
-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
 +
-moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
 +
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
 +
}
 +
 +
fieldset { border: 1px solid #ddd; }
 +
 +
input, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="tel"], input[type="color"], .uneditable-input {
 +
border: 1px solid #cccccc;
 +
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
 +
-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
 +
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
 +
-webkit-border-radius: 4px;
 +
-moz-border-radius: 4px;
 +
border-radius: 4px;
 +
height: 18px;
 +
padding: 4px 6px;
 +
margin-bottom: 10px;
 +
line-height: 18px;
 +
font-size: 14px !important;
 +
color: #555555;
 +
}
 +
input[type="radio"], input[type="checkbox"] {
 +
margin: 3px 4px 0 0;
 +
line-height: normal;
 +
vertical-align: middle;
 +
}
 +
 +
label { line-height: 18px !important; margin-right: 10px; }
 +
 +
/* Search */
 +
#search_box.color1 { background: none; }
 +
#search-button { top: 17px; right: 20px; border: none;}
 +
#searchform {
 +
background: #fff;
 +
-webkit-border-radius: 15px;
 +
-moz-border-radius: 15px;
 +
border-radius: 15px;
 +
border: 1px solid #cccccc;
 +
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
 +
-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
 +
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
 +
 +
height: 20px;
 +
padding: 3px 6px 5px 10px !important;
 +
margin: 6px;
 +
font-size: 16px !important;
 +
line-height: 20px;
 +
color: #555555;
 +
}
 +
 +
#searchform input { border: none; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; color: #555; }
 +
.suggestions-result-current { background-color: #bb341a}
 +
 +
textarea {
 +
font-family: Monaco, Menlo, Consolas, "Courier New", monospace !important;
 +
font-size: 12px;
 +
color: #48484c;
 +
background: #f5f5f5;
 +
border: 1px solid #e5e5e5;
 +
padding: 10px;
 +
margin-top: 10px;
 +
line-height: 20px !important;
 +
width: 98%;
 +
outline: none;
 +
border-radius: 4px;
 +
margin-bottom: 10px;
 +
}
 +
 +
div#userloginForm form, div#userlogin form#userlogin2 {
 +
border: 1px solid #ddd;
 +
}
 +
 +
/* End of Starbuck's CSS */
 +
 +
 +
/* are these still needed? */
 
body, div.monaco_shrinkwrap {
 
body, div.monaco_shrinkwrap {
 
  margin-left: auto;
 
  margin-left: auto;
Line 12: Line 277:
 
   font-size: 12px !important;
 
   font-size: 12px !important;
 
}
 
}
 +
/* END OF are these still needed? */
  
 
/** Collapsible tables *********************************************************
 
/** Collapsible tables *********************************************************

Revision as of 17:59, 28 May 2013

/** CSS placed here will be applied to all skins */

/* QuakeWiki Custom Style by Starbuck 
=========================================================================== */

/* Imports */
@import url('http://fonts.googleapis.com/css?family=Open+Sans:300,400,500,700');    

/* General Page Nonsense */
body { 
	margin: 10px;
	color: #333; 
	background: none;
	/* line-height: 150% !important; */
}
html { 
	background-image: url(/w/images/5/5b/Background-concrete.jpg); 
	background-repeat: no-repeat, repeat;
	background-position: top left;
}

#wikia_header { background :none !important; }

a { color: #456abd; }
a:visited { color: #8160a9 }

ul { list-style-image: none; list-style-type: circle; }
li.new a, a.new { color :#bb341a !important; }

input:focus {
    outline:none;
}

#wiki_logo { background-image: url(/w/images/8/89/Logo2.png) !important; margin: -50px 0 -10px -10px; }

hr { color: #ddd; background-color: #ddd; margin: 5px 0 20px 0;}
div.noarticletext, #catlinks { color: inherit; border: 1px solid #ddd; background: #f9f9f9;}

.dark_text_1 { color: #555; }
/* =========================================================================== */

/* Please Can We Use A Nice Font */
body, .page_bar, .page_tabs, .compact_page_tabs li, .sidebox #navigation ul { 
	font-family: 'Open Sans' !important;
}

.page article { font-size: 100%; }
/* More Type Fixes */
.hover-navigation .menu-item { font-weight: normal !important; }

/* Headings */
h1, h2, h3, h4, h5, h6 {
	border-bottom: 1px solid #ddd !important;
	padding-bottom: 0.35em !important;
	margin-bottom: 15px !important;
}


/* #editform .editOptions { clear: both; overflow: hidden; } */

/* =========================================================================== */

/* Backgrounds */
.color2 { background: inherit; }
.color1 { background: url(/w/images/7/77/Background-concrete2.jpg) top left repeat #5e5540; }

/* Awful Background Strip Thing The Logo Goes On */
#background_strip { background: none; border: none; display: none; }
#wikia_header { border: none; }

/* Page Layout Classes */
.page article { padding: 20px !important; }
.page { font: 13px 'Open Sans' sans-serif !important; }

/* header menu */
#headerMenuUser ul { background: #fff;}
#userData span, #userData span a { font-weight: normal; font-size: 13px; text-shadow: 0px 1px 1px #fff;}
#userData { right: 20px; clear: both; }
#userData a.wikia-button { margin-top: -5px; box-shadow: 0px 1px 1px #000; }

/* That Bar At The Top */
.page_bar { 
	margin: 0px 0px !important;
	font-size: 13px;
	-webkit-box-shadow: inset 0 -3px 4px rgba(0, 0, 0, 0.2);
	/*-moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);} */
}

ul.page_tabs li, .page_bar { 
	-webkit-border-radius: 4px 4px 0 0;
	-moz-border-radius: 4px 4px 0 0;
	border-radius: 4px 4px 0 0;
}

#wikia_page, .sidebox { 
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	border: none;
	margin-bottom: 20px;
}

div#userloginForm form, div#userlogin form#userlogin2, div.noarticletext, fieldset, #catlinks {
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
}


#wikia_page, .sidebox { box-shadow: 0px 2px 4px #5e5540; }

ul.page_tabs .selected a { color: #333; text-decoration: none; cursor: normal; } 

#page_controls a { color: #fff !important; text-shadow: 0px 2px 1px #000;}
#page_controls li { margin: 0px 15px 0px 5px !important; }
.page_bar .page_tabs li.selected { font-weight: normal; }
.page_bar .page_buttons li.selected { background: none; }
.page_bar .page_buttons a { margin-left: 4px; }

/* User Masthead / Accent */
.accent { background: none; }
#user_masthead h2 { font-weight: normal; border: none !important; margin-left: 10px; }
body.masthead-regular #page_controls a { color: red; text-shadow: none !important; color: #333 !important; }
#user_masthead_scorecard { padding: 8px; font-size: 48px; }
#user_masthead_tabs li.color1 { background: none;}

/* =========================================================================== */

/* Sidebox */
.sidebox { 
	padding: 0 !important; 
	margin-right: 20px;
}

#monaco_shrinkwrap_main.with_left_sidebar #page_wrapper { left: 218px; }
.sidebox #navigation li { padding: 3px; }
.sidebox #link_box li { padding: 6px 4px; }
.sidebox #link_box li a { color: #5e5540 !important; }
.sidebox #link_box.color2 { background: url(/w/images/b/b1/Background-concrete3.jpg) top left repeat #e1dbd1; }
.sidebox #link_box.color2  {
	-webkit-border-radius: 4px !important;
	-moz-border-radius: 4px !important;
	border-radius: 4px !important;
	border: none;
	font-weight: normal !important;
	font-size: 11px !important; 
}
.sidebox #link_box.color2 a {text-shadow: 0px 2px 2px #fff;}
.hover-navigation em { right: 8px; top: 3px; color: #999;}

#link_box_dynamic .link_box_dynamic_item {padding: 5px; font-weight: normal; }
#link_box_dynamic img#dynamic-links-add-image-img { margin-right: 4px; }

/* Footer */
.article_footer td { padding: 20px !important;}
.article_footer ul.actions li { min-width: 160px; margin-right: 10px; }

/* Forms and Buttons */
/* =========================================================================== */

/* Button */
a.wikia-button, span.wikia-button a, input[type="submit"], input[type="reset"], input[type="button"], button {
	border: none !important;
	color: #ffffff !important;
	text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25) !important;
	background-color: #006dcc;
	background-image: -moz-linear-gradient(top, #0088cc, #0044cc);
	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0044cc));
	background-image: -webkit-linear-gradient(top, #0088cc, #0044cc);
	background-image: -o-linear-gradient(top, #0088cc, #0044cc);
	background-image: linear-gradient(to bottom, #0088cc, #0044cc);
	background-repeat: repeat-x;
	border-color: #0044cc #0044cc #002a80;
	border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff0088cc', endColorstr='#ff0044cc', GradientType=0);
	filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
	/* btn */
	display: inline-block;
	padding: 4px 8px;
	margin: 5px;
	font-size: 12px !important;
	font-weight: normal !important;
	line-height: 18px;
	text-align: center;
	vertical-align: middle;
	cursor: pointer;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	height: auto !important;
	outline: none;
	-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
	-moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
}

fieldset { border: 1px solid #ddd; }

input, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="tel"], input[type="color"], .uneditable-input {
	border: 1px solid #cccccc;
	-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
	-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
	box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	height: 18px;
	padding: 4px 6px;
	margin-bottom: 10px;
	line-height: 18px;
	font-size: 14px !important;
	color: #555555;
}
input[type="radio"], input[type="checkbox"] {
margin: 3px 4px 0 0;
line-height: normal;
vertical-align: middle;
}

label { line-height: 18px !important; margin-right: 10px; }

/* Search */
#search_box.color1 { background: none; }
#search-button { top: 17px; right: 20px; border: none;}
#searchform { 
	background: #fff;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	border-radius: 15px;
	border: 1px solid #cccccc;
	-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
	-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
	box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);

	height: 20px;
	padding: 3px 6px 5px 10px !important;
	margin: 6px;
	font-size: 16px !important;
	line-height: 20px;
	color: #555555;
}

#searchform input { border: none; 	-webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; color: #555; }
.suggestions-result-current { background-color: #bb341a}

textarea { 
	font-family: Monaco, Menlo, Consolas, "Courier New", monospace !important;
	font-size: 12px;
	color: #48484c;
	background: #f5f5f5;
	border: 1px solid #e5e5e5;
	padding: 10px;
	margin-top: 10px;
	line-height: 20px !important;
	width: 98%;
	outline: none;
	border-radius: 4px;
	margin-bottom: 10px;
}

div#userloginForm form, div#userlogin form#userlogin2 {
	border: 1px solid #ddd;
}

/* End of Starbuck's CSS */


/* are these still needed? */
body, div.monaco_shrinkwrap {
 margin-left: auto;
 margin-right: auto;
 width: 960px;
}

div#bodyContent {
  font-size: 12px !important;
}
/* END OF are these still needed? */

/** Collapsible tables *********************************************************
 *
 *  Description: Allows tables to be collapsed, showing only the header. See
 *                         http://www.mediawiki.org/wiki/Manual:Collapsible_tables.
 *  Maintainers: [[en:User:R. Koot]]
 */
 
table.collapsed tr.collapsible {
        display: none;
}
 
.collapseButton {               /* 'show'/'hide' buttons created dynamically by the             */
        float: right;           /* CollapsibleTables JavaScript in [[MediaWiki:Common.js]] */
        font-weight: normal;    /* are styled here so they can be customised.             */
        text-align: right;
        width: auto;
}