Danke Euch, ich probier mal die CSS, Variante. Drag und Drop hattei ich bisher nicht, ist aber auch nicht schlecht. 
CSS funktioniert mit .2px und Drag und Drop geht auch, man muss nur gut zielen 
Perfekt 
Dankeschön!
Beiträge von AdE
-
-
Ja, führt aber zu keiner optischen Änderung.
-
so sieht es bei mir mit den Einstellungen:
var nTabBorderWidth = 1;
var nTabBorderRadius = 0;
var strTabBorderColor = "255,255,255"
aus. Setze ich jetzt var nTabMargin von 1 auf 0, sieht es so aus:
Im Ergebnis würde ich jetzt für weiche Übergänge zwischen den Tabs gern noch die senkrechten schwarzen Linien wegbekommen, das scheint aber über die Tab Rahmen Farbe nicht wirklich zu gehen. Vermutlich müsste man dann auch den Abstand zwischen den Tabs auf 0 setzen können, damit es optisch zusammenrückt.
-
Ich möchte gern die Schriftart in den Tabs optisch an die Standardschriftart von Firefox anpasse.
Du musst den exakten Namen der auf dem System verfügbaren Schriftart angeben. Ich nutze Ubuntu nicht, aber auch dort wird es sicher eine Übersicht über die verfügbaren Schriftarten geben.
Es lag am Namen. Der nannte sich in den Systemangaben Ubuntu Regular, allerdings funktioniert es nur wenn man als Schriftart nur Ubuntu eingibt und das Regular weglässt.... das würde ich gern über die Änderung der Farbe des Rahmens lösen, indem ich diese an die Tabfarbe anpasse. Welche Werte/Zeilen müsste ich dafür korrigieren?
Die Variable in den 'User-Settings' heißt var strTabBorderColor. Dort kannst du den gewünschten RGB-Wert angeben.
Dein Standardwert ist 128,128,128 für schwarz, wenn ich den z.B. auf 255,250,250 stelle, müsste der Rahmen ja weiß werden und bei hellem Hintergrund nahezu verschwinden, es ändert sich aber nix, er bliebt schwarz.
Als Umgehungsvariante habe ich versucht, var nTabMargin von 1 auf 0 zu setzten. Dann rücken die Tabzeilen näher zusammen und der schwarze Rahmen ist oben und unten weg, aber rechts und links der Tabs noch vorhanden.
-
Vielen Dank für das super Skript. Es läuft bei mir auf Anhieb unter Ubuntu. Könnt Ihr mir bitte noch mit einigen optischen Änderungen helfen?
1. Ich möchte gern die Schriftart in den Tabs optisch an die Standardschriftart von Firefox anpasse. Statt Arial habe ich den Wert Standard (DejaVu Serif) genommen, der in den Einstellungen vom FF steht, das funktioniert aber nicht. Auch die Systemschriftarf von Ubuntu habe ich schon ausprobiert, das klappt auch nicht. Vermutlich ist es der falsche Name. Welche Schriftart müsste ich dort eintragen?
2. Ich hätte gerne einen fließenden Übergang zwischen den Tabs, das würde ich gern über die Änderung der Farbe des Rahmens lösen, indem ich diese an die Tabfarbe anpasse. Welche Werte/Zeilen müsste ich dafür korrigieren?
-
Skripte funktionieren auf Anhieb bei mir unter Ubuntu, bin heftig am probieren und habe jetzt nur noch ein paar Anpassungsfragen :). Vielen Dank Dir und BrokenHeart.
-
Dann lass bitte erstmal und ich probiere das zunächst mit den Skripten aus.
-
Hallo Andreas,
vielleicht kannst Du mir erneut helfen, obige css funktioniert prinzipiell auch nach dem Update auf FF 133, aber die Tabzeilen sind jetz oberhalb der Adress- und Lesezeichenleiste.
-
Das stimmt, ich wechsle da mal in den alten Thread:
Multirow-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...
Ich wäre Euch sehr dankbar!
Beste Grüße!
Krabato
CssCode:
(Quelltext, 190 Zeilen)
-
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. -
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?
-
Vielen, vielen Dank! Läuft wieder bestens.
-
Hallo Andreas,
darf ich mich bitte anschließen? Bei mir sind die Tabreihen unten. Es hat super über ettliche Versionen von FF funktioniert, jetzt leider nicht mehr:
CSS
Alles anzeigen/* Tableiste mehrreihig unten */ @-moz-document url(chrome://browser/content/browser.xhtml) { :root { --tab-min-height: 30px !important; } :root #tabbrowser-tabs { --tab-min-height: 30px !important; } /* Feste Tabbreite */ .tabbrowser-tab:not([pinned]) { min-width: 130px !important; max-width: 130px !important; } #titlebar { -moz-box-ordinal-group: 2 !important; /*bis Fx 112*/ order: 2 !important; /*ab Fx 113*/ } /* Abstand nach oben - unten, und Höhe der Tableiste */ #titlebar { margin-top: -15px !important; margin-bottom: -12px !important; } #toolbar-menubar { position: fixed; display: inline-flex; } [sizemode="maximized"]:not([tabsintitlebar="true"]) #toolbar-menubar, [sizemode="normal"] #toolbar-menubar { top: 1px; } [sizemode="maximized"] #toolbar-menubar { top: 8px; } #main-window[tabsintitlebar="true"] #navigator-toolbox:not([inFullscreen="true"]) { border-top: solid 39px transparent !important; } #main-window:not([tabsintitlebar="true"]) #navigator-toolbox:not([inFullscreen="true"]) { border-top: solid 34px transparent !important; } [tabsintitlebar="true"] #navigator-toolbox { -moz-window-dragging: drag; } #navigator-toolbox:not([style^="margin-top:"])[style=""][inFullscreen="true"] #window-controls, [tabsintitlebar="true"] .titlebar-buttonbox-container { display: block; position: fixed; right: 0; } [tabsintitlebar="true"][sizemode="normal"] .titlebar-buttonbox-container { top: 1px; } [tabsintitlebar="true"][sizemode="maximized"] .titlebar-buttonbox-container { top: 8px; } #navigator-toolbox:not([style^="margin-top:"])[style=""][inFullscreen="true"] #window-controls { top: 0; } #navigator-toolbox[inFullscreen="true"] #nav-bar { padding-right: 109px !important; } box[class="scrollbox-clip"][orient="horizontal"], tabs > arrowscrollbox { display: block; contain: none !important; } /* Mehrzeilige Tableiste, bei mehr als 2 Zeilen erscheint eine Scrollbar */ scrollbox[part][orient="horizontal"] { display: flex; flex-wrap: wrap; max-height: calc(var(--tab-min-height) * 4); /* Anzahl der Tabzeilen = 4 Zeilen */ overflow-x: hidden; overflow-y: auto; } tabs tab[fadein]:not([pinned]) { flex-grow: 1; } tabs tab,.tab-background { height: var(--tab-min-height); overflow: hidden; } tab > .tab-stack { width: 100%; } box[class="scrollbox-clip"][orient="horizontal"] { -moz-window-dragging: no-drag; } hbox.titlebar-spacer, #alltabs-button, tabs tab:not([fadein]) { display: none; } } -
Du kannst ja mal diesen CSS Code für eine mehrzeilige Tableiste testen.
Einzelne Werte musst/kannst du dir ja anpassen dann.
Hallo Andreas,
nachdem das Update auf FF 113 bei mir meine mehrzeilige untere Tableiste zerschossen hatte, habe ich den Code probiert. Funktioniert unter FF 113 mit Ubuntu perfekt.
Vielen Dank und viele Grüße
-
Ich habe mal zwei Fotos gemacht, beim Screenshot wird der Mauszeiger nicht mit aufgenommen.
Hier passiert gar nichts, da kann man einfach mit der Maus drauf gehen ohne jegliche Reaktion:
Kaum geht man eine klitzekleines Stück weiter hoch funktioniert es und man kommt in den Ordner rein:
Mysteriös. Aber zum Glück gehts erstmal grundsätzlich.
-
Hallo Andreas,
im Fehlerbehebungsmodus ging es und dann nach dem Neustart auch wieder im normalen Modus.
Dankeschön! Ich kann grundsätzlich wieder auf die Lesezeichen zugreifen.
Eines ist jedoch noch "komisch". Wenn ich mit dem Mauszeiger auf die Links bzw. Ordner gehe, funktionieren diese nur im Bereich des oberen Rahmens, so als ob 2/3 der Schaltfläche inaktiv sind. Ich werd narrisch.
-
Hallo Andreas,
nein, das Reinziehen funktioniert nicht. Es zeigt mir zwar die Lesezeichensymbolleiste an, allerdings scheint sich diese mit den mehrzeiligen Tabreihen zu überlagern
. In die Menüleiste dagegen kann ich die Lesezeichensymbole reinziehen.Das Verkleinern der Werte in den Zeilen 77 und 80 hatte keine Auswirkungen.
Ich habe jetzt mal Zeile 4-15 meines alten Codes in den neuen mit eingefügt. Damit sieht es jetzt so aus:
CSS
Alles anzeigen/* Tableiste mehrreihig unten */ .tabbrowser-tab { margin-top: 1px !important; margin-bottom: 1px !important; } /* Tab-Höhe */ :root { --tab-min-height: 25px !important; } :root #tabbrowser-tabs { --tab-min-height: 25px !important; } @-moz-document url(chrome://browser/content/browser.xhtml) { /* Feste Tabbreite */ .tabbrowser-tab:not([pinned]) { min-width: 150px !important; max-width: 150px !important; } /* Activer Tab schwarze Schrift */ .tab-label[selected]{ color: black !important; } /* Inaktiver Tab schwarze Schrift */ .tab-label:not([selected]) { color: black !important; } .tab-close-button, #tabs-newtab-button { color: black !important; } #titlebar { -moz-box-ordinal-group: 2!important; } /* Abstand nach oben - unten, und Höhe der Tableiste */ #titlebar { margin-top: -20px !important; margin-bottom: -20px; } /* Farbe der Tableiste weiss */ #titlebar { appearance: none !important; background: #ffffff !important; } #toolbar-menubar { position: fixed; display: inline-flex; } [sizemode="maximized"]:not([tabsintitlebar="true"]) #toolbar-menubar, [sizemode="normal"] #toolbar-menubar { top: 1px; } [sizemode="maximized"] #toolbar-menubar { top: 8px; } #main-window[tabsintitlebar="true"] #navigator-toolbox:not([inFullscreen="true"]) { border-top: solid 39px transparent !important; } #main-window:not([tabsintitlebar="true"]) #navigator-toolbox:not([inFullscreen="true"]) { border-top: solid 34px transparent !important; } [tabsintitlebar="true"] #navigator-toolbox { -moz-window-dragging: drag; } #navigator-toolbox:not([style^="margin-top:"])[style=""][inFullscreen="true"] #window-controls, [tabsintitlebar="true"] .titlebar-buttonbox-container { display: block; position: fixed; right: 0; } [tabsintitlebar="true"][sizemode="normal"] .titlebar-buttonbox-container { top: 1px; } [tabsintitlebar="true"][sizemode="maximized"] .titlebar-buttonbox-container { top: 8px; } #navigator-toolbox:not([style^="margin-top:"])[style=""][inFullscreen="true"] #window-controls { top: 0; } #navigator-toolbox[inFullscreen="true"] #nav-bar { padding-right: 109px !important; } box[class="scrollbox-clip"][orient="horizontal"], tabs > arrowscrollbox { display: block; } /* Mehrzeilige Tableiste, bei mehr als 5 Zeilen erscheint eine Scrollbar */ scrollbox[part][orient="horizontal"] { display: flex; flex-wrap: wrap; max-height: calc(var(--tab-min-height) * 5); /* Anzahl der Tabzeilen = 5 Zeilen */ overflow-x: hidden; overflow-y: auto; } tabs tab[fadein]:not([pinned]) { flex-grow: 1; } tabs tab,.tab-background { height: var(--tab-min-height); overflow: hidden; } tab > .tab-stack { width: 100%; } box[class="scrollbox-clip"][orient="horizontal"] { -moz-window-dragging: no-drag; } hbox.titlebar-spacer, #alltabs-button, tabs tab:not([fadein]) { display: none; } } }
Die Tabreihen sind damit enger zusammengerückt, das passt. Auch der Rand nach unten zum Tabinhalt ist enger geworden, passt auch sehr gut.
Über den Tabs sieht man noch sehr viel Platz und dort scheinen sich die mehrzeiligen Tabs mit der Lesezeichensymbolleiste zu überlagern.
-
Hallo,
ich komme leider noch nicht so richtig klar mit den Einstellungen. Die Abstände zwischen den einzelnen Tabreihen, also nach oben, nach unten und zwischendrin sind sehr groß. Des Weiteren kann ich meine Lesezeichensymbole nicht mehr in meine Lesezeichensymbolleiste hineinschieben.
Hat jemand einen Tip?
-
Hallo Boersenfeger,
läuft
. Vielen Dank!. Ich habe mir die Tabzeilenzahl auf 4 angepasst und habe noch eine Frage. Welche Einträge muss ich ändern, wenn ich die Tabs über der Schrift, also oben etwas kleiner haben möchte? -
Hallo,
durch das Firefoxupdate habe ich leider ein Problem bei meiner mehrzeiligen Tableiste. Diese enthält über und unter der Leiste jetzt sehr viel verschenkten Platz, siehe angehängtes Bild. Kann mir jemand helfen, diese Leerzeilen zu entfernen?
Meine userChrome.css sieht wie folgt aus:
CSS
Alles anzeigen/* ----------------------------*/ /* Mehrzeilige Tabreihen */ /* ----------------------------*/ .tabbrowser-tab { margin-top: 1px !important; margin-bottom: 1px !important; } /* Tab-Höhe */ :root { --tab-min-height: 25px !important; } :root #tabbrowser-tabs { --tab-min-height: 25px !important; } /* Feste Breite des einzelnem Tabs */ .tabbrowser-tab:not([pinned]) { min-width: 130px !important; } /* Platz für Scrollbar schaffen */ .tabbrowser-tabs { margin-right: -41px !important; } tabs > arrowscrollbox { display: block; } box[class="scrollbox-clip"][orient="horizontal"], tabs > arrowscrollbox { display: block; } scrollbox[part][orient="horizontal"] { display: flex; flex-wrap: wrap; max-height: calc(var(--tab-min-height) * 5); /* Anzahl der angezeigten Tabreihen = 5 Zeilen */ overflow-x: hidden; overflow-y: auto; } /* Buttons/Zwischenräume Ausblenden */ hbox.titlebar-spacer, #alltabs-button,tabs tab:not([fadein]), [class="scrollbutton-up"], [class="scrollbutton-up"] + spacer, scrollbox[part][orient="horizontal"] + spacer, [class="scrollbutton-down"] { display: none; } tabs tab { border-left: solid 1px hsla(0,0%,50%,.5); border-right: solid 1px hsla(0,0%,50%,.5); } tabs tab:after,tabs tab:before { display: none;} #TabsToolbar:not(:-moz-lwtheme){ color: black !important; } #TabsToolbar > .titlebar-buttonbox-container { display: none !important; } /* -----------------------------*/ /* Tab: Optische Anpassungen */ /* -----------------------------*/ #tabbrowser-tabs :not([fokus]){ opacity: 1!important; } /* Schriftart/Schriftgröße ändern */ .tabbrowser-tab .tab-label { text-shadow: px px 0px #000000 !important; font-weight: 500 !important; font-size: 12px !important; font-family: "Arial" !important; color: black !important; } .tabbrowser-tab .tab-label:not(:-moz-lwtheme) { text-shadow: none !important; color: black !important; } .tabbrowser-tab .tab-label[selected="true"] { text-shadow: 1px 1px 0px #000000 !important; color: white !important; font-weight: 500 !important; font-size: 12px !important; font-family: "Arial" !important; } /* Tab-Line entfernen */ #TabsToolbar .tabbrowser-tab .tab-line { display: none !important; } /* Tab-Höhe */ .tabbrowser-tab { min-height: 22px !important; max-height: 22px !important; vertical-align: bottom !important; margin-top: 1px !important; margin-bottom: 1px !important; } /* Tab-Rahmen entfernen */ #TabsToolbar .tabbrowser-tab[visuallyselected="true"], #TabsToolbar .tabbrowser-tab, #TabsToolbar .tabbrowser-tab .tab-background { background: unset !important; border-top: unset !important; outline: none !important; } /* Tab-Schließen-Button entfernen *//* .tabbrowser-tab .tab-close-button { visibility: collapse !important; } */ /* Tab-Icon ausrichten *//* .tab-throbber:not([pinned]), .tab-sharing-icon-overlay:not([pinned]), .tab-icon-pending:not([pinned]), .tab-icon-image:not([pinned]) { margin-top: -1px !important; } */ /*------------------*/ /* Tab-Hintergrund */ /*------------------*/ /*--- selektiert ---*/ .tab-background[selected=true]:not(:-moz-lwtheme) > spacer { background-image: linear-gradient( rgba(103,171,224,1), rgba(10,58,95,1) ), none !important; /* blau */ /*background-image: linear-gradient( rgba(230,175,175,1), rgba(84,25,25,1) ), none !important;*/ /* rot */ filter: drop-shadow(4px 3px 2px rgba(0,0,0,0.33)) drop-shadow(-4px 3px 2px rgba(0,0,0,0.33)) !important; } .tab-background[selected=true]:-moz-lwtheme > spacer { background-image: linear-gradient( rgba(103,171,224,1), rgba(10,58,95,1) ), none !important; filter: drop-shadow(3px 3px 2px rgba(0,0,0,0.33)) drop-shadow(-2px 3px 2px rgba(0,0,0,0.33)) !important; } /*--- hover(nicht selektiert) ---*/ .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true]):not(:-moz-lwtheme) > spacer { background-image: linear-gradient( rgba(255,255,255,1), rgba(115,115,115,1) ), none !important; filter: brightness(130%) contrast(95%) drop-shadow(1px 1px 1px rgba(0,0,0,0.33)) drop-shadow(-1px 1px 1px rgba(0,0,0,0.33)) !important; } .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true]):-moz-lwtheme > spacer { background-image: linear-gradient( rgba(225,225,225,0.66), rgba(100,125,145,0.66) ), none !important; box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.75); } /*--- nicht selektiert ---*/ .tab-background:not([selected=true]):not(:-moz-lwtheme) > spacer { background-image: linear-gradient( rgba(255,255,255,1), rgba(125,125,125,1) ), none !important; filter: brightness(115%) contrast(90%) drop-shadow(1px 1px 1px rgba(0,0,0,0.33)) drop-shadow(-1px 1px 1px rgba(0,0,0,0.33)) !important; } .tab-background:not([selected=true]):-moz-lwtheme > spacer { background-image: linear-gradient( rgba(255,255,255,0.33), rgba(110,110,110,0.33) ), none !important; box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.75); } /*--- Multi-selektiert ---*/ .tab-background[multiselected=true]:not([selected=true]) > spacer { background-image: linear-gradient( rgba(225,225,225,1), rgba(50,98,135,1) ), none !important; } .tabbrowser-tab:hover > .tab-stack > .tab-background[multiselected=true]:not([selected=true]) > spacer { background-image: linear-gradient( rgba(225,225,225,1), rgba(50,98,135,1) ), none !important; } /* Tab-Leiste unterhalb der Symbolleiste verschieben */ #titlebar { -moz-box-ordinal-group: 2; } /* Menü nach oben verschieben */ #toolbar-menubar { position: fixed; display: inline-flex; } [sizemode="maximized"]:not([tabsintitlebar="true"]) #toolbar-menubar, [sizemode="normal"] #toolbar-menubar { top: 1px; } [sizemode="maximized"] #toolbar-menubar { top: 8px; } /* Platz für die Menüleiste oberhalb der Symbolleiste schaffen */ #main-window[tabsintitlebar="true"] #navigator-toolbox:not([inFullscreen="true"]) { border-top: solid 29px transparent !important; } #main-window:not([tabsintitlebar="true"]) #navigator-toolbox:not([inFullscreen="true"]) { border-top: solid 21px transparent !important; } /* Freien Bereich für Menü und Titelleistenschaltflächen festlegen */ [tabsintitlebar="true"] #navigator-toolbox { -moz-window-dragging: drag; } /* Titelleistenschaltfläche nach rechts oben verschieben */ #navigator-toolbox:not([style^="margin-top:"])[style=""][inFullscreen="true"] #window-controls, [tabsintitlebar="true"] .titlebar-buttonbox-container { display: block; position: fixed; right: 0; } [tabsintitlebar="true"][sizemode="normal"] .titlebar-buttonbox-container { top: 1px; } [tabsintitlebar="true"][sizemode="maximized"] .titlebar-buttonbox-container { top: 8px; } #navigator-toolbox:not([style^="margin-top:"])[style=""][inFullscreen="true"] #window-controls { top: 0; } /* auf der rechten Seite Platz machen, damit die Schaltflächen der Titelleiste und der Navigationssymbolleiste nicht im Vollbildmodus angezeigt werden */ #navigator-toolbox[inFullscreen="true"] #nav-bar { padding-right: 109px !important; } @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); toolbarbutton#tabs-newtab-button, .tabbrowser-arrowscrollbox { -moz-binding: url("bindings.xml#tabs-scroll") !important; }
