Der Trend hin zu Touchscreen optimierten Oberflächen ist für Desktopnutzer oft ein enormer Rückschritt, da sehr viel Platz dadurch verloren geht sowie Menüs und GUIs unübersichtlich werden. Gab es bis Version 90 noch einen Kompakt-Modus des Browsers, ist dieser ab Version 91 endgültig aus den Auswahlmenüs verschwunden. Firefox bietet aber weiterhin über den about:config Dialog und das CustomCSSforFx Framework unzählige Konfigurationsmöglichkeiten, u.a. 2 Kompatktmodi. Einmal den Proton-Real Compact Mode und den Proton Compact Mode. Der Proton Compact Mode bietet im Gegensatz zum Proton Real Compact Mode weiterhin alle Konfigurationsmöglichkeiten des CustomCSSforFX Frameworks.
About:Config Werte ändern
Für beide o.g. Modi müssen mithilfe des Firefox about:config Konfigurationsdialogs einige Werte geändert werden:
| toolkit.legacyUserProfileCustomizations.stylesheets | true | |
| browser.uidensity | 1 |
CustomCSSforFX Framework einrichten
Das CustomCSSforFX Framework für Firefox 91+ befindet sich im „classic“ Ordner des auf Github herunterladbaren Archivs, wird in den Firefox Benutzerprofilorder kopiert und in chrome umbenannt, sodass der Inhalt des Ordners „classic“ sich dann im Ordner „chrome“ befindet.
Alternativ kann ein vorkonfiguriertes Framework ( Proton Compact Mode ) genutzt werden.
CustomCSSforFX Framework konfigurieren
Über die sehr gut dokumentierte userChrome.css werden sämtliche vorkonfigurierten CSS Dateien geladen. Das Design des Proton Compact Mode ergibt sich aus der Änderung folgender Zeilen der userChrome.css:
| enable borderless B/W navigation buttons : | D 125 D 150 ( /* @import „./css/buttons/icons_colorized.css“; /**/ ) |
| diable hamburger button : | D 234 D 235 / E 231 => Button invisible – empty buttun space incorrect |
| restore proton tab button style : | D 301 ( /* @import „./css/tabs/classic_squared_tabs.css“; /**/ ) |
| move Tabs down below bookmark line : | E 325 ( @import „./css/tabs/tabs_below_navigation_toolbar.css“; /**/ ) |
| show tab close icon only when hover : | D 387 / E 389 ( @import „./css/tabs/tab_close_show_on_hover_only.css“; /**/ ) |
* ( D/E <line> = (D)isable / (E)nable <linenumber> )
TabToolBar verkleinern
Um die Tableiste ebenfalls ein wenig kompakter zu gestalten, müssen einige Änderungen in der Datei „./css/tabs/tabs_below_navigation_toolbar.css“ vorgenommen werden:
- Änderung => „–tab-min-height_tnot: 32px;“ zu „–tab-min-height_tnot: 25px;“
- Hinzufügen des Wertes in #TabsToolbar:not(:-moz-lwtheme) => „height: 29px;“
- Hinzufügen des Wertes in #tabbrowser-tabs => „margin-top: -4px; „
Bekannte Fehler
- Der sogenannte Hamburger Button ist nur unsichtbar, jedoch noch vorhanden. Menu ist daher verschoben
Ausstehende Optimierungen
- Weiteren Tabstyle wie in FF ESR hinzufügen
- Tab Buttonhöhe reduzieren
Speefak
