Lokale Datei als benutzerdefinierte Grafik für angepinnte Seiten

2002Andreas

Zitat von Ernie2210

toolkit.legacyUserProfileCustomizations.stylesheets

Der Eintrag muss auf true stehen, ansonsten funktionieren keine CSS Codes.

Ernie2210

Ich habe ihn zum Test mal deaktivert, da ich alles abschalten sollte und auch dann sind die schrägen Buchstaben da.

Sören Hentzschel

Es sind aber auch keine Icons mehr da - ist in dem Profil vielleicht noch irgendetwas abgeschaltet, was nicht abgeschaltet sein sollte? Hast du mal Firefox neu gestartet und geschaut, ob dann die Icons dann da sind?

Ernie2210

Neu gestartet habe und es ist auch nicht überall:

Ernie2210

Ich habe mal Firefox komplett neu installiert und festgestellt, dass die schrägen Buchstaben auftreten, sobald ich eine Seite anhefte und Ihr einen Namen vergebe.

Es liegt irgendwie an dem Eintrag:

user_pref("browser.newtabpage.pinned", "[{\"url\":\"http://www.tagesschau.de\",\"label\":\"Tagesschau\"}]");

Ernie2210

Das Problem tritt nicht auf, wenn ich das Bild als Verknüpfung über eine Internetadresse eingebe oder wenn Firefox selber ein Bild zu der verknüpften Internetadresse finde.

Kann man dieses irgendwie abstellen?

Zitronella

Ich kann das Problem reproduzieren und habe glaube ich auch eine Lösung:

CSS

.top-site-outer .tile .icon-wrapper.letter-fallback::before {
content: attr(data-fallback);
display:none !important;}

Zitronella

Da es zum Thema passt hefte ich mich hier mal ausnahmsweise dran.

Der Code

CSS

@-moz-document url(about:newtab), url(about:home) {
li.top-site-outer:nth-child(1) > div:nth-child(1) > a:nth-child(1) > div:nth-child(1) > div:nth-child(1) {
    background: url("Icons/01.ico")no-repeat !important;
    background-position:center!important;
    background-size:contain!important;}

@-moz-document url(about:newtab), url(about:home) {
li.top-site-outer:nth-child(2) > div:nth-child(1) > a:nth-child(1) > div:nth-child(1) > div:nth-child(1) {
    background: url("Icons/test02")no-repeat !important;
    background-position:center!important;
    background-size:contain!important;}

Alles anzeigen

funktioniert. Aber kann man die beiden Dinge irgendwie vereinen? Wenn ja, wie sähe dann der Code aus. Ich habs mal wieder nicht hin bekommen, dass oben nur 1x @-moz-document url(about:newtab), url(about:home) steht

2002Andreas

Zitat von Zitronella

die beiden Dinge irgendwie vereinen?

CSS

@-moz-document url(about:newtab), url(about:home) {
li.top-site-outer:nth-child(1) > div:nth-child(1) > a:nth-child(1) > div:nth-child(1) > div:nth-child(1) {
    background: url("Icons/01.ico")no-repeat !important;
    background-position:center!important;
    background-size:contain!important;}

li.top-site-outer:nth-child(2) > div:nth-child(1) > a:nth-child(1) > div:nth-child(1) > div:nth-child(1) {
    background: url("Icons/test02")no-repeat !important;
    background-position:center!important;
    background-size:contain!important;}
}

Alles anzeigen

Zitronella

Danke, es funktioniert, ich frage mich gerade was ich da vorhin alles ausprobierte

Wahrscheinlich hat mich verwirrt dass in Notepad++ die Farben beim zweiten Eintrag anders sind also Zeile 2 vs. Zeile 7 sowie Zeile 3 vs. Zeile 8

und links diese Verbindungslinie nicht durchgehend ist, sodass es aussieht als wäre es von der ersten Zeile abgetrennt.

Stimmt das denn wirklich, auch wenns funktioniert, oder kann sich das mit meinen restlichen Codes aus userContent.css beißen?

2002Andreas

Zitat von Zitronella

oder kann sich das mit meinen restlichen Codes aus userContent.css beißen?

Nein.

Steht ja alles in Doppel }} am Ende.

So sieht das hier aus:

Wobei in Zeile 5 die 2te } am Ende fehlt in deinem Code.

grisu2099

Dat paßt schon so!

Der Farbunterschied in den Zeilen 2+3 in deinem Bild kommt immer am Anfang einer neuen @-moz-document-Regel.

Zitronella

2002Andreas Das ist aber nicht der Code, den du gepostet hast, sondern der meinige, wo die erste Zeile doppelt drin vor kommt.

EDIT: grisu2099 okay, ich glaube euch

Sören Hentzschel

Ich sag's eh öfter, aber eine vernünftige Einrückung von Code vermeidet Fehler und Verwirrungen…

CSS

@at-rule {
  .selector {
    property: value;
  }

 .selector {
    property: value;
  }
}

Wenn man so einrückt (was die gängige Einrückung ist), sieht man sofort, ob jede Klammer da sitzt, wo sie sitzen muss, und ob Klammern fehlen (wie in Beitrag #49, wo gleich zwei schließende Klammern fehlten).

2002Andreas

Zitat von Zitronella

sondern der meinige

Ja, und da fehlte eben die 2te }

Ernie2210

Ich habe auch etwas herausgefunden. Der schräge Buchstabe erscheint, wenn ich die Verknüpfung noch nicht benutzt habe. Sobald ich die Verknüpfung verwende ist er nach einem Neustart verschwunden.

Ernie2210

Ich habe noch eine Frage zu dem Thema.

Kann ich auch die URL und den Namen in den Code einbinden?

2002Andreas

Zitat von Ernie2210

die URL

Sollte ich dich falsch verstanden haben, dann sorry.

Dann kannst du dem Eintrag auch direkt und ohne Code ein anderes Icon geben:

Einfach auf den blauen Eintrag klicken.

Ernie2210

Ich habe ja mit dem Code jedem Eintrag eine bneutzerdefinierte lokale Grafik definiert. Beispiel an Platz eins die Tagesschau:

CSS

li.top-site-outer:nth-child(1) > div:nth-child(1) > a:nth-child(1) > div:nth-child(1) > div:nth-child(1) {
    background: url(".//Icons/Tagesschau.png")no-repeat !important;
    background-position:center!important;
    background-size:contain!important;

Ich würde jetzt gerne wissen, ob ich in dem Code auch die URL "http://www.tagesschau.de" und den Anzeigenamen "Tagesschau" implementieren. Aktuell mache ich das immer manuell im Firefox für jedes Symbol

2002Andreas

Zitat von Ernie2210

bneutzerdefinierte lokale Grafik definiert

Eine Grafik vom PC musst du auch so einfügen.

Einen Url kannst du auch direkt in das Icon einfügen, siehe meinen Screenshot dazu.

Zitat von Ernie2210

den Anzeigenamen "Tagesschau" implementieren.

Den kannst du doch auch direkt in jedem Icon einfügen auf der Seite Neuer Tab.

Dafür brauchst du doch keinen CSS Code

So sieht das hier mit eigener Grafik und eigenem Text für GMX aus:

Ohne CSS Code.