{"id":5983,"date":"2021-08-22T19:21:04","date_gmt":"2021-08-22T17:21:04","guid":{"rendered":"https:\/\/speefak.spdns.de\/oss_lifestyle\/?p=5983"},"modified":"2024-06-02T10:45:04","modified_gmt":"2024-06-02T08:45:04","slug":"firefox-style-framework","status":"publish","type":"post","link":"https:\/\/speefak.spdns.de\/oss_lifestyle\/firefox-style-framework\/","title":{"rendered":"Firefox Style Framework"},"content":{"rendered":"<p>Der Trend hin zu Touchscreen optimierten Oberfl\u00e4chen ist f\u00fcr Desktopnutzer oft ein enormer R\u00fcckschritt, da sehr viel Platz dadurch verloren geht sowie Men\u00fcs und GUIs un\u00fcbersichtlich werden. Gab es bis Version 90 noch einen Kompakt-Modus des Browsers, ist dieser ab Version 91 endg\u00fcltig aus den Auswahlmen\u00fcs verschwunden. Firefox bietet aber weiterhin \u00fcber den about:config Dialog und das <a href=\"https:\/\/github.com\/Aris-t2\/CustomCSSforFx\" target=\"_blank\" rel=\"noopener\">CustomCSSforFx<\/a> Framework unz\u00e4hlige Konfigurationsm\u00f6glichkeiten, u.a. 2 Kompatktmodi. Einmal den <a href=\"https:\/\/github.com\/Aris-t2\/CustomCSSforFx\/issues\/334\">Proton-Real Compact Mode<\/a> und den <a href=\"https:\/\/github.com\/Aris-t2\/CustomCSSforFx\/issues\/406#issuecomment-903268401\" target=\"_blank\" rel=\"noopener\">Proton Compact Mode<\/a>. Der Proton Compact Mode bietet im Gegensatz zum Proton Real Compact Mode weiterhin alle Konfigurationsm\u00f6glichkeiten des CustomCSSforFX Frameworks.<\/p>\n<hr \/>\n<h2>About:Config Werte \u00e4ndern<\/h2>\n<p>F\u00fcr beide o.g. Modi m\u00fcssen mithilfe des <a href=\"https:\/\/support.mozilla.org\/de\/kb\/konfigurationseditor-fur-firefox#:~:text=The%20Configuration%20Editor%20(about%3Aconfig,present%20in%20the%20Settings%20panel.\" target=\"_blank\" rel=\"noopener\">Firefox about:config Konfigurationsdialogs<\/a> einige Werte ge\u00e4ndert werden:<\/p>\n<table class=\" aligncenter\">\n<tbody>\n<tr>\n<td style=\"text-align: right;\">toolkit.legacyUserProfileCustomizations.stylesheets<\/td>\n<td style=\"text-align: left;\">true<\/td>\n<td style=\"text-align: left;\"><\/td>\n<\/tr>\n<tr>\n<td style=\"text-align: right;\">browser.uidensity<\/td>\n<td>1<\/td>\n<td><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<hr \/>\n<h2>CustomCSSforFX Framework einrichten<\/h2>\n<p>Das CustomCSSforFX Framework f\u00fcr Firefox 91+ befindet sich im &#8220;classic&#8221; Ordner des auf Github herunterladbaren <a href=\"https:\/\/github.com\/Aris-t2\/CustomCSSforFx\/archive\/refs\/heads\/master.zip\" target=\"_blank\" rel=\"noopener\">Archivs<\/a>, wird in den <a href=\"https:\/\/support.mozilla.org\/de\/kb\/benutzerprofile-mit-ihren-persoenlichen-daten\" target=\"_blank\" rel=\"noopener\">Firefox Benutzerprofilorder<\/a> kopiert und in chrome umbenannt, sodass der Inhalt des Ordners &#8220;classic&#8221; sich dann im Ordner &#8220;chrome&#8221; befindet.<\/p>\n<p>Alternativ kann ein vorkonfiguriertes <a href=\"https:\/\/speefak.spdns.de\/oss_lifestyle\/wp-content\/uploads\/2021\/08\/2021-08-22_chrome.7z\" target=\"_blank\" rel=\"noopener\">Framework ( Proton Compact Mode )<\/a> genutzt werden.<\/p>\n<hr \/>\n<h2>CustomCSSforFX Framework konfigurieren<\/h2>\n<p>\u00dcber die sehr gut dokumentierte userChrome.css werden s\u00e4mtliche vorkonfigurierten CSS Dateien geladen. Das Design des Proton Compact Mode ergibt sich aus der \u00c4nderung folgender Zeilen der userChrome.css:<\/p>\n<table>\n<tbody>\n<tr>\n<td style=\"text-align: right;\">enable borderless B\/W navigation buttons :<\/td>\n<td style=\"text-align: left;\">D 125 D 150 ( \/* @import &#8220;.\/css\/buttons\/icons_colorized.css&#8221;; \/**\/ )<\/td>\n<\/tr>\n<tr>\n<td style=\"text-align: right;\">diable hamburger button :<\/td>\n<td>D 234 D 235 \/ E 231 =&gt; Button invisible &#8211; empty buttun space incorrect<\/td>\n<\/tr>\n<tr>\n<td style=\"text-align: right;\">restore proton tab button style :<\/td>\n<td>D 301 ( \/* @import &#8220;.\/css\/tabs\/classic_squared_tabs.css&#8221;; \/**\/ )<\/td>\n<\/tr>\n<tr>\n<td style=\"text-align: right;\">move Tabs down below bookmark line :<\/td>\n<td>E 325 ( @import &#8220;.\/css\/tabs\/tabs_below_navigation_toolbar.css&#8221;; \/**\/ )<\/td>\n<\/tr>\n<tr>\n<td style=\"text-align: right;\">show tab close icon only when hover :<\/td>\n<td>D 387 \/ E 389 ( @import &#8220;.\/css\/tabs\/tab_close_show_on_hover_only.css&#8221;; \/**\/ )<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<p><span style=\"font-size: 8pt;\">* ( D\/E &lt;line&gt; = (D)isable \/ (E)nable &lt;linenumber&gt; )<\/span><\/p>\n<p><span style=\"text-decoration: underline;\">TabToolBar verkleinern<\/span><\/p>\n<p>Um die Tableiste ebenfalls ein wenig kompakter zu gestalten, m\u00fcssen einige \u00c4nderungen in der Datei &#8220;.\/css\/tabs\/tabs_below_navigation_toolbar.css&#8221; vorgenommen werden:<\/p>\n<ul>\n<li>\u00c4nderung =&gt; &#8220;&#8211;tab-min-height_tnot: 32px;&#8221; zu &#8220;&#8211;tab-min-height_tnot: 25px;&#8221;<\/li>\n<li>Hinzuf\u00fcgen des Wertes in #TabsToolbar:not(:-moz-lwtheme) =&gt; &#8220;height: 29px;&#8221;<\/li>\n<li>Hinzuf\u00fcgen des Wertes in #tabbrowser-tabs =&gt; &#8220;margin-top: -4px; &#8220;<\/li>\n<\/ul>\n<hr \/>\n<h2>Bekannte Fehler<\/h2>\n<ul>\n<li>Der sogenannte Hamburger Button ist nur unsichtbar, jedoch noch vorhanden. Menu ist daher verschoben<\/li>\n<\/ul>\n<hr \/>\n<h2>Ausstehende Optimierungen<\/h2>\n<ul>\n<li>Weiteren Tabstyle wie in FF ESR hinzuf\u00fcgen<\/li>\n<li>Tab Buttonh\u00f6he reduzieren<img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-4619\" src=\"https:\/\/speefak.spdns.de\/oss_lifestyle\/wp-content\/uploads\/2018\/11\/blank_pixel.png\" alt=\"\" width=\"1\" height=\"1\" \/><\/li>\n<\/ul>\n<hr \/>\n<p><img loading=\"lazy\" decoding=\"async\" class=\" wp-image-2821 alignleft\" src=\"https:\/\/speefak.spdns.de\/oss_lifestyle\/wp-content\/uploads\/2014\/08\/CC_BY_NC_SA.png\" alt=\"CC_BY_NC_SA\" width=\"65\" height=\"23\" \/><span style=\"font-size: 10pt;\">Speefak <\/span><\/p>\n<h2><\/h2>\n","protected":false},"excerpt":{"rendered":"<p>Der Trend hin zu Touchscreen optimierten Oberfl\u00e4chen ist f\u00fcr Desktopnutzer oft ein enormer R\u00fcckschritt, da sehr viel Platz dadurch verloren geht sowie Men\u00fcs und GUIs un\u00fcbersichtlich werden. Gab es bis Version 90 noch einen Kompakt-Modus des Browsers, ist dieser ab Version 91 endg\u00fcltig aus den Auswahlmen\u00fcs verschwunden. Firefox bietet aber weiterhin \u00fcber den about:config Dialog [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[8,14],"tags":[],"class_list":["post-5983","post","type-post","status-publish","format-standard","hentry","category-anleitungen","category-gui"],"rttpg_featured_image_url":null,"rttpg_author":{"display_name":"speefak","author_link":"https:\/\/speefak.spdns.de\/oss_lifestyle\/author\/speefak_oss\/"},"rttpg_comment":0,"rttpg_category":"<a href=\"https:\/\/speefak.spdns.de\/oss_lifestyle\/category\/anleitungen\/\" rel=\"category tag\">Anleitungen<\/a> <a href=\"https:\/\/speefak.spdns.de\/oss_lifestyle\/category\/gui\/\" rel=\"category tag\">GUI<\/a>","rttpg_excerpt":"Der Trend hin zu Touchscreen optimierten Oberfl\u00e4chen ist f\u00fcr Desktopnutzer oft ein enormer R\u00fcckschritt, da sehr viel Platz dadurch verloren geht sowie Men\u00fcs und GUIs un\u00fcbersichtlich werden. Gab es bis Version 90 noch einen Kompakt-Modus des Browsers, ist dieser ab Version 91 endg\u00fcltig aus den Auswahlmen\u00fcs verschwunden. Firefox bietet aber weiterhin \u00fcber den about:config Dialog&hellip;","_links":{"self":[{"href":"https:\/\/speefak.spdns.de\/oss_lifestyle\/wp-json\/wp\/v2\/posts\/5983","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/speefak.spdns.de\/oss_lifestyle\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/speefak.spdns.de\/oss_lifestyle\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/speefak.spdns.de\/oss_lifestyle\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/speefak.spdns.de\/oss_lifestyle\/wp-json\/wp\/v2\/comments?post=5983"}],"version-history":[{"count":0,"href":"https:\/\/speefak.spdns.de\/oss_lifestyle\/wp-json\/wp\/v2\/posts\/5983\/revisions"}],"wp:attachment":[{"href":"https:\/\/speefak.spdns.de\/oss_lifestyle\/wp-json\/wp\/v2\/media?parent=5983"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/speefak.spdns.de\/oss_lifestyle\/wp-json\/wp\/v2\/categories?post=5983"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/speefak.spdns.de\/oss_lifestyle\/wp-json\/wp\/v2\/tags?post=5983"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}