[erledigt] Tab-Hintergrundfarbe ändern - Wie?

nik · Beitrag von **nik** » 27.01.2006, 16:15

Erstmal der Screenshot:

--> Klick <--

So ^^ das was auf dem Bild so schön rot eingerahmt wurde ...
da möchte ich eine andere Farbe (bzw. Grafik) haben!

Frage: WIE? (und natürlich WO?)

Ergänzung: Beschäftige mich damit schon seit 2 Tagen ... habe hier auf dem Board gesucht,
bei Google ... und auch in den Einstellungen von Firefox!
Rausgefunden habe ich nur eins: das die derzeitige Farbe den Code F8F8F8 hat

...
Bevor ich aber anfange (BackUp schon sowieso vorhanden) zu bastelln, frage ich lieber nach!

Kann mir mal eine(r) ein Tipp geben?
Vielleicht hab ich falsch gesucht ... es würde mich nicht wundern, wenn es da liegt, wo ich nicht geguckt habe!

Ich danke im Vorraus!

Cya!

Bild habe ich verlinkt, da es zu lange ist

.
Gruss Flambee1

Beitrag von **Tante Google** » 27.01.2006, 16:15

Tombik · Beitrag von **Tombik** » 27.01.2006, 16:24

Code: Alles auswählen

*/@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* set default namespace to XUL */

#sidebar {
min-width: 200px !important;
width: 300px !important;
max-width: 300px !important;
}

/*====LZ-ORDNER MIT EIGENEM ICON==========================START==*/
/*#personal-bookmarks toolbarbutton[label="Tom"] {padding: 0px 0px 0px 0px !important;}
#personal-bookmarks toolbarbutton[label="Tom"] .toolbarbutton-icon {display: block
!important; list-style-image: url('file:///D:/TR Desktop/ABC_123/T.ico') !important;
-moz-image-region: auto !important; margin: 0px 2px 0px 2px !important;}*/
/*====LZ-ORDNER MIT EIGENEM ICON===========================ENDE==*/

/*==========SIDEBAR FOCUS==========START=============*/
treechildren::-moz-tree-row(selected) {
 background-image: url("background.gif") !important;
 border: #6c4513 1px solid !important;
-moz-border-radius: 4px !important;
-moz-border-corner-fit: scale !important;
 background-color: transparent !important; }

treechildren::-moz-tree-row(selected, focus) {
 background-image: url("background.gif") !important;
 border: #6c4513 1px solid !important;
-moz-border-radius: 4px !important;
-moz-border-corner-fit: scale !important;
 background-color: transparent !important; }

/* Sidebar 'selected' bookmarks */
treechildren::-moz-tree-cell-text(selected) {
 color: #6c4513 !important;
 background-color: transparent !important; }
/*==========SIDEABR FOCUS==========ENDE=============*/

/*==========TABSACHEN==========START==========*/
/*Ränder begrenzen*/
#content > tabbox tab {
  margin-top: 0px !important;
  padding: 0px 0px 0px 0px !important;
  margin-bottom: 0px !important;
  margin-left: 0px !important;}

/* Tab-Höhe ändern */
tab{
  height: 20px !important;
  max-height: 20px !important;
  -moz-appearance: none !important;} 

/* Change Tab Colors */
/* Change color of active tab */
tab[selected="true"] {background-color: rgb(108,69,19) !important; color: RGB(216,174,75) !important;}
/* Change color of normal tabs */
tab {background-color: RGB(216,174,75) !important; color: rgb(108,69,19) !important;}
/*==========TABSACHEN==================================ENDE==========*/

/*========KONTEXTMENÜRAND UND -HINTERGRUND=======START==*/
/* Add border to popup menus 6C4513*/
menupopup, popup {
  border: 3px solid !important;
  -moz-border-top-colors: #6C4513 !important;
  -moz-border-right-colors: #6C4513 !important;
  -moz-border-bottom-colors: #6C4513 !important;
  -moz-border-left-colors: #6C4513 !important;
  padding: 2px !important;
  min-width: 1px !important;
  background-color: none !important; }
  
#navigator-toolbox {
   background:
     rgb(216,174,75)
     top left
     repeat
     !important;}
menupopup,
#toolbar-context-menu,
#contentAreaContextMenu {
   background:
     rgb(216,174,75)
     top left
     repeat-y
     !important;}
/*=======KONTEXTMENÜRAND UND -HINTERGRUND=======ENDE==*/

/*=========SIDEBAR TWEAKS=========START=========*/
/*Höhe des Headers*/
sidebarheader { height: 22px !important; } 

/* Sidebar Header Hintergrundbild */
sidebarheader {
   -moz-appearance: none !important;
   background-image: url("background.gif") !important;}
    
/*Hintergrund Sage Panel*/
#wf_box statusbarpanel, #wf_box separator {
border: none !important;}

treechildren {
background: #6c4513  !important;
font-size: 14px ! important;
color: #d8ae4b ! important;
font-family: Comic Sans MS ! important;
font-weight: bold !important;}

toolbox {
background: #6c4513  !important;
font-size: 12px ! important;
color: #d8ae4b ! important;
font-family: Comic Sans MS ! important;
font-weight: bold !important;}
/*==========SIDEBAR TWEAKS=========ENDE=========*/

/*=========TOOLBARS-TWEAKS=========START=========*/
/* Adressleisten-Schriftart ändern */
#urlbar { font: bold 8pt Comic Sans MS;}

/* Toolbars without borders */
menubar, toolbox, toolbar, statusbar, statusbarpanel 
{border-style: none !important;}
/*=========TOOLBARS-TWEAKS=========ENDE=========*/

/*==========HINTERGRUNDBILDER=========START=========*/
/* Benutze ein Hintergrundbild für die Symbolleisten */
menubar, toolbox,toolbar ,.tabbrowser-tabs {
   background-image: url("background.gif") !important;
   background-color: none !important; }

/*Benutze ein Hintergrundbild für die Statusbar*/
#status-bar, statusbarpanel {
  background-image: url("background.jpg") !important;
  background-color: none !important;
  color: #d8ae4b; !important;
  border-top: 1px solid #6c4513;
  border-left: 2px solid #6c4513;
  border-right: 2px solid #6c4513;
  border-bottom: 1px solid #6c4513;
  background-color: none; }
window statusbarpanel, #status-bar {
  -moz-appearance  : none !important;
  background-image : url("background.jpg") !important;
  color: #d8ae4b !important;
  border-top: 1px solid #6c4513;
  border-left: 2px solid #6c4513;
  border-right: 2px solid #6c4513;
  border-bottom: 1px solid #6c4513;
  background-color: none; }

/* Add background to Customize window */
#BrowserPreferences, #CustomizeToolbarWindow, #modelist, listbox, .menulist-dropmarker, dialog, wizard, page
{ -moz-appearance: none !important;
background-image: url("background.gif") !important;} 
/*==========HINTERGRUNDBILDER=========ENDE=========*/

Hier mal der Teil meiner userchrome.css, die mit Farben,Tabs und Backgrounds zu tun hat.
background.gif halt in Deiner bevorzugten Farbe selbst erstellen und in den Chromeordner des Profils kopieren.
Screenshot irgendwo in "Mein Firefox"

nik · Beitrag von **nik** » 27.01.2006, 16:52

äääähm ... bist du sicher, dass das die userChrom.css ist?

... die im Profil Ordner angelegt ist?

Meine sieht aber so aus:

Code: Alles auswählen

/*
 * Edit this file and copy it as userChrome.css into your
 * profile-directory/chrome/
 */

/*
 * This file can be used to customize the look of Mozilla's user interface
 * You should consider using !important on rules which you want to
 * override default settings.
 */

/*
 * Do not remove the @namespace line -- it's required for correct functioning
 */
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* set default namespace to XUL */


/*
 * Some possible accessibility enhancements:
 */
/*
 * Make all the default font sizes 20 pt:
 *
 * * {
 *   font-size: 20pt !important
 * }
 */
/*
 * Make menu items in particular 15 pt instead of the default size:
 *
 * menupopup > * {
 *   font-size: 15pt !important
 * }
 */
/*
 * Give the Location (URL) Bar a fixed-width font
 *
 * #urlbar {
 *    font-family: monospace !important;
 * }
 */

/*
 * Eliminate the throbber and its annoying movement:
 *
 * #throbber-box {
 *   display: none !important;
 * }
 */

/*
 * For more examples see http://www.mozilla.org/unix/customizing.html
 */

... Haben wir denn kein Tut dazu?

Hatte nicht schon einer das Problem gehabt?

---
//edit: Ich benutze den Firefox Default Theme! //

flambee1 · Beitrag von **flambee1** » 27.01.2006, 17:38

Jap, das ist sie. Da du noch nichts verändert hast, sieht sie noch so, nackt, aus. Sah meine vor drei Tagen auch noch. Dann habe ich mich auf den Weg zu Firefoxforen begeben, um mir endgültig mal einen Reim machen zu können, wie denn das funktioniert. Denn ich habe bestimmt schon 20x versucht, da irgend was zu machen, hat aber nie geklappt, weil ich es nicht verstanden hatte.

Alles das, was du später in die userChrome.css im Profilordner eintragen wirst, schaltet die Einstellungen in den Dateien des Programmordners aus (wenn mit "!important" versehen). Das heisst, nach und nach wird da immer mehr drin stehen, je nach dem, wieviel du änderst.

Hier findest du einige Sachen, um dir mal anzugucken, wie die Sache funktioniert. Am besten einfach mal einen Code von einem Button bei dir eintragen und spielen. Ich habe verdammt lange gebraucht, andere haben es sofort kapiert.

Viel Leseunterstützung hat mir http://www.firefox-browser.de gegeben. Es gibt etliche Links zu Wikis, FAQ's und allerlei Wissenswertes im Forum.

Gruss Flam

nik · Beitrag von **nik** » 27.01.2006, 18:18

Ok - danke Dir ...

Eine Frage ist noch übrig: Ist es egal, an welche Stelle "irgendein" Code eingefügt wird?

Danke!

flambee1 · Beitrag von **flambee1** » 27.01.2006, 18:21

Kurz und knapp: ja.

Nur Sachen, die auf das gleiche Bild zugreifen gehören zusammen, falls nicht jedes mal einzeln zugewiesen.

Gruss Flam

nik · Beitrag von **nik** » 27.01.2006, 18:45

OK ... erste Fortschritte habe ich hinter mir:

Aber so wollte ich das gar nicht

... ich wollte nur den Bereich hinter den Tabs einfärben!

Tipps?

---
OK - erledigt - hab's rausgefunden:

So - dann gucken wir weiter - was man sonst noch verändern kann! *süchtigwird*

---
DANKE FÜR DIE HILFE!!!

Tombik · Beitrag von **Tombik** » 27.01.2006, 19:42

äääähm ... bist du sicher, dass das die userChrom.css ist?

Ziemlich!

flambee1 · Beitrag von **flambee1** » 27.01.2006, 19:54

N!k hat geschrieben:was man sonst noch verändern kann!

Fast alles

Dann mal viel Spass

Gruss Flam

nik · Beitrag von **nik** » 27.01.2006, 23:17

@Tombik:

JOo - hat sich erledigt!

Danke!

@flambee1: Das merke ich auch langsam

- auch Danke!