Kacheln auf Bildschirm verändern plötzlich ihr Aussehen

  • Firefox-Version
    89.0.2 64-bit
    Betriebssystem
    WIN 10

    Hallo,

    vor kurzem änderten plötzlich meine Kacheln für meine Programme ihr Aussehen in winzig, kaum erkennbar

    Wo kann ich das groß-bildrige, besser erkennbare Design wiederhestellen ?

  • Wo kann ich

    Per CSS Code in der userContent.css geht das mit diesem Code:

    CSS
    @-moz-document url(about:newtab), url(about:home) {
        
    /*Inhalte wieder die ganze Breite vom Feld*/
    .top-site-outer .tile .icon-wrapper {
      border-radius: 8px !important;
      width: 100% !important;
      height: 100% !important;
    }
    }
  • Wo kann ich

    Per CSS Code in der userContent.css geht das mit diesem Code:

    CSS
    @-moz-document url(about:newtab), url(about:home) {
        
    /*Inhalte wieder die ganze Breite vom Feld*/
    .top-site-outer .tile .icon-wrapper {
      border-radius: 8px !important;
      width: 100% !important;
      height: 100% !important;
    }
    }

    ich kenne mich mit CSS nicht aus , kann mir das jemand erklären bitte

  • ich kenne mich mit CSS nicht aus

    Einzutragen in die userContent.css

    Sollte der Ordner chrome nicht vorhanden sein musst du ihn dir erst erstellen, und in ihm dann eine userContent.css
    Du mußt dir im Profilordner einen neuen Ordner chrome erstellen und in diesem dann eine Textdatei ( mit einem Editor ) in die du den Code kopierst, bzw. einträgst.

    Dann schließt du die Datei und speicherst sie als userContent.css ab.
    Danach mußt du den Fx neu starten.

    PS:
    Du musst dir dazu die versteckten Dateiendungen anzeigen lassen.

    Um das einzustellen klickt man im Windows 10 Explorer (wenn man einen Ordner offen hat) erst oben links auf Ansicht..dann rechts oben auf

    "Optionen" > "Ordner und Suchoptionen ändern" > "Ansicht"
    und entfernt das Häkchen bei "Erweiterungen bei bekannten Dateitypen ausblenden"

    Wo finde ich meinen Profilordner

    Eine genaue Beschreibung dazu befindet sich auch unter diesem Link ab Abschnitt 2.2:


    Videoanleitung für die userChrome.css und mehr

    Zusätzlich muss in about:config der Eintrag:

    toolkit.legacyUserProfileCustomizations.stylesheets

    auf true stehen.

  • DANKE! klingt nicht kompliziert.

    Falls etwas schief gehen sollte oder man entscheidet sich anders, dann die Datei userContent.css einfach löschen , richtig?

    Man liest oft über Personalisierungsänderung über die Datei userContent.css. Bedeutet das dass wenn man diese Datei einmal hat , dann werden solche Änderungen in diese Datei - über den Codes - weitergespeichert, d.h. Code nach Code hinzugefügt? Oder erstellt man immer wieder neue .css Datei?


    Zusätzlich muss in about:config der Eintrag:

    toolkit.legacyUserProfileCustomizations.stylesheets

    auf true stehen.

    Ohne diese Änderung würde der Code in der userContent.css Datei gar keine Auswirkung zeigen, verstehe ich das richtig?

  • Falls etwas schief gehen sollte oder man entscheidet sich anders, dann die Datei userContent.css einfach löschen , richtig?

    Richtig, oder in irgendwas anderes umbenennen. Du benötigst halt nach Änderungen (oder einem Löschen der Datei) einen Neustart von Firefox, weil Änderungen ausschließlich zum Programmstart von Firefox eingelesen und dann im Speicher behalten werden.

    Man liest oft über Personalisierungsänderung über die Datei userContent.css. Bedeutet das dass wenn man diese Datei einmal hat , dann werden solche Änderungen in diese Datei - über den Codes - weitergespeichert, d.h. Code nach Code hinzugefügt? Oder erstellt man immer wieder neue .css Datei?

    Wenn du weitere Änderungen für Content-Seiten hast, gehören die alle in diese Datei, ja. Änderungen an der Firefox-Oberfläche hingegen würden in eine Datei mit dem Namen userChrome.css kommen. Bei vielen Änderungen könntest du diese theoretisch auch in beliebig viele andere Dateien auslagern und diese Dateien dann in die userContent.css respektive userChrome.css importieren. Aber über sowas braucht man sich keine Gedanken zu machen, solange es nicht wirklich viel wird.

    Ohne diese Änderung würde der Code in der userContent.css Datei gar keine Auswirkung zeigen, verstehe ich das richtig?

    Korrekt. Auch hier wieder: Ein Neustart von Firefox ist erforderlich, damit die Änderung wirksam wird.

  • ok, danke.

    Den Code oben, wird er bewirken, dass die Kacheln "voller" werden, oder auch dass sie kleiner werden? Ich erinnere mich, dass sie früher kleiner waren, so dass in einer Reihe mehrere gepasst haben

  • so dass in einer Reihe mehrere gepasst haben

    Dann brauchst du 2 Codes.

    Einen, der mehr Kacheln nebeneinander setzt, und einen, der die Kacheln wieder kompl. ausfüllt.

    Das sieht dann so aus:

    Jetzt sind es 11 Kacheln statt 8.

    Und das wäre der Code dazu:

    Evtl. musst du in Zeile 6 den Wert für dich noch etwas verändern.

  • Jetzt sind es 11 Kacheln statt 8.

    Oder so mit 15 Kacheln:

  • Ich würde gerne eine weitere Möglichkeit einfügen: das Favicon der Seite ist defekt:

    https://stabikat.staatsbibliothek-berlin.de/

    Ich bekomme in Firefox als auch beim Lesezeichen nichts angezeigt. Könnte sich sowas auch auf die Kachel auswirken?

    (unabhängig von dem, dass die Kacheln kleiner geworden sind)

    Wir sind keine Beschwerdestelle, hier gibt es nur Lösungen! Meine Glückszahl hier: 92.

  • Könnte sich sowas auch auf die Kachel auswirken?

    Ich bin mir nicht sicher, ob ich dich richtig verstanden habe.

    Wenn nicht, dann sorry, uns vergiss bitte diesen Beitrag von mir.

    Du kannst dir ja ein eigenes Icon auf der Seite Neuer Tab einstellen.

    Sieht dann so aus:


    CSS
    li.top-site-outer:nth-child(28) > div:nth-child(1) > a:nth-child(1) {
    background: url("data:image/gif;base64,iVBORw0KGgoAAAANSUhEUgAAAFEAAABbCAIAAACEdv4HAAAACXBIWXMAAAsTAAALEwEAmpwYAAADyElEQVR4nO2cMUwaURiAn20XLHSAwfN6aTvcAZOcERIHaUonGxIntYNxoCStbWqrQ01sdWmjJqZJbUwjmiYa0066qBGZJA1NStJrPDsJdyMgDrBw9NYOlxgCB3LcPSB575vIu8f735f3eLz3P0KH6/4LgBjXWt2BFoCd0QA7owF2RgPsjAY3VEv5H1+a3A9IhLbCoc3DskIUxxk7owF2RgPsjAbYGQ2wMxpgZzTAzmiAndEAO6MBdkYD7IwG2BkNsDMaYGc0wM5ogJ3RQP13BlqRinJCSGWyuXQ2X1ruYRkHQ5lvmgyJYhS6nJNiei/yizsREmJKtUIIAACAm2WeB/x9LKMnloE04iwV5W870f2jeCabq6c+xwvB1ysrC88eDPQ0EM5wtDkrtt93jguSrDXS/NJ27PCj1nfBQINzUkxPvVvPZHN9LCNJcrX5DAAYG/b5vC6SsJKEzYhOGowG5+MY/3523M0yB5H42ma4Rs2EmPL02hXhg0h87yh++cjBUE6acvfau7usDXdaJxqcJwL+pJh+HFyqMcIKHC9wvGAxmxw0xfFC2SPlhc/r+jA73pIlXcP3c2grPBpcvFL4koIklwmXEo2dPhqdP7/IV6sAj7qcpaI8PbdR+YM6nRQkeX5x29g26+HquS0V5eCrlfqHVxMcL5xf5Jv82b5inM8v8vCEFRICxMZVqeUsFeWpt+tQhQEAZ5Dbr6Tq3DZkSvexjJOmLGaTu9deWp4QUtGfp8oKZzE3e+lWd9Yv7GaZmcmRgvSvtDCTzZGEzWLuHBvxjY34puc2orFTJ001HKUx1J2XV3d1jjDHC6PBxbJCkrB1E1YAgIdlJgJ+N8twJ8nmnz3UnfdLdk76cbPM0GC/z+sqm8ZOmvJ5XQYGqhNjzs/VIAmbsl1VfdpNWN+8HIbaAVUgOjto6uvnqRpLVKtOILByQxaz6dPC0+avyfUAy3ki4G/PgySA5zw02A+pZf1AcXbQVHvOagUozu0sDNDMb0NxrpEqaAdgjfNBxMidnLHAcl7bDEtFzfng5gDLOZPNLa/uQmpcJxD3nspBZWZyuN3uq+Cu2/tH8dEnS3/abEm7Ttz1QA1QkOT9SJzjhVuWznt3uqDGqkTJtJcVwj1LlsUmCZvP2/NwwAU7TyAVZe5E+M0no7G/lU87WvJ/Q8oVh7vX7qQpkrDZ6ds6G0yK6Uw2dyamEmJKuQmvUbk1zpWQhI0krACA0myhxWy6zJadianSy9BMNpc5z4GG9j/t4txM8H4bDbAzGmBnNMDOaICd0QA7o8F/q55J1LtMVpYAAAAASUVORK5CYII=") no-repeat !important;
    background-position: 2px -4px !important;
    }
    
    li.top-site-outer:nth-child(28) > div:nth-child(1) > a:nth-child(1) > div:nth-child(1) {
     visibility: hidden !important;
    }

    In Zeile 1 musst du den Wert 28 für dich dann anpassen.

  • Das ist jetzt aber ein Bild, dass du dir erstellt hast? Ich wollte eher darauf hinaus, dass die Kacheln was anderes anzeigen, wenn sich auf der Seite was geändert hat oder fehlerhaft ist. Da ich das Favicon vorher nicht kannte, es ist auf 24x24 dimensioniert, dass Firefox mit den "neuen" Kacheln das Favicon anders anzeigt als vorher. Das Bild von ihm oben sieht wie ein aufgeblasenes, dadurch unscharfes, 16x16 aus.

    Die Webseite gibt sogar einen Fehler aus, wenn man das Favicon direkt laden möchte.

    Funktioniert: https://stabikat.staatsbibliothek-berlin.de/images/logo_sbb.png

    Funktioniert nicht: https://stabikat.staatsbibliothek-berlin.de/favicon.ico

    Code
    Fehler     
    Ein - nicht näher zu bezeichnender - Fehler ist aufgetreten.     
    
    We regret the inconvenience this may cause you.
    Context: favicon.ico 

    Die Wayback-Machine sagt, im Oktober 2020 war das Favicon schon defekt, irgendwo zwischen Jan'2020 und Oktober muss das passiert sein, weil:

    https://web.archive.org/web/2020011403…pix/favicon.ico

    ein 16x16 icon präsentiert, was ich nach dem obigen Bild schon vermutet hatte.

    Da bleibt dann nur dein Vorschlag für das CSS übrig, um das zu beheben.

    Wir sind keine Beschwerdestelle, hier gibt es nur Lösungen! Meine Glückszahl hier: 92.

  • Ok, das ist gut, wusste ich nicht, danke. Dann hat er ja jetzt zwei Möglichkeiten, einmal CSS oder das Lesezeichen löschen und neu setzen, falls letzteres das bestehende Favicon mit löschen sollte.

    Wir sind keine Beschwerdestelle, hier gibt es nur Lösungen! Meine Glückszahl hier: 92.

  • vielen Dank für den zusätzlichen Code um die Anzahl Kacheln in einer Reihe zu vergrößern, muß testen wenn ich wieder am PC bin.

    Frage ist jetzt: wir haben 2 CSS Codes, wie integriert man sie in einer CSS Datei???

  • Frage ist jetzt: wir haben 2 CSS Codes, wie integriert man sie in einer CSS Datei???

    Hast du nicht beide Codes schon in der userContent.css? Siehe Beiträge #8 bzw. #9.

    Übersetzer für Obersorbisch und Niedersorbisch auf pontoon.mozilla.org u.a. für Firefox, Firefox für Android, Firefox für iOS, Firefox Klar/Focus für iOS und Android, Thunderbird, Pootle, Django, LibreOffice, LibreOffice Onlinehilfe, WordPress

  • die Code sehe ich, in #2 und #8.

    Die Frage ich wie soll der Inhalt der Datei aussehen? Den Text der beiden Codes nacheinander kopieren? Die Zeilen des Codes weiterführen, also wenn der 1 Code mit Zeile 9 endet, dann beginnt der 2. Code mit Zeile 10 oder wie?

    Ich weiß dass solche Sachen strenge Regeln haben, sonst klappt es nicht.

    Wäre schön wenn jemand die beiden Codes in #2 und #8 hier zusammen postet. Danke

  • Die Frage ich wie soll der Inhalt der Datei aussehen? Den Text der beiden Codes nacheinander kopieren? Die Zeilen des Codes weiterführen, also wenn der 1 Code mit Zeile 9 endet, dann beginnt der 2. Code mit Zeile 10 oder wie?

    Codes werden immer untereinander geschrieben. Das siehst du doch in den Beiträgen #8 und #9, wo du Codes für zwei unterschiedliche Zwecke hast. Wofür sie sind, steht zwischen /* und */. Was zwischen diesen Zeichen steht, ist ein Kommentar, der nur dazu dient, dass der Benutzer auch nach Wochen noch weiß, wozu die jeweiligen Codes dienen. Was zwischen diesen Zeichen steht, wird durch Firefox nicht ausgeführt. Es empfiehlt sich immer, Kommentare zu verwenden, insbesondere wenn du mal Codes übernimmst bzw. einträgst, die keine Kommentare enthalten. Der Kommentartext muss aber immer zwischen /* und */ stehen.

    Übersetzer für Obersorbisch und Niedersorbisch auf pontoon.mozilla.org u.a. für Firefox, Firefox für Android, Firefox für iOS, Firefox Klar/Focus für iOS und Android, Thunderbird, Pootle, Django, LibreOffice, LibreOffice Onlinehilfe, WordPress

  • ah, sorry, hatte nicht gesehen dass die späteren Codes den ersten beinhalten. Cool, danke.

    Also nur damit irgendwann weitere Codes hinzufüge.... ausgehend aus dem Code in #8, wenn ich also den nächsten Code eintrage, dann soll Zeile 16 leer bleiben und der nächste Code beginnt ab Zeile 17. Also immer eine leere Zeile zwischen den Codes, richtig?