Po představení konfiguračního souboru user.js bychom vám rádi ukázali další dva soubory – userChrome.css a userContent.css, u nichž přípona naznačuje, že jde o soubory formátovací nebo stylovací.
Oba soubory patří do podadresáře chrome ve vašem uživatelském profilu. Podobně jako soubor user.js ale standardně neexistují a v případě potřeby je musíte vytvořit včetně samotného podadresáře chrome. Zároveň je potřeba ve Firefoxu zapnout jejich načítání nastavením předvolby toolkit.legacyUserProfileCustomizations.stylesheets na true pomocí editoru předvoleb.
Nyní k funkci obou souborů. Soubor userChrome.css slouží k úpravě uživatelského rozhraní aplikací Mozilly. Díky němu můžete např. odstranit tlačítka pro zavírání panelů nebo změnit umístění tlačítka nabídky. Celé rozhraní aplikace je totiž formátováno CSS styly a do souboru userChrome.css můžete přidávat vlastní. Jediné, co k tomu potřebujete, je vědět id či class jednotlivých prvků grafického rozhraní.
Druhý soubor, userContent.css, slouží k úpravám zobrazovaných webových stránek. Můžete s ním zakázat blikající prvky na stránce a pohyblivý text, nebo vycentrovat konkrétní stránku. Úplně stejné úpravy vzhledu webových stránek můžete jednoduše dělat i pomocí doplňku Stylus.
Příklady
Teorie je jedna věc, máme tu ale i ukázky použití obou souborů. Nejprve userChrome.css:
/* Tento řádek musí být vždy na začátku souboru uveden */
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
/* Skrytí lišty s panely pro použití s některými doplňky */
#TabsToolbar {
display: none !important;
}
/* Odstranění tlačítka pro zavírání panelů */
.tab-close-button {
display: none !important;
}
/* Přesun tlačítka nabídka (hamburger) vlevo */
#PanelUI-button {
-moz-box-ordinal-group: 0;
}
/* Chceme lištu s panely na více řádků */
/* Ukázka také na https://vimeo.com/242120210 */
#TabsToolbar .tabbrowser-tab {
visibility: visible !important;
}
#TabsToolbar .arrowscrollbox-scrollbox {
height: 58px; overflow-y: auto;
}
#TabsToolbar .arrowscrollbox-scrollbox > * {
display: inline-block;
}
/* Vynutí zobrazení tlačítka se seznamem panelů vždy, i když není žádný skrytý */
#alltabs-button {
visibility: visible !important;
}
/* Chceme lištu se záložkami na více řádků */
.bookmark-item {
visibility: visible !important;
}
#PlacesToolbarItems {
height: 58px; overflow-y: auto;
}
#PlacesToolbarItems > * {
display: inline-block;
}
Další styly pro použití v souboru userChrome.css najdete na této stránce dole. A nyní ukázka userContent.css:
/* Tento řádek je dobré na začátku souboru uvést */
@namespace url(http://www.w3.org/1999/xhtml);
/* Zakázání tagu marguee – běžící text */
marquee {
-moz-binding: none;
display: block;
height: auto !important;
}
/* Vynucení podtržení všech odkazů na webech */
a {
text-decoration: underline !important
}
/* Změna kurzoru nad JavaScriptovými odkazy */
a[href^="javascript:"] {
cursor: move;
}
Kde hledat další informace
Výše je jenom několik málo ukázek, ale možností je podstatně více. To už je nad rámec základního seznámení, a proto vás odkážeme na celou řadu zajímavých stránek, které se týkají obsahu těchto souborů.