Firefox 4 - Tipps für ein paar GUI-Anpassungen

A

Aronnax

Aktives Mitglied
Thread Starter
Dabei seit
08.01.2005
Beiträge
1.560
Reaktionspunkte
139
Hi,
insbesondere etwas für ehemalige GrApple Theme Nutzer. Diese sind eingestellt, unter anderen weil nun alle sechs Wochen neue Firefox Versionen erscheinen sollen und eben dieses es sehr aufwendig machen wird Themes aktuell zu halten.

Alternativ nun Code für GUI-Anpassungen, den man in die userChrome.css Datei einfügen kann, oder mit Hilfe der Stylish Erweiterung https://addons.mozilla.org/de/firefox/addon/stylish/ aktiviert werden kann.

Code:
/* Tab Close-Button links + Tab Favicons ausgebendet  */
.tab-close-button { -moz-box-ordinal-group: 1 !important;}
.tab-text { -moz-box-ordinal-group: 2 !important;}
.tab-throbber { -moz-box-ordinal-group: 3 !important;}
.tab-icon-image { -moz-box-ordinal-group: 4; visibility: hidden !important;}

/* Tab Favicons in gepinnten Tabs wieder anzeigen  */
.tabbrowser-tab[pinned] .tab-icon-image {
visibility: visible !important;
}

/* Den Tab Close-Buttons ausblenden -  sichtbar beim Maus drüberfahren */
.tab-close-button {
visibility: hidden !important;
}
tab:hover .tab-close-button {
visibility: visible !important;
}

/* Favicons in der Lesezeichenleiste ausblenden*/
.bookmark-item > .toolbarbutton-icon {
display: none !important;
}

/* Die Lesezeichenleiste etwas schmaler */
#PersonalToolbar {
padding-top: 1px !important;
padding-bottom: 2px !important;
}

/* Lesezeichen Menüs in der Breite begrenzt und kleinere Schrift */
#personal-bookmarks menu,
#personal-bookmarks menuitem {
max-width: 460px !important;
font-size: 10pt !important;
}

/* Adressleiste - den Verlauf Button entfernt - Textfarbe im Adressleisten Menü geändert und weiteres ...*/
#urlbar .autocomplete-history-dropmarker {
display: none !important;
}
.autocomplete-richlistitem:not(:first-child) {
border-top: 1px solid #e6e6e6 !important;
}
.ac-url-text {
color: #959595 !important;
}
.ac-url-text[selected="true"] {
color: white !important;
}

.autocomplete-richlistitem[selected="true"],
 treechildren.autocomplete-treebody::-moz-tree-row(selected) {
  text-shadow: rgba(000, 000, 000, 0.15) 0 1px !important; 
  background: -moz-linear-gradient(top, #5c7efc, #0f49fb) repeat-x !important; 
}
.autocomplete-richlistitem[selected="true"]:not(:first-child),
treechildren.autocomplete-treebody::-moz-tree-row(selected) {
  border-top: 1px solid #5275f3 !important; 
}

.autocomplete-richlistitem[selected="true"]:-moz-system-metric(mac-graphite-theme),
 treechildren.autocomplete-treebody:-moz-system-metric(mac-graphite-theme)::-moz-tree-row(selected) {
  text-shadow: rgba(000, 000, 000, 0.15) 0 1px !important; 
  background: -moz-linear-gradient(top, #7c868e, #65717d) repeat-x !important; 
}
.autocomplete-richlistitem[selected="true"]:-moz-system-metric(mac-graphite-theme):not(:first-child),
 treechildren.autocomplete-treebody:-moz-system-metric(mac-graphite-theme)::-moz-tree-row(selected){
  border-top: 1px solid #717c85 !important; 
}

/* Suchleiste - die Suchmaschinen Favicons entfernt + den Go Button entfernt */
.searchbar-engine-image {
visibility: hidden !important;
width: 9px !important;
}
.searchbar-textbox > .autocomplete-textbox-container {
background-image: url("chrome://browser/skin/Search.png") !important;
background-repeat: no-repeat !important;
background-position: 4px 4px !important;
}
.search-go-button {
display: none !important;
}

/* Seitenleiste  - den Close Button nach links und den Text mittig + Lesezeichen Separator Design Änderungen */
sidebarheader {
-moz-box-direction: reverse !important;
text-align: center !important;
padding-right: 26px !important;
padding-bottom: 0px !important;
}
treechildren::-moz-tree-separator {
border-top: 1px dashed #6f8b9f !important;
}
#sidebar-splitter:-moz-window-inactive {
-moz-border-end: 1px solid #8B8B8B !important;
}

/* Die kombinierten Reload, Stop and Go Buttons monochrome */
#urlbar > toolbarbutton {
  -moz-padding-start: 2px !important;
  -moz-border-start: none !important;
}
#urlbar > toolbarbutton[disabled] {
opacity: .65 !important;
}
#urlbar-go-button,
#urlbar-reload-button,
#urlbar-stop-button {
  background-image: none !important;
  box-shadow: none !important;
}

/* Go Button monochrome  */
#go-button {
  list-style-image: url("chrome://browser/skin/reload-stop-go.png") !important;
  -moz-image-region: rect(0px, 56px, 14px, 42px) !important;
}



About the userChrome.css:
This file sets the display rules for various elements in the Firefox user interface and is located in the sub-folder called chrome in your profile folder.
~/Library/Application Support/Firefox/Profiles/xxxxxxx.default/chrome/
The file does not exist by default, so you need to create it before you can start adding your preferences. There's actually an example file that exists by default, called userChrome-example.css. Basically, you can just rename that file by removing the -example part.
 
Zuletzt bearbeitet:
  • Gefällt mir
Reaktionen: santigua, lari, elliot und 3 andere
Hallo Aronnax,
vielen vielen Dank für die Anleitungen.. Nun kommts vom Design her wieder ungefähr hin :)
Nur ne Frage: Gibts von Dir nochmal so ein Theme wie "Grapple Delicious"? Das war wirklich klasse...
Danke Dir, und viele Grüße
 
ohja, bittebitte! :clap:
 
vertippelt
 
Zuletzt bearbeitet:
Mit den jetzigen Einstellungen siehts aber auch schon seht gut aus

attachment.php



Aber mit dem Grapple Delicious sah das echt viel besser aus

attachment.php


@Aronnax
Biete doch an, dass Dir Leute auch per PayPal was spenden können.. Ich glaube, dass es auf jeden Fall Leute gibt (mich eingeschlossen), die Dir ein paar Euro überweisen würden...
 

Anhänge

  • ff4.jpg
    ff4.jpg
    19,2 KB · Aufrufe: 740
  • ff3.jpg
    ff3.jpg
    33,9 KB · Aufrufe: 737
Zuletzt bearbeitet:
Wird jetzt nach Finalisierung von Firefox 4 an einem neuen Theme gearbeitet? Habe die alten sehr geschätzt...
 
Oh ich sehe gerade, dass sich Aronnax bereits auf die finalisierte Fassung bezieht, indirekt.
Es geht ihm ja nicht um die Beta-Versionen, wie ich zuerst angenommen hatte, sondern um den neuen Release-Rhythmus von Mozilla.

Heißt das jetzt wirklich, dass es mit dem Theme vorbei ist?! Das wäre echt mordsschade.
 
Och... "Gefällt mir nicht" .....
Vielleicht haste doch mal Lust/Zeit, das "Grapple Delicious" für den 4-er zu machen :)
Falls Du schon ne "Beta-Version" hast --> Ich probiere die gerne aus :)
 
Weiß denn jemand ein mögliches alternatives Theme, das auch die Eigenschaft hat, die Logo bei den Lesezeichen zu entfernen und damit Platz zu schaffen?
 
Wer weiß schon was die Zukunft bringt, aber ist auf weiteres ist erst mal Schluss damit ;-)
Wäre das denn so ein Aufwand, das an Version 4 anzugleichen?
Mit deinen "Tipps für ein paar GUI-Anpassungen" kann ich nichts anfangen!
(Die "userChrome-example.css" kann ich nicht verändern und wie ich eine neue css erzeugen kann weiß ich auch nicht :()
 
Zuletzt bearbeitet:
Mit deinen "Tipps für ein paar GUI-Anpassungen" kann ich nichts anfangen!
(Die "userChrome-example.css" kann ich nicht verändern und wie ich eine neue css erzeugen kann weiß ich auch nicht :()

Ach sicher, bekommst du das hin.
Um mal mögliche Fehlerquellen zu eliminieren.
Saug dir mal eine richtigen Texteditor, der den Code auch farbig anzeigt z.B. Textwrangler
http://www.barebones.com/products/textwrangler/

Damit einfach ein neues Dokument anlegen und unter userChrome.css speichern.
Im userChrome-example.css steht zwar drin, dass bestimmte Codestellen erhalten bleiben müssen, aber so ganz stimmt nun auch wieder nicht. Also nichts davon übernehmen, dann kann auch nichts falsch laufen.
Dann kopierst du eben alles oder auch nur Teilweise das, was weiter oben steht
z.B.:
/* Favicons in der Lesezeichenleiste ausblenden*/
.bookmark-item > .toolbarbutton-icon {
display: none !important;
}
Zeigt er dann den Code nicht richtig an, weiß man übrigens schon das etwas falsch läuft. Richtig ist hierbei in Textwrangler eine Textkombination aus grau, schwarz, verschiedene blau Werte und etwas rötliches gibt es auch noch.
Diesen About the userChrome.css: ... Text allerdings nicht kopieren und wenn nun deine userChrome.css Datei auch im richtigen Ordner liegt, kann eigentlich nichts mehr schief laufen. Einmal Firefox neu starten sollen man dann nur noch und fertig.

MfG
 
Ach sicher, bekommst du das hin.
:no: :heul:
Folgendes hab ich gemacht:
TextWrangler gezogen
Dokument erstellt und als Sichern unter "userChrome-example.css" gespeichert
Deinen Text ausgewählt und in dieses css Dokument eingesetzt.
Dieses dann in den Ordner USER/../../Chrom getan
Aber es hat sich nichts getan. Alles ist geblieben wie es war :(

attachment.php


attachment.php
 

Anhänge

  • screenshot_01.jpg
    screenshot_01.jpg
    52,5 KB · Aufrufe: 119
  • screenshot_02.jpg
    screenshot_02.jpg
    20,3 KB · Aufrufe: 78
Dokument erstellt und als Sichern unter "userChrome-example.css" gespeichert

Nicht userChrome-example.css, sondern nur als userChrome.css.
Ansonsten sieht alles richtig aus ;-)

MfG
 

Anhänge

  • screenshot_03.jpg
    screenshot_03.jpg
    60,8 KB · Aufrufe: 132
  • screenshot_04.jpg
    screenshot_04.jpg
    40,3 KB · Aufrufe: 117
Der Punkt am Ende stand für das Satzende - nur userChrome.css bitte doch ;-)
 
Der Punkt am Ende stand für das Satzende - nur userChrome.css bitte doch ;-)
Hab vielen Dank für deine Mühe! :cake:
Hat nun scheinbar geklappt, aber sieht nicht sonderlich gut aus.
Bekommt man es nicht hin, das die Tabs wieder unten sind?

attachment.php
 

Anhänge

  • screenshot_01.jpg
    screenshot_01.jpg
    24,8 KB · Aufrufe: 288
Zurück
Oben Unten