Difference between revisions of "MediaWiki:Vector.css"

From Team Fortress Wiki
Jump to: navigation, search
m (🔧)
m (Add styles for "sapped logo easter egg")
Line 1: Line 1:
 
/* Make vector orange */
 
/* Make vector orange */
 
div.vectorTabs, div.vectorTabs li a, div.vectorMenu h5 a {
 
div.vectorTabs, div.vectorTabs li a, div.vectorMenu h5 a {
     background-image: url(/w/images/5/58/Tab-break.png);
+
     background-image: url(/w/images/5/58/Tab-#break.png);
 
}
 
}
  
Line 160: Line 160:
  
  
#p-logo
+
#p-logo {
{
+
  position: relative;
 
   background: url(/w/images/f/fb/Leyen_logo_background.png) no-repeat !important;
 
   background: url(/w/images/f/fb/Leyen_logo_background.png) no-repeat !important;
 
}
 
}
 +
 +
/**** START SAPPED LOGO EASTER EGG ****/
 +
#p-logo.wiki-logo--sapped:after,
 +
#p-logo.wiki-logo--sapped:before {
 +
content: '';
 +
position: absolute;
 +
width: 100%;
 +
    height: 100%;
 +
    pointer-events: none;
 +
}
 +
 +
#p-logo.wiki-logo--sapped:before {
 +
    top: 0;
 +
    display: block;
 +
    background: url('/w/images/9/9c/Team_Fortress_Wiki_Egg_Anim_Sparks.png') center / contain no-repeat;
 +
    opacity: 0.8;
 +
    -webkit-filter: blur(0.4px) drop-shadow(2px 2px 6px #00415b);
 +
    filter: blur(0.4px) drop-shadow(2px 2px 6px #00415b);
 +
}
 +
 +
#p-logo.wiki-logo--sapped:after {
 +
    top: -31px;
 +
    left: 2px;
 +
    background: url('/w/images/1/14/Team_Fortress_Wiki_Egg_Sapper_Apply.png') center no-repeat !important;
 +
}
 +
/**** END SAPPED LOGO EASTER EGG ****/
  
 
#p-personal li * {
 
#p-personal li * {

Revision as of 20:41, 2 May 2024

/* Make vector orange */
div.vectorTabs, div.vectorTabs li a, div.vectorMenu h5 a {
    background-image: url(/w/images/5/58/Tab-#break.png);
}

#mw-head-base, #footer {
    background-image: url(/w/images/4/46/Border.png);
}

div.vectorTabs ul { 
    background-image: url(/w/images/5/58/Tab-break.png);
}

div.vectorTabs ul li {
    background-image: url(/w/images/7/77/Tab-normal-fade.png);
    background-color: transparent;
}

div.vectorTabs li.selected {
    background-image: url(/w/images/7/71/Tab-current-fade.png);
}

#mw-page-base {
    background: transparent url(/w/images/9/99/Page-fade.png) repeat-x;
}

#content { 
    background-color: transparent;
    background-image: url(/w/images/d/dd/Content-bg.png);
    border-left:1px solid #F2A858;
}

/* Breaks with Vector on MW > 1.24 or so
#mw-panel div.portal div.body { 
    background-image: url(/w/images/0/0f/Portal-break.png);
}
*/

/* Need to set up new backgrounds here */
body {
    background-color: #F5F5F5;
    background-image: url(/w/images/9/9f/Background_Main_vector.png);
    background-attachment: fixed;
}

/* More padding for the little man icon in the corner */
#pt-userpage, #pt-anonuserpage, #pt-login { 
    padding-left: 20px !important;
}

/* Cover up visited link colour in personal bar */
#p-personal a:visited { 
    color: #3F56AD;
}

/* Adjust position of site notice */
#siteNotice div,
#siteNotice p { 
    margin: -0.5em 0em 1.5em 0em
}

.topicon { 
    position: absolute !important;
    top: -44px !important;
    right: 1px !important;
    display: block !important;
}

/* Account for additions to shared.css */
table.wikitable {
    border-collapse: separate;
}

.wikitable th, .wikitable td {
    border: none;
}

table.grid {
  border: 1px #79542B solid;
  border-collapse: collapse;
  padding:0.4em;
}

.grid th, .grid td {
  border: 1px #79542B solid;
  padding: 0.1em 0.8em;
  white-space: inherit;
}

/* Vector sidebar fixes */
/* Hide languages box per namespace & per page */

.ns--1 .portal#p-Languages,               /* Special */
.ns-0.page-Main_Page .portal#p-Languages, /* Main Page exception */
.ns-2 .portal#p-Languages,                /* User */
.ns-3 .portal#p-Languages,                /* User talk */
.ns-4 .portal#p-Languages,                /* Team Fortress Wiki */
.ns-5 .portal#p-Languages,                /* Team Fortress Wiki talk */
.ns-6 .portal#p-Languages,                /* File */
.ns-7 .portal#p-Languages,                /* File talk */
.ns-8 .portal#p-Languages,                /* MediaWiki */
.ns-9 .portal#p-Languages                 /* MediaWiki talk */
{ 
    display: none; 
}

/* Start Leyen override; FIXME: Rip this out into its own skin */
body {
  background: url(/w/images/7/74/Leyen_sidebar_background.png) repeat-y #f1f0ef !important;
}

#mw-panel {
  bottom: 0px !important;
}

#firstHeading {
  font-size: 1.7em !important;
}

#mw-page-base {
  background: transparent url(/w/images/6/63/Leyen_top_background.png) repeat-x !important;
}

#mw-head-base {
  background: url(/w/images/e/e6/Leyen_top_border.png) repeat-x !important;
  background-position: bottom left !important;
}

#content {
  background: url(/w/images/1/1b/Leyen_content_background.png) repeat-x #fdfdfd !important;
  border-left: 1px solid #878079 !important;
  border-top: 1px solid #878079 !important;
  border-bottom: 1px solid #878079 !important;
}

#footer {
  background: transparent url(/w/images/3/3f/Leyen_footer_background.png) bottom repeat-x !important;
  border-left: 1px solid #878079 !important;
}

#mw-panel div.portal h5 {
  color: #352d26 !important;
  font-weight: bold !important;
  font-size: 0.75em !important;
}

#mw-panel div.portal div.body ul li a {
  color: #27211c !important;
}

#mw-panel #p-logo + .portal .body {
  margin-left: 0;
}

#mw-panel div.portal div.body {
  margin-left: 0;
  padding-left: 0.5em;
  background-image: url(/w/images/c/c7/Leyen_sidebar_separator.png);
}


#p-logo {
  position: relative;
  background: url(/w/images/f/fb/Leyen_logo_background.png) no-repeat !important;
}

/**** START SAPPED LOGO EASTER EGG ****/
#p-logo.wiki-logo--sapped:after,
#p-logo.wiki-logo--sapped:before {
	content: '';
	position: absolute;
	width: 100%;
    height: 100%;
    pointer-events: none;
}

#p-logo.wiki-logo--sapped:before {
    top: 0;
    display: block;
    background: url('/w/images/9/9c/Team_Fortress_Wiki_Egg_Anim_Sparks.png') center / contain no-repeat;
    opacity: 0.8;
    -webkit-filter: blur(0.4px) drop-shadow(2px 2px 6px #00415b);
    filter: blur(0.4px) drop-shadow(2px 2px 6px #00415b);
}

#p-logo.wiki-logo--sapped:after {
    top: -31px;
    left: 2px;
    background: url('/w/images/1/14/Team_Fortress_Wiki_Egg_Sapper_Apply.png') center no-repeat !important;
}
/**** END SAPPED LOGO EASTER EGG ****/

#p-personal li * {
  color: #393736 !important;
}

div.vectorTabs, div.vectorTabs ul, div.vectorMenu h5 a {
  background: none !important;
}

div.vectorTabs ul li, div.vectorTabs ul li * {
  margin: 0px !important;
  padding: 0px !important;
  background: none !important;
}

input.vectorMenuCheckbox {
    visibility: hidden;
}

div.vectorMenu {
    background: url('/w/images/0/02/Leyen_dropdown.png') no-repeat !important;
    width: 5em !important;
    margin-top: 16px !important;
    transition: none !important;
}

div#mw-head div.vectorMenu h3 {
    background-image: none;
    float: none;
    height: auto;
}

div#mw-head div.vectorMenu h3 span:after {
    background-image: none;
}

div.vectorMenu h3 span {
    padding: 3px 0px 3px 25px;
    color: #edeceb;
    font-size: 16px;
    font-family: 'TF2 Build';
}

div.vectorMenu h3:hover span, 
div.vectorMenu h3:focus span {
  color: #edeceb;
}

div.vectorMenu .menu {
  top: 1.5em !important;
}

div.vectorMenu h3 a {
  background: none !important;
  position: static !important;
}

div.vectorMenu ul {
  background: #4c4b49 url(/w/images/6/62/Leyen_tab_dropdown.png) top repeat-x !important;
  border-left: 1px solid #878079 !important;
  border-right: 1px solid #878079 !important;
  border-bottom: 1px solid #878079 !important;
  margin-left: 0px !important;
}

div.vectorMenu ul * {
  color: #fcfbfa !important;
}

div.vectorTabs ul li {
  display: flex !important;
  height: 24px !important;
  margin-top: 16px !important;
}

div.vectorTabs ul li:before {
  content: '';
  background: url(/w/images/7/7f/Leyen_tab_off_left.png) bottom left no-repeat !important;
  width: 10px !important;
  margin-left: 5px !important;
}

div.vectorTabs ul li:after {
  content: '';
  background: url(/w/images/4/49/Leyen_tab_off_right.png) bottom right no-repeat !important;
  width: 10px !important;
  margin-right: 5px !important;
}

div.vectorTabs ul li a {
  line-height: 1.5em !important;
}

div.vectorTabs ul li span {
  background: url(/w/images/5/5c/Leyen_tab_off_center.png) bottom repeat-x !important;
  margin-bottom: 0px !important;
  display: block !important;
  position: relative !important;
  height: 100%;
}

div.vectorTabs ul li.new:before {
  background-image: url(/w/images/8/88/Leyen_tab_new_off_left.png) !important;
}

div.vectorTabs ul li.new:after {
  background-image: url(/w/images/a/ae/Leyen_tab_new_off_right.png) !important;
}

div.vectorTabs ul li.new span {
  background-image: url(/w/images/8/8e/Leyen_tab_new_off_center.png) !important;
}

div.vectorTabs ul li * {
  color: #edeceb !important;
  font-family: "TF2 Build" !important;
  font-size: 16px !important;
}

div.vectorTabs ul li:hover * {
  color: #fcfbfa !important;
}

div.vectorTabs ul li.selected:before {
  background: url(/w/images/f/f0/Leyen_tab_left.png) bottom left no-repeat !important;
}

div.vectorTabs ul li.selected:after {
  background: url(/w/images/4/46/Leyen_tab_right.png) bottom right no-repeat !important;
}

div.vectorTabs ul li.selected span {
  background: url(/w/images/c/ce/Leyen_tab_center.png) bottom repeat-x !important
}

div.vectorTabs ul li.selected * {
  color: #4d4743 !important;
  cursor: default !important;
}

div.vectorTabs ul li.selected.new * {
  color: #733c17 !important;
}

#p-search {
  background: url(/w/images/8/8e/Leyen_search_background.png) bottom no-repeat !important;
  width: 280px !important;
  max-width: 280px !important;
  height: 24px !important;
  margin-top: 16px !important;
}

#p-search form, #p-search input {
  margin-top: 0px !important;
}

#searchform {
  background-color: transparent !important;
  bottom: 18px !important;
}

#simpleSearch {
  background: none !important;
  border: none !important;
  width: 280px !important;
  bottom: 7px !important;
  padding: 0 !important;
}

#searchInput {
  border: 0px solid #998d82 !important;
  margin: 0px !important;
  background: #bcb3a9 !important;
  margin-left: 2px !important;
  height: 18px !important;
  color: #514840 !important;
  font-size: 11px !important;
  border-radius: 2px !important;
  -moz-border-radius: 2px !important;
  margin-left: 5px !important;
  width: 186px !important;
}

#searchButton {
  background: url(/w/images/b/b8/Leyen_search_button.png) top no-repeat !important;
  border: 0px !important;
  padding: 0px !important;
  width: 81px !important;
  height: 18px !important;
  cursor: pointer !important;
  text-indent: -5000px !important;
  position: relative !important;
  top: 1px !important;
  right: 5px !important;
  float: right !important;
}

#searchButton:hover {
  background-position: bottom !important;
}

#mw-searchButton {
  display: none !important;
}

/* End Leyen override */

/* Begin cancelling out 982px screen discrimination code */
@media screen and (min-width:982px) {
	div#content {
		margin-left: 10em !important;
		padding: 1em 1em 1em 1em !important;
	}
	#p-logo {
		left: 0em !important;
	}
	div#footer {
		margin-left: 10em !important;
		padding: 0.75em !important;
	}
	#mw-panel {
		padding-left: 0em !important;
	}
	#p-search {
		margin-right: 0.5em !important;
	}
	#left-navigation {
		left: 10em !important;
	}
	#p-personal {
		right: 0.75em !important;
	}
	#mw-head-base {
		margin-left: 10em !important;
	}
}
/* End cancelling out 982px screen discrimination code */

/* Undo font-size change made in 1.23 update. See https://www.mediawiki.org/wiki/Typography_refresh */
#bodyContent, .mw-body-content {
  font-size: 0.8em;
}