Updated for changes by Bug 593967 – Add more elements into tabbrowser tabs for easier stylability ( https://bugzilla.mozilla.org/show_bug.cgi?id=593967 )

git-svn-id: http://www.cozmixng.org/repos/piro/treestyletab/trunk@7214 599a83e7-65a4-db11-8015-0010dcdd6dc2
This commit is contained in:
piro 2010-09-15 12:41:12 +00:00
parent e1ec963f29
commit 02f148596d
3 changed files with 77 additions and 78 deletions

View File

@ -14,93 +14,56 @@
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
:root[tabFx2Compatible="8"] :root[tabFx2Compatible="9"]
.tabbrowser-tab { .tabbrowser-tab {
-moz-binding: url(tabFx2Compatible.xml#tabbrowser-tab-3) !important; -moz-binding: url(tabFx2Compatible.xml#tabbrowser-tab-3) !important;
} }
:root[tabFx2Compatible="8"][tabFx2Compatible-flags~="separate-tabContextMenu"] :root[tabFx2Compatible="9"][tabFx2Compatible-flags~="separate-tabContextMenu"]
.tabbrowser-tab { .tabbrowser-tab {
-moz-binding: url(tabFx2Compatible.xml#tabbrowser-tab-4) !important; -moz-binding: url(tabFx2Compatible.xml#tabbrowser-tab-4) !important;
} }
:root[tabFx2Compatible="8"]:not([tabFx2Compatible-flags~="png-throbber"]) :root[tabFx2Compatible="9"]:not([tabFx2Compatible-flags~="png-throbber"])
.tabbrowser-tab[busy] > hbox > stack > .tab-icon-image { .tab-icon-image[busy] {
list-style-image: url("chrome://global/skin/throbber/Throbber-small.gif") !important; list-style-image: url("chrome://global/skin/throbber/Throbber-small.gif") !important;
opacity: 0.6; opacity: 0.6;
} }
:root[tabFx2Compatible="8"][tabFx2Compatible-flags~="png-throbber"] :root[tabFx2Compatible="9"][tabFx2Compatible-flags~="png-throbber"]
.tabbrowser-tab[busy] > hbox > stack > .tab-icon-image { .tab-icon-image[busy] {
list-style-image: url("chrome://global/skin/icons/loading_16.png") !important; list-style-image: url("chrome://global/skin/icons/loading_16.png") !important;
} }
:root[tabFx2Compatible="8"][tabFx2Compatible-flags~="mac"][tabFx2Compatible-flags~="png-throbber"] :root[tabFx2Compatible="9"][tabFx2Compatible-flags~="mac"][tabFx2Compatible-flags~="png-throbber"]
.tabbrowser-tab .tab-icon-image { .tab-icon-image {
list-style-image: url("chrome://global/skin/tree/item.png"); list-style-image: url("chrome://global/skin/tree/item.png");
} }
:root[tabFx2Compatible="8"][tabFx2Compatible-flags~="mac"] :root[tabFx2Compatible="9"][tabFx2Compatible-flags~="mac"]
.tabbrowser-tab:not(:hover):not([selected="true"]) .tab-icon-image { .tabbrowser-tab:not(:hover) .tab-icon-image:not([selected="true"]) {
opacity: 0.6; opacity: 0.6;
} }
:root[tabFx2Compatible="8"][tabFx2Compatible-flags~="pie"] :root[tabFx2Compatible="9"][tabFx2Compatible-flags~="pie"]
.tabbrowser-tab[busy] > hbox > stack > .tab-icon-image { .tab-icon-image[busy] {
list-style-image: url("chrome://browser/skin/tabbrowser/progress.png") !important; list-style-image: url("chrome://browser/skin/tabbrowser/progress.png") !important;
-moz-image-region: rect(0, 16px, 16px, 0); -moz-image-region: rect(0, 16px, 16px, 0);
} }
:root[tabFx2Compatible="8"][tabFx2Compatible-flags~="pie"] :root[tabFx2Compatible="9"][tabFx2Compatible-flags~="pie"]
.tabbrowser-tab[busy][stalled] > hbox > stack > .tab-icon-image { .tab-icon-image[busy][stalled] {
list-style-image: url("chrome://browser/skin/tabbrowser/progress-pulsing.png") !important; list-style-image: url("chrome://browser/skin/tabbrowser/progress-pulsing.png") !important;
} }
:root[tabFx2Compatible="8"][tabFx2Compatible-flags~="pie"]
.tabbrowser-tab[busy][progress="1"] > hbox > stack > .tab-icon-image {
-moz-image-region: rect(0, 32px, 16px, 16px);
}
:root[tabFx2Compatible="8"][tabFx2Compatible-flags~="pie"]
.tabbrowser-tab[busy][progress="2"] > hbox > stack > .tab-icon-image {
-moz-image-region: rect(0, 48px, 16px, 32px);
}
:root[tabFx2Compatible="8"][tabFx2Compatible-flags~="pie"]
.tabbrowser-tab[busy][progress="3"] > hbox > stack > .tab-icon-image {
-moz-image-region: rect(0, 64px, 16px, 48px);
}
:root[tabFx2Compatible="8"][tabFx2Compatible-flags~="pie"]
.tabbrowser-tab[busy][progress="4"] > hbox > stack > .tab-icon-image {
-moz-image-region: rect(0, 80px, 16px, 64px);
}
:root[tabFx2Compatible="8"][tabFx2Compatible-flags~="pie"]
.tabbrowser-tab[busy][progress="5"] > hbox > stack > .tab-icon-image {
-moz-image-region: rect(0, 96px, 16px, 80px);
}
:root[tabFx2Compatible="8"][tabFx2Compatible-flags~="pie"]
.tabbrowser-tab[busy][progress="6"] > hbox > stack > .tab-icon-image {
-moz-image-region: rect(0, 112px, 16px, 96px);
}
:root[tabFx2Compatible="8"][tabFx2Compatible-flags~="pie"]
.tabbrowser-tab[busy][progress="7"] > hbox > stack > .tab-icon-image {
-moz-image-region: rect(0, 128px, 16px, 112px);
}
:root[tabFx2Compatible="8"][tabFx2Compatible-flags~="pie"]
.tabbrowser-tab[busy][progress="8"] > hbox > stack > .tab-icon-image {
-moz-image-region: rect(0, 144px, 16px, 128px);
}
:root[tabFx2Compatible="8"] :root[tabFx2Compatible="9"]
.tabbrowser-tab[selected="true"]:focus > hbox > .tab-text { .tabbrowser-tab:focus > .tab-stack {
border: 1px dotted -moz-DialogText; border: 1px dotted -moz-DialogText;
} }
:root[tabFx2Compatible="8"] :root[tabFx2Compatible="9"]
.tabbrowser-tab[pinned="true"] .tab-text { .tab-image-left[pinned="true"],
visibility: collapse !important; :root[tabFx2Compatible="9"]
} .tab-image-right[pinned="true"] {
:root[tabFx2Compatible="8"]
.tabbrowser-tab[pinned="true"] > .tab-image-left,
:root[tabFx2Compatible="8"]
.tabbrowser-tab[pinned="true"] > .tab-image-right {
display: none !important; display: none !important;
} }

View File

@ -29,16 +29,34 @@
extends="chrome://browser/content/tabbrowser.xml#tabbrowser-tab"> extends="chrome://browser/content/tabbrowser.xml#tabbrowser-tab">
<content chromedir="&locale.dir;" <content chromedir="&locale.dir;"
closetabtext="&closeTab.label;"> closetabtext="&closeTab.label;">
<xul:hbox class="tab-image-left" xbl:inherits="selected"/> <xul:stack class="tab-stack" flex="1">
<xul:hbox flex="1" class="tab-image-middle" align="center" xbl:inherits="selected"> <xul:hbox class="tab-content" align="center">
<xul:stack class="tab-icon"> <xul:hbox xbl:inherits="fadein,pinned,selected"
<xul:image xbl:inherits="validate,src=image" class="tab-icon-image"/> class="tab-image-left"/>
<xul:image class="tab-extra-status"/> <xul:hbox xbl:inherits="fadein,pinned,selected"
</xul:stack> flex="1"
<xul:label flex="1" xbl:inherits="value=label,crop,accesskey" class="tab-text"/> align="center"
</xul:hbox> class="tab-image-middle">
<xul:toolbarbutton anonid="close-button" tabindex="-1" class="tab-close-button"/> <xul:stack class="tab-icon">
<xul:hbox class="tab-image-right" xbl:inherits="selected"/> <xul:image xbl:inherits="validate,src=image,fadein,pinned,busy,stalled,progress,selected"
class="tab-icon-image"
role="presentation"/>
<xul:image class="tab-extra-status"/>
</xul:stack>
<xul:label xbl:inherits="value=label,crop,accesskey,fadein,pinned,selected"
flex="1"
class="tab-text tab-label"
role="presentation"/>
</xul:hbox>
<xul:toolbarbutton xbl:inherits="fadein,pinned,selected"
anonid="close-button"
tabindex="-1"
clickthrough="never"
class="tab-close-button"/>
<xul:hbox xbl:inherits="fadein,pinned,selected"
class="tab-image-right"/>
</xul:hbox>
</xul:stack>
</content> </content>
</binding> </binding>
@ -46,16 +64,34 @@
extends="chrome://browser/content/tabbrowser.xml#tabbrowser-tab"> extends="chrome://browser/content/tabbrowser.xml#tabbrowser-tab">
<content context="tabContextMenu" <content context="tabContextMenu"
closetabtext="&closeTab.label;"> closetabtext="&closeTab.label;">
<xul:hbox class="tab-image-left" xbl:inherits="selected"/> <xul:stack class="tab-stack" flex="1">
<xul:hbox flex="1" class="tab-image-middle" align="center" xbl:inherits="selected"> <xul:hbox class="tab-content" align="center">
<xul:stack class="tab-icon"> <xul:hbox xbl:inherits="fadein,pinned,selected"
<xul:image xbl:inherits="validate,src=image" class="tab-icon-image"/> class="tab-image-left"/>
<xul:image class="tab-extra-status"/> <xul:hbox xbl:inherits="fadein,pinned,selected"
</xul:stack> flex="1"
<xul:label flex="1" xbl:inherits="value=label,crop,accesskey" class="tab-text"/> align="center"
</xul:hbox> class="tab-image-middle">
<xul:toolbarbutton anonid="close-button" tabindex="-1" class="tab-close-button"/> <xul:stack class="tab-icon">
<xul:hbox class="tab-image-right" xbl:inherits="selected"/> <xul:image xbl:inherits="validate,src=image,fadein,pinned,busy,stalled,progress,selected"
class="tab-icon-image"
role="presentation"/>
<xul:image class="tab-extra-status"/>
</xul:stack>
<xul:label xbl:inherits="value=label,crop,accesskey,fadein,pinned,selected"
flex="1"
class="tab-text tab-label"
role="presentation"/>
</xul:hbox>
<xul:toolbarbutton xbl:inherits="fadein,pinned,selected"
anonid="close-button"
tabindex="-1"
clickthrough="never"
class="tab-close-button"/>
<xul:hbox xbl:inherits="fadein,pinned,selected"
class="tab-image-right"/>
</xul:hbox>
</xul:stack>
</content> </content>
</binding> </binding>

View File

@ -19,7 +19,7 @@
window.addEventListener('DOMContentLoaded', function() { window.addEventListener('DOMContentLoaded', function() {
window.removeEventListener('DOMContentLoaded', arguments.callee, true); window.removeEventListener('DOMContentLoaded', arguments.callee, true);
const currentRevision = 8; const currentRevision = 9;
var b = document.getElementById('content'); var b = document.getElementById('content');
if (!b || b.localName != 'tabbrowser') return; if (!b || b.localName != 'tabbrowser') return;