va-classic: Eine Lösung, um VoodooAlert mit klassischerem Layout zu betreiben

Jo, das CSS geht (zumindest soweit ersichtlich) recht gut auch im alten Opera 12. Aber das ist jetzt nicht so verwunderlich, immerhin unterstützt Opera 12 soweit ich weiß CSS3 recht vollumfänglich. Nur neuere Dinge wie Level 4 und komplett neue Level 1 Selektoren gehen evtl. nicht (CSS wurde in "Module" mit "Levels" gespalten, weswegen es leider nie ein CSS4 geben wird. Statt dessen gibt es wohl Chaos, weil keiner mehr genau weiß welcher Browser was kann, das haben wir im Web ja so besonders gerne).

Aber Opera 12 hat ganz andere Probleme: Eben erst einmal die grundlegende Benutzbarkeit des Forums.

2018-07-03: Die Stylish Erwähnungen in diesem Post wurden gestrichen, da die Software in den genannten Versionen Spionagecode enthält. Siehe Startpost.

Bah, das mit der Topbar bekomme ich NICHT hin. Bzw. ich hatte es endlich im Palemoon gelöst, doch das CSS funktioniert dann nicht mehr auf neueren Browsern. Hah...

Ajo, grade eben ist Stylish 3.1.1 rausgekommen, das funktioniert nun scheinbar auch wieder mit dem Firefox 52 ESR, anders als die 3.0.

Edit: So, mir ist soeben aufgefallen, daß der VA-Classic Style mit Chromium-basierten Browsern (für die es scheinbar nur ein altes Stylish 2.0.1 gibt) nur mangelhaft funktioniert. Auch eLuSiVes' Problem konnte ich auf Vivaldi 1.15 (Chromium 65) nachweisen. Die Überschriften sind zu fett, und einige andere Elemente gehorchen dem CSS nicht so wie bei Firefox.

Auch hängt der Umstand WELCHES der beiden Stylesheets man braucht nicht nur von der Stylish Version ab Stylish 2.0.1 verhält sich konfigurationstechnisch auf Chromium so wie Stylish 3.1.1 auf Firefox. Muß ich den ersten Post nochmals anpassen.

UND ich werde zusehen müssen, den Style so anzupassen, daß er auf Chromium Browsern wirklich auch so aussieht wie gewollt, und nicht nur zu 90%.

Heh, nice.

Weiter geht's mit der Multiposterei: Mir ist jetzt aufgefallen, daß VA-Classic auf Browsern mit einer etwas älteren Chromium Engine nicht korrekt funktioniert, und ich bekomme das auch nicht hin - nebst dessen ist es mir zudem auch komplett wurscht, wenn das nicht funktioniert. Auf jeden Fall betroffen sind Chromium Engines der Versionen 52 und 58.

Dabei wird die Breite des Forums einfach völlig falsch dargestellt, und es entsteht ein ~300 Pixel breites, schwarzes "Nichts" rechts vom Forum. Das betrifft nicht nur Google Chrome, sondern auch andere Derivate wie Vivaldi.

Neue Versionen allerdings (mindestens jedoch Chromium 65) gehen richtig mit dem Stylesheet um, und stellen alles so dar wie gedacht. Alte wie neue Gecko/Goanna Browser wie Firefox gehen ebenfalls ordentlich damit um (mindestens jedoch funktioniert es ab Gecko Version 38 bzw. Goanna Version 3.x).

Die Sidebar, in der sich die "Hot new Posts" und die "Trending Threads" befanden wird nun im Conversation View (vormals: PNs) wieder dargstellt, da dort wirklich funktionale und nicht ganz unwichtige Elemente vorhanden sind (gemeldet von Bier.jpg). Die Sidebar wurde entsprechend verschlankt, und wird nur dort rechts dargestellt.

Fazit: Korrekt unterstützt werden nur Gecko ab Version 38 und Chromium ab Version 65 (schert mich nicht exakt zu testen, ab welcher Chromium Version es wirklich sauber geht). Wer alte Systeme einsetzt, wird wahrscheinlich sowieso Firefox oder Palemoon statt Chromium nehmen, der Security Updates halber.

Edit: Kalendersidebar wieder eingeblendet, da nützlich (vgl. Conversation view) und zig weitere Tunings eingebracht. Eines davon ist die "Online" Badge, die über dem Nutzeravatar eingeblendet wird, und Teile des Avatars verdeckt (Ist mir bei einem gewissen, drehenden Shuttle Avatar negativ aufgefallen). Zuerst dachte ich, ich reduziere das Ding auf einen grünen Knubbel ohne Text, aber ich habe mich dann für eine andere Lösung entschieden:

badgeonline.png

Muß keine Dauerlösung sein, immerhin schaut das nur bei wirklich eckigen Avataren gut aus. Für Nutzer die runde oder sonstwie transparente Avatare nutzen ist das evtl. nicht so super. Vielleicht noch was anderes überlegen. Aber immerhin verdeckts das Bild nicht mehr.

Ansonsten? Zig Bugfixes eingebracht, hauptsächlich was Margins/Paddings angeht. Die angesprochenen Filterboxen sind jetzt mit der Convo Sidebar natürlich auch wieder da, so kompakt wie nie.

Edit 2: Opera 12.xx fallen gelassen. Die prinzipielle Bedienbarkeit als reiner Leser läßt sich in der Tat wiederherstellen, sodaß alles klickbar wird. Allerdings bestehen verheerende JavaScript-Inkompatibilitäten, was das Benutzen so einiger interaktiver Elemente (Edit, Submit) unmöglich macht. Und ohne JavaScript funktioniert auch die Stylish Extension nicht auf Opera 12.xx. Da hilft auch das von Opera unterstützte User-CSS nicht weiter.

Generell läßt sich das Opera 12.xx Problem also mit CSS alleine nicht lösen. Dazu bräuchte es noch Userskripte via Greasemonkey oder ähnlich, was allerdings meinen Horizont etwas übersteigt (bin ja kein Webentwickler).

2018-07-03: Moderneres Stylish beinhaltet Spionagecode, daher wurde dessen Erwähnung hier gestrichen. Siehe Startpost.

Jap, ich kenne die Warnings vom modernen Stylish bei meinem CSS. Da waren noch viel mehr, und wo möglich habe ich den Code korrigiert. Aber bei so einem Override CSS (wo man den Code auf Serverseite nicht ändern kann) bleibt stellenweise nichts anderes übrig, als IDs statt Klassen oder Sachen wie <h3> Tags direkt anzusprechen.

Alle Warnings werden sich nie eliminieren lassen.

Solang er keine Errors meldet is das im grünen Bereich, sprich: Es beeinflußt nicht die Fähigkeit der Browser, das korrekt zu rendern.

PS.: Ist mein erster Post über das mobile Interface. Funzt tiptop mit'm KeyOne...

Das mit der Klickbarheit kriegt man hin im Opera, indem man den .dropdownMenuContainer verkleinert und raufschiebt (Achtung: Ein display: none; funktioniert seltsamerweise nicht!). Sowas in der Art ist ein quick & dirty Fix für Stylish 1.0 auf Opera 12.18, um alles klickbar zu machen:

/* Opera 12 Fixes */
.dropdownMenuContainer {
    width: 100px;
    max-width: 100px;
    min-width: 100px;
    max-height: 100px;
    min-height: 100px;
    position: absolute;
    top: 0;
}

Aber es hilft eh nichts, weil wie gesagt die JavaScript Probleme bleiben, und die sind verheerend. Deswegen habe ich das Projekt "VA-Classic für Opera 12" aufgegeben, obwohl schade, weil den Style bekäme man ordentlich hin.

Jo.. Opera 12 meint beim Inspizieren des Quellcodes, daß er die referenzierten .js Files gar nicht erst finden kann. Vielleicht wegen des irgendwas.js?v=<versionsnummer> Übergabewerts, der die Versionierung vom JS identifiziert? Kann der alte Opera JavaScript Files so vielleicht nicht laden? Klänge seltsam, aber ich wüßte nicht, was sonst schuld sein sollte.

Es ist leider nicht perfekt, ist mir erst gestern wieder aufgefallen (mit der "Online" Badge, die auf manchen Browsern zu weit nach rechts versetzt wird)... hat immer noch einen Haufen Bugs drin. Dessen muß man sich halt bewußt sein, wenn man das verwendet.

btw., ich bin hier natürlich auf eure Rückmeldungen angewiesen, wenn es darum geht, Unzulänglichkeiten zu beseitigen...

Das passiert nur, wenn du einen "Overflow" auslöst, ansonsten verhalten sich CTRL+ und CTRL- normal. Also, das seltsame Verhalten das du beobachtest tritt dann auf, wenn du ein Bild größer als dein Browserfenster (bzw. größer als die Webseitenbreite oder -höhe) machen willst. Solange das Bild kleiner ist, funktioniert alles normal. So konnte ich es zumindest bei mir hier nachstellen.

Grund dafür ist leider kein CSS, sondern [https://www.voodooalert.de/board/js/WCF.Combined.min.js].

Da es sich um ein JavaScript Problem handelt, kann ich da nicht viel tun. Ich empfehle, die Bilder in einem Thread oder in einer Konversation mit CTRLLeft Click zu öffnen, dann gehen's als nacktes Bild ohne umgebendes JavaScript oder CSS in einem neuen Tab auf. Dort verhält sich die Zoomkontrolle dann wie von dir gewohnt, weil keine Skripte reinpfuschen können.