[gelöst] Höhe der einzelnen Tabs beim "Luna Blue"

adxalf

So ich bin jetzt weiter, habe im Code die Border entfernt, jetzt möchte ich nur noch wissen wie man die Höhe der einzelnen Tabs ändert, also wenn ich height: 32; einfüge wird nur die Tableiste höher, nicht aber die Tabs selber.
Bitte kann mir jemand sagen wo ich das ändern kann?

loshombre

Dann lass mal sehen, was du für nen Code für deine Tabs so eingeschraubt hast.

adxalf

Hi Kamerad!
Also das steht in der Datei global\browser.css

Code

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


.tabbrowser-strip {
  border-bottom: 3px solid;
  -moz-border-bottom-colors: #716F64 #ACA899 #CDCABB;
  /*background: url("chrome://global/skin/toolbar/tabstrip.png");*/
  background-color: #DEDBC5;
}


tabpanels {
  -moz-appearance: none;
}


tab {
  padding: 0;
  margin: 0 1px 0 0;
  border: 3px solid;


min-height: 24px;


  -moz-border-radius: 1px;
  color: #000;
  background-color: #D1CBAE;
  -moz-border-top-colors: #BBB396 #D7D2B8 #D7D3B8;
  -moz-border-left-colors: #BFBA9B #DFDCC8 #D5D0B4;
  -moz-border-right-colors: #857C66 #C7C2A3 #C9C5A9;
  -moz-border-bottom-colors: #948B72 #C8C2A4 #D1CBAE;
}


tab:hover {
  background-color: #DFDBC6;
  -moz-border-top-colors: #BBB396 #E4E0CD #E4E1CD;
  -moz-border-left-colors: #BFBA9B #E9E7D6 #E2DFCA;
  -moz-border-right-colors: #857C66 #D4D0BA #DFDCC6;
  -moz-border-bottom-colors: #948B72 #D9D5BE #DFDBC6;
}


tab:hover:active,
tab[selected="true"] {
  padding: 1px 0 0 1px;
  background-color: #A8A388;
  -moz-border-top-colors: #706D5B #A8A388 #A8A388;
  -moz-border-left-colors: #706D5B #A8A388 #A8A388;
  -moz-border-right-colors: #706D5B #A8A388 #A8A388;
  -moz-border-bottom-colors: #706D5B #A8A388 #A8A388;
  color: #FFF;
}


.tabs-left,
.tabs-right {
  border-bottom: none;
}


.tabbrowser-tabs {
  padding-top: 1px;
}


.tab-icon {
  margin-top: 1px;
  -moz-margin-end: 3px;
  width: 16px;
  height: 16px;
  list-style-image: url("chrome://global/skin/icons/folder-item.png");
  -moz-image-region: rect(0px, 16px, 16px, 0px);
}


tab[busy] > .tab-middle > .tab-icon {
  list-style-image: url("chrome://global/skin/throbber/Throbber-small.gif");
  opacity: 0.5;
}


.tab-drop-indicator-bar {
    display:none;
    height: 9px;
    margin-top: -9px;
    position: relative;
}


.tab-drop-indicator {
    height: 9px;
    width: 9px;
    margin-bottom: -5px;
    position: relative;
    background: url('chrome://global/skin/tabDragDrop/tabDragIndicator.png') 50% 50% no-repeat;
}


.tab-drop-indicator-bar[dragging="true"] {
    display: -moz-box;
}

Alles anzeigen

und das in der Datei global\tabbox.css

CSS

/* ===== tabbox.css =================================================
  == Styles used by XUL tab-related elements.
  ======================================================================= */


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


/* ::::: tabs ::::: */


.tabs-left,
.tabs-right {
  border-bottom: 2px solid;
  -moz-border-bottom-colors: ThreeDHighlight ThreeDLightShadow;
}


/* ::::: tabpanels ::::: */


tabpanels {
  -moz-appearance: tabpanels; 
  border-right: 2px solid;
  border-bottom: 2px solid;
  border-left: 2px solid;
  -moz-border-right-colors: ThreeDDarkShadow ThreeDShadow;
  -moz-border-bottom-colors: ThreeDDarkShadow ThreeDShadow;
  -moz-border-left-colors: ThreeDHighlight ThreeDLightShadow;
  padding: 8px;
  background-color: #FFFFFF;
  color: -moz-DialogText;
}


/* ::::: tab ::::: */


tab 
{
  -moz-appearance: tab;
  margin-top: 0px;
  border-top: 0px solid;
  border-right: 2px solid;
  border-left: 2px solid;
  border-bottom: 1px solid ThreeDHighlight;
  -moz-border-top-colors: ThreeDHighlight ThreeDLightShadow;
  -moz-border-right-colors: ThreeDDarkShadow ThreeDShadow;
  -moz-border-left-colors: ThreeDHighlight ThreeDLightShadow;
  -moz-border-radius-topleft: 2px;
  -moz-border-radius-topright: 2px;
  -moz-border-radius-bottomright: 1px;
  padding: 1px 4px 2px 4px;
  background-color: #FFFFFF;
  color: -moz-DialogText;
}


tab[chromedir="rtl"] {
  -moz-border-radius-bottomleft: 1px;
  -moz-border-radius-bottomright: 0px;
}


.tab-text {
  margin: 0 !important;
}


tab[selected="true"] {
  -moz-user-focus: normal;
  margin-top: 0;
  border-bottom-color: transparent;
  padding: 1px 6px 4px 6px;
}


tab:focus > .tab-middle {
  outline: 1px dotted invert;
}


tab[beforeselected="true"],
tab[afterselected="true"][chromedir="rtl"] {
  -moz-appearance: tab-left-edge;
  border-right: none;
  -moz-border-radius-topright: 0;
}


tab[afterselected="true"],
tab[beforeselected="true"][chromedir="rtl"] {
  -moz-appearance: tab-right-edge;
  border-left: none;
  -moz-border-radius-topleft: 0;
}


tab[first-tab="true"][selected="true"] {
  padding-right: 5px;
  padding-left: 5px;
}


/* ::::: tab-bottom ::::::::::
   :: Tabs that are attached to the bottom of a panel, but not necessarily
   :: a tabpanels.
   ::::: */


.tab-bottom {
  margin-top: 0;
  margin-bottom: 2px;
  border-top: 1px solid;
  border-bottom: 2px solid;
  -moz-border-top-colors: ThreeDShadow;
  -moz-border-bottom-colors: ThreeDShadow ThreeDLightShadow;
  -moz-border-radius-topleft: 0;
  -moz-border-radius-topright: 0;
  -moz-border-radius-bottomright: 2px;
  -moz-border-radius-bottomleft: 2px;
  padding: 2px 4px 1px 4px;
}


.tab-bottom[selected="true"] {
  margin-bottom: 0;
  -moz-border-top-colors: -moz-Dialog;
  padding: 4px 6px 1px 6px;
}


.tab-bottom[beforeselected="true"],
.tab-bottom[afterselected="true"][chromedir="rtl"] {
  -moz-border-radius-bottomright: 0;
}


.tab-bottom[afterselected="true"],
.tab-bottom[beforeselected="true"][chromedir="rtl"] {
  -moz-border-radius-bottomleft: 0;
}


/* ::::: tabs-bottom ::::: */


.tabs-bottom > .tabs-left,
.tabs-bottom > .tabs-right {
  border-top: 1px solid ThreeDShadow;
  border-bottom: none;
}

Alles anzeigen

Also ich habe schon an verschiedenen Stellen probiert min-height: 24px; und height: 24px; einzufügen *edit* auch mit !important aber jedes mal ändert sich nur die Höhe der Tableiste und nicht der Tabs in der Leiste. :cry:
Oder gibt es dafür auch einfach einen userChrome.css Code?

loshombre

Und welche Tabs willst du in der Höhe ändern ? Die im Vordergrund, im Hintergrund, die erst geladen werden (wie sie geladen werden, Vor- Hintergrund) ?

adxalf

Hi!
Also ich möchte das am liebsten so wie bei dem standard Fuchs Theme haben also alle gleich gross nur halt ein bischen grösser als jetzt. Am besten alles separat einstellbar in Pixel. Ich nutze die Erweiterung TabMixPlus da kann man die Tabsbreite einstellen aber leider nicht die höhe.

Also wenn ich die Tabsleiste höher mache bleibt der farbige Teil immer noch genauso schmal, aber beim standard Theme werden die Tabs richtig angezeigt:

[Blockierte Grafik: http://www.bilder-speicher.de/07042522236413.maxdirekt.jpg]

loshombre

Hast du hiermit schon probiert:

CSS

tab.tabbrowser-tab {
 max-height: 24px !important;
}


tab.tabbrowser-tab[selected="true"] {
max-height: 24px !important;
}


tab.tabbrowser-tab[busy=true] {
max-height: 24px !important;
}

Alles anzeigen

adxalf

Hallo!
Schade dein Code geht bei mir nicht, habe es auch noch mit min-height und height probiert es sieht immer so aus wie auf dem Bild oben :cry:

loshombre

Das Problem ist, wie du ja selber sehen kannst, dass das Theme sich dabei irgendwie anders verhält, als das Defaultmoped. Und TMP ist ja auch noch dazwischen. Es ist von hier aus immer etwas schwierig, wenn man sowat selber nicht benutzt.

adxalf

Ja ok das stimmt! Dann probiere ich noch ein bischen und wenn es nicht geht ist es auch nicht so schlimm! Trotzdem danke für deine Hilfe!

loshombre

Also ich kann dir da wirklich nicht weiter helfen, weil ich es nicht mal selber ausprobieren kann. Das Theme ist nur für den 1.5....er Fuchs und denn hab ich nicht mehr auf der Platte.

adxalf

Hallo Kamerad!
Jetzt habe ich mal mit dem DOM inspector gespielt und habe diese Anzeigen gefunden, nur weiß ich jetzt leider nicht welchen Code man da jetzt rauspicken muss für die userChrome.css :cry: Also kannst du da bitte vielleicht mal einen Blick darauf werfen? Das wäre super!
Ich habe da rechts im Fenster hinter style einfach height: 32px !important; angehängt dann wird auch das bunte innere von den TAbs grösser angezeigt!
[Blockierte Grafik: http://img82.imageshack.us/img82/1969/dom1rx7.th.png]

loshombre

Für dieses Theme, bzw. seine Optik solltest du dich sowieso schämen mein Jung!

Von hier aus leider schwer zu sagen, weil ich da keine id sehen kann und mit meinen Tabs verglichen sieht das bei dir schon etwas anders aus.
Versuchs mal so:

CSS

tab.tabbrowser-tab > hbox {
height: 32px !important; }

Es ist immer bisschen schwierig. Also bei mir im Stylish läuft die Nummer.

adxalf

Ja Entschuldigung Kamerad ich weiß mein Fuchs sieht aus wie von dem bösen besessen, aber das ist alles nur Tarnung um den Konkurrenten zu unterwandern und zu stürzen *g* :wink:
Das Thema ist jetzt auch gelöst, dein Code war absolut richtig, ist Gold wert *FREU* ein riesen grosses DANKESCHÖN loshombre!

loshombre

Jo, bitte schön, kein Thema. Dafür sind wir ja hier!

Zitat

...aber das ist alles nur Tarnung um den Konkurrenten zu unterwandern und zu stürzen

Unter diesem Aspekt ist die Nummer von der dunklen Seite abgesegnet und genehmigt

gemaka

Auch von mir ein 'Danke' an loshombre.

Mit dem letzten Code habe auch ich die Tabs kleiner (niedriger) bekommen.
Allerdings bleibt die Leiste dahinter (erscheint nur, wenn auch Tabs aufgerufen sind) so gross wie vorher.

Trotzdem ein grosses THX

adxalf

Huhu!
Die Leiste dahinter kannt du vielleicht mit:

CSS

.tabbrowser-strip {
height: 18px !important;
}

einstellen.

ReVox

Wenn der vorherige nicht geht, versuch mal diesen:

CSS

/* Tableisten-Höhe */
.tabs-frame {
   min-height: 24px !important;
   max-height: 24px !important; 
   border-bottom: none !important;
   background-image: none !important;
   padding-bottom: 0px !important;
}

gemaka

Danke für die Codes; einen Versuch ist es allemal wert.

Hat aber nicht geklappt. :cry:

loshombre

Meinst du die ganze Tableiste, die beim Laden eines neuen Tabs trotzdem in ihrer ursprünglichen Größe bleibt und in diesem Moment nicht schmaler wird ? Oder versteh ich dich jetzt falsch.
Mach doch mal ein Screenshot davon.

gemaka

Ich meinte diese Leiste, vor der Die Tabs stehen.