Open main menu

Difference between revisions of "MediaWiki:Vector.css"

 
(3 intermediate revisions by the same user not shown)
Line 4: Line 4:
 
   background: #fff;
 
   background: #fff;
 
}
 
}
 +
  
 
#mw-page-base {
 
#mw-page-base {
 +
  background: #f3da71; /* Yellow under the header */
 +
}
 +
 +
#p-logo {
 
   background: #f3da71;
 
   background: #f3da71;
 +
  border-bottom: 1px solid #d4ba49;
 
}
 
}
 
  
 
#mw-head a,
 
#mw-head a,
Line 33: Line 38:
 
}
 
}
  
.vectorTabs,
+
/* Borders and backgrounds for header tabs */
.vectorTabs ul,
+
#mw-head .vectorMenu h3,
.vectorTabs ul li,
+
#mw-head .vectorTabs,
.vectorTabs span {
+
#mw-head .vectorTabs ul,
 +
#mw-head .vectorTabs ul li,
 +
#mw-head .vectorTabs span {
 
   background: none;
 
   background: none;
 
}
 
}
.vectorTabs li.selected {
+
#mw-head .vectorTabs li.selected {
   background: rgba(255,255,255,0.5);
+
   background: rgba(255,255,255, 0.3);
 +
  background: linear-gradient(0deg,
 +
    rgba(106,73,29,1) 5%,
 +
    rgba(255,255,255,0.3) 5%,
 +
    rgba(255,255,255,0.3) 70%,
 +
    rgba(255,255,255,0) 71%
 +
  );
 +
}
 +
#mw-head .vectorTabs li.selected a {
 +
  color: #000;
 
}
 
}
  
/* Star icon SVG URL-encoded */
+
/* Watch button's star icon SVG URL-encoded as a background image: */
 
 
/* Un-encoded SVG just for the record:
 
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24"><path d="M0 0h24v24H0z" fill="none"/><path fill="currentColor" d="M12 17.27L18.18 21l-1.64-7.03L22 9.24l-7.19-.61L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21z"/><path d="M0 0h24v24H0z" fill="none"/></svg>
 
*/
 
 
.vectorTabs #ca-unwatch.icon a {
 
.vectorTabs #ca-unwatch.icon a {
 
   margin-top: 2px;
 
   margin-top: 2px;
 
   background-image: linear-gradient(transparent,transparent), url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M0%200h24v24H0z%22%20fill%3D%22none%22%2F%3E%3Cpath%20fill%3D%22%236a491d%22%20d%3D%22M12%2017.27L18.18%2021l-1.64-7.03L22%209.24l-7.19-.61L12%202%209.19%208.63%202%209.24l5.46%204.73L5.82%2021z%22%2F%3E%3Cpath%20d%3D%22M0%200h24v24H0z%22%20fill%3D%22none%22%2F%3E%3C%2Fsvg%3E%0A");
 
   background-image: linear-gradient(transparent,transparent), url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M0%200h24v24H0z%22%20fill%3D%22none%22%2F%3E%3Cpath%20fill%3D%22%236a491d%22%20d%3D%22M12%2017.27L18.18%2021l-1.64-7.03L22%209.24l-7.19-.61L12%202%209.19%208.63%202%209.24l5.46%204.73L5.82%2021z%22%2F%3E%3Cpath%20d%3D%22M0%200h24v24H0z%22%20fill%3D%22none%22%2F%3E%3C%2Fsvg%3E%0A");
 
}
 
}
 
 
.vectorTabs #ca-unwatch.icon a:hover,
 
.vectorTabs #ca-unwatch.icon a:hover,
 
.vectorTabs #ca-unwatch.icon a:focus {
 
.vectorTabs #ca-unwatch.icon a:focus {
 
   background-image: linear-gradient(transparent,transparent), url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M0%200h24v24H0z%22%20fill%3D%22none%22%2F%3E%3Cpath%20fill%3D%22white%22%20d%3D%22M12%2017.27L18.18%2021l-1.64-7.03L22%209.24l-7.19-.61L12%202%209.19%208.63%202%209.24l5.46%204.73L5.82%2021z%22%2F%3E%3Cpath%20d%3D%22M0%200h24v24H0z%22%20fill%3D%22none%22%2F%3E%3C%2Fsvg%3E%0A");
 
   background-image: linear-gradient(transparent,transparent), url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M0%200h24v24H0z%22%20fill%3D%22none%22%2F%3E%3Cpath%20fill%3D%22white%22%20d%3D%22M12%2017.27L18.18%2021l-1.64-7.03L22%209.24l-7.19-.61L12%202%209.19%208.63%202%209.24l5.46%204.73L5.82%2021z%22%2F%3E%3Cpath%20d%3D%22M0%200h24v24H0z%22%20fill%3D%22none%22%2F%3E%3C%2Fsvg%3E%0A");
 +
}
 +
/* Un-encoded SVG just for the record – to adjust color, just find "6a491d" HEX color on base version or "white" on hover version.
 +
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24"><path d="M0 0h24v24H0z" fill="none"/><path fill="#6a491d" d="M12 17.27L18.18 21l-1.64-7.03L22 9.24l-7.19-.61L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21z"/><path d="M0 0h24v24H0z" fill="none"/></svg>
 +
*/
 +
 +
 +
 +
/**
 +
* Styles for http://hitchwiki.org/en/MediaWiki:Sitenotice to take all white space above the header.
 +
*
 +
* More styles for this banner at https://hitchwiki.org/en/MediaWiki:Common.css
 +
*/
 +
#siteNotice {
 +
  margin: -1em -1em 10px -1em;
 +
}
 +
@media screen and (min-width: 982px) {
 +
  #siteNotice {
 +
    margin: -1.25em -1.5em 1.5em -1.5em
 +
  }
 
}
 
}

Latest revision as of 00:01, 29 September 2019

/* CSS placed here will affect users of the Vector skin */

body {
  background: #fff;
}


#mw-page-base {
  background: #f3da71; /* Yellow under the header */
}

#p-logo {
  background: #f3da71;
  border-bottom: 1px solid #d4ba49;
}

#mw-head a,
#mw-head a:visited {
  color: #6a491d;
}

.mw-body {
  border-color: #a2a9b1;
}

#mw-panel .portal .body li a,
#mw-panel .portal .body li a:visited {
  color: #2b829b;
}


#mw-panel .portal .body {
  font-size: 18px;
}

#mw-panel.collapsible-nav .portal .body {
  margin-left: 0.9em;
}

/* Borders and backgrounds for header tabs */
#mw-head .vectorMenu h3,
#mw-head .vectorTabs,
#mw-head .vectorTabs ul,
#mw-head .vectorTabs ul li,
#mw-head .vectorTabs span {
  background: none;
}
#mw-head .vectorTabs li.selected {
  background: rgba(255,255,255, 0.3);
  background: linear-gradient(0deg,
    rgba(106,73,29,1) 5%,
    rgba(255,255,255,0.3) 5%,
    rgba(255,255,255,0.3) 70%,
    rgba(255,255,255,0) 71%
  );
}
#mw-head .vectorTabs li.selected a {
  color: #000;
}

/* Watch button's star icon SVG URL-encoded as a background image: */
.vectorTabs #ca-unwatch.icon a {
  margin-top: 2px;
  background-image: linear-gradient(transparent,transparent), url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M0%200h24v24H0z%22%20fill%3D%22none%22%2F%3E%3Cpath%20fill%3D%22%236a491d%22%20d%3D%22M12%2017.27L18.18%2021l-1.64-7.03L22%209.24l-7.19-.61L12%202%209.19%208.63%202%209.24l5.46%204.73L5.82%2021z%22%2F%3E%3Cpath%20d%3D%22M0%200h24v24H0z%22%20fill%3D%22none%22%2F%3E%3C%2Fsvg%3E%0A");
}
.vectorTabs #ca-unwatch.icon a:hover,
.vectorTabs #ca-unwatch.icon a:focus {
  background-image: linear-gradient(transparent,transparent), url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M0%200h24v24H0z%22%20fill%3D%22none%22%2F%3E%3Cpath%20fill%3D%22white%22%20d%3D%22M12%2017.27L18.18%2021l-1.64-7.03L22%209.24l-7.19-.61L12%202%209.19%208.63%202%209.24l5.46%204.73L5.82%2021z%22%2F%3E%3Cpath%20d%3D%22M0%200h24v24H0z%22%20fill%3D%22none%22%2F%3E%3C%2Fsvg%3E%0A");
}
/* Un-encoded SVG just for the record – to adjust color, just find "6a491d" HEX color on base version or "white" on hover version.
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24"><path d="M0 0h24v24H0z" fill="none"/><path fill="#6a491d" d="M12 17.27L18.18 21l-1.64-7.03L22 9.24l-7.19-.61L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21z"/><path d="M0 0h24v24H0z" fill="none"/></svg>
*/



/**
 * Styles for http://hitchwiki.org/en/MediaWiki:Sitenotice to take all white space above the header.
 *
 * More styles for this banner at https://hitchwiki.org/en/MediaWiki:Common.css
 */
#siteNotice {
  margin: -1em -1em 10px -1em;
}
@media screen and (min-width: 982px) {
  #siteNotice {
    margin: -1.25em -1.5em 1.5em -1.5em
  }
}