[Stylish] Oldschool-Shoutbox

  • Hi!

    Da mir die alte Shoutbox ohne Bildchen usw. besser gefallen hat, habe ich fix ein Stylish-Skript geschrieben, um die neue Modern Shoutbox dahingehend anzupassen. Die Ausblendung des Smooth-Effektes am oberen Ende der SB stammt von Mars (.shoutboxContent.desc:after{display:none;}).

    Geschrieben wurde das Skript für Firefox 32 mit Stylish 1.4.3, mit Chrome und Stylish z.B. sollte es aber auch gehen.

    Quellcode

    Screenshot:
    [Blockierte Grafik: http://k58.imgup.net/modsb0451.PNG]

    Die Zeitangabe, wann ein Shout erstellt worden ist, erscheint bei Mouseover am rechten Zeilenrand, allerdings in absoluter Angabe (14. Oktober 2014, 18:00). Das funktioniert nicht ganz so gut bei Shouts, die nach dem Laden der Seite hinzugefügt worden sind. Diese Shouts benutzen scheinbar einen anderen HTML-Code als Grundlage, warum auch immer...

    Ist ja auch nur eine Übergangslösung, bis i2cs SB wieder im Einsatz ist. :thumbup:

  • mit Chrome und Stylish z.B. sollte es aber auch gehen.

    Negativ.


    So funktioniert es in Chrome:

    CSS
    .shoutboxEntry > .userAvatar{display: none;}
    li.shoutboxEntry:nth-child(even){background: #f9f9f9;}
    li.shoutboxEntry:nth-child(odd){background: #f0f0f0;}
    .shoutboxEntry time{visibility: hidden;float: right;}
    .shoutboxEntry time:after{visibility: visible;content: attr(title);}
    div.entryContent > small > a{font-size: 115%;font-weight: bold;}
    div.entryContent > small > a:after{content: ":";}
    .shoutboxEntry p{display: inline-block !important;}
    .shoutboxContent.desc:after{display: none;}

    Bei URL-Beschränkung einstellen "URLs beginnend mit" und dahinter "http://autoit.de/".

    Andy hat mir ein Schnitzel gebacken aber da war ein Raupi drauf und bevor Oscar das Bugfixen konnte kam Alina und gab mir ein AspirinJunkie.

    Einmal editiert, zuletzt von chip (14. Oktober 2014 um 18:24)

  • Optik für die Titelleiste:
    (Grafiken sind aus den Wettbewerbthreads für Logo und BG-Bild)

    CSS
    img[src='http://autoit.de/wcf/images/lightedged/logo.png'] {      height: 0 !important;      width: 0 !important;      padding-left: 468px !important;      padding-top: 60px !important;      background: url(http://autoit.de/index.php/Attachment/23457-Logo-png/) no-repeat !important;    }    #pageHeader > div {      background: url('http://i.imgur.com/RuRIN.png') !important;    }
  • Optik für die Onlineanzeige des Teams (Admins/Mods/PUs):

    CSS
    #portalBox9 .icon-desktop:before {      vertical-align: middle;      content: "";      color: #00bb00;      text-shadow: 0px 0px 3px;    }    #portalBox9 .icon-check-empty:before {      vertical-align: middle;      color: #909090;      content: "";    }    #portalBox9 > .container ul ol li:nth-child(even) {      background: #e0e0e0    }    #portalBox9 > .container ul ol li {      font-size: 80% !important;    }

    [Blockierte Grafik: http://i.imgur.com/XIJ6bwy.png]

  • Ich habe noch zwei Styles geschrieben, vielleicht will die ja auch einer haben:

    Geschrieben wurden diese Stile unter Firefox, sie funktionieren aber auch eingeschränkt unter Chrome. Eingeschränkt heißt konkret, dass die Färbung nicht in Richtung blau geht, sondern einfach grau ist. Ich musste unter Chrome auf einen voreingestellten Filter (grayscale) zurückgreifen.

    Der erste Stil modifiziert die Versionsbox im Portal auf der linken Seite ein wenig und passt sie dem Forendesign an. Der zweite Stil legt über alle Avatare (Benutzerbilder) im Forum einen Blauschleier, damit diese nicht mehr so rausstechen.

    Gruß!