Difference between revisions of "MediaWiki:Common.css"
From CrowdSociety
Wikidoctor (Talk | contribs) |
|||
(409 intermediate revisions by 4 users not shown) | |||
Line 1: | Line 1: | ||
− | /* To change the | + | /*-----------------------------------------------------------------------------*/ |
− | + | /* To change the BACKGROUND COLOR of the globalWrapper */ | |
− | + | /*-----------------------------------------------------------------------------*/ | |
− | |||
− | |||
− | |||
+ | #globalWrapper { | ||
+ | Background-color: #F5F5F5; | ||
+ | Background-image:none; | ||
+ | width: 100%; | ||
+ | margin: 0; padding: 0; | ||
+ | overflow: auto; | ||
+ | } | ||
+ | |||
+ | div#content { | ||
+ | background-color: #F5F5F5; | ||
+ | width:55%; | ||
+ | top: 25px; | ||
+ | overflow: auto; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | /*-----------------------------------------------------------------------------*/ | ||
+ | /* user's personal TOP menue */ | ||
+ | /*-----------------------------------------------------------------------------*/ | ||
+ | |||
+ | |||
+ | div#p-personal { | ||
+ | } | ||
+ | |||
+ | #p-personal .pBody { | ||
+ | background: #F5F5F5; | ||
+ | float: right; | ||
+ | } | ||
+ | |||
+ | #p-personal li a, #p-personal li a.new { | ||
+ | color: #5b5b5b; | ||
+ | text-decoration: none; | ||
+ | } | ||
+ | |||
+ | #p-personal li a:hover { | ||
+ | color: #000000; | ||
+ | background-color: transparent; | ||
+ | text-decoration: line-through; | ||
+ | } | ||
+ | |||
+ | |||
+ | /*-----------------------------------------------------------------------------*/ | ||
+ | /* TOP Menue (second line) edits */ | ||
+ | /*-----------------------------------------------------------------------------*/ | ||
+ | |||
+ | |||
+ | div#p-cactions { | ||
+ | background-color: #F5F5F5; | ||
+ | } | ||
+ | |||
+ | #p-cactions li { | ||
+ | text-indent: 20; /*spacing between words in the top bar */ | ||
+ | border-width: 0px; | ||
+ | background-color: #F5F5F5; | ||
+ | float:left; | ||
+ | margin: 8px; | ||
+ | } | ||
+ | |||
+ | #p-cactions li a { | ||
+ | display:block; | ||
+ | color:#000000; | ||
+ | font-weight: regular; | ||
+ | text-decoration:none; | ||
+ | background-color: #F5F5F5; | ||
+ | } | ||
+ | |||
+ | #p-cactions li a:hover { | ||
+ | color: #000000; | ||
+ | text-decoration: line-through; | ||
+ | background-color: #F5F5F5; | ||
+ | } | ||
+ | |||
+ | #p-cactions li.selected a { | ||
+ | border:none; | ||
+ | background-color: #F5F5F5; | ||
+ | } | ||
+ | |||
+ | #p-cactions li.selected a:hover { | ||
+ | color: #000000; | ||
+ | text-decoration: line-through; | ||
+ | background-color: #F5F5F5; | ||
+ | } | ||
+ | |||
+ | |||
+ | /*-----------------------------------------------------------------------------*/ | ||
+ | /* Table of Content TOC */ | ||
+ | /*-----------------------------------------------------------------------------*/ | ||
+ | |||
+ | |||
+ | |||
+ | #toc { | ||
+ | font-size: 1.1em; | ||
+ | margin: 0 0 1em 1em; | ||
+ | float: right; | ||
+ | border: solid 1px #00000; | ||
+ | text-color: #282828; | ||
+ | background-color: #F5F5F5; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | /* Allow limiting of which header levels are shown in a TOC; | ||
+ | <div class="toclimit-3">, for instance, will limit to | ||
+ | showing ==headings== and ===headings=== but no further | ||
+ | (as long as there are no =headings= on the page, which | ||
+ | there shouldn't be according to the MoS). */ | ||
+ | |||
+ | .toclimit-2 .toclevel-1 ul, | ||
+ | .toclimit-3 .toclevel-2 ul, | ||
+ | .toclimit-4 .toclevel-3 ul, | ||
+ | .toclimit-5 .toclevel-4 ul, | ||
+ | .toclimit-6 .toclevel-5 ul, | ||
+ | .toclimit-7 .toclevel-6 ul { | ||
+ | display: none; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | /*-----------------------------------------------------------------------------*/ | ||
+ | /* LOGO position */ | ||
+ | /*-----------------------------------------------------------------------------*/ | ||
+ | |||
+ | |||
+ | #p-logo, #p-logo a, #p-logo a:hover { | ||
+ | width:192px; | ||
+ | height: 150px; | ||
+ | margin-left: 0px; | ||
+ | margin-top: 10px; | ||
+ | margin-bottom: 30px; | ||
+ | z-index: 999; | ||
+ | |||
+ | } | ||
+ | |||
+ | |||
+ | /*-----------------------------------------------------------------------------*/ | ||
+ | /* Dynamik Image resizing (Images have to be in div-tags like that - <div>[[Image:MyImage.png]]</div> - */ | ||
+ | /*-----------------------------------------------------------------------------*/ | ||
+ | |||
+ | img { max-width: 100%; height: auto; width: auto\9; /* ie8 */ } | ||
+ | |||
+ | /*-----------------------------------------------------------------------------*/ | ||
+ | /* Sidebar Modifications */ | ||
+ | /*-----------------------------------------------------------------------------*/ | ||
+ | |||
+ | |||
+ | .portlet .pBody { | ||
+ | background-color:#F5F5F5; | ||
+ | z-index: 99; | ||
+ | } | ||
+ | |||
+ | /* increase sidebar width */ | ||
+ | |||
+ | #column-content { | ||
+ | margin-left: -16em; | ||
+ | } | ||
+ | |||
+ | #column-content #content { | ||
+ | margin-left: 16em; | ||
+ | } | ||
+ | |||
+ | #p-logo a, #p-logo a:hover { | ||
+ | width: 16em; | ||
+ | } | ||
+ | |||
+ | #p-cactions { | ||
+ | left: 14.5em; | ||
+ | } | ||
+ | |||
+ | .portlet { | ||
+ | width: 14em; | ||
+ | |||
+ | } | ||
+ | |||
+ | div#column-content { | ||
+ | margin-left: -14em; | ||
+ | } | ||
+ | |||
+ | div#content { | ||
+ | margin-left: 14em; | ||
+ | } | ||
+ | |||
+ | |||
+ | /*-----------------------------------------------------------------------------*/ | ||
+ | /* changes the background of pre areas */ | ||
+ | /*-----------------------------------------------------------------------------*/ | ||
+ | |||
+ | pre { background-color: #F5F5F5} | ||
+ | |||
+ | |||
+ | /*-----------------------------------------------------------------------------*/ | ||
+ | /* Tabellenhintergründe transparent machen */ | ||
+ | /*-----------------------------------------------------------------------------*/ | ||
+ | |||
+ | |||
+ | table.diff { | ||
+ | background-color: transparent; | ||
+ | } | ||
+ | |||
+ | |||
+ | /*-----------------------------------------------------------------------------*/ | ||
/* To change the size of the whitespace abouve an article's title (between top menue and the article's title */ | /* To change the size of the whitespace abouve an article's title (between top menue and the article's title */ | ||
+ | /*-----------------------------------------------------------------------------*/ | ||
+ | |||
+ | |||
#siteNotice { | #siteNotice { | ||
− | margin-top: | + | margin-top: 100px; |
− | margin-bottom: 0em;} | + | margin-bottom: 0em; |
+ | } | ||
+ | |||
+ | /*-----------------------------------------------------------------------------*/ | ||
/* Erase borders */ | /* Erase borders */ | ||
+ | /*-----------------------------------------------------------------------------*/ | ||
+ | |||
+ | |||
#content { border-width: 0px; } | #content { border-width: 0px; } | ||
.portlet .pBody { border-width: 0px; } | .portlet .pBody { border-width: 0px; } | ||
− | #footer { border-top: 0px; border-bottom-width: 0px; } | + | #footer {width: 100%; border-top: 0px; border-bottom-width: 0px; Background-color: #F5F5F5;} |
+ | |||
+ | /*-----------------------------------------------------------------------------*/ | ||
/* CHANGES OF LINKS COLORS */ | /* CHANGES OF LINKS COLORS */ | ||
− | + | /*-----------------------------------------------------------------------------*/ | |
− | + | ||
− | + | ||
− | |||
− | |||
+ | a:link { | ||
+ | color: #2e7cff; | ||
+ | text-decoration: none; | ||
+ | } | ||
+ | |||
+ | a:hover { | ||
+ | color: #97d2ff; | ||
+ | text-decoration: line-through; | ||
+ | } | ||
+ | |||
+ | a:visited { | ||
+ | color: #26baaf; | ||
+ | text-decoration: line-through; | ||
+ | } | ||
+ | |||
+ | a:active { | ||
+ | color: #000000; | ||
+ | text-decoration: line-through; | ||
+ | } | ||
+ | |||
+ | a.new:link { | ||
+ | color: #ff77aa; | ||
+ | text-decoration: none; | ||
+ | } | ||
+ | |||
+ | a.new:hover { | ||
+ | color: #FF6E9E; | ||
+ | text-decoration: line-through; | ||
+ | } | ||
+ | |||
+ | |||
+ | a.external { color: #2e7cff !important; } /* external link */ | ||
+ | a.external:hover { color: #97d2ff; text-decoration: line-through; } | ||
+ | a.external:visited { color: #26baaf; text-decoration: line-through; } | ||
+ | |||
+ | |||
+ | /*-----------------------------------------------------------------------------*/ | ||
/* Headlines and Body - Styling */ | /* Headlines and Body - Styling */ | ||
+ | /*-----------------------------------------------------------------------------*/ | ||
− | |||
− | |||
− | + | html,body,p,td,a,li { | |
− | + | font: 0.9em Times, "Times New Roman", "Palatino", "Georgia", serif; | |
− | + | background-color: #F5F5F5; | |
+ | } | ||
− | |||
− | |||
− | |||
− | + | /*inserst and edit "0px line #000000; line-height: 1.1em" after "border-bottom:" to see a line, and I erased "margin: 3em 0 0.25em 0;" after "uppercase" */ | |
− | + | h1 { | |
− | + | font: bold 1.8em Helvetica, Arial, Roboto, "DejaVu Sans", sans-serif; | |
+ | color: #000000; | ||
+ | letter-spacing: 0.12em; | ||
+ | text-transform: uppercase; | ||
+ | border-bottom: none; | ||
+ | padding-bottom: 2em; | ||
+ | } | ||
− | |||
− | /* | + | /* inserst and edit "0px line #000000; line-height: 1.1em" after "border-bottom:" to see a line */ |
− | + | h2 { | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | font: 1.3em Helvetica, Arial, Roboto, "DejaVu Sans",sans-serif; | |
+ | color: #000000; letter-spacing: 0.1em; | ||
+ | text-transform: uppercase; | ||
+ | text-decoration: underline; | ||
+ | margin: 2em 0 0 0; | ||
+ | border-bottom: none; | ||
+ | padding-bottom: 2em; | ||
+ | } | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | + | h3 { | |
− | + | font: 1.1em Helvetica, Arial, Roboto, "DejaVu Sans",sans-serif; | |
− | + | color: #000000; letter-spacing: 0.06em; | |
− | + | text-transform: uppercase; | |
− | + | padding-top: 0.7em; | |
− | + | padding-bottom: 0.2em; | |
− | + | } | |
− | + | ||
+ | |||
+ | h4 { | ||
+ | |||
+ | font: 0.92em Helvetica, Arial, Roboto, "DejaVu Sans",sans-serif; | ||
+ | color: #000000; | ||
+ | letter-spacing: 0.06em; | ||
+ | text-transform: uppercase; | ||
+ | padding-top: 0.5em; | ||
+ | padding-bottom: 0.2em; | ||
+ | } | ||
+ | |||
+ | |||
+ | h5 { | ||
+ | |||
+ | font: 0.91em Helvetica, Arial, Roboto, "DejaVu Sans",sans-serif; | ||
+ | color: #000000; | ||
+ | letter-spacing: 0.06em; | ||
+ | text-transform: uppercase; | ||
+ | padding-top: 0.3em; | ||
+ | padding-bottom: 0.1em; | ||
+ | } | ||
+ | |||
+ | |||
+ | h6 { | ||
+ | |||
+ | font: 0.91em Helvetica, Arial, Roboto, "DejaVu Sans",sans-serif; | ||
+ | color: #000000; | ||
+ | letter-spacing: 0.06em; | ||
+ | text-transform: uppercase; | ||
+ | padding-top: 0.1em; | ||
+ | padding-bottom: 0.05em; | ||
+ | } | ||
+ | |||
+ | |||
+ | /*-----------------------------------------------------------------------------*/ | ||
+ | /* FOOTER */ | ||
+ | /*-----------------------------------------------------------------------------*/ | ||
+ | |||
+ | |||
+ | #f-poweredbyico { display: none; } /* Erases the mediawiki logo */ | ||
+ | #f-copyrightico { display: none; } | ||
+ | |||
+ | |||
+ | /* reduce footer */ | ||
+ | |||
+ | #footer { | ||
+ | color: #000000; | ||
+ | font-size: 85%; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
+ | /*-----------------------------------------------------------------------------*/ | ||
/* Additional things */ | /* Additional things */ | ||
+ | /*-----------------------------------------------------------------------------*/ | ||
+ | |||
+ | |||
+ | /* Remove the annoying arrow that occurs after external links */ | ||
+ | #bodyContent a[href ^="http://"] { | ||
+ | background:inherit !important; padding-right:inherit !important | ||
+ | background-color: #F5F5F5; | ||
+ | } | ||
+ | |||
− | |||
− | |||
− | |||
li#pt-userpage | li#pt-userpage | ||
{ background: none; } /* no login logo at the user-login button */ | { background: none; } /* no login logo at the user-login button */ | ||
− | |||
− | + | /*-----------------------------------------------------------------------------*/ | |
− | + | /*Change the color of the user message notice box */ | |
− | + | /*-----------------------------------------------------------------------------*/ | |
+ | |||
+ | |||
+ | .usermessage { | ||
+ | background-color: none; | ||
+ | border-color: #000000; | ||
+ | color: black; | ||
+ | margin: 2em 0em 1em 0em; | ||
+ | padding: 0.5em 1em; | ||
+ | vertical-align: middle; | ||
+ | text-align: center; | ||
+ | } |
Latest revision as of 12:42, 21 May 2015
/*-----------------------------------------------------------------------------*/ /* To change the BACKGROUND COLOR of the globalWrapper */ /*-----------------------------------------------------------------------------*/ #globalWrapper { Background-color: #F5F5F5; Background-image:none; width: 100%; margin: 0; padding: 0; overflow: auto; } div#content { background-color: #F5F5F5; width:55%; top: 25px; overflow: auto; } /*-----------------------------------------------------------------------------*/ /* user's personal TOP menue */ /*-----------------------------------------------------------------------------*/ div#p-personal { } #p-personal .pBody { background: #F5F5F5; float: right; } #p-personal li a, #p-personal li a.new { color: #5b5b5b; text-decoration: none; } #p-personal li a:hover { color: #000000; background-color: transparent; text-decoration: line-through; } /*-----------------------------------------------------------------------------*/ /* TOP Menue (second line) edits */ /*-----------------------------------------------------------------------------*/ div#p-cactions { background-color: #F5F5F5; } #p-cactions li { text-indent: 20; /*spacing between words in the top bar */ border-width: 0px; background-color: #F5F5F5; float:left; margin: 8px; } #p-cactions li a { display:block; color:#000000; font-weight: regular; text-decoration:none; background-color: #F5F5F5; } #p-cactions li a:hover { color: #000000; text-decoration: line-through; background-color: #F5F5F5; } #p-cactions li.selected a { border:none; background-color: #F5F5F5; } #p-cactions li.selected a:hover { color: #000000; text-decoration: line-through; background-color: #F5F5F5; } /*-----------------------------------------------------------------------------*/ /* Table of Content TOC */ /*-----------------------------------------------------------------------------*/ #toc { font-size: 1.1em; margin: 0 0 1em 1em; float: right; border: solid 1px #00000; text-color: #282828; background-color: #F5F5F5; } /* Allow limiting of which header levels are shown in a TOC; <div class="toclimit-3">, for instance, will limit to showing ==headings== and ===headings=== but no further (as long as there are no =headings= on the page, which there shouldn't be according to the MoS). */ .toclimit-2 .toclevel-1 ul, .toclimit-3 .toclevel-2 ul, .toclimit-4 .toclevel-3 ul, .toclimit-5 .toclevel-4 ul, .toclimit-6 .toclevel-5 ul, .toclimit-7 .toclevel-6 ul { display: none; } /*-----------------------------------------------------------------------------*/ /* LOGO position */ /*-----------------------------------------------------------------------------*/ #p-logo, #p-logo a, #p-logo a:hover { width:192px; height: 150px; margin-left: 0px; margin-top: 10px; margin-bottom: 30px; z-index: 999; } /*-----------------------------------------------------------------------------*/ /* Dynamik Image resizing (Images have to be in div-tags like that - <div>[[Image:MyImage.png]]</div> - */ /*-----------------------------------------------------------------------------*/ img { max-width: 100%; height: auto; width: auto\9; /* ie8 */ } /*-----------------------------------------------------------------------------*/ /* Sidebar Modifications */ /*-----------------------------------------------------------------------------*/ .portlet .pBody { background-color:#F5F5F5; z-index: 99; } /* increase sidebar width */ #column-content { margin-left: -16em; } #column-content #content { margin-left: 16em; } #p-logo a, #p-logo a:hover { width: 16em; } #p-cactions { left: 14.5em; } .portlet { width: 14em; } div#column-content { margin-left: -14em; } div#content { margin-left: 14em; } /*-----------------------------------------------------------------------------*/ /* changes the background of pre areas */ /*-----------------------------------------------------------------------------*/ pre { background-color: #F5F5F5} /*-----------------------------------------------------------------------------*/ /* Tabellenhintergründe transparent machen */ /*-----------------------------------------------------------------------------*/ table.diff { background-color: transparent; } /*-----------------------------------------------------------------------------*/ /* To change the size of the whitespace abouve an article's title (between top menue and the article's title */ /*-----------------------------------------------------------------------------*/ #siteNotice { margin-top: 100px; margin-bottom: 0em; } /*-----------------------------------------------------------------------------*/ /* Erase borders */ /*-----------------------------------------------------------------------------*/ #content { border-width: 0px; } .portlet .pBody { border-width: 0px; } #footer {width: 100%; border-top: 0px; border-bottom-width: 0px; Background-color: #F5F5F5;} /*-----------------------------------------------------------------------------*/ /* CHANGES OF LINKS COLORS */ /*-----------------------------------------------------------------------------*/ a:link { color: #2e7cff; text-decoration: none; } a:hover { color: #97d2ff; text-decoration: line-through; } a:visited { color: #26baaf; text-decoration: line-through; } a:active { color: #000000; text-decoration: line-through; } a.new:link { color: #ff77aa; text-decoration: none; } a.new:hover { color: #FF6E9E; text-decoration: line-through; } a.external { color: #2e7cff !important; } /* external link */ a.external:hover { color: #97d2ff; text-decoration: line-through; } a.external:visited { color: #26baaf; text-decoration: line-through; } /*-----------------------------------------------------------------------------*/ /* Headlines and Body - Styling */ /*-----------------------------------------------------------------------------*/ html,body,p,td,a,li { font: 0.9em Times, "Times New Roman", "Palatino", "Georgia", serif; background-color: #F5F5F5; } /*inserst and edit "0px line #000000; line-height: 1.1em" after "border-bottom:" to see a line, and I erased "margin: 3em 0 0.25em 0;" after "uppercase" */ h1 { font: bold 1.8em Helvetica, Arial, Roboto, "DejaVu Sans", sans-serif; color: #000000; letter-spacing: 0.12em; text-transform: uppercase; border-bottom: none; padding-bottom: 2em; } /* inserst and edit "0px line #000000; line-height: 1.1em" after "border-bottom:" to see a line */ h2 { font: 1.3em Helvetica, Arial, Roboto, "DejaVu Sans",sans-serif; color: #000000; letter-spacing: 0.1em; text-transform: uppercase; text-decoration: underline; margin: 2em 0 0 0; border-bottom: none; padding-bottom: 2em; } h3 { font: 1.1em Helvetica, Arial, Roboto, "DejaVu Sans",sans-serif; color: #000000; letter-spacing: 0.06em; text-transform: uppercase; padding-top: 0.7em; padding-bottom: 0.2em; } h4 { font: 0.92em Helvetica, Arial, Roboto, "DejaVu Sans",sans-serif; color: #000000; letter-spacing: 0.06em; text-transform: uppercase; padding-top: 0.5em; padding-bottom: 0.2em; } h5 { font: 0.91em Helvetica, Arial, Roboto, "DejaVu Sans",sans-serif; color: #000000; letter-spacing: 0.06em; text-transform: uppercase; padding-top: 0.3em; padding-bottom: 0.1em; } h6 { font: 0.91em Helvetica, Arial, Roboto, "DejaVu Sans",sans-serif; color: #000000; letter-spacing: 0.06em; text-transform: uppercase; padding-top: 0.1em; padding-bottom: 0.05em; } /*-----------------------------------------------------------------------------*/ /* FOOTER */ /*-----------------------------------------------------------------------------*/ #f-poweredbyico { display: none; } /* Erases the mediawiki logo */ #f-copyrightico { display: none; } /* reduce footer */ #footer { color: #000000; font-size: 85%; } /*-----------------------------------------------------------------------------*/ /* Additional things */ /*-----------------------------------------------------------------------------*/ /* Remove the annoying arrow that occurs after external links */ #bodyContent a[href ^="http://"] { background:inherit !important; padding-right:inherit !important background-color: #F5F5F5; } li#pt-userpage { background: none; } /* no login logo at the user-login button */ /*-----------------------------------------------------------------------------*/ /*Change the color of the user message notice box */ /*-----------------------------------------------------------------------------*/ .usermessage { background-color: none; border-color: #000000; color: black; margin: 2em 0em 1em 0em; padding: 0.5em 1em; vertical-align: middle; text-align: center; }