Beiträge von Horstmann

Zitat von hwww

Es funktioniert nicht mehr richtig. Es kommen die Pfeile und die zwei tanzende Punkte. Bei längeren laden gehen die Pfeile ganz weg.

Um das genauer testen zu können, sollte man vermutlich dein .gif haben; ich glaube du kannst das hier hochladen.

Was genau du erreichen willst ist mir auch nicht ganz klar - sollen die Punkte denn bleiben?

Bei mir stören die nur mein animiertes .gif, also hab ich sie abgestellt.

Generell könntest du sowas in der Art mal probieren:

.tab-throbber[busy]::before {
    display: none !important;
}

.tab-throbber {
    background-image: url("DeinAnimiertesBildHier.gif") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: 16px !important;
}

Was den Übergang zwischen Throbber und Website Icon angeht (Pfeile ganz weg), da bin ich leider überfragt.

Passiert bei mir auch, ist aber nur ein kurzer Moment.

.tab-throbber-fallback gibt's denke ich nicht, und das doppelte .gif.gif könnte auch Ärger machen.

Zitat von Sören Hentzschel

Zitat von GermanFreme82

Ich mag das Notepad ++ zwar nicht, weil er die Code grau macht und ich kaum was lesen kann, aber irgendwer hat mir mal gesagt, das ist das beste für Codes.

Das beste für Code ist Notepad++ ganz sicher nicht, nicht einmal annähernd. Aber es ist kostenlos.

Also hier auf dem Mac nehm ich ja TextEdit, das macht nämlich den Code nicht grau.

Oder manchmal Atom, wenn ich was sehen will.

Beides kostenlos.

Zitat von GermanFreme82

---

Ich rate da nur wild umher und ändere Zahlen und Dinge, von denen ich glaube, das sie das machen was ich möchte. Ich könnte eben so gut auch blind auf die Tasten schlagen.

Mach ich auch so, und funktioniert prima.

Meistens jedenfalls, oder zumindest manchmal...

Aber wie schon erwähnt - wenn du komplexe Modifikationen benutzt, und die dann auch noch manipulieren willst, dann solltest du dich halt ab und zu mal mit dem Thema beschäftigen, und wenigstens ein Basiswissen anlegen.

Oder Firefox halt ohne Hacks benutzen, ist auch eine Option.

Aber der gute 2002Andreas ist ja dran, also Ruhe bewahren.

Zitat von 2002Andreas

Finde ich ja auch, darum das Bild wie es bei mir aussieht

Ah, verstehe, dachte da wäre was im Argen - die ewige Angst vor der kompetenzschwachen Falschaussage ...

Zitat von 2002Andreas

Sach ich doch, sieht gut (funktionell, nicht hübsch ) aus - oder hab ich was übersehen?

Zitat von 2002Andreas

Teste bitte:

Sieht hier gut aus!

#downloadsListBox {

Zitat von geldhuegel

Leider sind die Icons und der Text seit FF 113 linksbündig und nicht zentriert.

Du könntest sowas mal probieren, im Prinzip hab ich nur an diversen Stellen margin-inline: auto !important; dazugepackt.

Wo es nötig ist und wo nicht habe ich allerdings nicht im Detail getestet.

Ein Screenshot würde evtl. auch helfen für genauere Modifikationen.

#downloadsListBox {
  max-height: 1213px !important;
  overflow-y: auto !important;
  margin-inline: auto !important;
}

#downloadsPanel-multiView #downloadsPanel-mainView {
    width: 44em !important;
}

#downloadsFooterButtons .button-box {
  display: flex !important;
  justify-content: center !important;
  margin-inline: auto !important;
}

#downloadsHistory {
  appearance: none !important;
  background: url("file:///C:/Users/geldh/AppData/Roaming/Mozilla/Firefox/Profiles/rq9bmbv4.Neustart/chrome/Icons/savevideo.png") no-repeat !important;
  background-position: 130px 8px !important;
  padding-left: 25px !important;
  margin-inline: auto !important;
}

#downloadsFooterButtons button#downloadsHistory.downloadsPanelFooterButton hbox.box-inherit.button-box label.button-text {
  appearance: none !important;
  background: url("file:///C:/Users/geldh/AppData/Roaming/Mozilla/Firefox/Profiles/rq9bmbv4.Neustart/chrome/Icons/savevideo.png") no-repeat !important;
  background-position: 0px 0px !important;
  padding-left: 25px !important;
  margin-inline: auto !important;
}

.downloadTarget {
  color: blue !important;
  font-size: 16px !important;
}
 
#emptyDownloads {
  font-weight: bold !important;
  font-size: 15px !important;
  color: red !important;
}
 
#emptyDownloads {
  appearance: none !important;
  background: url("file:///C:/Users/geldh/AppData/Roaming/Mozilla/Firefox/Profiles/rq9bmbv4.Neustart/chrome/Icons/feed_delete.png") no-repeat !important;
  background-position: 0px 25px !important;
  padding-left: 25px !important;
  margin-inline: auto !important;
}

.panel-view-body-unscrollable { /*Keine Downloads in dieser Sitzung mittig*/
  display: flex !important;
  justify-content: center !important;
  margin-inline: auto !important;
}

.downloadDetails.downloadDetails {
  font-size: 13px !important;
  color: red !important;
}

.downloadIconShow > .button-box > .button-icon {
  fill: blue !important;
}


.downloadIconRetry > .button-box > .button-icon {
  fill: red !important;
}

Zitat von 2002Andreas

Zitat von Dharkness

funktioniert natürlich auch nicht mehr,

Teste bitte:

CSS

/*Tabtext zentriert*/
.tab-label-container {
  margin: auto !important; /*nur wenn Tabs schmaler gemacht sind, sonst auskommentieren*/
  height: unset !important;
  display: grid !important;
  justify-items: safe center !important;
  justify-content: safe center !important;
}

.tab-label {
  justify-content: center !important;
  overflow: hidden !important;
}

/* Tabtext nicht verschoben bei hover */
.tabbrowser-tab > .tab-stack > .tab-content > .tab-close-button {
  padding-inline-start: 7px !important;
  width: unset !important;
}

Alles anzeigen

Mal kurz angetestet: das zentriert nur den Tab Text innerhalb der Tab, das Tab Icon bleibt am linken Rand.

Der alte Code von Dharkness hat Text und Icon zentriert, daher würde ich die andere Lösung vorschlagen.

Die gleiche Frage hatte neulich jemand woanders gestellt, für den jungen Mann hat es so funktioniert.

Zitat von Dharkness

Hallo zusammen,

das * funktioniert natürlich auch nicht mehr, eine Änderung dahingehend zeigt aber nicht das gewünschte Bild, wer hat ein Idee?

*

CSS

/* Tabinhalt zentrieren. */
.tabbrowser-tab[selected]:not(:hover):not([pinned]) .tab-label-container,
#tabbrowser-tabs:not([closebuttons="activetab"])
.tabbrowser-tab:not(:hover):not([pinned]) .tab-label-container{
  margin-inline-end: 7px
}
.tab-content:not([pinned])::before{
  display: -moz-box;
  content: "";
  -moz-box-flex: 1;
}

Alles anzeigen

Alternativ zum CSS von 2002Andreas kannst du auch das hier mal antesten, das hat den obigen alten Code ersetzt.

Firefox 113 bringt einige Änderungen mit sich, vermutlich mehr als viele frühere Versionen.

Für den Fall dass manche Leute noch nicht auf dem Laufenden sind, und sich wundern werden warum ihr CSS Code mit Version 113 plötzlich versagt, könnte das hier evtl. helfen.

Im Prinzip benötigt fast alles was -moz-box als CSS Regel enthält eine Änderung oder Ergänzung; Erklärungen zum Thema finden sich z.B. hier und hier.

Die Umstellung für selbst gebastelte CSS Codes ist einfach, man muss es nur machen; wer sehr komplexe Modifikationen von dritten Parteien verwendet, sollte vielleicht nach aktuellen Updates für das betreffende Theme etc. schauen.

Einige der für mich relevanten Änderungen für mein eigenes CSS sind diese (basierend auf den oben verlinkten Infos):

• display: -moz-box -> display: flex / ( display: inherit )
• -moz-box-ordinal-group: 0 -> order: -1
• -moz-box-ordinal-group: 1 -> order: 1
• -moz-box-orient: vertical / horizontal -> flex-direction: column / row
• -moz-box-direction: reverse -> flex-direction: row-reverse
• -moz-box-align: center -> align-items: center
• -moz-box-pack: start / end / center -> justify-content: flex-start / flex-end / center
• -moz-box-flex: 10 -> flex-grow: 10

Zitat von FuchsFan

Danke für den Hinweis.

Gerne!

Zitat von Gehberger

Ich habe das wie folgt geändert und das scheint zu funktionieren?

.tabbrowser-tab:not([pinned]) {

min-width: 40px !important;

}

Das funktioniert generell auch.

Zitat von FuchsFan

Zitat von Gehberger

Kann man diese Mindestgröße reduzieren, damit mehrere offene Tabs immer kleiner werden, aber noch vorhanden sind und nicht überlaufen?

Das kannst Du damit probieren.

CSS

/* Länge der Tabs */
.tabbrowser-tab[fadein]:not([style^="max-width"]) {
    max-width: 25vw !important;
    min-width: 18vw !important;
}    

Ist aber etwas Arbeit das ordentlich zu justieren, und nix für Ungeübte...

Das Einfachste wäre in about:config die Einstellung browser.tabs.tabMinWidth zu verändern.

Ein höherer Wert lässt die Tabs früher überlaufen, ein niedrigerer Wert erlaubt mehr Tabs vor dem Überlaufen ( geht auch mit CSS ).

Zitat von Oberschamane

Hier ist der Inhalt der UserCrome.css (die Standarddatei, die bei dem Paket mit dabei ist)

// userChrome.js

userChrome.ignoreCache = true;

userChrome.import("*", "UChrm");

Getestet habe ich es mit deaktivierter Datei und es gab (fast) keinerlei Änderung, nur dass sich eine andere userCrome.css-Datei erstellt hat.

Das ist die userChrome.js, nicht die userChrome.css, grosser Unterschied.

Zitat von 2002Andreas

Das kann ich dir anbieten:

CSS

.tabbrowser-tab[pinned] {
   -moz-box-ordinal-group: 2 !important; 
}

Oder auch sowas, damit der Neuer Tab Button rechts von allen Tabs bleibt:

.tabbrowser-tab[pinned] {
    -moz-box-ordinal-group: 2 !important; 
    order: 2 !important;
}

#tabbrowser-arrowscrollbox-periphery {
    -moz-box-ordinal-group: 3 !important; 
    order: 3 !important;
}

Der Haken ist, es funktioniert nicht wenn die Tabs überlaufen.

Es gibt auch noch das hier, ist aber ebenfalls nicht das Wahre, wie der Autor auch anmerkt.

Zitat von Mary-J.

@Horstmann,

danke für die Erklärung, Ich habe einfach nur die var() übersehen,

so ein sch...

Macht auch keinen Unterschied, wenn die Variable nicht vorher definiert wird.

Zitat

Dein GuRu ist nicht der Erfinder des Präfixes uc .

Charmant, erinnert mich an jemanden...

Wer ist denn der 'Erfinder', und wen juckt's?

Deine andere Frage hat mich auch beschäftigt, also habe ich - extra für dich - mal eben beim Chef/Guru nachgefragt, und netterweise wie immer eine hilfreiche Antwort bekommen.

Zitat von Mary-J.

Bisher habe ich die Shadowroot-Variablen-Lösung immer mit einer Variablen-Deklaration eine Ebene höher als die Variablen-Definition angewendet. Hast Du vielleicht hierfür auch eine einfachere Lösung?

CSS

/*vertical scrollbar for bookmarks folder*/
#PlacesToolbar menupopup {
    --uc-menupopup-overflow: auto !important;
}
.scrollbox-clip > scrollbox[orient="vertical"] {
    overflow-y: var(--uc-menupopup-overflow,hidden) !important;
}

Die Frage verstehe ich nicht ganz.

Wenn ich den Code ausprobiere, scheint er zu funktionieren, und sieht denkbar einfach aus.

Normal eingestezt in der userChrome.css, ohne shadow-root Skript.

Zitat

Nur mit:

CSS

.scrollbox-clip > scrollbox[orient="vertical"] {
    --uc-overflow-y: auto !important;
}

geht das jedenfalls nicht.

Die Variable --uc-overflow-y wird hier nur definiert, nicht angewandt; hier nochmal der Link zum Infoartikel.

--uc-overflow-y ist so eine selber erstellte Variable - --uc wird glaub ich ursprünglich von It_Was_The_Other_Guy benutzt, und ist ein beliebiges Kürzel.

Man kann auch --abc-Rumpelstilzchen-overflowhaha benutzen, oder sonstwas, solange es keine Benennung ist die Fx schon verwendet.

Angewandt wird die Variable dann mit var(); entweder im Element in dem es definiert wurde, oder in einem untergeordneten Element.

Etwa so, die Variable lässt sich auf alles in Navbar anwenden:

#nav-bar {
    --abc-Rumpelstilzchen-doofe-farbe: pink;
}

#PanelUI-menu-button {
    background-color: var(--abc-Rumpelstilzchen-doofe-farbe) !important;
}

Oder so:

#PanelUI-menu-button {
    --abc-Rumpelstilzchen-doofe-farbe: pink;
    background-color: var(--abc-Rumpelstilzchen-doofe-farbe) !important;
}

Zitat von FuchsFan

Ich bedanke mich, reichhaltiges Angebot, werde bestimmt was davon gebrauchen.

Gerne, hoffe eine Variante passt.

2002Andreas und Dharkness , danke für's ausprobieren.

Variablen sind schon prima; die einfache Variante macht vermutlich am meisten Sinn in den meisten Fällen.

Zitat von FuchsFan

Wie müsste er jetzt aussehen, wenn ich für beide Bereiche andere Icons einsetzen möchte. Habe mich schon daran versucht, aber will nicht so wirklich funktionieren.

Der Code von Andreas funktioniert hier; alternativ sollte auch sowas funktionieren:

#tabbrowser-arrowscrollbox {
    --custom-right-image: url("pfeiltest-rechts.png");
    --custom-left-image: url("pfeiltest-links.png");
    --custom-arrow-transform: scale(1);
}

.menupopup-arrowscrollbox {
    --custom-right-image: url("pfeiltest-down.png");
    --custom-left-image: url("pfeiltest-up.png");
}

#scrollbutton-down > .toolbarbutton-icon {
    list-style-image: var(--custom-right-image) !important;
    transform: var(--custom-arrow-transform) !important;
}

#scrollbutton-up > .toolbarbutton-icon {
    list-style-image: var(--custom-left-image) !important;
    transform: var(--custom-arrow-transform) !important;
}

Oder diese einfache Variante mal testen; hier muss man nur beachten, dass Firefox selber die Pfeile (Icons) intern transformiert, bzw. in der Richtung anpasst.

transform sollte man also dann nicht zusätzlich benutzen, und das Positionieren könnte im Einzelfall etwas aufwändiger sein; aber es ist simpler, und man braucht nur ein Icon nach links und eines nach unten zeigend.

#tabbrowser-arrowscrollbox {
    --custom-arrow-image: url("pfeiltest-links.png");
}

.menupopup-arrowscrollbox {
    --custom-arrow-image: url("pfeiltest-down.png");
}

:is(#scrollbutton-up, #scrollbutton-down) > .toolbarbutton-icon {
    list-style-image: var(--custom-arrow-image) !important;
}

Zum Testen hier noch ein paar Icons, die gehören dann - mit dem CSS von oben - direkt in den chrome Ordner.

Oder eben die url Pfade und Bilddateien nach Wunsch anpassen.