Neue Farben zur Anpassung an die Linux Guides Webseite

Stardenver · June 1, 2023 at 9:00 AM

Hallo zusammen

Eventuell habt ihr ja schon gesehen, dass Jean der Seite einen neuen Anstrich verpasst hat und das Ganze nun weniger "mintig" ist. Mir persönlich gefällt es sehr gut. Ich werde mal schauen, wie die neue Farbe im Forum hier passt und ein angepasstes Template erstellen. Gleichzeitig werde ich einige Updates einspielen und hier und da vielleicht etwas umbasteln. Also nicht wundern, wenn über das Wochenende Veränderungen bemerkt werden oder die Farbe sich ändert.

Von Jean habe ich absolut freie Hand in der Gestaltung und er hat es mir sogar offen gelassen, die neue Farbe zu übernehmen. Aber aus Gründen der Cooperate Identity finde ich es sinnvoll, wenn alles einheitlich ist und als zusammengehörend erkennbar bleibt. Möglich wäre aber durchaus, das aktuelle Theme als Legacy weiterhin anzubieten, den Standard für neue Mitglieder aber auf das neue Design zu setzen. Ich werde da einfach das Wochenende mal etwas "herumspielen".

Grüße

Boris

kim88 · June 1, 2023 at 3:59 PM

Wenn ich hier noch einen Wunsch anbringen darf. Es wäre cool, wenn das neue Design einen Dark Mode hätte der automatisch angeht wenn jemand den Dark Mode auf seinem Desktop installiert hat.

Stelle · June 1, 2023 at 4:12 PM

Quote from kim88

Wenn ich hier noch einen Wunsch anbringen darf. Es wäre cool, wenn das neue Design einen Dark Mode hätte der automatisch angeht wenn jemand den Dark Mode auf seinem Desktop installiert hat.

Dark Reader als Browser Plugin wäre eine Lösung

Stardenver · June 5, 2023 at 10:58 AM

Ich habe die neue Farbe als Standard gesetzt, bin aber noch nicht so ganz durch. Da wird es die Tage sicher noch weitere kleine Anpassungen und optimierungen geben. Da dies für neue Mitglieder die Standard-Farbe sein soll, habe ich diese auch als Standard gesetzt. Ich vermute allerdings, dass sie dadurch für euch alle als Standard gesetzt wurde. Das tut mir leid und ich entschuldige mich, dass hier ein kurzer Eingriff eurerseits notwendig ist, falls ihr die neue Staandard-Farbe nicht verwenden wollt.

Wenn ihr in eure Einstellungen geht, findet ihr dort den LinuxGuides Legacy Stil. Das ist quasi das alte Design und ihr könnt hier zurück springen, wenn ihr dies möchtet.

Sollten euch - sowohl im neuen, als auch im alten Design - noch Fehler, Unstimmigkeiten, etc auffallen, bitte ich euch um kurze Rückmeldung. Ich werde das dann heute Abend nach dem Spätdienst nochmal angehen.

Ich danke euch

stefan.johnigk · June 5, 2023 at 10:59 AM

Ja, hab mich gerade erschrocken, dann viel mir wieder ein dass Du das ja angekündigt hattest. 🤣

Sieht auf den ersten Blick gut aus, die neue Farbe.

Riley · June 5, 2023 at 11:29 AM

Finde die Farbe besser.

Es sticht nicht mehr extrem in Auge und die Farbe ist echt gut geworden

Ich genehmige dir das Design und Dankeschön für die Arbeit und Mühe

Nibbler · June 5, 2023 at 11:40 AM

Ja, ist gut geworden Logo und Favicon müssten noch. Beißt sich etwas und die finale Frage:

staryvyr · June 5, 2023 at 11:43 AM

Quote from Riley

Es sticht nicht mehr extrem in Auge und die Farbe ist echt gut geworden

Ansichtssache. Ich finde das Grün viel beruhigender für meine Augen und das Türkis

beißt einfach nur.

Stardenver

Vielen Dank für die Möglichkeit, auf das Legacy zurückstellen zu können! Das ging auch recht

intuitiv.

Olaf · June 5, 2023 at 11:56 AM

Stardenver

Ich find die Farbe cool. Überlege mir sogar, meine Fenstereinstellungen auch so anzupassen

Tealk · June 5, 2023 at 12:14 PM

Quote from stefan.johnigk

Ja, hab mich gerade erschrocken, dann viel mir wieder ein dass Du das ja angekündigt hattest. 🤣
Sieht auf den ersten Blick gut aus, die neue Farbe.

So ging es mir auch 😅

Borrtux · June 5, 2023 at 2:17 PM

Bei mir blieb die alte Version, die ich gewählt hatte eingestellt.

Quote from Nibbler

Ja, ist gut geworden Logo und Favicon müssten noch. Beißt sich etwas und die finale Frage:

Reicht dir dies nicht als Darkmode?

kim88 · June 5, 2023 at 5:58 PM

Leider weiterhin ohne nativen Dark-Mode, also bleibt mein Stylus Projekt bestehen. Das Favicon ist noch im alten Grün - gilt auch für die LinuxGuides Hauptseite.

torius · June 5, 2023 at 8:22 PM

Ich benutze DarkReader als addon, so ist jede Webseite automatisch im Dark Mode, zumindest die meisten.

für Firefox

für Chrome

MFG

Stardenver · June 5, 2023 at 9:20 PM

Quote from kim88

Leider weiterhin ohne nativen Dark-Mode, also bleibt mein Stylus Projekt bestehen. Das Favicon ist noch im alten Grün - gilt auch für die LinuxGuides Hauptseite.

Ich hatte schon vor einiger Zeit mal geschaut. Damit man sich nicht alles zerschießt, arbeitet Woltlab ja mit Plugins. Das für automatischen Darkmode sollte aber richtig Geld kosten. Ich schaue die Tage gerne nochmal, ob es da mittlerweile einfache Lösungen gibt.

Alternative wäre ein manueller Dark Mode. Da müsste ich mich aber erst mal hinein fuchsen. Design ist so null meins. Aber ich schaue einfach mal.

kim88 · June 5, 2023 at 10:08 PM

Also rein technisch müsste das einfach innerhalb vom CSS gehen. Beispiel:

Code

body {
    background-color: white;
}

@media (prefers-color-scheme: dark) {
    body {
        background-color: black;
    }
}

So wäre die Hintergrundfarbe vom Design standardmässig weiss, und wenn jemand den Dark Mode aktiviert hat wird die Hintergrundfarbe Schwarz.

So hab ich auch mein "Auto-Dark-Mode LinuxGuides Forum Stylus CSS Dings" gebaut. Dunkle Designs bauen, die noch gute Kontrastverhältnisse haben und nicht einfach nur "weiss auf schwarz" sind ist ziemlich aufwendig.

Ab Chromium Version 114, können Google Chrome & Co das (endlich!) auch unter Linux. War bisher nur Mac OS, Windows, Android und iOS vorenthalten.

staryvyr und torius vielleicht liegt es daran, dass ich selber in der Web Entwicklung tätig bin. Aber ich will es ja nicht einfach nur "dunkel" haben - sondern es soll ja doch noch weiterhin schön aussehen. Und Kontraste sollten weiterhin funktionieren.

Sehr gute Beispiele für einen optisch wirklich gut umgesetzten Dark Mode ist sicherlich "Facebook" oder "ComputerBase" die das beide übrigens auch über dieses MediaQuery machen.

Diese über Addons automatisiert dunkel gemachten Seiten sehen. Google hat da in Kombination mit ihrem "Material Design" einen ziemlich ausführlichen Leitfaden auf was man alles achten sollte. Siehe hier: https://m2.material.io/design/color/dark-theme.html

staryvyr · June 5, 2023 at 10:46 PM

Quote from kim88
Also rein technisch müsste das einfach innerhalb vom CSS gehen. Beispiel:
Code
body {
    background-color: white;
}

@media (prefers-color-scheme: dark) {
    body {
        background-color: black;
    }
}
So wäre die Hintergrundfarbe vom Design standardmässig weiss, und wenn jemand den Dark Mode aktiviert hat wird die Hintergrundfarbe Schwarz.

So hab ich auch mein "Auto-Dark-Mode LinuxGuides Forum Stylus CSS Dings" gebaut. Dunkle Designs bauen, die noch gute Kontrastverhältnisse haben und nicht einfach nur "weiss auf schwarz" sind ist ziemlich aufwendig.
Ab Chromium Version 114, können Google Chrome & Co das (endlich!) auch unter Linux. War bisher nur Mac OS, Windows, Android und iOS vorenthalten.
staryvyr und torius vielleicht liegt es daran, dass ich selber in der Web Entwicklung tätig bin. Aber ich will es ja nicht einfach nur "dunkel" haben - sondern es soll ja doch noch weiterhin schön aussehen. Und Kontraste sollten weiterhin funktionieren.
Sehr gute Beispiele für einen optisch wirklich gut umgesetzten Dark Mode ist sicherlich "Facebook" oder "ComputerBase" die das beide übrigens auch über dieses MediaQuery machen.

Diese über Addons automatisiert dunkel gemachten Seiten sehen. Google hat da in Kombination mit ihrem "Material Design" einen ziemlich ausführlichen Leitfaden auf was man alles achten sollte. Siehe hier: https://m2.material.io/design/color/dark-theme.html
Display More

Danke ich behalte das mal im Hinterkopf. Momentan bin ich mit dem Legacy-Modus hier zufrieden.

tempograd · June 6, 2023 at 12:46 PM

Ha, die Farben sind fast exakt passend zu meinem "Mint-y-Darker-Teal" Theme (aus den mint-themes-legacy). Ich würde sagen passt perfekt!! Gefällt mir.

Helmfuss · June 6, 2023 at 4:46 PM

Mir gefällt es sehr gut 👍.

Noch das Favicon in der Farbe, dann wird auch die Leiste so eingefärbt.

Olaf · September 20, 2023 at 12:47 PM

Moin,

wenn ich den Forum-Stil auf Flatbrit ändere, habe ich hin und wieder das Problem, dass schwarzer Text angezeigt wird:

So sieht es im Stil Legacy aus:

maschu666 · September 20, 2023 at 12:55 PM

Quote from Olaf

Moin,
wenn ich den Forum-Stil auf Flatbrit ändere, habe ich hin und wieder das Problem, dass schwarzer Text angezeigt wird:

So sieht es im Stil Legacy aus:

Ist hier auch so. Auf Win, Linux und MacOS.

Participate now!