Last active
December 26, 2015 03:29
-
-
Save oliof/7086147 to your computer and use it in GitHub Desktop.
User CSS für das Tanelorn Forum.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* tanelorn_contrast.css | |
Verändert das Tanelorn Moon Theme so, dass der Text kontrastreich dargestellt wird. | |
Ersetzt einige Icons durch UTF8-Symbole, die auflösungsunabhängig gerendert werden. | |
Verbirgt einige Icons, die ich selbst nie benutze. | |
version $Id$ | |
*/ | |
/* Testeintrag für Testvariablen. Geht derzeit noch nicht. */ | |
:root { | |
var-testcolor: red; | |
} | |
/* Mehr Kontrast! */ | |
body, td, th, tr, | |
.windowbg, tr.windowbg, td.info,tr.windowbg td.lastpost, tr.windowbg | |
td.smalltext, .windowbg2, tr.windowbg2 td.info, tr.windowbg2 td.lastpost, | |
tr.windowbg2 td.smalltext, .windowbg3, .stickybg, .stickybg2, | |
.lockedbg, .lockedbg2 { | |
color: #000000; | |
background: #ffffff; | |
} | |
body { | |
font-family: sans-serif; | |
} | |
/* SMF verwendet <strong></strong> anstatt font-weight: bold via styles. | |
Das wollen wir nicht. */ | |
strong, | |
div.sub_boards strong a { | |
font-weight: normal !important; | |
/* Wer rote Schatten sieht, melde sich bitte bei mir! */ | |
text-shadow: | |
0 0 .2em var(testcolor), | |
0 0 .2em var(testcolor); | |
} | |
/* Ausser in den Postings und in Previews selbst natürlich! */ | |
#preview_body strong, | |
#personal_messages * strong, | |
.postarea * strong { | |
font-weight: bold; | |
} | |
/* Leichte Einfaerbung fuer die die nicht ohne koennen. */ | |
div#content_section { | |
background: #eeeeee; | |
border-radius: 1em 1em; | |
margin-bottom: 1em; | |
} | |
/* Header-Grafik desaturieren. Funktioniert nur in Webkit-basierenden Browsern. */ | |
div#wrapper a img[src*="header"] { | |
-webkit-filter: grayscale(1); | |
filter: grayscale(100%); | |
} | |
/* Beiträge in Listen weicher trennen. */ | |
table.table_grid td { | |
border-color: #cccccc; | |
} | |
/* Menü-Einstellungen für #main_menu und #admin_menu. */ | |
.dropmenu li a.firstlevel span.firstlevel { | |
margin: 0; | |
padding-left: 1em; | |
padding-right: 1em; | |
} | |
.dropmenu, | |
.dropmenu li a.active, | |
.dropmenu li a.active:hover, | |
.dropmenu li a.firstlevel:hover, | |
.dropmenu li:hover a.firstlevel, | |
.dropmenu li a.active span.firstlevel, | |
.dropmenu li a.active:hover span.firstlevel | |
.dropmenu li a.firstlevel:hover span.firstlevel, | |
.dropmenu li:hover a.firstlevel span.firstlevel, | |
.dropmenu li li:hover a, | |
.dropmenu li li > a:hover { | |
background-image: none; | |
} | |
.dropmenu li li:hover a, | |
.dropmenu li li > a:hover { | |
font-weight: bold; | |
color: #000000; | |
} | |
#adm_submenus .dropmenu li a.active span.firstlevel, | |
#adm_submenus .dropmenu li a.firstlevel:hover, | |
#adm_submenus .dropmenu li:hover a.firstlevel, | |
#admin_menu .dropmenu li a.active span.firstlevel, | |
#admin_menu .dropmenu li a.firstlevel:hover, | |
#admin_menu .dropmenu li:hover a.firstlevel { | |
color: #000000; | |
} | |
#main_menu * li a.firstlevel:link, | |
#main_menu * li a.firstlevel:visited, | |
#main_menu * li a.firstlevel:hover { | |
color: #ffffff; | |
} | |
/* Pseudobuttons */ | |
.buttonlist ul li a:visited, | |
.buttonlist ul li a:link { | |
background: #cccccc none; | |
color: #000000; | |
border: 1px solid #cccccc; | |
} | |
div.catbg, tr.catbg td, tr.catbg th, | |
tr.catbg th a:link, tr.catbg th a:visited, | |
div.catbg2, tr.catbg2 td, tr.catbg2 th, | |
tr.catbg2 td a:link, tr.catbg2 td a:visited, | |
.description, .description_board, .plainbox, | |
.dropmenu li ul { | |
background: #cccccc none; | |
color: #000000; | |
} | |
.dropmenu li ul { | |
border-radius: .25em; | |
box-shadow: 0 .2em .3em .2em #aaaaaa; | |
} | |
.description#topic_icons, | |
div#footer_section { | |
display: none; | |
} | |
h3.catbg a:hover, h4.catbg a:hover, .table_list tbody.header td a:hover, | |
h3.catbg a:link, h3.catbg a:visited, h4.catbg a:link, h4.catbg a:visited, | |
h3.catbg, .table_list tbody.header td, .table_list tbody.header td a { | |
color: #000000; | |
} | |
h3.catbg[style] { | |
color: #000000 !important; | |
} | |
#content_section { | |
background: #ffffff; | |
} | |
#header { | |
background-image: none; | |
background-color: #ffffff; | |
border: 1px solid #cccccc; | |
border-radius: 1em; | |
opacity: .8; | |
} | |
#top_section[style] { | |
margin-right: 4.5em !important; | |
} | |
/* Die Vorschau ist schwarz auf hellgrau und mit Punkten abgesetzt. */ | |
#preview_body { | |
background-image: none; | |
background-color: #cccccc; | |
color: #000000; | |
padding: 1em; | |
border: 1px dotted #000000; | |
border-radius: .25em .25em; | |
} | |
/* Pseudobuttons wollen auch schick aussehen. */ | |
input[type='submit']:hover { | |
background: #cccccc; | |
} | |
.button_submit { | |
background: #cccccc; | |
border: 1px solid #aaaaaa; | |
color: #000000; | |
} | |
.buttonlist ul li a span { | |
background-image: none; | |
} | |
.buttonlist ul li a { | |
border-radius: 2px 2px; | |
} | |
.buttonlist ul li a.active:link { | |
background: #cccccc none; | |
border: 1px solid #cccccc; | |
color: #000000; | |
font-weight: normal; | |
} | |
.buttonlist ul li a.active:hover { | |
background: #cccccc none; | |
color: #000000; | |
border: 1px solid #000000; | |
} | |
.buttonlist ul li a:link { | |
background: #cccccc none; | |
color: #000000; | |
border: 1px solid #cccccc; | |
} | |
.buttonlist ul li a:hover { | |
background: #cccccc none; | |
color: #000000; | |
border: 1px solid #000000; | |
} | |
/* Die Box überm Logo auch in schwarz-weiss */ | |
div.frame.user { | |
font-size: smaller; | |
line-height: 1.5; | |
} | |
/* Beiträge in schlichtem schwarz/weiss. Jetzt mit Schatten! */ | |
span.botslice { | |
background-color: #eeeeee; | |
} | |
.windowbg span.topslice, | |
.windowbg2 span.topslice { | |
display: none; | |
} | |
.post_wrapper { | |
padding-top: 2px; | |
box-shadow: 0 .2em .3em .2em #aaaaaa; | |
border-radius: .2em; | |
} | |
.bbc_link:link, | |
.bbc_link:visited, | |
.bbc_link:hover, | |
a:link, a:visited, | |
a:hover { | |
color: #000000; | |
} | |
.poster h4, .poster h4 a { | |
color: #000000; | |
} | |
#preview_body .bbc_link:link, | |
#preview_body .bbc_link:visited, | |
#preview_body a:link, | |
#preview_body a:visited, | |
#personal_messages * .bbc_link:link, | |
#personal_messages * .bbc_link:visited, | |
#personal_messages * a:link, | |
#personal_messages * a:visited, | |
.post .bbc_link:link, | |
.post .bbc_link:visited, | |
.post a:link, | |
.post a:visited, | |
.signature .bbc_link:link, | |
.signature .bbc_link:visited, | |
.signature a:link, | |
.signature a:visited { | |
text-decoration: none; | |
border-bottom: 1px dotted #666666; | |
} | |
a[href$=new] { | |
border: 0 none; | |
} | |
/* Zitat/Löschen/Ändern-Icon entfernen. */ | |
ul.quickbuttons li.quote_button, | |
ul.quickbuttons li.modify_button, | |
ul.quickbuttons li.remove_button { | |
background: none; | |
} | |
li.quote_button a, | |
li.modify_button a, | |
li.remove_button a | |
{ | |
display: none; | |
} | |
li.quote_button a:before { | |
content: "❠\a0"; | |
} | |
li.modify_button a:before { | |
content: "✍\a0"; | |
} | |
li.remove_button a:before { | |
content: "✗\a0"; | |
} | |
/* Zitate grau in grau. */ | |
blockquote.bbc_standard_quote { | |
background: #dddddd; | |
color: #000000; | |
border-top: 1px solid #aaaaaa; | |
border-bottom: 1px solid #aaaaaa; | |
} | |
blockquote.bbc_alternate_quote { | |
background: #ffffff; | |
color: #333333; | |
border-top: 1px solid #aaaaaa; | |
border-bottom: 1px solid #aaaaaa; | |
} | |
/* [code-Blöcke] */ | |
code.bbc_code { | |
background: #dddddd; | |
} | |
/* Betreff-Zeilen fett markieren. */ | |
a.subject { | |
color: #000000; | |
font-weight: bold; | |
} | |
/* Runde Rahmen sind rund. */ | |
.roundframe { | |
background-image: none; | |
border-radius: 1em 1em; | |
} | |
.roundframe[style] { | |
margin: 1em 0 1em 0 !important; | |
} | |
div.roundframe div.cat_bar, | |
div.cat_bar, .cat_bar { | |
background-image: none; | |
background: #cccccc; | |
border-radius: .25em .25em; | |
padding-left: 1em; | |
} | |
/* Tabellen wollen massiert werden. */ | |
table { | |
border-collapse: collapse; | |
border: none; | |
} | |
#boardindex_table { | |
background-color: transparent; | |
} | |
tbody.header td, | |
tbody.header td tr { | |
border: none; | |
background-color: transparent; | |
} | |
.table_list tbody.content td.info a.subject { | |
color: #000000; | |
} | |
td { | |
border: 1px solid #cccccc; | |
} | |
td.subject { | |
background-image: none; | |
} | |
tbody.divider tr td { | |
background-color: #eeeeee; | |
border: none; | |
} | |
td.icon { | |
background-color: #eeeeee; | |
border: none; | |
} | |
h3.catbg { | |
background: #cccccc; | |
color: #000000; | |
} | |
div.title_bar, div.title_barIC, div.title_barIC h4.titlebg { | |
background: #cccccc none; | |
color: #000000; | |
border-radius: 0.25em 0.25em; | |
} | |
/* offline/online Markierung für User durch Farbfelder ersetzen. */ | |
img[alt="Offline"], | |
img[alt="Online"] { | |
display: inline; | |
box-sizing: border-box; | |
width: 0; | |
height: 0; | |
padding: -0.5em; | |
margin-bottom: -.05em; | |
border: 0.5em solid #cccccc; | |
border-radius: 0.25em; | |
} | |
img[alt="Online"] { | |
border: 0.5em solid #44aa44; | |
} | |
/* redundantes sticky-gif und locked-gif ausblenden. */ | |
.topic_table td.stickybg2, | |
.topic_table td.stickybg, | |
.topic_table td.lockedbg, | |
.topic_table td.lockedbg2 { | |
background-image: none; | |
} | |
/* Instant Messenger links ausblenden. */ | |
a.icq, a.msn, a.aim, a.yim { | |
display:none; | |
} | |
/* Einige Icons ausblenden, deren Funktion ich nie benutze. */ | |
td.icon a img, | |
td.icon2 a img, | |
div#posting_icons, | |
img[src$="modify_inline.gif"] { | |
display:none; | |
} | |
/* "Melden"-Knopf und IP-Adress-Info ausblenden. */ | |
div.reportlinks { | |
display: none; | |
} | |
/* Die Betreffzeile soll soviel Platz benutzen koennen wie sie will. */ | |
.keyinfo { | |
float: left; | |
clear: left; | |
max-width: 90%; | |
min-width: 50%; | |
padding-right: 1em; | |
} | |
/* PM Dateianhänge-Liste. */ | |
tr.titlebg th { | |
background-image: none; | |
} | |
tr.titlebg th a:link, | |
tr.titlebg th a:visited, | |
tr.titlebg th a:hover { | |
color: #000000; | |
} | |
/* Rahmen um Eingabefelder und Buttons. */ | |
input, textarea, button, select, | |
input:hover, textarea:hover, button:hover, select:hover, | |
.button_submit:hover, .button_reset:hover, | |
input:focus, textarea:focus, button:focus, select:focus { | |
border-color: #33aa33; | |
} | |
/* Header für Themen aufbereiten. */ | |
#forumposts h3 span#author { | |
min-width: 5em; | |
clear: right; | |
padding-left: 3em; | |
margin: 0 10em 0 0; | |
font-weight: bold; | |
} | |
/* Platz fuer die UTF8-Symbole reservieren. */ | |
.catbg img, | |
.floatleft img { | |
font-weight: normal; | |
padding-right: 1em; | |
} | |
.topic_table .icon1 { | |
width: 4em; | |
text-align: right; | |
} | |
/* Die folgenden CSS-Regeln funktionieren nur wenn man eine Schriftart installiert hat, | |
die die Symbole ersetzen kann. Gegebenenfalls muss fuer diese Schriftart noch eine | |
font-family gesetzt werden. Ohne die richtige Schrift verschwinden Funktionen aus dem | |
Sichtfeld! */ | |
/* Bilder verstecken. */ | |
img[src*="poll"], | |
img[src$="arrow.gif"], | |
img[src$="expand.gif"], | |
img[src$="collapse.gif"], | |
img[src$="question.gif"], | |
img[src$="lamp.gif"], | |
img[src$="thumbup.gif"], | |
img[src$="exclamation.gif"], | |
img[src$="recycled.gif"], | |
img[src$="moved.gif"], | |
img[src*="change_menu"], | |
img[src$="/ip.gif"], | |
img[src$="/upshrink.png"], | |
img[src$="/upshrink2.png"], | |
img[src$="/xx.gif"], | |
img[src$="/sort_down.gif"], | |
img[src$="/sort_up.gif"], | |
img[src$="quick_lock.gif"], | |
img[src$="quick_sticky.gif"], | |
img[src$="/normal_post.gif"], | |
img[src$="/topic/hot_post.gif"], | |
img[src$="/veryhot_post.gif"], | |
img[src$="/normal_post_sticky.gif"], | |
img[src$="/hot_post_sticky.gif"], | |
img[src$="/veryhot_post_sticky.gif"], | |
img[src$="/normal_post_locked.gif"], | |
img[src$="/hot_post_locked.gif"], | |
img[src$="/very_post_locked.gif"], | |
img[src$="/normal_post_locked_sticky.gif"], | |
img[src$="/hot_post_locked_sticky.gif"], | |
img[src$="/veryhot_post_locked_sticky.gif"], | |
img[src$="/topic/my_normal_post.gif"], | |
img[src$="/my_hot_post.gif"], | |
img[src$="/my_veryhot_post.gif"], | |
img[src$="/my_normal_post_sticky.gif"], | |
img[src$="/my_hot_post_sticky.gif"], | |
img[src$="/my_veryhot_post_sticky.gif"], | |
li.stars img[src*="star"], | |
img[alt="Zukünftige Ereignisse"], | |
img[alt="Forumstatistiken"], | |
img[alt="Benutzer Online"], | |
img[src="/Themes/Curve_Tanelorn/images/icons/profile_sm.gif"], | |
img[src="/Themes/Curve_Tanelorn/images/www_sm.gif"], | |
img[alt="Private Mitteilung (Offline)"], | |
img[alt="Private Mitteilung (Online)"], | |
img[alt="Profil anzeigen"], | |
img[alt="E-Mail"], | |
img.gender[alt="Weiblich"], | |
img.gender[alt="Männlich"], | |
img[alt="Letzter Beitrag"], | |
img[alt="Neu"], | |
img.new_posts { | |
/* Bild verstecken. */ | |
height: 0; | |
width: 0; | |
/* fake content verstecken. */ | |
color: transparent; | |
/* Pseudo-Elemente müssen absolut positioniert werden. */ | |
position: relative; | |
content: "fake"; | |
} | |
/* Ersatz-Inhalte sichtbar machen. */ | |
img:before, | |
img:after { | |
top:0; | |
left:0; | |
font-weight: normal; | |
color: #000000; | |
} | |
img[src$="arrow.gif"]:before { | |
content: "▹\a0"; | |
} | |
img[src$="expand.gif"]:before { | |
content: "➕"; | |
} | |
img[src$="collapse.gif"]:before { | |
content: "➖"; | |
} | |
img[src$="/change_menu.png"]:before { | |
content: "⏪"; /* ⏩ */ | |
font-weight: bold; | |
} | |
img[src$="/change_menu2.png"]:before { | |
content: "⏩"; | |
font-weight: bold; | |
} | |
img[alt="Neu"]:before, | |
img.new_posts:before { | |
content: "neu"; | |
color: #007700; | |
font-size: smaller; | |
} | |
img[alt="Private Mitteilung (Offline)"]:before { | |
content: "💬"; | |
font-weight: bolder; | |
color: #777777; | |
} | |
img[alt="Private Mitteilung (Online)"]:before { | |
content: "💬"; | |
font-weight: bolder; | |
color: #007700; | |
} | |
img[src$="/profile_sm.gif"]:before, | |
img[alt="Profil anzeigen"]:before { | |
content: "👤"; | |
} | |
img.gender[alt="Männlich"]:before { | |
content: "♂"; | |
font-size: 140%; | |
font-weight: bold; | |
} | |
img.gender[alt="Weiblich"]:before { | |
content: "♀"; | |
font-size: 140%; | |
font-weight: bold; | |
} | |
img[alt="E-Mail"]:before { | |
content: "📧"; | |
padding-bottom: -.5em; | |
} | |
img[src$="/www_sm.gif"]:before { | |
content: "🔗"; | |
} | |
li.stars img[src*="star"]:before { | |
content: "★"; | |
} | |
img[src$="/starmodtechsupport.png"]:before { | |
color: #00ff00; | |
text-shadow: | |
0 0 1px #00aa00, | |
0 0 1px #00aa00; | |
} | |
img[src$="/starmoddungeonkeeper.png"]:before { | |
color: #ff0000; | |
text-shadow: | |
0 0 1px #aa0000, | |
0 0 1px #aa0000; | |
} | |
img[src$="/star.gif"]:before { | |
color: #ffcc77; | |
text-shadow: | |
0 0 1px #ffcc00, | |
0 0 1px #ffcc00;} | |
img[src$="/starmodmasterofkeys.png"]:before { | |
color: #4466FF; | |
text-shadow: | |
0 0 1px #0000ff, | |
0 0 1px #0000ff; | |
} | |
img[src$="/starmodchallengeteam.png"]:before { | |
color: #C982C9; | |
text-shadow: | |
0 0 1px #770077, | |
0 0 1px #770077; | |
} | |
img[src$="/starmodgamemaster.png"]:before { | |
color: #4DD5D7; | |
text-shadow: | |
0 0 1px #00aaaa, | |
0 0 1px #00aaaa; | |
} | |
img[src$="quick_sticky.gif"]:before { | |
content: "📌"; | |
} | |
img[src$="quick_lock.gif"]:before { | |
content: "🔒"; | |
} | |
img[src*="/upshrink"]:before { | |
content: "▲"; | |
color: #ffffff; | |
text-shadow: | |
0 0 .1em #444444, | |
0 0 .1em #444444; | |
position: relative; | |
top: 1em; | |
z-index: 10000; | |
} | |
img[src$="/upshrink2.png"]:before, | |
img[src$="/sort_down.gif"]:before { | |
content: "▼"; | |
} | |
img[src$="/sort_up.gif"]:before { | |
content: "▲"; | |
} | |
a.collapse img:before, | |
img#lastfiveupshrink, | |
img#newsupshrink, | |
img#upshrink, | |
img#upshrink_ic { | |
margin: 0 !important; | |
} | |
#top_section img#upshrink { | |
float: none; | |
} | |
table.table_list a.collapse { | |
margin: 0 0 0 1em; | |
} | |
img#lastfiveupshrink { | |
padding-right: 1em; | |
font-weight: normal; | |
} | |
img[src$="/ip.gif"]:before { | |
content: "💻"; | |
} | |
/* Thread-Typen (unvollständig). */ | |
img[src$="question.gif"]:before { | |
content: "⁇"; | |
} | |
img[src$="exclamation.gif"]:before { | |
content: "‼"; | |
} | |
img[src$="lamp.gif"]:before { | |
content: "💡"; | |
text-shadow: | |
0 1px #aaaa00, | |
0 1px #aaaa00, | |
0 1px #aaaa00, | |
0 1px #aaaa00; | |
} | |
img[src$="thumbup.gif"]:before { | |
content: "👍"; | |
} | |
img[src$="moved.gif"]:before { | |
content: "↪"; | |
} | |
img[src$="recycled.gif"]:before { | |
content: "♻"; | |
} | |
img[src$="/xx.gif"]:before { | |
content: "📖"; | |
} | |
/* Alle poll-Icons ersetzen. Blaue Farbe um nicht gedeckte | |
Fälle zu sehen */ | |
img[src*="poll"]:before { | |
content: "☑"; | |
} | |
/* Normale Themen. */ | |
img[src*="post_"]:before, | |
img[src*="_post"]:before { | |
content: "📰"; | |
} | |
/* Gesperrte Themen. */ | |
img[src*="locked"]:before { | |
content: "🔒📰"; | |
} | |
/* Gepinnte Themen. */ | |
img[src*="post_sticky"]:before { | |
content: "📌📰"; | |
} | |
/* Gesperrte und Gepinnte Themen. */ | |
img[src*="post_locked_sticky"]:before { | |
content: "📌🔒📰"; | |
} | |
/* Themen, in denen der User selbst Beiträge verfasst hat. */ | |
img[src*="my_"]:before { | |
content: "📝"; | |
} | |
/* Gepinnte Themen, in denen der User selbst Beiträge verfasst hat. */ | |
img[src*="my_normal_post_sticky"]:before { | |
content: "📌📝"; | |
} | |
img[src$="/my_hot_post_sticky.gif"]:before { | |
content: "📌📝"; | |
} | |
img[src$="/my_veryhot_post_sticky.gif"]:before { | |
content: "📌📝"; | |
} | |
/* TODO: Gesperrte und gepinnte Themen, in denen der User selbst Beiträge verfasst hat */ | |
/* TODO: Gesperrte Themen, in denen der User selbst Beiträge verfasst hat */ | |
/* Icon für die Aktivitätsstufen. */ | |
img[src*="veryhot"]:after { | |
color: #77cc77 !important; | |
} | |
img[src*="hot"]:after { | |
content: "🔥"; | |
color: #aaaaaa; | |
} | |
/* Foreninformationen. */ | |
img[alt="Zukünftige Ereignisse"]:before { | |
content: "📆"; | |
margin-left: -1em; | |
} | |
img[alt="Forumstatistiken"]:before { | |
content: "📊"; | |
margin-left: -1em; | |
} | |
img[alt="Benutzer Online"]:before { | |
content: "🔌"; | |
margin-left: -1em; | |
} | |
img[alt="Letzter Beitrag"]:before { | |
content: "➔"; | |
margin-left: -1em; | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment