Guten Tag Andreas, erstmal wieder Vielen Dank für deine Lösung zu " Fx 133 > Tableiste unten per CSS-Code" . Diesmal bekomme ich es leider selber nicht hin. Irgendwas mache ich falsch. Darf ich hier mal meine UserChrome.css posten/hochladen. Ich bedanke mich recht herzlich. Der verzweifelte Herr Drawig
Fx 133 > Tableiste unten per CSS-Code, oder per Skript.
-
2002Andreas -
7. Dezember 2019 um 18:38 -
Erledigt
-
-
Diesmal bekomme ich es leider selber nicht hin.
In deinem Code ist ein ganz anderer enthalten, als in Beitrag Nr. 1
Teste bitte mal, ob es so passt bei dir:
CSS
Alles anzeigen/* -------------------------------------------------*/ /************* aktiven Tab einfärben ****************/ /* -------------------------------------------------*/ .tab-background[selected="true"]{ background-color:transparent !important; box-shadow: inset 0px 0px 40px 0px #2846fa !important; } /* -------------------------------------------------*/ /************* Tab ICON LAUTSÄRKE Größe ****************/ /* -------------------------------------------------*/ .tab-icon-overlay { fill: white !important; transform: scale(1.5, 1.5) !important; } /* -------------------------------------------------*/ /************* Mehrzeilige Lesezeichen-Symbolleiste ****************/ /* -------------------------------------------------*/ /*Mehrzeilige Lesezeichen-Symbolleiste*/ @-moz-document url-prefix("chrome://browser/content/browser.xhtml") { #PersonalToolbar { max-height: calc(25px * 3) !important; } #personal-bookmarks, #PlacesToolbar, #PlacesToolbar > hbox { display: block !important; } #PersonalToolbar toolbarbutton { min-height: 25px !important; max-height: 25px !important; } #PlacesToolbarItems { max-height:60px!important; display: flex!important; flex-wrap: wrap!important; overflow-x: visible!important; overflow-y: auto!important; } #PlacesToolbar, #PersonalToolbar > scrollbar { -moz-window-dragging: no-drag !important; } #PlacesToolbar #PlacesChevron { display: none !important; } } /* -------------------------------------------------*/ /************* Lesezeichen Sidebar - Ordner Icon gelb ****************/ /* -------------------------------------------------*/ /* Lesezeichen Sidebar - Ordner Icon gelb */ @-moz-document url("chrome://browser/content/places/bookmarksSidebar.xhtml") { treechildren::-moz-tree-image(container) { list-style-image: url("data:image/gif;base64,R0lGODlhEAAQAOZMAP/////MAF06AJhlAJNgAP//AP/lAP/UAJViAP/JANShAJRhAP/OAJRgAOy5AMaSAP/nAMyZAP/IAP/NAOazAP/RAMmVALaAAH5TAJNfAM2aAP/dT//XOv/KAOPOkMeRAP/nhOSxAOu4AP3KAOrTkv/nrv//1c6bAKdyAP/TAP/bPdWsMr6LA7iCALqGALiEAJNeAMCMAP/gcv/eYdGdAP/TEP/mgv/2y//gg/3JAP/ila97AP/aKsWPAJFbAJZgALeBAMiVAPC9AP/rOum2AHlQAP/4zP//z//jPpNdAP/LANixNP///wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAEAAEwALAAAAAAQABAAAAefgEyCg4SFhoeFDQ0LjIiCCyU5IwEBBAiXCAOEBDohFBREIg6jQgibODQKqgonDz0fPkkwDQMEMhYRERpBMUsAv8C1Mw8uLUAXKwA2EgkJDJoEGy8swAAgCZQMz0wEKigkN8wJHZQBFZrcPDsAHErllBMT6AQ1HkYVKQf6++hMGUgAhhgYSBAChH4/TBwpwLAhw35MMAiYSLFiEUcYmQQCADs=") !important;} } /* -------------------------------------------------*/ /************* Lesezeichensymbolleiste - Hintergrundfarbe ****************/ /* -------------------------------------------------*/ /* Lesezeichensymbolleiste - Hintergrundfarbe */ @-moz-document url("chrome://browser/content/bookmarks/bookmarksPanel.xhtml"), url("chrome://browser/content/browser.xhtml"), url("chrome://browser/content/history/history-panel.xhtml"), url("chrome://browser/content/places/bookmarksSidebar.xhtml") { #bookmarks-view,sidebarheader,#sidebar-box,.sidebar-placesTreechildren,#sidebar-search-label,#sidebar-search-container,#placesList > treechildren{ background:#000000!important; color:white!important; } } /* Tableiste unten*/ #TabsToolbar { position: absolute; display: block; bottom: 0; width: 100vw; } #navigator-toolbox { position: relative; padding-bottom: calc( var(--tab-min-height) + 8px ); } .titlebar-buttonbox-container { position: fixed; right: 0; visibility: visible; display: block; } #TabsToolbar .titlebar-buttonbox-container, #TabsToolbar #window-controls { display: none; } #main-menubar { height: 28px !important; } /*...................Ab hier nur Privater Modus...................*/ /* Das lila Icon für privaten Modus oben rechts eingefügt */ #main-window[privatebrowsingmode=temporary] #PanelUI-button::before { margin-left: 0 !important; margin-right: 0 !important; content: '' !important; display: block !important; width: 20px !important; height: 30px !important; background: url("chrome://global/skin/icons/indicator-private-browsing.svg") !important; background-repeat: no-repeat !important; background-position: 0 8px !important; background-size: 25px 17px !important; } /* Der neue zusätzliche Eintrag: Privater Modus unter dem Tab entfernt */ .private-browsing-indicator-with-label { display: none !important; } .tab-background { border-radius: 8px 8px 0px 0px !important; border-image: none !important; } .tab-line { display: none; } .tab-close-button { color: red !important; }
-
Die Chrome.css ist schon etwas älter, Sören hatte mir dort vor Jahren so nett mal geholfen. Seitdem habe ich Sie minimal dann immer (mit eurer Hilfe hier im Forum) leicht abgeändert bezüglich der Tabs.
Andreas, DANKE !! es funktioniert mit deiner css. Die Tabs sind nun minimal ein wenig größer und der aktive Tab ist nicht mehr blau, Aber das passt so für mich, Hauptsache die Tabs sind wieder unten! - Vielen Vielen Dank für deine Turbo Schnelle Hilfe, Beste Grüße der Herr Drawig.
-
Vielen Vielen Dank für deine Turbo Schnelle Hilfe
Freut mich wenn ich dir damit helfen konnte, war gern geschehen
der aktive Tab ist nicht mehr blau
Dann für diesen Code noch hinzu, und pass dir die Farben an:
-
Vielen Dank Andreas, auch das hat einwandfrei funktioniert. Der Tab ist wieder blau und mein ist Tag gerettet. Ich bin begeistert und Dankbar für deine Turbo Schnelle Hilfe! - Beste Grüße, der Herr Drawig.
-
mein ist Tag gerettet
Das freut mich dann
Beste Grüße
Danke.
-
Du musst dir natürlich vorher überlegen, ob du nur die Tableiste nach unten willst, oder doch eine mehrzeilige Tableiste.
Beides geht nicht.
Hallo Andreas,
bedeutet das, ich muss mich ,wenn ich Änderungen über die Userchrome.css vorgenommen habe ,zukünftig entscheiden und beide o.g. Fälle gehen zusammen nicht mehr über die css sondern nur noch mit Skript?
-
beide o.g. Fälle gehen zusammen nicht mehr über die css sondern nur noch mit Skript?
Das bezog sich nur auf den User GermanFreme82 .
Er nutzt nämlich eine mehrzeilige Tableiste, und nicht nur Tabs unten, um die es in diesem Thread geht.
-
Ja, ich dank mehrfacher Hilfe von Dir auch. Die Tableiste ist mit dem neuen Update zwar immer noch mehrzeilig, aber wird oben angezeigt. ich hätte sie gern wieder mehrzeilig unter die Adress- und Lesezeichenleiste.
-
immer noch mehrzeilig, aber wird oben angezeigt.
Aber nicht mit dem Code aus Beitrag Nr. 1.
Dann funkt dir etwas anderes dazwischen.
So sieht das mit dem Code aus:
-
Das stimmt, ich wechsle da mal in den alten Thread:
ThemaMultirow-Tableiste mit userChrome.css Änderungen für FF97.0
Hallo,
und wieder gab es ein Update, welches meinen .css Code nicht mehr richtig verarbeitet... und ich benötige Eure Hilfe...
Würdet Ihr bitte mal nachschauen, was geändert werden kann, sodass die obere Tableiste nicht die Menüleiste überlagert?
Auch die untere Tableiste überlagert die Eingabezeile der Internetadresse...
camp-firefox.de/attachment/36042/
Ich wäre Euch sehr dankbar!
Beste Grüße!
Krabato
CssCode:
(Quelltext, 190 Zeilen)
Krabato12. Februar 2022 um 10:30 -
ich wechsle da mal in den alten Thread:
Was genau möchtest du denn?
Nur die Tabs unten oder eine mehrzeilige Tableiste?
-
Hallo Andreas,
dein Code weicht sehr stark von meinem ab und ich bin leider nicht in der Lage diesen selber anzupassen.
Nehme ich den Code von Seite 1 funktioniert es zwar, jedoch sieht mein FF dann anders aus.
Da ich ein Gewohnheitsmensch bin, habe ich die Bitte an dich zu gucken ob du meinen Code anpassen kannst. Falls das zu viel Aufwand ist, habe ich Pech. Ich möchte keinen großen Aufwand verursachen
Ich wünsche ein schönes Wochenende! -
ob du meinen Code anpassen kannst.
Teste bitte diesen kompl. Code mal:
CSS
Alles anzeigen/* Grauer Kasten: */ .browser-toolbar:not(.titlebar-color) { background-color: transparent !important; } /* Schwarze Linie */ #nav-bar:-moz-lwtheme { box-shadow: none !important; } /*Tableiste unten*/ #TabsToolbar { position: absolute; display: block; bottom: 0; width: 100vw; } #navigator-toolbox { position: relative; padding-bottom: calc( var(--tab-min-height) + 8px ); } /*...................Ab hier nur Privater Modus...................*/ /* Das lila Icon für privaten Modus oben rechts eingefügt */ #main-window[privatebrowsingmode=temporary] #PanelUI-button::before { margin-left: 0 !important; margin-right: 0 !important; content: '' !important; display: block !important; width: 20px !important; height: 30px !important; background: url("chrome://global/skin/icons/indicator-private-browsing.svg") !important; background-repeat: no-repeat !important; background-position: 0 8px !important; background-size: 25px 17px !important; } /* Der neue zusätzliche Eintrag: Privater Modus unter dem Tab entfernt */ .private-browsing-indicator-with-label { display: none !important; } /* Mostly transparent on dark theme */ /* More subtle background color on selected tab */ #main-window[lwthemetextcolor="bright"] #tabbrowser-tabs:not([movingtab]) > .tabbrowser-tab > .tab-stack > .tab-background[selected=true]:-moz-lwtheme { background-image: linear-gradient(to right, transparent, rgba(255,255,255,0.2) 20%, rgba(255,255,255,0.2) 80%, transparent) !important; } /* No top line on selected tab */ #main-window[lwthemetextcolor="bright"] .tabbrowser-tab[selected="true"] .tab-line { display: none !important; } /* Transparent toolbars */ #main-window[lwthemetextcolor="bright"] #navigator-toolbox > toolbar:not(#toolbar-menubar):not(#TabsToolbar) { background-color: transparent !important; background-image: none !important; } /* Hide tab close buttons until hovered */ .tabbrowser-tab:not([pinned="true"]):not(:hover) .tab-close-button { display: none !important; } /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom.css made available under Mozilla Public License v. 2.0 See the above repository for updates as well as full license text. */ /* Modify to change window drag space width */ /* Use tabs_on_bottom_menubar_on_top_patch.css if you have menubar permanently enabled and want it on top */ /* IMPORTANT */ /* Get window_control_placeholder_support.css Window controls will be all wrong without it. Additionally on Linux, you may need to get: linux_gtk_window_control_patch.css */ :root{ --uc-titlebar-padding: 0px; } @media (-moz-os-version: windows-win10){ :root[sizemode="maximized"][tabsintitlebar]{ --uc-titlebar-padding: 8px } } #toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container, #TabsToolbar > .titlebar-buttonbox-container{ position: fixed; display: block; top: var(--uc-titlebar-padding,0px); right:0; height: 40px; } /* Mac specific. You should set that font-smoothing pref to true if you are on any platform where window controls are on left */ @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled"){ :root{ --uc-titlebar-padding: 0px !important } .titlebar-buttonbox-container{ left:0; right: unset !important; } } :root[uidensity="compact"] #TabsToolbar > .titlebar-buttonbox-container{ height: 32px } #toolbar-menubar[inactive] > .titlebar-buttonbox-container{ opacity: 0 } #navigator-toolbox{ padding-top: var(--uc-titlebar-padding,0px) !important; } .titlebar-buttonbox-container > .titlebar-buttonbox{ height: 100%; } .titlebar-placeholder, #TabsToolbar .titlebar-spacer{ display: none; } /* Also hide the toolbox bottom border which isn't at bottom with this setup */ #navigator-toolbox::after{ display: none !important; } @media (-moz-gtk-csd-close-button){ .titlebar-button{ flex-direction: column; } } /* These exist only for compatibility with autohide-tabstoolbar.css */ toolbox#navigator-toolbox > toolbar#nav-bar.browser-toolbar{ animation: none; } #navigator-toolbox:hover #TabsToolbar{ animation: slidein ease-out 48ms 1 } /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom_menubar_on_top_patch.css made available under Mozilla Public License v. 2.0 See the above repository for updates as well as full license text. */ /* Menubar on top patch - use with tabs_on_bottom.css */ /* Only really useful if menubar is ALWAYS visible */ :root{ --uc-window-control-width: 0px !important } #navigator-toolbox{ padding-top: calc(29px + var(--uc-titlebar-padding,0px)) !important } #toolbar-menubar{ position: fixed; display: flex; top: var(--uc-titlebar-padding,0px); height: 29px; width: 100%; overflow: hidden; } #toolbar-menubar > .titlebar-buttonbox-container{ height: 29px; order: 100; } #toolbar-menubar > [flex]{ flex-grow: 100; } #toolbar-menubar > spacer[flex]{ order: 99; flex-grow: 1; min-width: var(--uc-window-drag-space-width,20px); } #toolbar-menubar .titlebar-button{ padding: 2px 17px !important; } #toolbar-menubar .toolbarbutton-1 { --toolbarbutton-inner-padding: 3px } /* TABS: height */*|*:root { --tab-toolbar-navbar-overlap: 0px !important; --tab-min-height: 25px !important; /*adjust to set height or omit to use density*/ --tab-min-width: 80px !important; /*adjust to set width or omit to use default*/ #tabbrowser-tabs { width: 100vw !important; } #main-window:not([chromehidden*="toolbar"]) #navigator-toolbox {padding-bottom: var(--tab-min-height) !important;} .tab-background { border-radius: 8px 8px 0px 0px !important; border-image: none !important; } .tab-line { display: none; } .tab-close-button { color: red!important; } /* Mostly transparent on dark theme */ /* More subtle background color on selected tab */ #main-window[lwthemetextcolor="bright"] #tabbrowser-tabs:not([movingtab]) > .tabbrowser-tab > .tab-stack > .tab-background[selected=true]:-moz-lwtheme { background-image: linear-gradient(to right, transparent, rgba(255,255,255,0.2) 20%, rgba(255,255,255,0.2) 80%, transparent) !important; } /* No top line on selected tab */ #main-window[lwthemetextcolor="bright"] .tabbrowser-tab[selected="true"] .tab-line { display: none !important; } /* Transparent toolbars */ #main-window[lwthemetextcolor="bright"] #navigator-toolbox > toolbar:not(#toolbar-menubar):not(#TabsToolbar) { background-color: transparent !important; background-image: none !important; } /* Hide tab close buttons until hovered */ .tabbrowser-tab:not([pinned="true"]):not(:hover) .tab-close-button { display: none !important; }
-
ob du meinen Code anpassen kannst.
Teste bitte diesen kompl. Code mal:
CSS
Alles anzeigen/* Grauer Kasten: */ .browser-toolbar:not(.titlebar-color) { background-color: transparent !important; } /* Schwarze Linie */ #nav-bar:-moz-lwtheme { box-shadow: none !important; } /*Tableiste unten*/ #TabsToolbar { position: absolute; display: block; bottom: 0; width: 100vw; } #navigator-toolbox { position: relative; padding-bottom: calc( var(--tab-min-height) + 8px ); } /*...................Ab hier nur Privater Modus...................*/ /* Das lila Icon für privaten Modus oben rechts eingefügt */ #main-window[privatebrowsingmode=temporary] #PanelUI-button::before { margin-left: 0 !important; margin-right: 0 !important; content: '' !important; display: block !important; width: 20px !important; height: 30px !important; background: url("chrome://global/skin/icons/indicator-private-browsing.svg") !important; background-repeat: no-repeat !important; background-position: 0 8px !important; background-size: 25px 17px !important; } /* Der neue zusätzliche Eintrag: Privater Modus unter dem Tab entfernt */ .private-browsing-indicator-with-label { display: none !important; } /* Mostly transparent on dark theme */ /* More subtle background color on selected tab */ #main-window[lwthemetextcolor="bright"] #tabbrowser-tabs:not([movingtab]) > .tabbrowser-tab > .tab-stack > .tab-background[selected=true]:-moz-lwtheme { background-image: linear-gradient(to right, transparent, rgba(255,255,255,0.2) 20%, rgba(255,255,255,0.2) 80%, transparent) !important; } /* No top line on selected tab */ #main-window[lwthemetextcolor="bright"] .tabbrowser-tab[selected="true"] .tab-line { display: none !important; } /* Transparent toolbars */ #main-window[lwthemetextcolor="bright"] #navigator-toolbox > toolbar:not(#toolbar-menubar):not(#TabsToolbar) { background-color: transparent !important; background-image: none !important; } /* Hide tab close buttons until hovered */ .tabbrowser-tab:not([pinned="true"]):not(:hover) .tab-close-button { display: none !important; } /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom.css made available under Mozilla Public License v. 2.0 See the above repository for updates as well as full license text. */ /* Modify to change window drag space width */ /* Use tabs_on_bottom_menubar_on_top_patch.css if you have menubar permanently enabled and want it on top */ /* IMPORTANT */ /* Get window_control_placeholder_support.css Window controls will be all wrong without it. Additionally on Linux, you may need to get: linux_gtk_window_control_patch.css */ :root{ --uc-titlebar-padding: 0px; } @media (-moz-os-version: windows-win10){ :root[sizemode="maximized"][tabsintitlebar]{ --uc-titlebar-padding: 8px } } #toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container, #TabsToolbar > .titlebar-buttonbox-container{ position: fixed; display: block; top: var(--uc-titlebar-padding,0px); right:0; height: 40px; } /* Mac specific. You should set that font-smoothing pref to true if you are on any platform where window controls are on left */ @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled"){ :root{ --uc-titlebar-padding: 0px !important } .titlebar-buttonbox-container{ left:0; right: unset !important; } } :root[uidensity="compact"] #TabsToolbar > .titlebar-buttonbox-container{ height: 32px } #toolbar-menubar[inactive] > .titlebar-buttonbox-container{ opacity: 0 } #navigator-toolbox{ padding-top: var(--uc-titlebar-padding,0px) !important; } .titlebar-buttonbox-container > .titlebar-buttonbox{ height: 100%; } .titlebar-placeholder, #TabsToolbar .titlebar-spacer{ display: none; } /* Also hide the toolbox bottom border which isn't at bottom with this setup */ #navigator-toolbox::after{ display: none !important; } @media (-moz-gtk-csd-close-button){ .titlebar-button{ flex-direction: column; } } /* These exist only for compatibility with autohide-tabstoolbar.css */ toolbox#navigator-toolbox > toolbar#nav-bar.browser-toolbar{ animation: none; } #navigator-toolbox:hover #TabsToolbar{ animation: slidein ease-out 48ms 1 } /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/tabs_on_bottom_menubar_on_top_patch.css made available under Mozilla Public License v. 2.0 See the above repository for updates as well as full license text. */ /* Menubar on top patch - use with tabs_on_bottom.css */ /* Only really useful if menubar is ALWAYS visible */ :root{ --uc-window-control-width: 0px !important } #navigator-toolbox{ padding-top: calc(29px + var(--uc-titlebar-padding,0px)) !important } #toolbar-menubar{ position: fixed; display: flex; top: var(--uc-titlebar-padding,0px); height: 29px; width: 100%; overflow: hidden; } #toolbar-menubar > .titlebar-buttonbox-container{ height: 29px; order: 100; } #toolbar-menubar > [flex]{ flex-grow: 100; } #toolbar-menubar > spacer[flex]{ order: 99; flex-grow: 1; min-width: var(--uc-window-drag-space-width,20px); } #toolbar-menubar .titlebar-button{ padding: 2px 17px !important; } #toolbar-menubar .toolbarbutton-1 { --toolbarbutton-inner-padding: 3px } /* TABS: height */*|*:root { --tab-toolbar-navbar-overlap: 0px !important; --tab-min-height: 25px !important; /*adjust to set height or omit to use density*/ --tab-min-width: 80px !important; /*adjust to set width or omit to use default*/ #tabbrowser-tabs { width: 100vw !important; } #main-window:not([chromehidden*="toolbar"]) #navigator-toolbox {padding-bottom: var(--tab-min-height) !important;} .tab-background { border-radius: 8px 8px 0px 0px !important; border-image: none !important; } .tab-line { display: none; } .tab-close-button { color: red!important; } /* Mostly transparent on dark theme */ /* More subtle background color on selected tab */ #main-window[lwthemetextcolor="bright"] #tabbrowser-tabs:not([movingtab]) > .tabbrowser-tab > .tab-stack > .tab-background[selected=true]:-moz-lwtheme { background-image: linear-gradient(to right, transparent, rgba(255,255,255,0.2) 20%, rgba(255,255,255,0.2) 80%, transparent) !important; } /* No top line on selected tab */ #main-window[lwthemetextcolor="bright"] .tabbrowser-tab[selected="true"] .tab-line { display: none !important; } /* Transparent toolbars */ #main-window[lwthemetextcolor="bright"] #navigator-toolbox > toolbar:not(#toolbar-menubar):not(#TabsToolbar) { background-color: transparent !important; background-image: none !important; } /* Hide tab close buttons until hovered */ .tabbrowser-tab:not([pinned="true"]):not(:hover) .tab-close-button { display: none !important; }
Es funktioniert! Vielen, vielen Dank!
-
Es funktioniert! Vielen, vielen Dank!
freut mich, war gern geschehen.
-