User:Marcin/vector.css

From SQLZOO
< User:Marcin
Revision as of 01:42, 6 July 2012 by Marcin (talk | contribs) (Created page with "/* SQL ZOO COLOR PALETTE: http://sqlzoo.net/w/index.php/User:09011004/vector.css #dae5d9 - light green (bg color) [ alt: #d2e5d1 ] #161525 - dark blue #3b434e ...")
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to navigation Jump to search

Note: After saving, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Internet Explorer: Hold Ctrl while clicking Refresh, or press Ctrl-F5
  • Opera: Go to Menu → Settings (Opera → Preferences on a Mac) and then to Privacy & security → Clear browsing data → Cached images and files.
/* SQL ZOO COLOR PALETTE:
 http://sqlzoo.net/w/index.php/User:09011004/vector.css
     #dae5d9 - light green (bg color) [ alt: #d2e5d1 ]
     #161525 - dark blue
     #3b434e - light blue
     #ee8301 - orange [ darker alt: #ff530d ]
     #e3e3e3 - near white
     #4a787d - bright blue (links) [ alt: #668195 ]
 
*/
 
/* GLOBAL SETTINGS: */
 
/* remove the Wiki markup */
#p-logo, #left-navigation, #p-cactions, #p-search, #p-tb, #pt-mytalk, #pt-watchlist, #pt-mycontris, #footer, .editsection {
    display:none;
}
body, body #content,
#mw-page-base {
    background:#d2e5d1;
    font-family: Helvetica, Arial, Sans-Serif;
    color:#161525;
}
a:link {
    color:#4a787d;
    text-decoration:none;
}
a:visited {color:#668195;}
a:hover {color:#ee8301;}
a:active {color:#e3e3e3;}
 
@font-face {
font-family: 'ChineseRocksRgRegular';
    src: url('http://socweb8.napier.ac.uk/~09011004/zoo_tutorials/chinese_rocks_rg-webfont.eot');
    src: url('http://socweb8.napier.ac.uk/~09011004/zoo_tutorials/chinese_rocks_rg-webfont.eot?#iefix') format('embedded-opentype'),
         url('http://socweb8.napier.ac.uk/~09011004/zoo_tutorials/chinese_rocks_rg-webfont.woff') format('woff'),
         url('http://socweb8.napier.ac.uk/~09011004/zoo_tutorials/chinese_rocks_rg-webfont.ttf') format('truetype'),
         url('http://socweb8.napier.ac.uk/~09011004/zoo_tutorials/chinese_rocks_rg-webfont.svg#ChineseRocksRgRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'SquareBlockRegular';
    src: url('http://socweb8.napier.ac.uk/~09011004/zoo_tutorials/square_block-webfont.eot');
    src: url('http://socweb8.napier.ac.uk/~09011004/zoo_tutorials/square_block-webfont.eot?#iefix') format('embedded-opentype'),
         url('http://socweb8.napier.ac.uk/~09011004/zoo_tutorials/square_block-webfont.woff') format('woff'),
         url('http://socweb8.napier.ac.uk/~09011004/zoo_tutorials/square_block-webfont.ttf') format('truetype'),
         url('http://socweb8.napier.ac.uk/~09011004/zoo_tutorials/square_block-webfont.svg#SquareBlockRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}
 
/* ADMIN WIKI LINKS: */
 
/* reposition temporary admin links */
#mw-head {
    position:absolute;
}
 
/* HEADER: */
 
#mw-page-base {
    background: #c9dbca; /* Old browsers */
    background: -moz-linear-gradient(top,  #c9dbca 0%, #d2e5d1 23%, #dae5d9 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#c9dbca), color-stop(23%,#d2e5d1), color-stop(100%,#dae5d9)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #c9dbca 0%,#d2e5d1 23%,#dae5d9 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #c9dbca 0%,#d2e5d1 23%,#dae5d9 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #c9dbca 0%,#d2e5d1 23%,#dae5d9 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #c9dbca 0%,#d2e5d1 23%,#dae5d9 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c9dbca', endColorstr='#dae5d9',GradientType=0 ); /* IE6-9 */
    height:149px; /* needs to be in pixels - same height as the logo image */
}
#mp-logo {
    position:absolute; left:1em; top:0.2em;
}
#logo-desc {
    font-family: 'ChineseRocksRgRegular';
    font-size: 34px;
    color:#161525;
    margin-top:-0.4em;
    margin-bottom:-0.4em
}
#logo-desc span {
    color:#ee8301;
}
 
/* MAIN MENU */
 
#main_menu {
   position: absolute; top:200px; left:1px;
   margin:0 0 0 1em;
   padding:0.5em 1em 0.5em 1em;
   line-height: 100%;
   -webkit-border-radius: 20px;
   border-radius: 20px;
   background: #363d49; /* Old browsers */
   background: -moz-linear-gradient(top,  #363d49 0%, #363d49 18%, #161525 69%, #161525 100%); /* FF3.6+ */
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#363d49), color-stop(18%,#363d49), color-stop(69%,#161525), color-stop(100%,#161525)); /* Chrome,Safari4+ */
   background: -webkit-linear-gradient(top,  #363d49 0%,#363d49 18%,#161525 69%,#161525 100%); /* Chrome10+,Safari5.1+ */
   background: -o-linear-gradient(top,  #363d49 0%,#363d49 18%,#161525 69%,#161525 100%); /* Opera 11.10+ */
   background: -ms-linear-gradient(top,  #363d49 0%,#363d49 18%,#161525 69%,#161525 100%); /* IE10+ */
   background: linear-gradient(to bottom,  #363d49 0%,#363d49 18%,#161525 69%,#161525 100%); /* W3C */
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#363d49', endColorstr='#161525',GradientType=0 ); /* IE6-9 */
   color:#e3e3e3;
}
#main_menu li {
	z-index:+2; /* stays on the top of tables */
	margin:0 2em 0 0.5em;
	padding: 0px;
	float: left;
	position: relative;
	list-style: none;
}
/* main level link */
#main_menu a {
	font-weight: bold;
	color: #E8FFFF;
	text-decoration: none;
	display: block;
	padding:  8px 20px;
	margin: 0;
	-webkit-border-radius: 1.6em;
	-moz-border-radius: 1.6em;
	text-shadow: 0 1px 1px rgba(0, 0, 0, .3);
}
/* main level link hover */
#main_menu .current a, #main_menu li:hover > a {
	background: #B2C4BB; /* for non-css3 browsers */
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#DDDEDB', endColorstr='#536D7D'); /* for IE */
	background: -webkit-gradient(linear, left top, left bottom, from(#DDDEDB), to(#536D7D)); /* for webkit browsers */
	background: -moz-linear-gradient(top,  #DDDEDB,  #536D7D); /* for firefox 3.6+ */
 
	color: #1F3348;
	border-top: solid 1px #E4EFF2;
 
	-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .2);
	-moz-box-shadow: 0 1px 1px rgba(0, 0, 0, .2);
	box-shadow: 0 1px 1px rgba(0, 0, 0, .2);
 
	text-shadow: 0 1px 0 #DDE8EB;
}
/* sub levels link hover */
#main_menu ul li:hover a, #main_menu li:hover li a {
	background: none;
	border: none;
	color: #575F65;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
}
#main_menu ul a:hover {
	background: #576B85 !important; /* for non-css3 browsers */
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#E08808', endColorstr='#E08808'); /* for IE */
	background: -webkit-gradient(linear, left top, left bottom, from(#698EC1), to(#5B7BA7)) !important; /* for webkit browsers */
	background: -moz-linear-gradient(top,  #E08808,  #E08808) !important; /* for firefox 3.6+ */
	color: #FFF !important;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	text-shadow: 0 1px 1px rgba(0, 0, 0, .1);
}
/* level 2 list */
#main_menu ul {
	background: #ddd; /* for non-css3 browsers */
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#EBECEF'); /* for IE */
	background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#D4DDD8)); /* for webkit browsers */
	background: -moz-linear-gradient(top,  #fff,  #EBECEF); /* for firefox 3.6+ */
	display: none;
	margin: 0;
	padding: 0;
	width: 185px;
	position: absolute;
	top: 35px;
	left: 0;
	border: solid 1px #b4b4b4;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
	-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
	box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
}
/* dropdown */
#main_menu li:hover > ul {
	display: block;
}
#main_menu ul li {
	float: none;
	margin: 0;
	padding: 0;
}
#main_menu ul a {
	font-weight: normal;
	text-shadow: 0 1px 1px rgba(255, 255, 255, .9);
}
/* level 3+ list */
#main_menu ul ul {
	left: 181px;
	top: -3px;
}
/* rounded corners for first and last child */
#main_menu ul li:first-child > a {
	-webkit-border-top-left-radius: 9px;
	-moz-border-radius-topleft: 9px;
	-webkit-border-top-right-radius: 9px;
	-moz-border-radius-topright: 9px;
}
#main_menu ul li:last-child > a {
	-webkit-border-bottom-left-radius: 9px;
	-moz-border-radius-bottomleft: 9px;
	-webkit-border-bottom-right-radius: 9px;
	-moz-border-radius-bottomright: 9px;
}
/* clearfix */
#main_menu:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}
#main_menu {
	display: inline-block;
}
html[xmlns] #main_menu {
	display: block;
}
* html #main_menu {
	height: 1%;
}
 
 
/* SIDE MENU: */
 
#mw-panel {
    margin-top:63px; /* Needs to be in pixels to match the mw-page-base height */
}
#mw-panel #p-Reference h5,
body #mw-panel div.portal h5 {
    font-size: 1.8em;
    font-family: 'SquareBlockRegular';
    font-weight:500;
    margin:0; padding: 0 0 0 0.65em;
    color:#161525;
}
#mw-panel .portal .body ul li {
    text-align:right;
}
#engine {
    background:#161525;
    color:#e3e3e3;
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    border-radius: 20px;
    width: 9em; height: 2.4em;
 }
/* CONTENT: */
 
#firstHeading {
    font-size: 1.7em;
    font-family: 'SquareBlockRegular';
    font-weight:500;
    color:#3b434e;
}
/* First paragraph only */
.mw-content-ltr > p:first-child {
    font-family: 'ChineseRocksRgRegular';
    font-size: 1.8em;
}
div.tutblock, 
div.refblock {
    border:none;
}