Das Forum hier im Dark-Mode?

[GS-Dirgi]

Das geht tatsächlich und evtl. einfacher als Du denkst.
So könnte das aussehen:


Wie geht das?

Schaue mal in Deinem Browser, ob es dafür die Erweiterung "Stylus" gibt. Lade diese dann herunter und aktiviere sie.​

Ich benutze den Brave Browser (ein Google Chrome Derivat) - Somit sollte die Erweiterung schon mal für alle auf dr Chrome Engine basierenden Browser funktionieren. Für andere Browser (Edge, Firefox, Safar etc.) einfach mal schauen.​

Was macht die Erweiterung:

Sie ändert im Prinzip das Aussehen der Seite (so wie Du es möchtest) ohne, das sie die original Seite ändert. Nur für Dich wird die Seite anders aussehen, solange DU es möchtest.​

Es hat keinen Einfluss auf die Seite und du machst dort nichts kaputt.​

Wenn Du Stylus installiert hast, starte es:
Das sieht dann so aus (hier stehen schon Einträge drin - bei Euch ist es noch leer)


Unter 1:
Trägst Du nun die Adresse der Homepage ein, auf der Die Erweiterung angewendet werden soll: also www.gs-forum.eu

Unter 2:
muss nun der Code hinein kopiert werden, damit die Homepage in Zukunft im Darkmode erscheint.
Natürlich kannst Du jeden anderen CSS Code auch hinein kopieren.

Zum Abschluss nur noch speichern und ab sofort erscheint die Forum Seite im Dark Mode bis Du es wieder deaktivierst.

Hier ist der Code:

Spoiler: Klicke zum ausklappen des Codes

/* --- ULTIMATIVER DEEP-DARK MODE FÜR GS-FORUM.EU --- */

/* 1. RADIKALE BASIS-ABDUNKLUNG */
html, body, .p-pageWrapper, .p-sectionMain, .p-body, .p-body-inner,
div, section, header, footer, article, aside {
    background-color: #121212 !important;
    background-image: none !important;
    color: #b0b0b0 !important;
    border-color: #2a2a2a !important;
}

/* 2. INHALTS-BOXEN & LINIEN-FIX (Tabellen & Trenner abdunkeln) */
.block-container, .block-header, .block-footer, .block-body, .block-row,
.structItem, .message-inner, .message-cell, .p-breadcrumbs,
.p-header, .p-nav, .p-navSticky, .p-nav-inner, .p-footer, .offCanvasMenu-content,
.block-separator, .message-main, .message-user, .p-body-sideNav, .p-body-sidebar,
.dataList-cell, .dataList-row, .table, .table td, .table th, .dataList {
    background-color: #1c1c1c !important;
    color: #d1d1d1 !important;
    border-color: #333333 !important; /* Dezentes Grau für alle Rahmen */
    box-shadow: none !important;
}

/* 3. DER ULTIMATIVE PAGINATION-FIX (VOR, ZURÜCK, ZAHLEN) */
.pageNav-page,
.pageNav-jump,
.pageNav-prev,
.pageNav-next,
.pageNav-main > li,
.pageNav-main > li > a,
.button.button--link,
a.pageNav-prev,
a.pageNav-next,
.pageNav .button {
    background-color: #2a2a2a !important;
    color: #64b5f6 !important;
    border: 1px solid #444444 !important;
    background-image: none !important;
    text-shadow: none !important;
}

/* Aktive Seite */
.pageNav-page.pageNav-page--current,
.pageNav-main > li.pageNav-page--current > a {
    background-color: #444444 !important;
    color: #ffffff !important;
    border-color: #64b5f6 !important;
}

/* Hover für die Navigation */
.pageNav-page:hover, .pageNav-jump:hover, .pageNav-prev:hover, .pageNav-next:hover,
.pageNav-main > li > a:hover, .pageNav .button:hover {
    background-color: #3d3d3d !important;
    color: #ffeb3b !important;
}

/* 4. BLOCK-OUTER & STATUSBEREICH */
.block-outer, .block-outer-main, .block-outer-opposite, .js-threadStatusField {
    background-color: #121212 !important;
    color: #d1d1d1 !important;
}

/* 5. EDITOR & OVERLAYS */
.bbWrapper, .message-content, .fr-wrapper, .fr-toolbar, .input, .js-editor,
.overlay-content, .menu-content, .select2-dropdown {
    background-color: #222222 !important;
    color: #f0f0f0 !important;
    border: 1px solid #3a3a3a !important;
}

/* 6. LOGO & ALLGEMEINE LINKS */
a { color: #64b5f6 !important; }
.button, .button--primary { background-color: #333333 !important; color: #ffffff !important; border-color: #444 !important; }
.p-header-logo img { filter: invert(0.8) brightness(0.8); }

[COLOR=rgb(224, 224, 224)]

 

[Eckart]

Das geht tatsächlich und evtl. einfacher als Du denkst.

Vielen Dank für Deine Mühe. Tatsächlich verwende ich vorzugsweise den dunklen Modus, wo verfügbar. Weil das oft nicht gegeben ist, hatte ich mir in Firefox das Add-On Dark Reader installiert, das zwar grundsätzlich funktioniert, aber weil es die Farben schematisch ändert, produziert es oft nur mäßige Darstellungen mit schecht aufeinander abgestimmten Farben, weswegen ich es dann doch meist deaktiviert lasse.
Das von Dir vorgeschlagene Add-On ist auf jeden Fall der bessere Ansatz für Webseiten, die nicht selbst ein dunkles Farbmodell bereitstellen, allerdings muss man es ja selbst mit einem passendes Farbmodell füttern. Zumindest auf den allerersten Blick funktioniert es mit Deinen CSS-Daten sogar - vielen Dank füs Teilen.
Allerdings ...

ab sofort erscheint die Forum Seite im Dark Mode bis Du es wieder deaktivierst.

Aber so ganz fehlerfrei arbeitet es wohl nicht. Klicke ich Links in der linken Spalte an, erscheint die angewählte Seite im hellen Farbmodell, auch nach einem Aktualisieren weiterhin. Gilt aber nicht für alle Links. Ich beobachte das einfach mal. Vielleicht gibt es ja noch Optimierungsmöglichkeiten.