Fxkr (Diskussion | Beiträge) KKeine Bearbeitungszusammenfassung |
Laus (Diskussion | Beiträge) Keine Bearbeitungszusammenfassung |
||
(38 dazwischenliegende Versionen von 2 Benutzern werden nicht angezeigt) | |||
Zeile 3: | Zeile 3: | ||
* | * | ||
* Ändern hier: https://entropia.de/GPN14:Stylesheet | * Ändern hier: https://entropia.de/GPN14:Stylesheet | ||
* Einbinden über: {{Navigationsleiste GPN14}} | * Einbinden über: <nowiki>{{Navigationsleiste GPN14}}</nowiki> | ||
* | * | ||
* Farben: bitte HSL (bzw. HSLA) ggü. RGB bevorzugen! | * Farben: bitte HSL (bzw. HSLA) ggü. RGB bevorzugen! | ||
Zeile 11: | Zeile 11: | ||
* hsl(193, 64%, 43%) | * hsl(193, 64%, 43%) | ||
* | * | ||
* | * Andere, aber passende, Farben lassen sich leicht durch ändern | ||
* | * der dritten Komponente erzeugen. | ||
* | * | ||
* | * Testen: am einfachsten über mitmproxy (siehe git repo). | ||
*/ | */ | ||
@font-face { | @font-face { | ||
font-family: "Loxica"; | font-family: "Loxica"; | ||
src: url("/gulasch/v5loxicar.ttf"); | src: url("/gulasch/v5loxicar.ttf"); | ||
} | } | ||
@font-face { | |||
font-family: "Xolonium-Regular"; | |||
src: url("/gulasch/Xolonium-Regular.otf"); | |||
} | |||
@font-face { | |||
font-family: "Xolonium-Bold"; | |||
src: url("/gulasch/Xolonium-Bold.otf"); | |||
} | |||
/* | /* | ||
* Screen only | * Screen only | ||
*/ | */ | ||
@media screen { | @media screen { | ||
/* | |||
* Replace site logo | |||
* | |||
* gaaaaaarrrrrr.....!!!! | |||
*/ | |||
div#p-logo.portlet a, | |||
div#p-logo.portlet a:hover { | |||
background-image: url("/wiki/images/f/f8/GPN14-wikilogo.png") !important; | |||
display: block; | |||
height: 110px; | |||
width: 160px; | |||
} | |||
div#column-one div a img { | |||
display: none; | |||
} | |||
/* | /* | ||
* Header, Sidebar, Footer | * Header, Sidebar, Footer | ||
*/ | */ | ||
#column-one, | #column-one, | ||
#column-content { | #column-content { | ||
background-color: hsl(193, 64%, 43%); | background-color: hsl(193, 64%, 43%); | ||
} | } | ||
.pBody { | .pBody { | ||
background-color: hsl(193, 64%, 43%); | background-color: hsl(193, 64%, 43%); | ||
} | } | ||
#p-navigation a, #p-portlet2 a, #p-portlet3 a, #p-search a, #p-tb a, #p-fnord a { | #p-navigation a, #p-portlet2 a, #p-portlet3 a, #p-search a, #p-tb a, #p-fnord a { | ||
color: hsl(193, 64%, 95%); | color: hsl(193, 64%, 95%); | ||
} | } | ||
#p-logo { | #p-logo { | ||
background-color: hsl(193, 64%, 23%); | background-color: hsl(193, 64%, 23%); | ||
} | } | ||
#footer li { | |||
color: hsl(193, 64%, 83%); | |||
margin: 0.2em !important; | |||
} | |||
div#footer li a, | |||
div#footer li a:link, | |||
div#footer li a:active, | |||
div#footer li a:visited { | |||
color: hsl(193, 64%, 83%); | |||
} | |||
body { | |||
/* In Chromium, a small rectangle at the bottom end | |||
of the sidebar isn't covered by anything else */ | |||
background-color: hsl(193, 64%, 43%); | |||
} | |||
div#globalWrapper { | div#globalWrapper { | ||
background-color: hsl(193, 64%, 43%); | background-color: hsl(193, 64%, 43%); | ||
} | } | ||
div#footer { | div#footer { | ||
background-color: hsl(193, 64%, | background-color: hsl(193, 64%, 43%); | ||
border-top: none; | border-top: none; | ||
border-bottom: none; | border-bottom: none; | ||
} | } | ||
/* line break before links in footer */ | |||
div#footer li[id="viewcount"]:after { | |||
content: " "; | |||
display: block; | |||
} | |||
/* Hide banner1 ("There is no fork.") -- wtf?! */ | /* Hide banner1 ("There is no fork.") -- wtf?! */ | ||
div#p-tb + div.generated-sidebar.portlet { | div#p-tb + div.generated-sidebar.portlet { | ||
display: none !important; | display: none !important; | ||
} | } | ||
#p-navigation ul li, | #p-navigation ul li, | ||
#p-portlet2 ul li, | #p-portlet2 ul li, | ||
Zeile 74: | Zeile 125: | ||
border-bottom: 1px solid hsl(193, 64%, 53%); | border-bottom: 1px solid hsl(193, 64%, 53%); | ||
} | } | ||
/* Search box */ | /* Search box */ | ||
#searchInput { | #searchInput { | ||
Zeile 80: | Zeile 131: | ||
border: solid 1px hsl(193, 64%, 38%); | border: solid 1px hsl(193, 64%, 38%); | ||
outline: none; | outline: none; | ||
padding: 2px 2px; | padding: 2px 2px; | ||
} | } | ||
#searchBody input[type="submit"], | #searchBody input[type="submit"], | ||
#searchBody input[type="submit"] { | #searchBody input[type="submit"] { | ||
Zeile 88: | Zeile 139: | ||
border: solid 1px hsl(193, 10%, 63%); | border: solid 1px hsl(193, 10%, 63%); | ||
} | } | ||
/* | /* | ||
* Article/Discussion/Edit... tabs | * Article/Discussion/Edit... tabs | ||
*/ | */ | ||
/* bugfix: they were overflowing at the bottom side */ | /* bugfix: they were overflowing at the bottom side */ | ||
li#ca-nstab-main, | li#ca-nstab-main, | ||
Zeile 103: | Zeile 151: | ||
background: none; | background: none; | ||
} | } | ||
/* | /* | ||
* Page content box | * Page content box | ||
*/ | */ | ||
.mw-body-primary { | .mw-body-primary { | ||
border: none !important; /* border to header/navbar/footer */ | border: none !important; /* border to header/navbar/footer */ | ||
border-left: 1px solid hsl(193, 64%, 53%) !important; | border-left: 1px solid hsl(193, 64%, 53%) !important; | ||
} | } | ||
div#content { /* background of everything below header, incl. sidebar */ | div#content { /* background of everything below header, incl. sidebar */ | ||
background-color: hsl(193, 64%, 43%); /* empty space between header/navbar/footer and content box */ | background-color: hsl(193, 64%, 43%); /* empty space between header/navbar/footer and content box */ | ||
color: black; /* main text color */ | color: black; /* main text color */ | ||
padding-right: 0; /* content box meets right screen border */ | padding-right: 0; /* content box meets right screen border */ | ||
background-image: url("/wiki/images/3/3f/GPN14-Logo-only.png"); | background-image: url("/wiki/images/3/3f/GPN14-Logo-only.png"); | ||
background-repeat: no-repeat; | background-repeat: no-repeat; | ||
background-attachment: scroll; | background-attachment: scroll; | ||
background-size: | background-size: 70% auto; | ||
background-position: 1em 1em; | background-position: 1.1em 1.1em; | ||
} | } | ||
div#content h1#firstHeading { | div#content h1#firstHeading { | ||
background-color: hsla(193, 64%, 93%, 0.94); | background-color: hsla(193, 64%, 93%, 0.94); | ||
Zeile 132: | Zeile 180: | ||
border-top: 1px solid hsl(193, 64%, 50%); | border-top: 1px solid hsl(193, 64%, 50%); | ||
border-radius: 5px; | border-radius: 5px; | ||
/* Bottom joins div#bodyContent*/ | /* Bottom joins div#bodyContent*/ | ||
border-radius: 5px 0px 0px 0px; | border-radius: 5px 0px 0px 0px; | ||
Zeile 138: | Zeile 186: | ||
margin-bottom: 0; | margin-bottom: 0; | ||
} | } | ||
div#bodyContent { | div#bodyContent { | ||
background-color: hsla(193, 64%, 93%, 0.94); | background-color: hsla(193, 64%, 93%, 0.94); | ||
border-left: 1px solid hsl(193, 64%, 50%); | border-left: 1px solid hsl(193, 64%, 50%); | ||
/* Top joins h1#firstHeading */ | /* Top joins h1#firstHeading */ | ||
margin-top: 0; | margin-top: 0; | ||
border-radius: 0px 0px 5px 5px; | border-radius: 0px 0px 5px 5px; | ||
} | } | ||
/* | /* | ||
* Content | * Content | ||
*/ | */ | ||
/* not for h4/h5: too hard to read at a typical h4/h5 size, | |||
not for h2/h3: looks bad when h4/h5 isnt in Loxica too | |||
note: the h4 "von Norden (A5) & Osten (A8)" on GPN14:Anfahrt has to be readable */ | |||
h1,h2 { | |||
font-family: Xolonium-Bold,sans-serif; | |||
font-family: | |||
} | } | ||
h1#firstHeading { | h1#firstHeading { | ||
font-size: | font-size: 22pt; | ||
font-family: Xolonium-Bold,sans-serif; | |||
} | } | ||
h2 { | |||
font-size: 18pt; | |||
} | |||
/* Table of contents */ | /* Table of contents */ | ||
#toc, .toc, .mw-warning { | #toc, .toc, .mw-warning { | ||
background-color: rgba(255, 255, 255, 0); | background-color: rgba(255, 255, 255, 0); | ||
} | } | ||
/* Code blocks */ | /* Code blocks */ | ||
div#mw-content-text pre { | div#mw-content-text pre { | ||
background-color: rgba(255, 255, 255, 0.25); | background-color: rgba(255, 255, 255, 0.25); | ||
overflow: auto; /* "GPN14: Anfahrt": adress pre would overflow onto floating image. auto => offer scrollbar instead. */ | |||
} | } | ||
/* Thumbnails */ | /* Thumbnails */ | ||
html .thumbimage { | html .thumbimage { | ||
border: none; | border: none; | ||
} | } | ||
/* Linkbox am Artikelende */ | /* Linkbox am Artikelende */ | ||
div.NavHead, .catlinks { | div.NavHead, .catlinks { | ||
background-color: rgba(255, 255, 255, 0); | background-color: rgba(255, 255, 255, 0); | ||
} | } | ||
/* Bullet point lists */ | /* Bullet point lists */ | ||
div#content ul { | div#content ul { | ||
list-style: none; | list-style: none; | ||
} | } | ||
div#content ul li { | div#content ul li { | ||
text-indent: -1em; | text-indent: -1em; | ||
} | } | ||
div#content ul li:before { /* hack to change color of bullet point */ | div#content ul li:before { /* hack to change color of bullet point */ | ||
content: " | content: "\25fe "; | ||
color: hsl(193, 64%, | color: hsl(193, 64%, 28%); | ||
} | } | ||
li.toclevel-1, | |||
li.toclevel-2, | |||
li.toclevel-3, | |||
li.toclevel-4, | |||
li.toclevel-5, | |||
li.toclevel-6, | |||
div.mw-normal-catlinks li { /* revert these changes for the toc and category link box */ | |||
text-indent: 0 !important; | |||
} | |||
li.toclevel-1:before, | |||
li.toclevel-2:before, | |||
li.toclevel-3:before, | |||
li.toclevel-4:before, | |||
li.toclevel-5:before, | |||
li.toclevel-6:before, | |||
div.mw-normal-catlinks li:before { /* revert these changes for the toc and category link box */ | |||
content: none !important; | |||
} | |||
/* | /* | ||
* Links | * Links | ||
*/ | */ | ||
div#content a, | div#content a, | ||
div#content a:link, | div#content a:link, | ||
Zeile 215: | Zeile 288: | ||
color: hsl(193, 64%, 25%); | color: hsl(193, 64%, 25%); | ||
} | } | ||
div#content a | div#content a:new { | ||
text-decoration: underline; | text-decoration: underline; | ||
color: hsl(0, 55%, 55%); | color: hsl(0, 55%, 55%); | ||
} | } | ||
div#content a:hover { | div#content a:hover { | ||
text-decoration: none; | text-decoration: none; | ||
Zeile 230: | Zeile 303: | ||
color: #101010; | color: #101010; | ||
} | } | ||
/* highlight */ | |||
div#content table.highlight { | |||
background-color:hsl(193, 10%, 95%); | |||
border:solid 1px #99B3FF; | |||
margin:1em; margin-top:2em; | |||
padding: 0.3em 1em; | |||
font-size: 150%; | |||
} | |||
div#content td.highlight { | |||
padding-right: 1.5em; | |||
} | |||
/* links to missing pages */ | |||
a.new { | |||
text-decoration: underline !important; | |||
color: hsl(360, 70%, 60%) !important; | |||
} | |||
/* nicer table colums */ | |||
div#content tr td:nth-child(even){ | |||
background: rgba(255, 255, 255, 0.45);; | |||
} | |||
/* ueber dem TOC ein Link zur GPN14 Seite - fuer fxkr <3 */ | |||
/*div#Hauptlink{ | |||
position:absolute; | |||
top: 0px; | |||
right: 0px; | |||
direction: rtl; | |||
width: 100%; | |||
padding-top: 5px; | |||
padding-right: 12px; | |||
}*/ | |||
} /* end -- media screen */ | } /* end -- media screen */ | ||
[[Kategorie:GPN14]] |
Aktuelle Version vom 21. Juli 2017, 18:33 Uhr
/* * GPN14 Stylesheet * * Ändern hier: https://entropia.de/GPN14:Stylesheet * Einbinden über: {{Navigationsleiste GPN14}} * * Farben: bitte HSL (bzw. HSLA) ggü. RGB bevorzugen! * * Hintergrund-Cyan: * background-color: rgb(40, 150, 180) * hsl(193, 64%, 43%) * * Andere, aber passende, Farben lassen sich leicht durch ändern * der dritten Komponente erzeugen. * * Testen: am einfachsten über mitmproxy (siehe git repo). */ @font-face { font-family: "Loxica"; src: url("/gulasch/v5loxicar.ttf"); } @font-face { font-family: "Xolonium-Regular"; src: url("/gulasch/Xolonium-Regular.otf"); } @font-face { font-family: "Xolonium-Bold"; src: url("/gulasch/Xolonium-Bold.otf"); } /* * Screen only */ @media screen { /* * Replace site logo * * gaaaaaarrrrrr.....!!!! */ div#p-logo.portlet a, div#p-logo.portlet a:hover { background-image: url("/wiki/images/f/f8/GPN14-wikilogo.png") !important; display: block; height: 110px; width: 160px; } div#column-one div a img { display: none; } /* * Header, Sidebar, Footer */ #column-one, #column-content { background-color: hsl(193, 64%, 43%); } .pBody { background-color: hsl(193, 64%, 43%); } #p-navigation a, #p-portlet2 a, #p-portlet3 a, #p-search a, #p-tb a, #p-fnord a { color: hsl(193, 64%, 95%); } #p-logo { background-color: hsl(193, 64%, 23%); } #footer li { color: hsl(193, 64%, 83%); margin: 0.2em !important; } div#footer li a, div#footer li a:link, div#footer li a:active, div#footer li a:visited { color: hsl(193, 64%, 83%); } body { /* In Chromium, a small rectangle at the bottom end of the sidebar isn't covered by anything else */ background-color: hsl(193, 64%, 43%); } div#globalWrapper { background-color: hsl(193, 64%, 43%); } div#footer { background-color: hsl(193, 64%, 43%); border-top: none; border-bottom: none; } /* line break before links in footer */ div#footer li[id="viewcount"]:after { content: " "; display: block; } /* Hide banner1 ("There is no fork.") -- wtf?! */ div#p-tb + div.generated-sidebar.portlet { display: none !important; } #p-navigation ul li, #p-portlet2 ul li, #p-portlet3 ul li, #p-search ul li, #p-tb ul li, #p-fnord ul li { border-bottom: 1px solid hsl(193, 64%, 53%); } /* Search box */ #searchInput { background-color: hsl(193, 64%, 78%); border: solid 1px hsl(193, 64%, 38%); outline: none; padding: 2px 2px; } #searchBody input[type="submit"], #searchBody input[type="submit"] { background-color: hsl(193, 10%, 93%); border: solid 1px hsl(193, 10%, 63%); } /* * Article/Discussion/Edit... tabs */ /* bugfix: they were overflowing at the bottom side */ li#ca-nstab-main, li#ca-nstab-main ~ li { background: none; } /* * Page content box */ .mw-body-primary { border: none !important; /* border to header/navbar/footer */ border-left: 1px solid hsl(193, 64%, 53%) !important; } div#content { /* background of everything below header, incl. sidebar */ background-color: hsl(193, 64%, 43%); /* empty space between header/navbar/footer and content box */ color: black; /* main text color */ padding-right: 0; /* content box meets right screen border */ background-image: url("/wiki/images/3/3f/GPN14-Logo-only.png"); background-repeat: no-repeat; background-attachment: scroll; background-size: 70% auto; background-position: 1.1em 1.1em; } div#content h1#firstHeading { background-color: hsla(193, 64%, 93%, 0.94); border-left: 1px solid hsl(193, 64%, 50%); border-top: 1px solid hsl(193, 64%, 50%); border-radius: 5px; /* Bottom joins div#bodyContent*/ border-radius: 5px 0px 0px 0px; padding: 0.3em 0.3em 0; margin-bottom: 0; } div#bodyContent { background-color: hsla(193, 64%, 93%, 0.94); border-left: 1px solid hsl(193, 64%, 50%); /* Top joins h1#firstHeading */ margin-top: 0; border-radius: 0px 0px 5px 5px; } /* * Content */ /* not for h4/h5: too hard to read at a typical h4/h5 size, not for h2/h3: looks bad when h4/h5 isnt in Loxica too note: the h4 "von Norden (A5) & Osten (A8)" on GPN14:Anfahrt has to be readable */ h1,h2 { font-family: Xolonium-Bold,sans-serif; } h1#firstHeading { font-size: 22pt; font-family: Xolonium-Bold,sans-serif; } h2 { font-size: 18pt; } /* Table of contents */ #toc, .toc, .mw-warning { background-color: rgba(255, 255, 255, 0); } /* Code blocks */ div#mw-content-text pre { background-color: rgba(255, 255, 255, 0.25); overflow: auto; /* "GPN14: Anfahrt": adress pre would overflow onto floating image. auto => offer scrollbar instead. */ } /* Thumbnails */ html .thumbimage { border: none; } /* Linkbox am Artikelende */ div.NavHead, .catlinks { background-color: rgba(255, 255, 255, 0); } /* Bullet point lists */ div#content ul { list-style: none; } div#content ul li { text-indent: -1em; } div#content ul li:before { /* hack to change color of bullet point */ content: "\25fe "; color: hsl(193, 64%, 28%); } li.toclevel-1, li.toclevel-2, li.toclevel-3, li.toclevel-4, li.toclevel-5, li.toclevel-6, div.mw-normal-catlinks li { /* revert these changes for the toc and category link box */ text-indent: 0 !important; } li.toclevel-1:before, li.toclevel-2:before, li.toclevel-3:before, li.toclevel-4:before, li.toclevel-5:before, li.toclevel-6:before, div.mw-normal-catlinks li:before { /* revert these changes for the toc and category link box */ content: none !important; } /* * Links */ div#content a, div#content a:link, div#content a:active { text-decoration: underline; color: hsl(193, 64%, 35%); } div#content a:visited { text-decoration: underline; color: hsl(193, 64%, 25%); } div#content a:new { text-decoration: underline; color: hsl(0, 55%, 55%); } div#content a:hover { text-decoration: none; } div#mw-content-text pre a, div#mw-content-text pre a:link, div#mw-content-text pre a:active, div#mw-content-text pre a:visited { color: #101010; } /* highlight */ div#content table.highlight { background-color:hsl(193, 10%, 95%); border:solid 1px #99B3FF; margin:1em; margin-top:2em; padding: 0.3em 1em; font-size: 150%; } div#content td.highlight { padding-right: 1.5em; } /* links to missing pages */ a.new { text-decoration: underline !important; color: hsl(360, 70%, 60%) !important; } /* nicer table colums */ div#content tr td:nth-child(even){ background: rgba(255, 255, 255, 0.45);; } /* ueber dem TOC ein Link zur GPN14 Seite - fuer fxkr <3 */ /*div#Hauptlink{ position:absolute; top: 0px; right: 0px; direction: rtl; width: 100%; padding-top: 5px; padding-right: 12px; }*/ } /* end -- media screen */