|
|
| (3 intermediate revisions by the same user not shown) |
| Line 1: |
Line 1: |
| | /* CSS placed here will be applied to all skins */ | | /* CSS placed here will be applied to all skins */ |
| − | /* Default *
| + | #footer-info { display: none; } |
| − | * Resetting the margins and paddings, and defining the font-family
| |
| − | */
| |
| − |
| |
| − | * {
| |
| − | margin: 0;
| |
| − | padding: 0;
| |
| − | }
| |
| − |
| |
| − | body {
| |
| − | font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
| |
| − | font-size: small;
| |
| − | }
| |
| − |
| |
| − | /* Lay-out *
| |
| − | * Set paddings and margins, and clear the floats of the menu items and the sidebar
| |
| − | */
| |
| − |
| |
| − | h1#header { margin-left: 3%; }
| |
| − | div#column-one { padding: 0 3%; }
| |
| − | div#globalWrapper { clear: both; }
| |
| − | div#column-content { margin: 0 3%; }
| |
| − | div#content { padding: 20px; margin-right: 206px; /* 200 + 2*6px padding of div#sidebar + (-6px) margin of div#sidebar*/ }
| |
| − | div#sidebar { width: 212px; margin-right: -6px; /* for the right corner */
| |
| − | float: right; padding-top: 16px; /* so if the first item is selected the corners don't interfere */ }
| |
| − | div#footer { clear: both; padding: 0 3%; }
| |
| − |
| |
| − | /* Header *
| |
| − | * Replace the header with an image
| |
| − | */
| |
| − |
| |
| − | h1#header {
| |
| − | text-indent: -9999px;
| |
| − | background-image: url(http://home.planet.nl/~merri033/header.png);
| |
| − | height: 78px;
| |
| − | width: 505px;
| |
| − | }
| |
| − |
| |
| − | /* Footer *
| |
| − | * Style the footer
| |
| − | */
| |
| − |
| |
| − | #footer div { /* Flot the logos to the right */
| |
| − | float: right;
| |
| − | width: 200px;
| |
| − | text-align: center;
| |
| − | clear: both;
| |
| − | margin: 1em 0;
| |
| − | }
| |
| − |
| |
| − | #footer a img {
| |
| − | border: none;
| |
| − | }
| |
| − |
| |
| − | #footer ul {
| |
| − | list-style: none;
| |
| − | padding: 1em;
| |
| − | margin-right: 200px;
| |
| − | }
| |
| − |
| |
| − | /* Top menu *
| |
| − | * Apply proper paddings and font-styling to the menu
| |
| − | * Float the menu items (h5) and text to the left to make the menu horizontal.
| |
| − | */
| |
| − |
| |
| − | div#column-one {
| |
| − | height: 2em; /* height 1em + 2 * 0.5em padding */
| |
| − | }
| |
| − |
| |
| − | div#column-one div.portlet, div#column-one p {
| |
| − | float: left;
| |
| − | padding: 0.5em;
| |
| − | }
| |
| − |
| |
| − | div#column-one h5, div#column-one p {
| |
| − | font-size: 1em;
| |
| − | line-height: 1em; /* makes the menu 1em high */
| |
| − | font-weight: normal;
| |
| − | }
| |
| − |
| |
| − | div#column-one p {
| |
| − | font-weight: bold;
| |
| − | }
| |
| − |
| |
| − | /*
| |
| − | * Hide and position the submenus
| |
| − | */
| |
| − |
| |
| − | div#column-one div.portlet {
| |
| − | position: relative;
| |
| − | }
| |
| − |
| |
| − | div#column-one div.pBody {
| |
| − | display: none;
| |
| − | position: absolute;
| |
| − | top: 2em; /* the menu is 2em high */
| |
| − | }
| |
| − |
| |
| − | /*
| |
| − | * Style the menu
| |
| − | */
| |
| − |
| |
| − | div#column-one div.pBody {
| |
| − | width: 15em; /* this is the maximum width before the menu items start wrapping */
| |
| − | }
| |
| − |
| |
| − | div#column-one ul {
| |
| − | list-style: none;
| |
| − | float: left; /* by floating the list the menu items the menu gets as wide as the largest item */
| |
| − | border-bottom: 1px solid #bcb699;
| |
| − | border-left: 1px solid #bcb699;
| |
| − | border-right: 1px solid #bcb699;
| |
| − | }
| |
| − |
| |
| − | div#column-one li {
| |
| − | margin: 3px; /* this is so the highlight for the items don't touch the side */
| |
| − | padding: 3px;
| |
| − | }
| |
| − |
| |
| − | /*
| |
| − | * Add the icons
| |
| − | */
| |
| − |
| |
| − | div#column-one div.pBody { /* this is to make the text of the submenu line up with the headers */
| |
| − | margin-left: -28px; /* 3px padding + 3px margin of #column-one li + 16px icon + 6px icon padding */
| |
| − | }
| |
| − |
| |
| − | div#column-one li a { /* make some room for the icons and define background properties */
| |
| − | padding-left: 21px; /* 16px icon + 3px padding and 3px margin from #column-one li */
| |
| − | background-position: left center;
| |
| − | background-repeat: no-repeat;
| |
| − | }
| |
| − |
| |
| − | li#n-Main-page a { background-image: url(http://home.planet.nl/~merri033/house.png); }
| |
| − | li#n-Contents a { background-image: url(http://home.planet.nl/~merri033/book.png); }
| |
| − | li#n-Featured-content a { background-image: url(http://home.planet.nl/~merri033/medal_gold_3.png); }
| |
| − | li#n-currentevents a { background-image: url(http://home.planet.nl/~merri033/time.png); }
| |
| − | li#n-randompage a { background-image: url(http://home.planet.nl/~merri033/arrow_switch.png); }
| |
| − |
| |
| − | li#n-About-Wikipedia a { background-image: url(http://home.planet.nl/~merri033/information.png); }
| |
| − | li#n-portal a { background-image: url(http://home.planet.nl/~merri033/group.png); }
| |
| − | li#n-recentchanges a { background-image: url(http://home.planet.nl/~merri033/page_lightning.png); }
| |
| − | li#n-contact a { background-image: url(http://home.planet.nl/~merri033/email.png); }
| |
| − | li#n-sitesupport a { background-image: url(http://home.planet.nl/~merri033/money.png); }
| |
| − | li#n-help a { background-image: url(http://home.planet.nl/~merri033/help.png); }
| |
| − |
| |
| − | li#t-whatlinkshere a { background-image: url(http://home.planet.nl/~merri033/link_go.png); }
| |
| − | li#t-recentchangeslinked a { background-image: url(http://home.planet.nl/~merri033/hourglass_link.png); }
| |
| − | li#t-contributions a { background-image: url(http://home.planet.nl/~merri033/user_edit.png); }
| |
| − | li#t-log a { background-image: url(http://home.planet.nl/~merri033/user_lightning.png); }
| |
| − | li#t-emailuser a { background-image: url(http://home.planet.nl/~merri033/user_email.png); }
| |
| − | li#t-print a { background-image: url(http://home.planet.nl/~merri033/printer.png); }
| |
| − | li#t-permalink a { background-image: url(http://home.planet.nl/~merri033/page_link.png); }
| |
| − | li#t-cite a { background-image: url(http://home.planet.nl/~merri033/page_green.png); }
| |
| − |
| |
| − | /* Sidebar *
| |
| − | * Styling of the menus
| |
| − | */
| |
| − |
| |
| − | div#sidebar ul {
| |
| − | list-style: none;
| |
| − | }
| |
| − |
| |
| − | #sidebar .portlet {
| |
| − | background-image: url(http://home.planet.nl/~merri033/bg-sidebar-ruler.png);
| |
| − | background-repeat: no-repeat;
| |
| − | background-position: center bottom;
| |
| − | padding-bottom: 10px;
| |
| − | margin-bottom: 8px;
| |
| − | }
| |
| − |
| |
| − | .portlet h5, #p-cactions li, #p-personal li, #p-tb2 li { /* smaller height looks better, but favorites can be multiple lines */
| |
| − | height: 13px;
| |
| − | }
| |
| − |
| |
| − | div#sidebar li, div#sidebar h5 {
| |
| − | padding: 12px 0 18px 36px;
| |
| − | margin: -6px 0 -9px 0;
| |
| − | font-size: 1em;
| |
| − | }
| |
| − |
| |
| − | div#sidebar form {
| |
| − | margin: 0 13px;
| |
| − | text-align: center;
| |
| − | }
| |
| − |
| |
| − | #searchInput {
| |
| − | display: block;
| |
| − | margin: 5px 0;
| |
| − | width: 180px;
| |
| − | }
| |
| − |
| |
| − | div#sidebar input {
| |
| − | border: 1px solid #000;
| |
| − | background-color: #bcb699;
| |
| − | }
| |
| − |
| |
| − | div#sidebar li a img {
| |
| − | border: none;
| |
| − | vertical-align: middle;
| |
| − | }
| |
| − |
| |
| − | div#sidebar li.selected {
| |
| − | background-image: url(http://home.planet.nl/~merri033/bg-sidebar-selected.png);
| |
| − | background-repeat: no-repeat;
| |
| − | }
| |
| − |
| |
| − | div#sidebar li.new a {
| |
| − | color: #775240;
| |
| − | font-style: italic;
| |
| − | }
| |
| − |
| |
| − | div#sidebar li.selected-first { /* The first of two adjacent selected items */
| |
| − | background-image: url(http://home.planet.nl/~merri033/bg-sidebar-selected-first.png);
| |
| − | background-repeat: no-repeat;
| |
| − | }
| |
| − |
| |
| − | div#sidebar li.selected-second { /* The second of two adjacent selected items */
| |
| − | background-image: url(http://home.planet.nl/~merri033/bg-sidebar-selected-second.png);
| |
| − | background-repeat: no-repeat;
| |
| − | }
| |
| − |
| |
| − | /*
| |
| − | * Add the icons
| |
| − | */
| |
| − |
| |
| − | div#sidebar li a {
| |
| − | margin-left: -23px;
| |
| − | padding-left: 23px;
| |
| − | background-position: left center;
| |
| − | background-repeat: no-repeat;
| |
| − | }
| |
| − |
| |
| − | div#sidebar li.selected a {
| |
| − | font-weight: bold;
| |
| − | }
| |
| − |
| |
| − | /*
| |
| − | * 'Views' icons
| |
| − | */
| |
| − |
| |
| − | #ca-nstab-main a { background-image: url(http://home.planet.nl/~merri033/house.png); }
| |
| − | #ca-nstab-user a { background-image: url(http://home.planet.nl/~merri033/user.png); }
| |
| − | #ca-nstab-image a { background-image: url(http://home.planet.nl/~merri033/image.png); }
| |
| − | #ca-nstab-portal a { background-image: url(http://home.planet.nl/~merri033/layout.png); }
| |
| − | #ca-talk a { background-image: url(http://home.planet.nl/~merri033/comments.png); }
| |
| − | #ca-edit a { background-image: url(http://home.planet.nl/~merri033/page_edit.png); }
| |
| − | #ca-addsection a { background-image: url(http://home.planet.nl/~merri033/page_add.png); }
| |
| − | #ca-viewsource a { background-image: url(http://home.planet.nl/~merri033/page_code.png); }
| |
| − | #ca-history a { background-image: url(http://home.planet.nl/~merri033/hourglass.png); }
| |
| − | #ca-move a { background-image: url(http://home.planet.nl/~merri033/page_go.png); }
| |
| − | #ca-watch a { background-image: url(http://home.planet.nl/~merri033/eye.png); }
| |
| − |
| |
| − | /*
| |
| − | * Favorites
| |
| − | */
| |
| − |
| |
| − | #ca-favorites a { background-image: url(http://home.planet.nl/~merri033/star.png); }
| |
| − | li.favorite a { background-image: url(http://home.planet.nl/~merri033/star_silver.png); }
| |
| − | div#sidebar li a.remove-favorite { padding-left: 0; margin-left: 0; background: none; }
| |
| − |
| |
| − | /*
| |
| − | * Toolbox
| |
| − | */
| |
| − |
| |
| − | #t-upload a { background-image: url(http://home.planet.nl/~merri033/image_add.png); }
| |
| − | #t-specialpages a { background-image: url(http://home.planet.nl/~merri033/page_gear.png); }
| |
| − |
| |
| − | /*
| |
| − | * 'Personal menu' icons
| |
| − | */
| |
| − |
| |
| − | #pt-userpage a { background-image: url(http://home.planet.nl/~merri033/user.png); }
| |
| − | #pt-mytalk a { background-image: url(http://home.planet.nl/~merri033/user_comment.png); }
| |
| − | #pt-preferences a { background-image: url(http://home.planet.nl/~merri033/wrench_orange.png); }
| |
| − | #pt-watchlist a { background-image: url(http://home.planet.nl/~merri033/page_find.png); }
| |
| − | #pt-mycontris a { background-image: url(http://home.planet.nl/~merri033/user_edit.png); }
| |
| − | #pt-logout a { background-image: url(http://home.planet.nl/~merri033/door_in.png); }
| |
| − |
| |
| − | /* Autcomplete
| |
| − | * Styles for the autocomplete form
| |
| − | */
| |
| − |
| |
| − | #p-search, #searchform {
| |
| − | overflow:visible !important;
| |
| − | }
| |
| − |
| |
| − | #autocompletebox {
| |
| − | display: block;
| |
| − | position: absolute;
| |
| − | border: solid 1px #000;
| |
| − | background: #bcb699;
| |
| − | overflow: auto;
| |
| − | visibility: hidden;
| |
| − | width: 180px;
| |
| − | opacity: 0.95;
| |
| − | }
| |
| − |
| |
| − | /* Backgrounds and border *
| |
| − | * Here all the background images and colors + borders defined
| |
| − | */
| |
| − |
| |
| − | body {
| |
| − | background-color: #000;
| |
| − | }
| |
| − |
| |
| − | div#column-one { /* The top menu */
| |
| − | background-color: #e9e2be;
| |
| − | background-image: url(http://home.planet.nl/~merri033/bg-menu.png);
| |
| − | background-repeat: repeat-x;
| |
| − | }
| |
| − |
| |
| − | div#column-one ul { /* The top submenu */
| |
| − | background-color: #e9e2be;
| |
| − | opacity: 0.95;
| |
| − | }
| |
| − |
| |
| − | div#globalWrapper { /* Page background gradient */
| |
| − | background-image: url(http://home.planet.nl/~merri033/bg.png);
| |
| − | background-repeat: repeat-x;
| |
| − | }
| |
| − |
| |
| − | div#column-content { /* Faux columns background */
| |
| − | background-image: url(http://home.planet.nl/~merri033/bg-column-content.png);
| |
| − | background-repeat: repeat-y;
| |
| − | background-position: right;
| |
| − | background-color: #fff; /* The background color of the content */
| |
| − | }
| |
| − |
| |
| − | div#sidebar { /* Sidebar corners */
| |
| − | background-image: url(http://home.planet.nl/~merri033/bg-sidebar-top.png);
| |
| − | background-repeat: no-repeat;
| |
| − | margin-right: -6px;
| |
| − | }
| |
| − |
| |
| − | div#content { /* Shadow of the menu */
| |
| − | background-image: url(http://home.planet.nl/~merri033/bg-content.png);
| |
| − | background-repeat: repeat-x;
| |
| − | }
| |
| − |
| |
| − | div#footer {
| |
| − | background-image: url(http://home.planet.nl/~merri033/bg-footer.png);
| |
| − | background-repeat: repeat-x;
| |
| − | background-color: #4d4229;
| |
| − | border-top: 3px solid #bcb699;
| |
| − | }
| |
| − |
| |
| − | /* Links *
| |
| − | * Styles for the links outside the content
| |
| − | */
| |
| − |
| |
| − | div#column-one a, div#sidebar a { /* Links in the top menu and sidebar*/
| |
| − | color: #000;
| |
| − | text-decoration: none;
| |
| − | }
| |
| − |
| |
| − | div#sidebar a:hover { /* Hover over the links in de sidebar */
| |
| − | font-weight: bold;
| |
| − | }
| |
| − |
| |
| − | div#column-one li:hover { /* Hover over a submenu item */
| |
| − | background-color: #bcb699;
| |
| − | }
| |
| − |
| |
| − | #footer, #footer a {
| |
| − | color: #fff;
| |
| − | }
| |
| − |
| |
| − | /* Content
| |
| − | * This is the style of the content, copied from the monobook sking
| |
| − | */
| |
| − |
| |
| − | #content table {
| |
| − | font-size: 100%;
| |
| − | background: White;
| |
| − | }
| |
| − | #content a {
| |
| − | text-decoration: none;
| |
| − | color: #002bb8;
| |
| − | background: none;
| |
| − | }
| |
| − | #content a:visited { color: #5a3696; }
| |
| − | #content a:active { color: Orange; }
| |
| − | #content a:hover { text-decoration: underline; }
| |
| − | #content a.stub { color: #772233; }
| |
| − | a.new,
| |
| − | #content #p-personal a.new { color:#ba0000; }
| |
| − | a.new:visited,
| |
| − | #content #p-personal a.new:visited { color:#a55858; }
| |
| − |
| |
| − | #content img {
| |
| − | border: none;
| |
| − | vertical-align: middle;
| |
| − | }
| |
| − | #content p {
| |
| − | margin: 0.4em 0em 0.5em 0em;
| |
| − | line-height: 1.5em;
| |
| − | }
| |
| − |
| |
| − | #content p img { margin: 0; }
| |
| − |
| |
| − | #content hr {
| |
| − | height: 1px;
| |
| − | color: #aaaaaa;
| |
| − | background-color: #aaaaaa;
| |
| − | border: 0;
| |
| − | margin: 0.2em 0 0.2em 0;
| |
| − | }
| |
| − |
| |
| − | #content h1, #content h2, #content h3, #content h4, #content h5, #content h6 {
| |
| − | color: Black;
| |
| − | background: none;
| |
| − | font-weight: normal;
| |
| − | margin: 0;
| |
| − | padding-top: 0.5em;
| |
| − | padding-bottom: 0.17em;
| |
| − | border-bottom: 1px solid #aaaaaa;
| |
| − | }
| |
| − | #content h1 { font-size: 188%; }
| |
| − | #content h2 { font-size: 150%; }
| |
| − | #content h3, #content h4, #content h5, #content h6 {
| |
| − | border-bottom: none;
| |
| − | font-weight: bold;
| |
| − | }
| |
| − | #content h3 { font-size: 132%; }
| |
| − | #content h4 { font-size: 116%; }
| |
| − | #content h5 { font-size: 100%; }
| |
| − | #content h6 { font-size: 80%; }
| |
| − |
| |
| − | #content ul {
| |
| − | line-height: 1.5em;
| |
| − | list-style-type: square;
| |
| − | margin: 0.3em 0 0 1.5em;
| |
| − | padding:0;
| |
| − | list-style-image: url("bullet.gif");
| |
| − | }
| |
| − | #content ol {
| |
| − | line-height: 1.5em;
| |
| − | margin: 0.3em 0 0 3.2em;
| |
| − | padding:0;
| |
| − | list-style-image: none;
| |
| − | }
| |
| − | #content li { margin-bottom: 0.1em; }
| |
| − | #content dt {
| |
| − | font-weight: bold;
| |
| − | margin-bottom: 0.1em;
| |
| − | }
| |
| − | #content dl{
| |
| − | margin-top: 0.2em;
| |
| − | margin-bottom: 0.5em;
| |
| − | }
| |
| − | #content dd {
| |
| − | line-height: 1.5em;
| |
| − | margin-left: 2em;
| |
| − | margin-bottom: 0.1em;
| |
| − | }
| |
| − |
| |
| − | #content fieldset {
| |
| − | border: 1px solid #2f6fab;
| |
| − | margin: 1em 0em 1em 0em;
| |
| − | padding: 0em 1em 1em 1em;
| |
| − | line-height: 1.5em;
| |
| − | }
| |
| − | #content legend {
| |
| − | background: White;
| |
| − | padding: 0.5em;
| |
| − | font-size: 95%;
| |
| − | }
| |
| − | #content form {
| |
| − | border: none;
| |
| − | margin: 0;
| |
| − | }
| |
| − |
| |
| − | #content textarea {
| |
| − | border: 1px solid #2f6fab;
| |
| − | color: Black;
| |
| − | background-color: white;
| |
| − | width: 100%;
| |
| − | padding: 0.1em;
| |
| − | overflow: auto;
| |
| − | }
| |
| − | /* hide this from ie/mac and konq2.2 */
| |
| − | @media All {
| |
| − | #content head:first-child+body input {
| |
| − | visibility: visible;
| |
| − | border: 1px solid #2f6fab;
| |
| − | color: Black;
| |
| − | background-color: white;
| |
| − | vertical-align: middle;
| |
| − | padding: 0.2em;
| |
| − | }
| |
| − | }
| |
| − | #content input.historysubmit {
| |
| − | padding: 0 0.3em 0.3em 0.3em !important;
| |
| − | font-size: 94%;
| |
| − | cursor: pointer;
| |
| − | height: 1.7em !important;
| |
| − | margin-left: 1.6em;
| |
| − | }
| |
| − | #content input[type="radio"],
| |
| − | #content input[type="checkbox"] { border:none; }
| |
| − | #content select {
| |
| − | border: 1px solid #2f6fab;
| |
| − | color: Black;
| |
| − | vertical-align: top;
| |
| − | }
| |
| − | #content abbr, #content acronym, #content .explain {
| |
| − | border-bottom: 1px dotted Black;
| |
| − | color: Black;
| |
| − | background: none;
| |
| − | cursor: help;
| |
| − | }
| |
| − | #content q {
| |
| − | font-family: Times, "Times New Roman", serif;
| |
| − | font-style: italic;
| |
| − | }
| |
| − | #content code { background-color: #f9f9f9; }
| |
| − | #content pre {
| |
| − | padding: 1em;
| |
| − | border: 1px dashed #2f6fab;
| |
| − | color: Black;
| |
| − | background-color: #f9f9f9;
| |
| − | line-height: 1.1em;
| |
| − | } | |
