Nur sind die meisten nur als PNG zu bekommen, SVG lässt man sich schön bezahlen.
Ich habe mir schon einige von hier geholt.
Nur sind die meisten nur als PNG zu bekommen, SVG lässt man sich schön bezahlen.
Ich habe mir schon einige von hier geholt.
Mit 546 Nutzern scheint es eine extrem selten genutzte Funktion zu sein, auch wenn es damit eine Berechtigung hat. Aber diese verschwindend geringe Zahl animierte Mozilla bislang wohl nicht, es zu integrieren wie vieles anderes.
Da wären aber auch noch die 800 Millionen anderer Nutzer, die sich einmal im Jahr ärgern wie Panne der Lesezeichenexport/import ist, aber sich nie die Mühe machen nach alternativen Lösungen zu suchen.
Ist bei anderen Browsern auch nicht unbedingt besser; aber Ordnerexport wäre schon nett.
Jetzt sieht es perfekt aus.
Prima!
und Horstmann für
Moment , das hier sollte besser sein; wieder als Ersatz für den gesamten alten Code:
/* BMB button in box #3 */
#bookmarks-menu-button::after {
content: "Lesezeichen";
height: calc(2 * var(--toolbarbutton-inner-padding) + 16px);
display: flex;
align-items: center;
border-radius: var(--toolbarbutton-border-radius);
border-bottom-left-radius: 0;
border-top-left-radius: 0;
padding-right: var(--toolbarbutton-inner-padding);
}
#bookmarks-menu-button .toolbarbutton-icon {
border-bottom-right-radius: 0 !important;
border-top-right-radius: 0 !important;
}
#bookmarks-menu-button:hover::after {
background-color: var(--button-hover-bgcolor) !important;
}
#bookmarks-menu-button:is([open], :active)::after {
background-color: var(--button-active-bgcolor) !important;
}
#BMB_bookmarksPopup {
margin-inline: 0 -75px !important;
}
Alles anzeigen
Mit dem margin für das Popup kannst du ja mal spielen.
Wie bekomme ich es hin, dass der "Button" gemeinsam mit dem Wort "Lesezeichen" beim "Hover" und "Klicken" markiert wird.
Oder vielleicht den gesamten Code damit ersetzen?
/* BMB button in box */
#bookmarks-menu-button::after {
content: "Lesezeichen";
display: flex !important;
align-items: center !important;
padding-right: 6px !important;
}
#bookmarks-menu-button {
margin: var(--toolbarbutton-inner-padding) !important;
border-radius: var(--toolbarbutton-border-radius) !important;
}
#bookmarks-menu-button .toolbarbutton-icon {
background-color: transparent !important;
}
#bookmarks-menu-button:hover {
background-color: var(--button-hover-bgcolor) !important;
}
#bookmarks-menu-button[open] {
background-color: var(--button-active-bgcolor) !important;
}
#BMB_bookmarksPopup {
margin-inline: 0 -75px !important;
}
Alles anzeigen
Damit wird der Button halt zu groß/hoch; das ganze Ding sollte neu aufgebaut werden.
Wie man auf dem Dateianhang unten sieht, wird beim "Hover" und "Klicken" leider nur der Bookmark-Button dunkelgrau eingefärbt, das Wort "Lesezeichen" bleibt unverändert / unmarkiert.
Wie bekomme ich es hin, dass der "Button" gemeinsam mit dem Wort "Lesezeichen" beim "Hover" und "Klicken" markiert wird.
Ist ein ziemliches Gehacke, und selber würde ich den ganzen CC Code rauswerfen und neu machen, aber teste vielleicht mal das hier, zusätzlich zu deinem Code:
#PersonalToolbar #bookmarks-menu-button[label="Lesezeichen-Menü"] image {
border-radius: var(--toolbarbutton-border-radius) 0px 0px var(--toolbarbutton-border-radius) !important;
}
#PersonalToolbar #bookmarks-menu-button[label="Lesezeichen-Menü"]::after {
border-radius: 0px var(--toolbarbutton-border-radius) var(--toolbarbutton-border-radius) 0px;
padding-right: var(--toolbarbutton-inner-padding);
}
#PersonalToolbar #bookmarks-menu-button[label="Lesezeichen-Menü"]:hover::after {
background-color: var(--button-hover-bgcolor) !important;
}
#PersonalToolbar #bookmarks-menu-button[label="Lesezeichen-Menü"][open]::after {
background-color: var(--button-active-bgcolor) !important;
}
Alles anzeigen
Das Verhalten steht hier
chrome://browser/content/tabbrowser.css
Im aktiven Tab wird das X angezeigt, sonst nicht - ab einer bestimmten Breite (kleiner werdend).
Bei Hover wirkt das hier bei mir
Vielen Dank für den Vorschlag ; wenn ich das im Testprofil meinem CSS Code von oben hinzufüge, ändert sich am Problem aber leider nichts.
Egal ob aktive oder nicht aktive Tab, der Inhalt springt an dem Übergangspunkt zwischen textoverflow und keinem textoverflow, falls der Close Button bis zum Hovern versteckt wird ( Zeile 17-18 in meinem CSS ) - und nur dann.
Die automatische Breitenanpassung vom .tab-close-button hier hatte ich auch schon umgangen, ändert aber auch nichts.
.
Endlich habe ich es geschafft, die Verlaufsmaske für abgeschnittenen Text auch in den Tabs zu Auslassungspunkten (...) bzw. Ellipsis umzuwandlen.
Soweit so gut; ich möchte aber auch, dass bei Textüberlauf der Close Button komplett verschwindet, um mehr Platz für den Text zu schaffen, bis man über über dem Tab hovert.
Was generell auch funktioniert - aber! - wenn die Tab Breite gerade so zwischen textoverflow und kein textoverflow liegt, springt der Tabtext bzw. Inhalt hin und her, und kann sich nicht entscheiden zwischen beiden Zuständen.
Das Problem scheint im Zusammenhang mit dem ebenfalls benutzten CSS Code für Tabs über die volle Breite zu entstehen.
Hier der Code im Testprofil; beim Testen tritt das Problem auf wenn - wie erwähnt - die Tabbreite gerade auf der Grenze ist.
Ideen und Lösungen wären sehr willkommen!
/* TEST Tabs Ellipsis */
.tab-label-container {
mask-image: none !important;
}
.tab-label {
overflow: hidden !important;
text-overflow: ellipsis !important;
white-space: nowrap !important;
max-width: 100% !important;
}
/*** remove close button to make space for text til hover ***/
.tabbrowser-tab:not(:hover) .tab-label-container[textoverflow] + .tab-close-button {
visibility: collapse !important;
}
/*** tabs full width ***/
.tabbrowser-tab[fadein]:not([style^="max-width"]) {
max-width: 100vw !important;
}
Alles anzeigen
Alles anzeigenSo, 2002Andreas & Horstmann !
Ich habe die Vektorgrafiken im Code überarbeitet!
Sie sollten nun im Explorer sichtbar sein, auch habe ich einigen Grafiken zum Test im Code "komisch" gelassen.
Sie sind aber mit Test im Namen gekennzeichnet, und man sieht es ihnen auch an.
Wenn es irgendwie machbar war, habe ich den Code relativ, vom Aufbau her, so gestaltet, dass sie sich gleichen.
Nun, dann hoffe ich, dass getestet wird und warte auch Rückmeldungen.
Bei mir gibts bei deinen Icons nicht das Problem mit der schwarz gefüllten Vorschau, das Andreas hatte.
Ich habe es nur schon bei anderen Icons beobachten können, als ich mit .svg mal rumexperimeniert hatte, daher mein Kommentar dazu.
Die problematischen svgs hab ich aber alle schon gelöscht, deshalb kann ich nicht 100% nachvollziehen was genau das Problem war, hatte aber irgendwas mit context-fill... zu tun.
weil die gesamte Bildfläche mit dieser Basis Füllfarbe gefüllt wird.
Danke für die Erklärung, leuchtet mir ein.
Immer gerne.
Zu beachten ist wie üblich, dass meine Kenntnis in dem Bereich eher oberflächlich ist.
InkScape Kostenloses, leichtes, portables Programm. Erstellen und bearbeiten Sie svg, importieren Sie svg in png 16x16, usw.
Danke, das werde ich ausprobieren!
Bis jetzt nutze ich hier keine .svg Grafiken, es ist mehr aus Interesse warum das bei manchen so ist.
Wie Mira schon geschrieben hat, es liegt wohl am context-fill und/oder context-fill-opacity, teils auch stroke statt fill.
Das braucht definierten context, der in Fx an den meisten Stellen für Icons vorgegeben und erlaubt ist.
Viele Bildprogramme berücksichtigen das nicht, und typisch ist dann ein schwarzes Rechteck/Quadrat als Darstellung, weil die gesamte Bildfläche mit dieser Basis Füllfarbe gefüllt wird.
Ohne context-... im .svg Code sind aber bestimmte Funktionen in Fx nicht verfügbar, wie zB Farbänderungen.
Alles anzeigenDie "neuen" Icons
Nur mal eine Frage.
So sehen deine Icons hier im Windows Explorer in der Vorschau aus:
Manche Icons werden also nicht angezeigt bei mir.
Liegt das evtl. an deiner Bearbeitung der .svg Dateien, oder wie kann ich das ändern
Aber wie sehen sie in Firefox aus?
Viele .svg Dateien werden nicht von jedem Programm korrekt oder überhaupt angezeigt; in Fx kommt's manchmal drauf an wo sie eingesetzt werden.
Im Zweifel mal mit Firefox öffnen.
Zum Teil!
Da habe ich mich ein wenig eingearbeitet!
Aber ich bearbeite zum Teil die Vektorgrafiken auch mit Visual Studio Code,
z.B. um festzulegen, ob sie direkt farbig sein sollen, oder ob das von außen per CSS geschehen soll.
Dankeschön, Mira!
Irgendwann muss ich da auch nochmal ran.
Bisher hab ich nur ein rudimentäres Verständnis davon; wie man den Text Code in eine Bilddatei umbenennt/verwandelt und das Einfärben manipuliert, solche Sachen.
Die "neuen" Icons
Kurze Frage: machst du deine (.svg) Icons selber, und falls ja mit welchem Programm?
es hat geklappt
Prima!
Ich benutze die Sсript about:about, about:addons, about:config, aber mir fehlen die Kenntnisse, um CSS für Textbuttons wie in Beitrag #26 #31 zu erstellen. Bitte helfen Sie mit jeder Schaltfläche und ich werde es von dort herausfinden.
Mit CSS kannst du auch einen Textbutton erstellen, zB so:
#aboutabout-ToolBarButton > image {
display: none !important;
}
#aboutabout-ToolBarButton > label {
display: flex !important;
background-color: lightgreen !important;
color: red !important;
outline: 1px solid red !important;
outline-offset: -1px !important;
}
#aboutabout-ToolBarButton:hover > label {
background-color: green !important;
color: cyan !important;
outline: 1px solid purple !important;
outline-offset: -1px !important;
}
Alles anzeigen
Im Script wäre dabei die ID aboutabout-ToolBarButton, der Text ist was im Script bei label eingetragen ist.
Farben, Outlines, Texteinstellungen etc. kannst du dann ganz normal mit CSS anpassen, oder einfach weglassen; im Prinzip brauchst du nur das, um das Icon mit Text zu ersetzen:
Mein direkter Symbolpfad enthält Leerzeichen, daher funktioniert er nur mit "my path"-Anführungszeichen.
Auf meinem Mac hatte ich das Problem auch; es hat geholfen die Leerzeichen im Dateipfad mit %20 zu ersetzen.
Für die Tabs hat's bei mir etwas gedauert bis ich es raushatte, ich teste bei mir gerade das hier, sieht soweit gut aus:
Ich habe es jetzt erst einmal Testweise eingebaut, Dankeschön.
Wenn wir schonmal dabei sind, es ist doch nur noch ein Schnipsel; das benutze ich für diverse URL Einträge; damit ist bei mir scheinbar das Meiste (Alles?) an Textverläufen abgedeckt.
Auf Mac und leider nur 115esr, sowas ändert sich gerne mal.