Doch noch eine Frage: Kannst du mir bitte auch den Code für die inaktiven Tabs nennen? Vielen Dank!
Beiträge von klickman
-
-
Aber die Datei userChrome.css habe ich ja schon, muss ich den Inhalt der neuen in meine vorhandene reinkopieren?War bei mir auch so. Ich habe meine in chrome belassen und die aus dem Paket nicht kopiert. Auch nicht den Text übernommen.
-
Dein Code ist für mich jetzt wieder sichtbar. Mysteriös.
-
Seltsam, ich konnte den Code gerade noch kopieren und in die userChrome.css einfügen. :-?? Klappt tadellos im aktiven Tab.
-
Sorry, mea culpa. Im aktiven Tab meinte ich. Und danke, klappt wunderbar!
-
In welche Datei muss ich den Hinweis auf die TabFocus.uc.js eintragen? Und in welcher Form?Gar nicht.
Browser neu starten, dann sollte das Script aktiv sein und arbeiten.EDIT:
Und der Ordner sollte chrome heißen -
Kollegen, wie kann ich die Schrift in den Tabüberschriften vergrößern?
[attachment=0]Bildschirmfoto 2017-12-03 um 20.20.26.jpg[/attachment]
-
Dein Code, der den Throbber aus FF56 wieder herstellt, ist genau richtig für mich! Wahnsinn. Vielen herzlichen Dank!!
:klasse: -
Sensationell 2002Andreas, das ging ja in Lichtgeschwindigkeit! Vielen Dank!
:klasse:
Solange es für die URL-Bar nichts gibt, werde ich zumindest den wandernden Punkt behalten. Dieser Farbschleier allerdings bleibt beerdigt. -
Hallo Kollegen,
nachdem ich meinen 57er mit eurer Hilfe nun schon recht ansehnlich und für mich brauchbar gestaltet habe, gehts hurtig weiter.
Ich verwende die CustomCSSforFx]CustomCSSforFx von Aris und die Curved Tabs von wilfredwee. Ich erwähne das, weil sich ev. in einem der beiden der Code für meine gewünschten Veränderungen verbirgt.Mein Anliegen:
Ich hätte gerne die Fortschritts- bzw. Ladeanzeige direkt im Tab ausgeblendet. Das ist zum einen dieser links/rechts pendelnde Punkt
[attachment=2]Bildschirmfoto 2017-12-03 um 13.09.49.jpg[/attachment]und zum anderen dieser Farbschleier, der während des Ladens von links nach rechts wandert
[attachment=1]Bildschirmfoto 2017-12-03 um 13.12.10.jpg[/attachment]Stattdessen soll sich die Fortschrittsanzeige in der URL-Bar befinden. Bis FF56 war das durch die Erweiterung Status-4-Evar möglich und sah bei mir so aus:
[attachment=0]Fortschritt FF56.jpg[/attachment]Lässt sich das irgendwie nachbauen?
-
Nein, muß er nicht, die "alte" Version läuft problemlos unter Linux, denn Linux ist nicht MacOS.
Danke für den Hinweis!
Dass Linux und macOS nicht das Gleiche ist, ist klar. Doch da der Unterbau bei beiden gleich ist, lag die Vermutung nahe. Wie dem auch sei, die von aborix angepasste config.js ist lt. seiner Aussage nun für alle Betriebssysteme nutzbar.
-
milupo:
Wobei er aus meiner Sicht allerdings die angepasste config.js (für macOS) verwenden müsste. -
Perfekt, danke! :klasse:
[attachment=0]Bildschirmfoto 2017-12-03 um 16.42.04.jpg[/attachment]
-
teste einmal diesen Code:CSS
Alles anzeigen:root { --tab-curve-width: 30px; --tabs-border: transparent !important; } .arrowscrollbox-scrollbox { padding-inline-start: 10px !important; } /* To be able to see the top border of the tab */ .tab-stack { margin-top: 2px !important; } /* When the window is maximized, the first pinned tab is properly displayed. */ #TabsToolbar { padding-inline-start: 15px !important; } .titlebar-placeholder { border: none !important; } /* Remove unneeded styles from Photon */ .tabbrowser-tab::before, .tabbrowser-tab::after { border: none !important; } .tabbrowser-tab > .tab-stack > .tab-background { background-image: none !important; -moz-box-orient: horizontal !important; background-color: transparent !important; margin-top: 1px !important; } .tab-background[selected="true"] { border: none !important; } .tab-line { display: none !important; } .tab-bottom-line { display: none !important; } /* Match height of new tab button (right svg) on hover */ .tabs-newtab-button { margin: 0 !important; } /* overlap the tab curves */ .tab-background { -moz-margin-end: -15px !important; -moz-margin-start: -15px !important; } /* Begin tab background customizations */ .tab-background[selected="true"]::before { border: none !important; content: "" !important; width: 30px !important; min-height: 30px !important; display: -moz-box !important; background-repeat: no-repeat !important; } .tab-background[selected="true"]::after { border: none !important; content: "" !important; width: 30px !important; min-height: 30px !important; display: -moz-box !important; background-repeat: no-repeat !important; } .tab-background[selected="true"] > spacer { margin-top: 0px !important; } #new-tab-button, .tabs-newtab-button { width: calc(36px + 30px) !important; margin-inline-start: -15px !important; margin-top: 1px !important; } /* Tab hover customizations */ /* Regular tabs */ .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true])::before { display: -moz-box !important; background-repeat: no-repeat !important; content: "" !important; width: 30px !important; min-height: 30px !important; background-color: transparent !important; } .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true])::after { display: -moz-box !important; background-repeat: no-repeat !important; content: "" !important; width: 30px !important; min-height: 30px !important; background-color: transparent !important; } .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true]) > spacer { margin-top: 0px !important; } #TabsToolbar[brighttext] > #tabbrowser-tabs > .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected="true"]), .tabs-newtab-button:hover, .tabs-newtab-button:hover::before, .tabs-newtab-button:hover::after { background-color: transparent !important; } /* New tab hover customizations */ .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected="true"]), .tabs-newtab-button:hover { background-position: 0px 2px, 30px 3px , right bottom !important; background-repeat: no-repeat !important; background-size: 30px 30px, calc(100% - (2 * 30px)) 30px, 30px !important; } .tabs-newtab-button:hover > .toolbarbutton-icon { background: none !important; background-color: transparent !important; } /* Color specific customizations */ .tab-background[selected="true"]::before { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='31px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.0625 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.0625 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='31' clip-path='url(%23tab-curve-clip-path-start)'><div id='tab-background-fill' style='background-color:rgb(50, 50, 52);background-repeat:no-repeat;height:100%;width:100%;' xmlns='http://www.w3.org/1999/xhtml'></div></foreignObject></svg>") !important; } .tab-background[selected="true"]::after { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='31px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.0625 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.0625 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='31' clip-path='url(%23tab-curve-clip-path-end)'><div id='tab-background-fill' style='background-color:rgb(50, 50, 52);background-repeat:no-repeat;height:100%;width:100%;' xmlns='http://www.w3.org/1999/xhtml'></div></foreignObject></svg>") !important; } .tab-background[selected="true"] > spacer { background-image: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0)), linear-gradient( transparent 2px, rgb(50, 50, 52) 2px, rgb(50, 50, 52) ), none !important; } .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true])::before { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='31px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.0625 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.0625 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='31' clip-path='url(%23tab-curve-clip-path-start)'><div id='tab-background-fill' style='background-color:rgba(255, 255, 255, .1);background-repeat:no-repeat;height:100%;width:100%;' xmlns='http://www.w3.org/1999/xhtml'></div></foreignObject></svg>") !important; } .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true])::after { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='31px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.0625 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.0625 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='31' clip-path='url(%23tab-curve-clip-path-end)'><div id='tab-background-fill' style='background-color:rgba(255, 255, 255,.1);background-repeat:no-repeat;height:100%;width:100%;' xmlns='http://www.w3.org/1999/xhtml'></div></foreignObject></svg>") !important; } .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true]) > spacer { background-image: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0)), linear-gradient( transparent 2px, rgba(255,255,255,.1) 2px, rgba(255,255,255,.1) ), none !important; } .tabs-newtab-button:hover { background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='31px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.0625 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.0625 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='31' clip-path='url(%23tab-curve-clip-path-start)'><div id='tab-background-fill' style='background-color:rgba(255,255,255,.1);background-repeat:no-repeat;height:100%;width:100%;' xmlns='http://www.w3.org/1999/xhtml'></div></foreignObject></svg>"), linear-gradient(rgba(255,255,255,.1), rgba(255,255,255,.1)), url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='31px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.0625 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.0625 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='31' clip-path='url(%23tab-curve-clip-path-end)'><div id='tab-background-fill' style='background-color:rgba(255,255,255,.1);background-repeat:no-repeat;height:100%;width:100%;' xmlns='http://www.w3.org/1999/xhtml'></div></foreignObject></svg>") !important; }
Gruß
EDV-OldiSpitze, EDV-Oldi! Das färbt mir nur den aktiven Tab ein, genau das wollte ich. :klasse:
Ich nehme an, du hast die Werte 50,50,52 verwendet?? Dann kann ich danach suchen und durch meine gewünschten (255,153,102) ersetzen.EDIT:
Es müssten diese 4 Stellen sein, korrekt?
[attachment=0]Bildschirmfoto 2017-12-03 um 16.34.39.jpg[/attachment] -
Ich würde die Werte einmal drastisch verändert.
Z.B. 60,60,60,An den Farbwerten liegts nicht, ich weiß, welche ich benutzen möchte. Die Frage ist bloß, welche bzw. wo die zu finden sind?
Wie gesagt, ich finde den Abschnitt, den du gepostet hast, nirgendwo im Code. -
Tut es aber nicht. Hier der gesamte wilfredwee-Code, den ich in meiner userChrome.css stehen hab:
CSS
Alles anzeigen/*Geschweifte Tabs nach wilfredwee*/ :root { --tab-curve-width: 30px; --tabs-border: transparent !important; } .arrowscrollbox-scrollbox { padding-inline-start: 10px !important; } /* To be able to see the top border of the tab */ .tab-stack { margin-top: 2px !important; } /* When the window is maximized, the first pinned tab is properly displayed. */ #TabsToolbar { padding-inline-start: 15px !important; } .titlebar-placeholder { border: none !important; } /* Remove unneeded styles from Photon */ .tabbrowser-tab::before, .tabbrowser-tab::after { border: none !important; } .tabbrowser-tab > .tab-stack > .tab-background { background-image: none !important; -moz-box-orient: horizontal !important; background-color: transparent !important; margin-top: 1px !important; } .tab-background[selected="true"] { border: none !important; } .tab-line { display: none !important; } .tab-bottom-line { display: none !important; } /* Match height of new tab button (right svg) on hover */ .tabs-newtab-button { margin: 0 !important; } /* overlap the tab curves */ .tab-background { -moz-margin-end: -15px !important; -moz-margin-start: -15px !important; } /* Begin tab background customizations */ .tab-background[selected="true"]::before { border: none !important; content: "" !important; width: 30px !important; min-height: 30px !important; display: -moz-box !important; background-repeat: no-repeat !important; } .tab-background[selected="true"]::after { border: none !important; content: "" !important; width: 30px !important; min-height: 30px !important; display: -moz-box !important; background-repeat: no-repeat !important; } .tab-background[selected="true"] > spacer { margin-top: 0px !important; } #new-tab-button, .tabs-newtab-button { width: calc(36px + 30px) !important; margin-inline-start: -15px !important; margin-top: 1px !important; } /* Tab hover customizations */ /* Regular tabs */ .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true])::before { display: -moz-box !important; background-repeat: no-repeat !important; content: "" !important; width: 30px !important; min-height: 30px !important; background-color: transparent !important; } .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true])::after { display: -moz-box !important; background-repeat: no-repeat !important; content: "" !important; width: 30px !important; min-height: 30px !important; background-color: transparent !important; } .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true]) > spacer { margin-top: 0px !important; } #TabsToolbar[brighttext] > #tabbrowser-tabs > .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected="true"]), .tabs-newtab-button:hover, .tabs-newtab-button:hover::before, .tabs-newtab-button:hover::after { background-color: transparent !important; } /* New tab hover customizations */ .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected="true"]), .tabs-newtab-button:hover { background-position: 0px 2px, 30px 4px , 36px 2px !important; background-repeat: no-repeat !important; background-size: 30px 30px, calc(100% - (2 * 30px)) 30px, 30px !important; } .tabs-newtab-button:hover > .toolbarbutton-icon { background: none !important; background-color: transparent !important; } /* Color specific customizations */ :root { --svg-selected-before: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='31px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.0625 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.0625 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='31' clip-path='url(%23tab-curve-clip-path-start)'><div id='tab-background-fill' style='background-color:rgb(249,249,250);background-repeat:no-repeat;height:100%;width:100%;' xmlns='http://www.w3.org/1999/xhtml'></div></foreignObject></svg>"); --svg-selected-after: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='31px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.0625 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.0625 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='31' clip-path='url(%23tab-curve-clip-path-end)'><div id='tab-background-fill' style='background-color:rgb(249, 249, 255);background-repeat:no-repeat;height:100%;width:100%;' xmlns='http://www.w3.org/1999/xhtml'></div></foreignObject></svg>"); --background-selected-middle: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0)), linear-gradient( transparent 2px, rgb(249,249,255) 2px, rgb(249,249,255) ), none; --svg-hover-before: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='30px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.0625 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.0625 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='30' clip-path='url(%23tab-curve-clip-path-start)'><div id='tab-background-fill' style='background-color:rgba(255, 255, 255, .1);background-repeat:no-repeat;height:100%;width:100%;' xmlns='http://www.w3.org/1999/xhtml'></div></foreignObject></svg>"); --svg-hover-after: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='31px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.0625 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.0625 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='31' clip-path='url(%23tab-curve-clip-path-end)'><div id='tab-background-fill' style='background-color:rgba(255, 255, 255,.1);background-repeat:no-repeat;height:100%;width:100%;' xmlns='http://www.w3.org/1999/xhtml'></div></foreignObject></svg>"); --background-hover-middle: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0)), linear-gradient( transparent 2px, rgba(255,255,255,.1) 2px, rgba(255,255,255,.1) ), none; --newtab-hover: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='30px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.0625 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.0625 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='31' clip-path='url(%23tab-curve-clip-path-start)'><div id='tab-background-fill' style='background-color:rgba(255,255,255,.1);background-repeat:no-repeat;height:100%;width:100%;' xmlns='http://www.w3.org/1999/xhtml'></div></foreignObject></svg>"), linear-gradient(rgba(255,255,255,.1), rgba(255,255,255,.1)), url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='31px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.0625 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.0625 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='31' clip-path='url(%23tab-curve-clip-path-end)'><div id='tab-background-fill' style='background-color:rgba(255,255,255,.1);background-repeat:no-repeat;height:100%;width:100%;' xmlns='http://www.w3.org/1999/xhtml'></div></foreignObject></svg>"); } /* OS-specific color variables */ @media screen and (-moz-windows-theme) { :root { } } @media not screen and (-moz-windows-theme) { :root { } } .tab-background[selected="true"]::before { background-image: var(--svg-selected-before) !important; } .tab-background[selected="true"]::after { background-image: var(--svg-selected-after) !important; } .tab-background[selected="true"] > spacer { background-image: var(--background-selected-middle) !important; } .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true])::before { background-image: var(--svg-hover-before) !important; } .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true])::after { background-image: var(--svg-hover-after) !important; } .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true]) > spacer { background-image: var(--background-hover-middle) !important; } .tabs-newtab-button:hover { background-image: var(--newtab-hover) !important; } -
Danke, doch abgesehen davon, dass ich das Standard-Theme und demnach die "default-css" verwende, finde ich im kompletten Code keinen Abschnitt, der dem deinen gleicht.
Es gibt zwar ein paar Abschnitte, in denen rgb-Werte eingetragen sind, doch keine Ahnung, welche die nötigen sind. Ich werde mal mittels "trial and error" durchtesten. -
Danke für den Hinweis, Beitrag 121 habe ich schon gesehen. Bloß ist das mit der Zeilennummer ein Problem, da bei unterschiedlicher Größe meines Texteditorfenster entweder mehr oder weniger Zeilen angezeigt werden und ich dadurch keine Ahnung habe, wo welche Werte angepasst werden sollen. :-???
EDIT:
Ich schätze, es müsste irgendwo in diesem Abschnitt sein? Hab null Ahnung von dem, was da drinnen steht. :roll:Code
Alles anzeigen/* Color specific customizations */ :root { --svg-selected-before: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='31px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.0625 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.0625 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='31' clip-path='url(%23tab-curve-clip-path-start)'><div id='tab-background-fill' style='background-color:rgb(249,249,250);background-repeat:no-repeat;height:100%;width:100%;' xmlns='http://www.w3.org/1999/xhtml'></div></foreignObject></svg>"); --svg-selected-after: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='31px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.0625 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.0625 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='31' clip-path='url(%23tab-curve-clip-path-end)'><div id='tab-background-fill' style='background-color:rgb(249, 249, 255);background-repeat:no-repeat;height:100%;width:100%;' xmlns='http://www.w3.org/1999/xhtml'></div></foreignObject></svg>"); --background-selected-middle: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0)), linear-gradient( transparent 2px, rgb(249,249,255) 2px, rgb(249,249,255) ), none; --svg-hover-before: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='30px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.0625 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.0625 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='30' clip-path='url(%23tab-curve-clip-path-start)'><div id='tab-background-fill' style='background-color:rgba(255, 255, 255, .1);background-repeat:no-repeat;height:100%;width:100%;' xmlns='http://www.w3.org/1999/xhtml'></div></foreignObject></svg>"); --svg-hover-after: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='31px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.0625 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.0625 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='31' clip-path='url(%23tab-curve-clip-path-end)'><div id='tab-background-fill' style='background-color:rgba(255, 255, 255,.1);background-repeat:no-repeat;height:100%;width:100%;' xmlns='http://www.w3.org/1999/xhtml'></div></foreignObject></svg>"); --background-hover-middle: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0)), linear-gradient( transparent 2px, rgba(255,255,255,.1) 2px, rgba(255,255,255,.1) ), none; --newtab-hover: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='30px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.0625 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.0625 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='31' clip-path='url(%23tab-curve-clip-path-start)'><div id='tab-background-fill' style='background-color:rgba(255,255,255,.1);background-repeat:no-repeat;height:100%;width:100%;' xmlns='http://www.w3.org/1999/xhtml'></div></foreignObject></svg>"), linear-gradient(rgba(255,255,255,.1), rgba(255,255,255,.1)), url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='31px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.0625 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.0625 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.0625 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='31' clip-path='url(%23tab-curve-clip-path-end)'><div id='tab-background-fill' style='background-color:rgba(255,255,255,.1);background-repeat:no-repeat;height:100%;width:100%;' xmlns='http://www.w3.org/1999/xhtml'></div></foreignObject></svg>"); } -
klickman
Ich habe die Tabs "gefärbt" und "gerundet" mit dem Code von https://github.com/wilfredwee/photon-australis.
In diesem Code habe ich die Farbwerte geändert... :wink:Verrätst du mir bitte, was genau du wo für die orange Färbung des aktiven Tabs geändert hast?
-
Ergänzend dazu...vorher einfach mein Script von oben mal testen, evtl. sind ja alle Einträge bei dir richtig.
Wenn er die Vorbereitungen so wie beschrieben getroffen hat und mit Linux arbeitet, dann ist die angepasste config.js nicht dabei, braucht diese aber zwingend. Darauf wird einzig im Thread von EffPeh hingewiesen. Das war ja auch der Grund für meine PN an dich.