CSS-Datei speziell für LibreOffice?

[juribel]

Kennt hier jemand eine Möglichkeit, das Design von LibreOffice mit CSS zu beeinflussen, so ähnlich, wie man das in Firefox und Thunderbird in seinem Profil mit einer userChrome.css machen kann? Ich hab schon die ganze Kugel durchsucht, aber nur Hinweise gefunden, die sich um CSS im Zusammenhang mit den erstellten Texten drehen, aber nicht um das Design von LibreOffice selber.

[KP97]

Sag mal genauer, was Du ändern möchtest, vielleicht auch mit einem Screenshot.

[GregorS]

Kennt hier jemand eine Möglichkeit, das Design von LibreOffice mit CSS zu beeinflussen, so ähnlich, wie man das in Firefox und Thunderbird in seinem Profil mit einer userChrome.css machen kann? Ich hab schon die ganze Kugel durchsucht, aber nur Hinweise gefunden, die sich um CSS im Zusammenhang mit den erstellten Texten drehen, aber nicht um das Design von LibreOffice selber.

Wie kommst Du auf die Idee, man könne das Design von LibreOffice via CSS manipulieren? Was meinst Du mit CSS überhaupt? Ich kenne das als „Cascading Style Sheets“ und das bringe ich im Kopf nicht mit dem Design eines Programms zusammen.

Gruß

Gregor

Siehe https://de.wikipedia.org/wiki/CSS

[juribel]

Danke für eure Antworten!

@KP97: In den Pulldown-Menüs, z. B. im "Datei"-Menü von LibreOffice, gibt es zwischen einigen Menüpunkten eine dünne Trennlinie. Diese lässt sich mit CSS verändern, z. B. in Dicke, Farbe und Transparenz. In dem Pulldown-Menü für die Schriftart gibt es eine hauchdünne kaum sichtbare Trennlinie, die die Liste der zuletzt gewählten Schriften von der gesamten Liste der Schriften trennt. Das ist aber ein anderes CSS-Element, und das ändert sich nicht. In LibreOffice 6.4 war diese Linie deutlich sichtbar, und jetzt ist sie kaum noch zu erkennen.

@GregorS: Klar kann man Oberflächen-Elemente vieler Anwendungen mit CSS ändern. Zumindest unter Linux ist so etwas eine Selbstverständlichkeit, und es funktioniert ja auch (s. o.). Falls du Windows benutzt, kann es natürlich sein, dass solche Möglichkeiten dort gar nicht vorgesehen sind. Ich kann das leider nicht ausprobieren, ich habe seit 15 Jahren kein Windows mehr. Unter Linux kann man mit CSS die gesamte Betriebssystemoberfläche mit sämtlichen Elementen und auch die Oberflächen der meisten Programme nach Belieben anpassen.

[GregorS]

... Klar kann man Oberflächen-Elemente vieler Anwendungen mit CSS ändern. ...

Huh?! Bislang habe ich CSS nur im Zusammenhang mit HTML kennengelernt, nie im Zusammenhang mit der Oberflächengestaltung einer Anwendung. Und das Ergebnis Deiner Recherche legt IMO auch nahe, dass es das nicht gibt. Aber ich lerne gerne etwas Neues kennen (immer öfter auch Altes ...

Gruß

Gregor

[juribel]

Und das Ergebnis Deiner Recherche legt IMO auch nahe, dass es das nicht gibt

Falsch verstanden. Zumindest unter Linux ist der Einsatz von CSS eine Selbstverständlichkeit, um das Aussehen von grafischen Elementen zu verändern. So habe ich zum Test mit CSS die Separator-Linien für Menüs blau gefärbt. Das funktioniert in so gut wie allen Anwendungen, auch in LibreOffice, aber dort nur nicht mit der beschriebenen Separatorlinie im Schriften-Menü. Der Firefox-Browser hat unter Linux einen eigenen Profil-Ordner, in dem man eine CSS-Datei namens "userChrome.css" unterbringen kann. Dort eingestellte Anpassen wirken ausschliesslich auf Firefox. Bei dem Mailprogramm Thunderbird verhält sich das genau so.

Aber wie gesagt, ob es so etwas unter Windows überhaupt gibt, kann ich weder bestätigen noch dementieren, ich habe keins

NACHTRAG: Wie fügt man hier Bilder ein?

[KP97]

Da muß ich leider passen. Über die hauseigenen Funktionen in "Anpassen" und "Optionen" kann man schon eine Menge einstellen, aber gerade die Trennlinien sind nicht dabei.

Bilder:
gallery/album/1
und dann verlinken im Beitrag.

[juribel]

Danke

[schorsch_76]

Und das Ergebnis Deiner Recherche legt IMO auch nahe, dass es das nicht gibt

Falsch verstanden. Zumindest unter Linux ist der Einsatz von CSS eine Selbstverständlichkeit, um das Aussehen von grafischen Elementen zu verändern. So habe ich zum Test mit CSS die Separator-Linien für Menüs blau gefärbt. Das funktioniert in so gut wie allen Anwendungen, auch in LibreOffice, aber dort nur nicht mit der beschriebenen Separatorlinie im Schriften-Menü. Der Firefox-Browser hat unter Linux einen eigenen Profil-Ordner, in dem man eine CSS-Datei namens "userChrome.css" unterbringen kann. Dort eingestellte Anpassen wirken ausschliesslich auf Firefox. Bei dem Mailprogramm Thunderbird verhält sich das genau so.

Aber wie gesagt, ob es so etwas unter Windows überhaupt gibt, kann ich weder bestätigen noch dementieren, ich habe keins

NACHTRAG: Wie fügt man hier Bilder ein?

Das würde ich so nicht generell sagen. AFAIK kann man in Gnome viel per CSS anpassen aber Gnome ist nicht Linux. Es ist nur eine DE von vielen.

[1] https://gjs.guide/extensions/

[juribel]

Moin,

stimmt, das kann man nicht generell sagen. Ich benutze Xfce, und das ist weitestgehend mit CSS konfigurierbar. Das gesamte Theming mit den "Erscheinungsbild"-Themes beruht auf CSS. Zumindest unter Xfce braucht man dazu keine Extensions, es ist bereits alles an Bord und Teil von Xfce.

Auf den Gedanken, LibreOffice mit einer speziellen CSS-Datei zu beglücken, komme ich, weil dies in Firefox und Thunderbird genau so vorgesehen ist: eine Datei namens userChrome.css in deren Profil-Ordnern. Mit einer Datei ~/.config/gtk-3.0/gtk.css hingegen kann man für seinen Benutzer generelle Einstellungen vornehmen, aber die Einstellungen, die ich vornehmen will, möchte ich auf LibreOffice beschränken.

[Huo]

In dem Pulldown-Menü für die Schriftart gibt es eine hauchdünne kaum sichtbare Trennlinie, die die Liste der zuletzt gewählten Schriften von der gesamten Liste der Schriften trennt. Das ist aber ein anderes CSS-Element, und das ändert sich nicht. In LibreOffice 6.4 war diese Linie deutlich sichtbar, und jetzt ist sie kaum noch zu erkennen.

Diese Trennlinie muss ja irgendwie vom gewählten GTK3-Thema abhängen. Während die Linie bei den meisten Themen tatsächlich sehr blass ausfällt, erscheint sie mit dem (überhaupt angenehm augenfreundlichen) Thema clearlooks-phenix in kräftigem Schwarz. Allerdings ist es mir nicht gelungen, das verantwortliche Element in den CSS-Dateien des Themas zu identifizieren.

Man kann übrigens ein von der globalen Einstellung abweichendes Thema exklusiv für LibreOffice nutzen, indem man die Desktopdatei /usr/share/applications/libreoffice-writer.desktop nach ~/.local/share/applications/ kopiert und dann die Exec-Zeile modifiziert:

Code: Alles auswählen

Exec=env GTK_THEME=clearlooks-phenix libreoffice --writer %U

[juribel]

Danke für den Tipp. Wenn es tatsächlich vom gewählten Thema abhängt, muss sich das ja eigentlich auch identifizieren lassen

[juribel]

Gerade habe ich mir das Theme installiert und kann es nachvollziehen: diese Linie erscheint tatsächlich schwarz statt hellgrau auf hellergrau. Dann geh ich jetzt mal auf die Suche... leider liegt das Theme nur in Form von css-Dateien vor und nicht im .scss-Quellenformat. Wenn ich etwas gefunden habe, berichte ich gerne.

[KP97]

... leider liegt das Theme nur in Form von css-Dateien vor und nicht im .scss-Quellenformat.

Da hast Du Glück gehabt, denn diese Dateien kann man bearbeiten, ganz im Gegensatz zu den verschlossenen gresource Binaries, die mittlerweile in fast allen Themes verwendet werden.
Wenn es um Systemthemes geht, kann ich Dir natürlich helfen, ich mache meine Themes schon lange selbst.

Also, in clearlooks gibt es in /usr/share/themes/clearlooks/gtk-3.0.
Darin die Dateien gtk.css, hier stehen die Default Variablen, auf die sich in gtk-widgets.css bezogen wird.
In gtk-widgets.css steht in Zeile 1778 schon, was Du wohl suchst. Hier kannst Du Deine Farbe als Hexa, z.B. #000000 für schwarz, eintragen. Wenn Du nach dem Begriff "separator" suchst, finden sich noch andere Stellen.
Auf diese Weise kannst Du das ganze Theme nach Deinen Vorstellungen neu gestalten... viel Spaß dabei.

Ich hatte übrigens in LO selbst mit den Entwicklerwerkzeugen geschaut, aber da gibt es nichts in der Richtung. Wenn ich das richtig verstanden habe, beziehen sich Änderungen nur auf das Dokument, aber nicht auf LO selbst z.B. das Menü. Unter "Anpassen" läßt sich auch noch einiges verändern, aber nicht mit CSS.

[juribel]

Danke für deine Hinweise!

Auch ich habe bereits einige Erfahrungen mit der Erstellung von themes sammeln können, seitdem ich bei der Suche auf ein Theme gestossen bin, welches nicht nur .css-Dateien enthält, sondern Sourcecode in Form von .scss-Dateien, die mit dem sass-Compiler in gültiges CSS übersetzt werden können und erheblich mehr Freiheiten bei der Formulierung der Stylesheets bieten.

Das Separator-Element in LibreOffice, das man bei mir kaum erkennen konnte, ist entgegen meiner Annahme kein Menü-Separator (diese hatte ich ja bereits gefunden und auch erfolgreich eingefärbt). Hier handelt es sich jetzt um das Separator-Element von treeview.view. Beides kann man in seinem Theme ändern, die Änderungen wirken aber auch (unabhängig vom gewählten Theme), wenn man sie in eine Datei ~/..config/gtk-3.0/gtk.scss schreibt und diese kompiliert, oder (das sollte ebenfalls funktionieren) auch direkt in eine Datei .../gtk.cs, hier zum Test in blauer Farbe:

Code: Alles auswählen

menu separator, .menu separator, .menuitem separator { 
  background-color: #00f;                              
  border-radius: 2px;                                  
}                                                      
                                                       
treeview.view {                                        
  &.separator {                                        
    min-height: 2px;                                   
    color: #00f;                                       
  }                                                    
}                                                      

[KP97]

...oder (das sollte ebenfalls funktionieren) auch direkt in eine Datei .../gtk.cs,

Ja, das funktioniert auch.
Hier kann man auch z.B. nur für Thunar Änderungen einstellen, wenn man etwas nicht global haben will.
Man kann schon eine Menge machen, jetzt haben wir ja Zeit...

Dieses scss bzw. sass war mir nicht geläufig, ich kann mich ganz dunkel erinnern, das mal gelesen zu haben, habe das aber nicht weiter verfolgt.
Ich glaube, das direkte css ist weniger Aufwand für bereits vorhandene Themes.

[Huo]

[...] hier zum Test in blauer Farbe:

Code: Alles auswählen

menu separator, .menu separator, .menuitem separator { 
  background-color: #00f;                              
  border-radius: 2px;                                  
}                                                      
                                                       
treeview.view {                                        
  &.separator {                                        
    min-height: 2px;                                   
    color: #00f;                                       
  }                                                    
}                                                      

Der treeview-Teil funktioniert bei mir nicht ... keine blaue Linie und Fehler

Code: Alles auswählen

Theme parsing error: gtk.css:7:2: Expected semicolon

So klappt's:

Code: Alles auswählen

treeview.view.separator {
    min-height: 2px;
    color: #00f;
}

Meine CSS-Kenntisse sind ziemlich begrenzt. Kann jemand erklären, warum die Variante mit dem Ampersand (&) nicht funktioniert? Wo muss das laut Fehlermeldung fehlende Semikolon hin?

[GregorS]

Kann jemand erklären, warum die Variante mit dem Ampersand (&) nicht funktioniert? Wo muss das laut Fehlermeldung fehlende Semikolon hin?

Ich vermute, dass jedes Element innerhalb eines Blocks mit einem Semikolon abgeschlossen werden muss.
Was für die Dinge in der inneren Klammer gilt (und dort ja auch stimmt), gilt auch für den inneren Block selbst. Funktioniert's denn, wenn Du nach der vorletzten „Klammer zu“ ein Semikolon setzt?

Gruß

Gregor

[juribel]

Oh sorry! Der Grund für den Fehler ist, dass ich den .scss-Quellcode gepostet habe und nicht daran dachte, dass der übersetzte CSS-Code anders aussieht. Gültiges CSS ist auch gültiger .scss-Code, aber nicht umgekehrt. .scss muss mit dem sassc-Compiler in gültiges CSS übersetzt werden. Dein Code ist genau das, was auch der Compiler als CSS ausspuckt.

[GregorS]

Oh sorry! Der Grund für den Fehler ist, dass ich den .scss-Quellcode gepostet habe und nicht daran dachte, dass der übersetzte CSS-Code anders aussieht. Gültiges CSS ist auch gültiger .scss-Code, aber nicht umgekehrt. .scss muss mit dem sassc-Compiler in gültiges CSS übersetzt werden. Dein Code ist genau das, was auch der Compiler als CSS ausspuckt.

Frage an die anderen Mitlesenden: Sollte dann nicht der „Empfänger“ – ich meine das per CSS gesteuerte Programm (hier im Thread LO) – darum kümmern, dass .scss-Dateien kompiliert werden? Oder ist ein sassc-Compiler ein so umfangreiches Gebilde, dass man das nicht in den Client einbauen kann?

Gruß

Gregor

[juribel]

Das würde wohl zu weit gehen. Der Standard und gemeinsame Nenner für Style sheets ist CSS. sassc ist ein Präprozessor für .scss-Dateien, die eine Erweiterung für CSS darstellen. Hinzu kommt, dass sassc nicht der einzige Präprozessor ist und .scss auch nicht die einzige Erweiterungssprache. .sass-Dateien bezwecken dasselbe, haben aber eine völlig andere nicht kompatible Syntax. Und dann gibt es noch (so hab ich gelesen) einen weiteren Präprozessor namens less. Wiederum eigentlich eine andere Sprache. Und alle Compiler spucken sauberes lauffähiges CSS aus.

.scss besitzt nach meiner Erfahrung einen Haufen Vorzüge gegenüber dem Programmieren in "reinem" CSS. Ich möchte hier jetzt nicht darauf eingehen, das lässt sich alles nachlesen.

[KP97]

Frage an die anderen Mitlesenden: Sollte dann nicht der „Empfänger“ – ich meine das per CSS gesteuerte Programm (hier im Thread LO) – darum kümmern, dass .scss-Dateien kompiliert werden?

Libreoffice wird da gar nichts machen, das kennt kein sass. Dass überhaupt die Gtk3-Ansicht erscheint, liegt an dem Paket libreoffice-gtk3, welches wohl Schnittstellen hat, die auf das Systemtheme zugreifen können. Genauso ist es mit libreoffice-qt5, welches ja auch die Qt-Ansicht eines entsprechenden Themes anpaßt. Ohne diese beiden Pakete sieht Libreoffice ganz anders aus, und dann würden auch die Einträge im Home von LO nichts bewirken.
Ich habe es aber nicht ausprobiert, kannst Du aber mal machen, wenn Du Lust hast.

[GregorS]

Danke juribel, KP97!

Demnach hat sich die Bedeutung/der Einsatzbereich von CSS in den letzten Jahren deutlich geändert.

Mist, dass man sich nicht um alles kümmern kann, was einen interessiert ...

[juribel]

@KP97: Danke für die gute Erklärung!

@GregorS: Ja, Mist, es ist ein Fass ohne Boden, aber sooo interessant

[DaCoda]

Jedes Programm, welches Qt verwendet, kann mit CSS angepasst werden.