mozilla
/
gecko-dev
зеркало из https://github.com/mozilla/gecko-dev.git
1
0
Форкнуть 0
Код Задачи Пакеты Проекты Релизы Вики Активность

Bug 1066531 - Delay tab switching until content is ready in e10s mode r=mconley,mstange

This commit is contained in:
George Wright 2015-03-16 14:30:41 -04:00
Родитель 1def388b28
Коммит 72153ad282
25 изменённых файлов: 193 добавлений и 136 удалений
Показать статистику Скачать Patch файл Скачать Diff файл Показать все файлы Свернуть все файлы

2
browser/base/content/browser.xul
Просмотреть файл

@ -661,7 +661,7 @@
setfocus="false"
tooltip="tabbrowser-tab-tooltip"
stopwatchid="FX_TAB_CLICK_MS">
<tab class="tabbrowser-tab" selected="true" fadein="true"/>
<tab class="tabbrowser-tab" selected="true" visuallyselected="true" fadein="true"/>
</tabs>
<toolbarbutton id="new-tab-button"

53
browser/base/content/tabbrowser.xml
Просмотреть файл

@ -2768,7 +2768,8 @@
let wasFocused = (document.activeElement == this.mCurrentTab);
aIndex = aIndex < aTab._tPos ? aIndex: aIndex+1;
this.mCurrentTab._selected = false;
this.mCurrentTab._logicallySelected = false;
this.mCurrentTab._visuallySelected = false;
// invalidate caches
this._browsers = null;
@ -2780,9 +2781,11 @@
for (let i = 0; i < this.tabs.length; i++) {
this.tabs[i]._tPos = i;
this.tabs[i]._selected = false;
this.tabs[i]._logicallySelected = false;
this.tabs[i]._visuallySelected = false;
}
this.mCurrentTab._selected = true;
this.mCurrentTab._logicallySelected = true;
this.mCurrentTab._visuallySelected = true;
if (wasFocused)
this.mCurrentTab.focus();
@ -3121,9 +3124,16 @@
this.tabbrowser._adjustFocusAfterTabSwitch(showTab);
}
}
// This doesn't necessarily exist if we're a new window and haven't switched tabs yet
if (this.lastVisibleTab)
this.lastVisibleTab._visuallySelected = false;
this.visibleTab._visuallySelected = true;
}
this.lastVisibleTab = this.visibleTab;
},
assert: function(cond) {
@ -5411,22 +5421,22 @@
<content context="tabContextMenu" closetabtext="&closeTab.label;">
<xul:stack class="tab-stack" flex="1">
<xul:hbox xbl:inherits="pinned,selected,titlechanged,fadein"
<xul:hbox xbl:inherits="pinned,selected,visuallyselected,titlechanged,fadein"
class="tab-background">
<xul:hbox xbl:inherits="pinned,selected,titlechanged"
<xul:hbox xbl:inherits="pinned,selected,visuallyselected,titlechanged"
class="tab-background-start"/>
<xul:hbox xbl:inherits="pinned,selected,titlechanged"
<xul:hbox xbl:inherits="pinned,selected,visuallyselected,titlechanged"
class="tab-background-middle"/>
<xul:hbox xbl:inherits="pinned,selected,titlechanged"
<xul:hbox xbl:inherits="pinned,selected,visuallyselected,titlechanged"
class="tab-background-end"/>
</xul:hbox>
<xul:hbox xbl:inherits="pinned,selected,titlechanged"
<xul:hbox xbl:inherits="pinned,selected,visuallyselected,titlechanged"
class="tab-content" align="center">
<xul:image xbl:inherits="fadein,pinned,busy,progress,selected"
<xul:image xbl:inherits="fadein,pinned,busy,progress,selected,visuallyselected"
class="tab-throbber"
role="presentation"
layer="true" />
<xul:image xbl:inherits="src=image,fadein,pinned,selected,busy,crashed"
<xul:image xbl:inherits="src=image,fadein,pinned,selected,visuallyselected,busy,crashed"
anonid="tab-icon-image"
class="tab-icon-image"
validate="never"
@ -5436,17 +5446,36 @@
role="presentation"/>
<xul:label flex="1"
anonid="tab-label"
xbl:inherits="value=visibleLabel,crop,accesskey,fadein,pinned,selected"
xbl:inherits="value=visibleLabel,crop,accesskey,fadein,pinned,selected,visuallyselected"
class="tab-text tab-label"
role="presentation"/>
<xul:toolbarbutton anonid="close-button"
xbl:inherits="fadein,pinned,selected"
xbl:inherits="fadein,pinned,selected,visuallyselected"
class="tab-close-button close-icon"/>
</xul:hbox>
</xul:stack>
</content>
<implementation>
<property name="_selected">
<setter>
<![CDATA[
// in e10s we want to only pseudo-select a tab before its rendering is done, so that
// the rest of the system knows that the tab is selected, but we don't want to update its
// visual status to selected until after we receive confirmation that its content has painted.
this._logicallySelected = val;
// If we're non-e10s we should update the visual selection as well at the same time
if (!gMultiProcessBrowser) {
this._visuallySelected = val;
}
return val;
]]>
</setter>
</property>
<property name="label">
<getter>
return this.getAttribute("label");

6
browser/themes/linux/browser-lightweightTheme.css
Просмотреть файл

@ -11,8 +11,8 @@
*/
/* Lightweight theme on tabs */
#tabbrowser-tabs:not([movingtab]) > .tabbrowser-tab > .tab-stack > .tab-background > .tab-background-start[selected=true]:-moz-lwtheme::before,
#tabbrowser-tabs:not([movingtab]) > .tabbrowser-tab > .tab-stack > .tab-background > .tab-background-end[selected=true]:-moz-lwtheme::before {
#tabbrowser-tabs:not([movingtab]) > .tabbrowser-tab > .tab-stack > .tab-background > .tab-background-start[visuallyselected=true]:-moz-lwtheme::before,
#tabbrowser-tabs:not([movingtab]) > .tabbrowser-tab > .tab-stack > .tab-background > .tab-background-end[visuallyselected=true]:-moz-lwtheme::before {
background-attachment: scroll, fixed;
background-color: transparent;
background-image: @fgTabTextureLWT@;/*, lwtHeader;*/
@ -20,7 +20,7 @@
background-repeat: repeat-x, no-repeat;
}
#tabbrowser-tabs:not([movingtab]) > .tabbrowser-tab > .tab-stack > .tab-background > .tab-background-middle[selected=true]:-moz-lwtheme {
#tabbrowser-tabs:not([movingtab]) > .tabbrowser-tab > .tab-stack > .tab-background > .tab-background-middle[visuallyselected=true]:-moz-lwtheme {
background-attachment: scroll, scroll, fixed;
background-color: transparent;
background-image: url(chrome://browser/skin/tabbrowser/tab-active-middle.png),

8
browser/themes/linux/browser.css
Просмотреть файл

@ -1841,15 +1841,15 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action-
}
/* Tab close button */
.tab-close-button:not([selected]):not(:hover) {
.tab-close-button:not([visuallyselected]):not(:hover) {
background-image: -moz-image-rect(url("chrome://global/skin/icons/close.svg"), 0, 64, 16, 48);
}
#TabsToolbar[brighttext] .tab-close-button:not([selected]):not(:hover) {
#TabsToolbar[brighttext] .tab-close-button:not([visuallyselected]):not(:hover) {
background-image: -moz-image-rect(url("chrome://global/skin/icons/close.svg"), 0, 80, 16, 64);
}
.tab-close-button:not([selected]):not(:hover):-moz-lwtheme-darktext {
.tab-close-button:not([visuallyselected]):not(:hover):-moz-lwtheme-darktext {
background-image: -moz-image-rect(url("chrome://global/skin/icons/close.svg"), 0, 96, 16, 80);
}
@ -1924,7 +1924,7 @@ richlistitem[type~="action"][actiontype="switchtab"] > .ac-url-box > .ac-action-
list-style-image: url("chrome://mozapps/skin/places/defaultFavicon.png");
}
.alltabs-item[selected="true"] {
.alltabs-item[visuallyselected="true"] {
font-weight: bold;
}

8
browser/themes/osx/browser-lightweightTheme.css
Просмотреть файл

@ -10,8 +10,8 @@
*/
/* Lightweight theme on tabs */
#tabbrowser-tabs:not([movingtab]) > .tabbrowser-tab > .tab-stack > .tab-background > .tab-background-start[selected=true]:-moz-lwtheme::before,
#tabbrowser-tabs:not([movingtab]) > .tabbrowser-tab > .tab-stack > .tab-background > .tab-background-end[selected=true]:-moz-lwtheme::before {
#tabbrowser-tabs:not([movingtab]) > .tabbrowser-tab > .tab-stack > .tab-background > .tab-background-start[visuallyselected=true]:-moz-lwtheme::before,
#tabbrowser-tabs:not([movingtab]) > .tabbrowser-tab > .tab-stack > .tab-background > .tab-background-end[visuallyselected=true]:-moz-lwtheme::before {
background-attachment: scroll, fixed;
background-color: transparent;
background-image: @fgTabTextureLWT@;/*, lwtHeader;*/
@ -19,7 +19,7 @@
background-repeat: repeat-x, no-repeat;
}
#tabbrowser-tabs:not([movingtab]) > .tabbrowser-tab > .tab-stack > .tab-background > .tab-background-middle[selected=true]:-moz-lwtheme {
#tabbrowser-tabs:not([movingtab]) > .tabbrowser-tab > .tab-stack > .tab-background > .tab-background-middle[visuallyselected=true]:-moz-lwtheme {
background-attachment: scroll, scroll, fixed;
background-color: transparent;
background-image: url(chrome://browser/skin/tabbrowser/tab-active-middle.png),
@ -30,7 +30,7 @@
}
@media (min-resolution: 2dppx) {
#tabbrowser-tabs:not([movingtab]) > .tabbrowser-tab > .tab-stack > .tab-background > .tab-background-middle[selected=true]:-moz-lwtheme {
#tabbrowser-tabs:not([movingtab]) > .tabbrowser-tab > .tab-stack > .tab-background > .tab-background-middle[visuallyselected=true]:-moz-lwtheme {
background-image: url(chrome://browser/skin/tabbrowser/tab-active-middle@2x.png),
@fgTabTextureLWT@;/*,
lwtHeader;*/

30
browser/themes/osx/browser.css
Просмотреть файл

@ -3045,26 +3045,26 @@ toolbarbutton.chevron > .toolbarbutton-menu-dropmarker {
url(chrome://browser/skin/tabbrowser/tab-background-start@2x.png);
}
.tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true]),
.tabbrowser-tab:hover > .tab-stack > .tab-background:not([visuallyselected=true]),
.tabs-newtab-button:hover {
background-image: url(chrome://browser/skin/tabbrowser/tab-background-start@2x.png),
url(chrome://browser/skin/tabbrowser/tab-background-middle@2x.png),
url(chrome://browser/skin/tabbrowser/tab-background-end@2x.png);
}
.tab-background-middle[selected=true] {
.tab-background-middle[visuallyselected=true] {
background-image: url(chrome://browser/skin/tabbrowser/tab-active-middle@2x.png),
@fgTabTexture@,
none;
}
.tab-background-start[selected=true]:-moz-locale-dir(ltr)::after,
.tab-background-end[selected=true]:-moz-locale-dir(rtl)::after {
.tab-background-start[visuallyselected=true]:-moz-locale-dir(ltr)::after,
.tab-background-end[visuallyselected=true]:-moz-locale-dir(rtl)::after {
background-image: url(chrome://browser/skin/tabbrowser/tab-stroke-start@2x.png);
}
.tab-background-end[selected=true]:-moz-locale-dir(ltr)::after,
.tab-background-start[selected=true]:-moz-locale-dir(rtl)::after {
.tab-background-end[visuallyselected=true]:-moz-locale-dir(ltr)::after,
.tab-background-start[visuallyselected=true]:-moz-locale-dir(rtl)::after {
background-image: url(chrome://browser/skin/tabbrowser/tab-stroke-end@2x.png);
}
@ -3082,13 +3082,13 @@ toolbarbutton.chevron > .toolbarbutton-menu-dropmarker {
/* Background tab separators */
#tabbrowser-tabs[movingtab] > .tabbrowser-tab[beforeselected]:not([last-visible-tab])::after,
.tabbrowser-tab:not([selected]):not([afterselected-visible]):not([afterhovered]):not([first-visible-tab]):not(:hover)::before,
#tabbrowser-tabs:not([overflow]) > .tabbrowser-tab[last-visible-tab]:not([selected]):not([beforehovered]):not(:hover)::after {
.tabbrowser-tab:not([visuallyselected]):not([afterselected-visible]):not([afterhovered]):not([first-visible-tab]):not(:hover)::before,
#tabbrowser-tabs:not([overflow]) > .tabbrowser-tab[last-visible-tab]:not([visuallyselected]):not([beforehovered]):not(:hover)::after {
background-image: url(chrome://browser/skin/tabbrowser/tab-separator@2x.png);
}
}
.tabbrowser-tab:not(:hover) > .tab-stack > .tab-content > .tab-icon-image:not([selected="true"]) {
.tabbrowser-tab:not(:hover) > .tab-stack > .tab-content > .tab-icon-image:not([visuallyselected="true"]) {
opacity: .9;
}
@ -3100,7 +3100,7 @@ toolbarbutton.chevron > .toolbarbutton-menu-dropmarker {
opacity: 0.9999;
}
.tab-label:not([selected="true"]) {
.tab-label:not([visuallyselected="true"]) {
opacity: .7;
}
@ -3110,12 +3110,12 @@ toolbarbutton.chevron > .toolbarbutton-menu-dropmarker {
border: none;
}
.tabbrowser-tab[selected=true]:not(:-moz-lwtheme) {
.tabbrowser-tab[visuallyselected=true]:not(:-moz-lwtheme) {
/* overriding tabbox.css */
color: inherit;
}
.tabbrowser-tab[selected=true] {
.tabbrowser-tab[visuallyselected=true] {
/* overriding tabbox.css */
text-shadow: inherit;
}
@ -3165,7 +3165,7 @@ toolbarbutton.chevron > .toolbarbutton-menu-dropmarker {
* of the window (e.g. no menubar, tabs in titlebar, etc.) to make it easier to drag the window by
* the titlebar. We don't need this in fullscreen since window dragging is not an issue there.
*/
#main-window[tabsintitlebar]:not([inFullscreen]) .tab-background-middle:not([selected=true]) {
#main-window[tabsintitlebar]:not([inFullscreen]) .tab-background-middle:not([visuallyselected=true]) {
clip-path: url(chrome://browser/content/browser.xul#tab-hover-clip-path);
}
@ -3201,12 +3201,12 @@ toolbarbutton.chevron > .toolbarbutton-menu-dropmarker {
cursor: default;
}
#TabsToolbar[brighttext] .tab-close-button.close-icon:not([selected=true]):not(:hover) {
#TabsToolbar[brighttext] .tab-close-button.close-icon:not([visuallyselected=true]):not(:hover) {
-moz-image-region: rect(0, 64px, 16px, 48px);
}
@media (min-resolution: 2dppx) {
#TabsToolbar[brighttext] .tab-close-button.close-icon:not([selected=true]):not(:hover) {
#TabsToolbar[brighttext] .tab-close-button.close-icon:not([visuallyselected=true]):not(:hover) {
-moz-image-region: rect(0, 128px, 32px, 96px);
}
}

4
browser/themes/osx/devedition.css
Просмотреть файл

@ -85,11 +85,11 @@
/* Tab styling - make sure to use an inverted icon for the selected tab
(brighttext only covers the unselected tabs) */
.tab-close-button[selected=true]:not(:hover) {
.tab-close-button[visuallyselected=true]:not(:hover) {
-moz-image-region: rect(0, 64px, 16px, 48px);
}
@media (min-resolution: 2dppx) {
.tab-close-button[selected=true]:not(:hover) {
.tab-close-button[visuallyselected=true]:not(:hover) {
-moz-image-region: rect(0, 128px, 32px, 96px);
}
}

22
browser/themes/shared/devedition.inc.css
Просмотреть файл

@ -141,17 +141,17 @@
-moz-padding-start: 0;
}
.tab-background-start[selected=true]::after,
.tab-background-start[selected=true]::before,
.tab-background-start[visuallyselected=true]::after,
.tab-background-start[visuallyselected=true]::before,
.tab-background-start,
.tab-background-end,
.tab-background-end[selected=true]::after,
.tab-background-end[selected=true]::before {
.tab-background-end[visuallyselected=true]::after,
.tab-background-end[visuallyselected=true]::before {
width: 0;
}
.tab-background-start[selected=true]::after,
.tab-background-end[selected=true]::after {
.tab-background-start[visuallyselected=true]::after,
.tab-background-end[visuallyselected=true]::after {
-moz-margin-start: 0;
}
/* End override @tabCurveHalfWidth@ and @tabCurveWidth@ */
@ -270,8 +270,8 @@ searchbar:not([oneoffui]) .search-go-button {
/* Make the tab splitter 1px wide with a solid background. */
#tabbrowser-tabs[movingtab] > .tabbrowser-tab[beforeselected]:not([last-visible-tab])::after,
.tabbrowser-tab:not([selected]):not([afterselected-visible]):not([afterhovered]):not([first-visible-tab]):not(:hover)::before,
#tabbrowser-tabs:not([overflow]) > .tabbrowser-tab[last-visible-tab]:not([selected]):not([beforehovered]):not(:hover)::after {
.tabbrowser-tab:not([visuallyselected]):not([afterselected-visible]):not([afterhovered]):not([first-visible-tab]):not(:hover)::before,
#tabbrowser-tabs:not([overflow]) > .tabbrowser-tab[last-visible-tab]:not([visuallyselected]):not([beforehovered]):not(:hover)::after {
background: var(--tab-separator-color);
width: 1px;
-moz-margin-start: 0;
@ -282,7 +282,7 @@ searchbar:not([oneoffui]) .search-go-button {
due to the ::after element causing the width of the tab to extend, which
causes an overflow and makes it disappear, which removes the overflow and
causes it to reappear, etc, etc. */
#tabbrowser-tabs:not([overflow]) > .tabbrowser-tab[last-visible-tab]:not([selected]):not([beforehovered]):not(:hover)::after {
#tabbrowser-tabs:not([overflow]) > .tabbrowser-tab[last-visible-tab]:not([visuallyselected]):not([beforehovered]):not(:hover)::after {
-moz-margin-start: -1px;
-moz-margin-end: 0;
}
@ -304,7 +304,7 @@ searchbar:not([oneoffui]) .search-go-button {
pointer-events: auto;
}
.tabbrowser-tab[pinned][titlechanged]:not([selected="true"]) > .tab-stack > .tab-content {
.tabbrowser-tab[pinned][titlechanged]:not([visuallyselected="true"]) > .tab-stack > .tab-content {
background-image: var(--pinned-tab-glow);
background-position: center;
background-size: 100%;
@ -316,7 +316,7 @@ searchbar:not([oneoffui]) .search-go-button {
background-color: var(--tab-hover-background-color);
}
.tabbrowser-tab[selected] {
.tabbrowser-tab[visuallyselected] {
color: var(--tab-selection-color) !important; /* Override color: inherit */
background-color: var(--tab-selection-background-color);
box-shadow: var(--tab-selection-box-shadow);

66
browser/themes/shared/tabs.inc.css
Просмотреть файл

@ -47,7 +47,7 @@
}
/* The selected tab should appear above adjacent tabs, .tabs-newtab-button and the highlight of #nav-bar */
.tabbrowser-tab[selected=true] {
.tabbrowser-tab[visuallyselected=true] {
position: relative;
z-index: 2;
}
@ -167,17 +167,17 @@
transition: opacity 150ms ease;
}
.tab-background-start[selected=true]::after,
.tab-background-start[selected=true]::before,
.tab-background-start[visuallyselected=true]::after,
.tab-background-start[visuallyselected=true]::before,
.tab-background-start,
.tab-background-end,
.tab-background-end[selected=true]::after,
.tab-background-end[selected=true]::before {
.tab-background-end[visuallyselected=true]::after,
.tab-background-end[visuallyselected=true]::before {
min-height: var(--tab-min-height);
width: @tabCurveWidth@;
}
.tabbrowser-tab:not([selected=true]),
.tabbrowser-tab:not([visuallyselected=true]),
.tabbrowser-tab:-moz-lwtheme {
color: inherit;
}
@ -193,8 +193,8 @@
*/
.tab-background-start[selected=true]::after,
.tab-background-end[selected=true]::after {
.tab-background-start[visuallyselected=true]::after,
.tab-background-end[visuallyselected=true]::after {
/* position ::after on top of its parent */
-moz-margin-start: -@tabCurveWidth@;
background-size: 100% 100%;
@ -203,47 +203,47 @@
position: relative;
}
.tab-background-start[selected=true]::before,
.tab-background-end[selected=true]::before {
.tab-background-start[visuallyselected=true]::before,
.tab-background-end[visuallyselected=true]::before {
/* all ::before pseudo elements */
content: "";
display: -moz-box;
}
.tab-background-start[selected=true]:-moz-locale-dir(ltr):not(:-moz-lwtheme)::before,
.tab-background-end[selected=true]:-moz-locale-dir(rtl):not(:-moz-lwtheme)::before {
.tab-background-start[visuallyselected=true]:-moz-locale-dir(ltr):not(:-moz-lwtheme)::before,
.tab-background-end[visuallyselected=true]:-moz-locale-dir(rtl):not(:-moz-lwtheme)::before {
background-image: url(chrome://browser/skin/tabbrowser/tab-selected-start.svg);
background-size: 100% 100%;
}
.tab-background-end[selected=true]:-moz-locale-dir(ltr):not(:-moz-lwtheme)::before,
.tab-background-start[selected=true]:-moz-locale-dir(rtl):not(:-moz-lwtheme)::before {
.tab-background-end[visuallyselected=true]:-moz-locale-dir(ltr):not(:-moz-lwtheme)::before,
.tab-background-start[visuallyselected=true]:-moz-locale-dir(rtl):not(:-moz-lwtheme)::before {
background-image: url(chrome://browser/skin/tabbrowser/tab-selected-end.svg);
background-size: 100% 100%;
}
/* For lightweight themes, clip the header image on start, middle, and end. */
.tab-background-start[selected=true]:-moz-locale-dir(ltr):-moz-lwtheme::before,
.tab-background-end[selected=true]:-moz-locale-dir(rtl):-moz-lwtheme::before {
.tab-background-start[visuallyselected=true]:-moz-locale-dir(ltr):-moz-lwtheme::before,
.tab-background-end[visuallyselected=true]:-moz-locale-dir(rtl):-moz-lwtheme::before {
clip-path: url(chrome://browser/content/browser.xul#tab-curve-clip-path-start);
}
.tab-background-end[selected=true]:-moz-locale-dir(ltr):-moz-lwtheme::before,
.tab-background-start[selected=true]:-moz-locale-dir(rtl):-moz-lwtheme::before {
.tab-background-end[visuallyselected=true]:-moz-locale-dir(ltr):-moz-lwtheme::before,
.tab-background-start[visuallyselected=true]:-moz-locale-dir(rtl):-moz-lwtheme::before {
clip-path: url(chrome://browser/content/browser.xul#tab-curve-clip-path-end);
}
.tab-background-start[selected=true]:-moz-locale-dir(ltr)::after,
.tab-background-end[selected=true]:-moz-locale-dir(rtl)::after {
.tab-background-start[visuallyselected=true]:-moz-locale-dir(ltr)::after,
.tab-background-end[visuallyselected=true]:-moz-locale-dir(rtl)::after {
background-image: url(chrome://browser/skin/tabbrowser/tab-stroke-start.png);
}
.tab-background-end[selected=true]:-moz-locale-dir(ltr)::after,
.tab-background-start[selected=true]:-moz-locale-dir(rtl)::after {
.tab-background-end[visuallyselected=true]:-moz-locale-dir(ltr)::after,
.tab-background-start[visuallyselected=true]:-moz-locale-dir(rtl)::after {
background-image: url(chrome://browser/skin/tabbrowser/tab-stroke-end.png);
}
.tab-background-middle[selected=true] {
.tab-background-middle[visuallyselected=true] {
background-clip: padding-box, padding-box, content-box;
background-color: @fgTabBackgroundColor@;
background-image: url(chrome://browser/skin/tabbrowser/tab-active-middle.png),
@ -258,7 +258,7 @@
/* Selected tab lightweight theme styles.
See browser-lightweightTheme.css for information about run-time changes to LWT styles. */
.tab-background-middle[selected=true]:-moz-lwtheme {
.tab-background-middle[visuallyselected=true]:-moz-lwtheme {
background-color: transparent;
background-image: url(chrome://browser/skin/tabbrowser/tab-active-middle.png),
@fgTabTextureLWT@;/*,
@ -268,21 +268,21 @@
}
/* These LWT styles are normally overridden by browser-lightweightTheme.css */
.tab-background-start[selected=true]:-moz-lwtheme::before,
.tab-background-end[selected=true]:-moz-lwtheme::before {
.tab-background-start[visuallyselected=true]:-moz-lwtheme::before,
.tab-background-end[visuallyselected=true]:-moz-lwtheme::before {
background-image: @fgTabTextureLWT@;
}
.tab-background-start[selected=true]:-moz-lwtheme::before,
.tab-background-end[selected=true]:-moz-lwtheme::before,
.tab-background-middle[selected=true]:-moz-lwtheme {
.tab-background-start[visuallyselected=true]:-moz-lwtheme::before,
.tab-background-end[visuallyselected=true]:-moz-lwtheme::before,
.tab-background-middle[visuallyselected=true]:-moz-lwtheme {
background-color: transparent;
}
/* End selected tab */
/* new tab button border and gradient on hover */
.tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true]),
.tabbrowser-tab:hover > .tab-stack > .tab-background:not([visuallyselected=true]),
.tabs-newtab-button:hover {
background-image: url(chrome://browser/skin/tabbrowser/tab-background-start.png),
url(chrome://browser/skin/tabbrowser/tab-background-middle.png),
@ -311,7 +311,7 @@
position: absolute;
}
.tabbrowser-tab[pinned][titlechanged]:not([selected="true"]) > .tab-stack > .tab-content {
.tabbrowser-tab[pinned][titlechanged]:not([visuallyselected="true"]) > .tab-stack > .tab-content {
background-image: radial-gradient(farthest-corner at center bottom, rgb(255,255,255) 3%, rgba(186,221,251,0.75) 20%, rgba(127,179,255,0.25) 40%, transparent 70%);
background-position: center bottom var(--tab-toolbar-navbar-overlap);
background-repeat: no-repeat;
@ -321,8 +321,8 @@
/* Background tab separators (3px wide).
Also show separators beside the selected tab when dragging it. */
#tabbrowser-tabs[movingtab] > .tabbrowser-tab[beforeselected]:not([last-visible-tab])::after,
.tabbrowser-tab:not([selected]):not([afterselected-visible]):not([afterhovered]):not([first-visible-tab]):not(:hover)::before,
#tabbrowser-tabs:not([overflow]) > .tabbrowser-tab[last-visible-tab]:not([selected]):not([beforehovered]):not(:hover)::after {
.tabbrowser-tab:not([visuallyselected]):not([afterselected-visible]):not([afterhovered]):not([first-visible-tab]):not(:hover)::before,
#tabbrowser-tabs:not([overflow]) > .tabbrowser-tab[last-visible-tab]:not([visuallyselected]):not([beforehovered]):not(:hover)::after {
-moz-margin-start: -1.5px;
-moz-margin-end: -1.5px;
background-image: url(chrome://browser/skin/tabbrowser/tab-separator.png);

2
browser/themes/windows/browser-aero.css
Просмотреть файл

@ -83,7 +83,7 @@
background-color: @customToolbarColor@;
}
.tab-background-middle[selected=true]:not(:-moz-lwtheme) {
.tab-background-middle[visuallyselected=true]:not(:-moz-lwtheme) {
background-color: @customToolbarColor@;
}

8
browser/themes/windows/browser-lightweightTheme.css
Просмотреть файл

@ -11,8 +11,8 @@
*/
/* Lightweight theme on tabs */
#tabbrowser-tabs:not([movingtab]) > .tabbrowser-tab > .tab-stack > .tab-background > .tab-background-start[selected=true]:-moz-lwtheme::before,
#tabbrowser-tabs:not([movingtab]) > .tabbrowser-tab > .tab-stack > .tab-background > .tab-background-end[selected=true]:-moz-lwtheme::before {
#tabbrowser-tabs:not([movingtab]) > .tabbrowser-tab > .tab-stack > .tab-background > .tab-background-start[visuallyselected=true]:-moz-lwtheme::before,
#tabbrowser-tabs:not([movingtab]) > .tabbrowser-tab > .tab-stack > .tab-background > .tab-background-end[visuallyselected=true]:-moz-lwtheme::before {
background-attachment: scroll, fixed;
background-color: transparent;
background-image: @fgTabTextureLWT@;/*, lwtHeader;*/
@ -20,7 +20,7 @@
background-repeat: repeat-x, no-repeat;
}
#tabbrowser-tabs:not([movingtab]) > .tabbrowser-tab > .tab-stack > .tab-background > .tab-background-middle[selected=true]:-moz-lwtheme {
#tabbrowser-tabs:not([movingtab]) > .tabbrowser-tab > .tab-stack > .tab-background > .tab-background-middle[visuallyselected=true]:-moz-lwtheme {
background-attachment: scroll, scroll, fixed;
background-color: transparent;
background-image: url(chrome://browser/skin/tabbrowser/tab-active-middle.png),
@ -31,7 +31,7 @@
}
@media (min-resolution: 1.25dppx) {
#tabbrowser-tabs:not([movingtab]) > .tabbrowser-tab > .tab-stack > .tab-background > .tab-background-middle[selected=true]:-moz-lwtheme {
#tabbrowser-tabs:not([movingtab]) > .tabbrowser-tab > .tab-stack > .tab-background > .tab-background-middle[visuallyselected=true]:-moz-lwtheme {
background-image: url(chrome://browser/skin/tabbrowser/tab-active-middle@2x.png),
@fgTabTextureLWT@;/*,
lwtHeader;*/

20
browser/themes/windows/browser.css
Просмотреть файл

@ -1828,26 +1828,26 @@ toolbarbutton[type="socialmark"] > .toolbarbutton-icon {
url(chrome://browser/skin/tabbrowser/tab-background-start@2x.png);
}
.tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true]),
.tabbrowser-tab:hover > .tab-stack > .tab-background:not([visuallyselected=true]),
.tabs-newtab-button:hover {
background-image: url(chrome://browser/skin/tabbrowser/tab-background-start@2x.png),
url(chrome://browser/skin/tabbrowser/tab-background-middle@2x.png),
url(chrome://browser/skin/tabbrowser/tab-background-end@2x.png);
}
.tab-background-middle[selected=true] {
.tab-background-middle[visuallyselected=true] {
background-image: url(chrome://browser/skin/tabbrowser/tab-active-middle@2x.png),
@fgTabTexture@,
none;
}
.tab-background-start[selected=true]:-moz-locale-dir(ltr)::after,
.tab-background-end[selected=true]:-moz-locale-dir(rtl)::after {
.tab-background-start[visuallyselected=true]:-moz-locale-dir(ltr)::after,
.tab-background-end[visuallyselected=true]:-moz-locale-dir(rtl)::after {
background-image: url(chrome://browser/skin/tabbrowser/tab-stroke-start@2x.png);
}
.tab-background-end[selected=true]:-moz-locale-dir(ltr)::after,
.tab-background-start[selected=true]:-moz-locale-dir(rtl)::after {
.tab-background-end[visuallyselected=true]:-moz-locale-dir(ltr)::after,
.tab-background-start[visuallyselected=true]:-moz-locale-dir(rtl)::after {
background-image: url(chrome://browser/skin/tabbrowser/tab-stroke-end@2x.png);
}
}
@ -1856,14 +1856,14 @@ toolbarbutton[type="socialmark"] > .toolbarbutton-icon {
/* Use lighter colors of buttons and text in the titlebar on luna-blue */
@media (-moz-windows-theme: luna-blue) {
#tabbrowser-tabs[movingtab] > .tabbrowser-tab[beforeselected]:not([last-visible-tab])::after,
.tabbrowser-tab:not([selected]):not([afterselected-visible]):not([afterhovered]):not([first-visible-tab]):not(:hover)::before,
#tabbrowser-tabs:not([overflow]) > .tabbrowser-tab[last-visible-tab]:not([selected]):not([beforehovered]):not(:hover)::after {
.tabbrowser-tab:not([visuallyselected]):not([afterselected-visible]):not([afterhovered]):not([first-visible-tab]):not(:hover)::before,
#tabbrowser-tabs:not([overflow]) > .tabbrowser-tab[last-visible-tab]:not([visuallyselected]):not([beforehovered]):not(:hover)::after {
background-image: url("chrome://browser/skin/tabbrowser/tab-separator-luna-blue.png");
}
}
%endif
#TabsToolbar[brighttext] .tab-close-button:not(:hover):not([selected="true"]) {
#TabsToolbar[brighttext] .tab-close-button:not(:hover):not([visuallyselected="true"]) {
-moz-image-region: rect(0, 64px, 16px, 48px) !important;
}
@ -1878,7 +1878,7 @@ toolbarbutton[type="socialmark"] > .toolbarbutton-icon {
* of the window (e.g. no menubar, tabs in titlebar, etc.) to make it easier to drag the window by
* the titlebar. We don't need this in fullscreen since window dragging is not an issue there.
*/
#main-window[tabsintitlebar][sizemode=normal] #toolbar-menubar[autohide="true"][inactive] + #TabsToolbar .tab-background-middle:not([selected=true]) {
#main-window[tabsintitlebar][sizemode=normal] #toolbar-menubar[autohide="true"][inactive] + #TabsToolbar .tab-background-middle:not([visuallyselected=true]) {
clip-path: url(chrome://browser/content/browser.xul#tab-hover-clip-path);
}

2
browser/themes/windows/devedition.css
Просмотреть файл

@ -158,6 +158,6 @@
/* Tab styling - make sure to use an inverted icon for the selected tab
(brighttext only covers the unselected tabs) */
.tab-close-button[selected=true]:not(:hover) {
.tab-close-button[visuallyselected=true]:not(:hover) {
-moz-image-region: rect(0, 64px, 16px, 48px);
}

1
dom/base/nsGkAtomList.h
Просмотреть файл

@ -1239,6 +1239,7 @@ GK_ATOM(viewport_minimum_scale, "viewport-minimum-scale")
GK_ATOM(viewport_user_scalable, "viewport-user-scalable")
GK_ATOM(viewport_width, "viewport-width")
GK_ATOM(visibility, "visibility")
GK_ATOM(visuallyselected, "visuallyselected")
GK_ATOM(vlink, "vlink")
GK_ATOM(vspace, "vspace")
GK_ATOM(wbr, "wbr")

32
toolkit/content/widgets/tabbox.xml
Просмотреть файл

@ -701,7 +701,7 @@
</resources>
<content>
<xul:hbox class="tab-middle box-inherit" xbl:inherits="align,dir,pack,orient,selected" flex="1">
<xul:hbox class="tab-middle box-inherit" xbl:inherits="align,dir,pack,orient,selected,visuallyselected" flex="1">
<xul:image class="tab-icon"
xbl:inherits="validate,src=image"
role="presentation"/>
@ -727,13 +727,13 @@
<property name="selected" readonly="true"
onget="return this.getAttribute('selected') == 'true';"/>
<property name="_selected">
<property name="_visuallySelected">
<setter>
<![CDATA[
if (val)
this.setAttribute("selected", "true");
this.setAttribute("visuallyselected", "true");
else
this.removeAttribute("selected");
this.removeAttribute("visuallyselected");
if (this.previousSibling && this.previousSibling.localName == "tab") {
if (val)
@ -759,6 +759,30 @@
</setter>
</property>
<property name="_logicallySelected">
<setter>
<![CDATA[
if (val)
this.setAttribute("selected", "true");
else
this.removeAttribute("selected");
return val;
]]>
</setter>
</property>
<property name="_selected">
<setter>
<![CDATA[
// If our tab switching is synchronous, then logical selection = visual selection
this._logicallySelected = val;
this._visuallySelected = val;
return val;
]]>
</setter>
</property>
<property name="linkedPanel" onget="return this.getAttribute('linkedpanel')"
onset="this.setAttribute('linkedpanel', val); return val;"/>

14
toolkit/themes/faststripe/global/tabbox.css
Просмотреть файл

@ -51,7 +51,7 @@ tab:-moz-locale-dir(rtl) {
margin: 0 !important;
}
tab[selected="true"] {
tab[visuallyselected="true"] {
margin-top: 0;
border-bottom-color: transparent;
padding: 1px 6px 4px 6px;
@ -63,18 +63,18 @@ tab:focus > .tab-middle {
}
tab[beforeselected="true"]:not(:-moz-locale-dir(rtl)),
tab[selected="true"]:-moz-locale-dir(rtl) + tab {
tab[visuallyselected="true"]:-moz-locale-dir(rtl) + tab {
border-right: none;
border-top-right-radius: 0;
}
tab[selected="true"]:not(:-moz-locale-dir(rtl)) + tab,
tab[visuallyselected="true"]:not(:-moz-locale-dir(rtl)) + tab,
tab[beforeselected="true"]:-moz-locale-dir(rtl) {
border-left: none;
border-top-left-radius: 0;
}
tab:first-of-type[selected="true"] {
tab:first-of-type[visuallyselected="true"] {
padding-right: 5px;
padding-left: 5px;
}
@ -96,18 +96,18 @@ tab:first-of-type[selected="true"] {
padding: 2px 4px 1px 4px;
}
.tab-bottom[selected="true"] {
.tab-bottom[visuallyselected="true"] {
margin-bottom: 0;
-moz-border-top-colors: -moz-Dialog;
padding: 4px 6px 1px 6px;
}
.tab-bottom[beforeselected="true"]:not(:-moz-locale-dir(rtl)),
.tab-bottom[selected="true"]:-moz-locale-dir(rtl) + .tab-bottom {
.tab-bottom[visuallyselected="true"]:-moz-locale-dir(rtl) + .tab-bottom {
border-bottom-right-radius: 0;
}
.tab-bottom[selected="true"]:not(:-moz-locale-dir(rtl)) + .tab-bottom,
.tab-bottom[visuallyselected="true"]:not(:-moz-locale-dir(rtl)) + .tab-bottom,
.tab-bottom[beforeselected="true"]:-moz-locale-dir(rtl) {
border-bottom-left-radius: 0;
}

2
toolkit/themes/linux/global/in-content/common.css
Просмотреть файл

@ -4,7 +4,7 @@
%include ../../../shared/in-content/common.inc.css
xul|tab[selected] {
xul|tab[visuallyselected] {
/* Override styles for tab[selected] from
toolkit/themes/linux/global/tabbox.css */
margin-bottom: 0;

4
toolkit/themes/linux/global/tabbox.css
Просмотреть файл

@ -48,7 +48,7 @@ tab {
color: -moz-DialogText;
}
tab[selected="true"] {
tab[visuallyselected="true"] {
z-index: 1;
margin-top: 0;
margin-bottom: -2px;
@ -83,7 +83,7 @@ tab + tab {
border-bottom-left-radius: 2px;
}
.tab-bottom[selected="true"] {
.tab-bottom[visuallyselected="true"] {
margin-bottom: 0;
margin-top: -2px;
padding-top: 6px;

4
toolkit/themes/osx/global/in-content/common.css
Просмотреть файл

@ -10,7 +10,7 @@ xul|tabs {
padding-left: 0;
}
xul|tab[selected] {
xul|tab[visuallyselected] {
text-shadow: none;
}
@ -95,4 +95,4 @@ xul|tab:-moz-focusring > .tab-middle > .tab-text {
xul|radio[focused="true"] > .radio-check {
-moz-outline-radius: 100%;
}
}

22
toolkit/themes/osx/global/tabbox.css
Просмотреть файл

@ -51,7 +51,7 @@ tab:last-of-type {
}
@media (-moz-mac-lion-theme) {
tab[selected="true"] {
tab[visuallyselected="true"] {
color: #FFF;
text-shadow: rgba(0, 0, 0, 0.4) 0 1px;
}
@ -104,14 +104,14 @@ tabs.tabs-bottom > tab > .tab-middle {
padding: 1px 2px 0 2px;
}
tabbox.tabs-bottom > tabs > tab:not([selected=true]):hover,
tabs.tabs-bottom > tab:not([selected=true]):hover {
tabbox.tabs-bottom > tabs > tab:not([visuallyselected=true]):hover,
tabs.tabs-bottom > tab:not([visuallyselected=true]):hover {
background-color: rgba(0, 0, 0, 0.1);
-moz-border-end-color: rgba(0, 0, 0, 0.1);
}
tabbox.tabs-bottom > tabs > tab[selected=true],
tabs.tabs-bottom > tab[selected=true] {
tabbox.tabs-bottom > tabs > tab[visuallyselected=true],
tabs.tabs-bottom > tab[visuallyselected=true] {
color: #000;
text-shadow: none;
border: solid #888;
@ -132,19 +132,19 @@ tabs.tabs-bottom > tab[beforeselected=true] {
-moz-margin-end: -2px;
}
tabbox.tabs-bottom > tabs > tab:first-of-type:not([selected=true]),
tabs.tabs-bottom > tab:first-of-type:not([selected=true]) {
tabbox.tabs-bottom > tabs > tab:first-of-type:not([visuallyselected=true]),
tabs.tabs-bottom > tab:first-of-type:not([visuallyselected=true]) {
-moz-border-start: 4px solid transparent;
}
tabbox.tabs-bottom > tabs > tab:first-of-type[selected=true],
tabs.tabs-bottom > tab:first-of-type[selected=true] {
tabbox.tabs-bottom > tabs > tab:first-of-type[visuallyselected=true],
tabs.tabs-bottom > tab:first-of-type[visuallyselected=true] {
-moz-margin-start: 2px;
}
tabbox.tabs-bottom,
tabbox.tabs-bottom > tabpanels,
tabbox.tabs-bottom > tabs > tab[selected=true] > .tab-middle,
tabs.tabs-bottom > tab[selected=true] > .tab-middle {
tabbox.tabs-bottom > tabs > tab[visuallyselected=true] > .tab-middle,
tabs.tabs-bottom > tab[visuallyselected=true] > .tab-middle {
-moz-appearance: dialog;
}

14
toolkit/themes/windows/global/tabbox.css
Просмотреть файл

@ -60,7 +60,7 @@ tab:-moz-locale-dir(rtl) {
margin: 0 !important;
}
tab[selected="true"] {
tab[visuallyselected="true"] {
margin-top: 0;
border-bottom-color: transparent;
padding: 1px 6px 4px 6px;
@ -72,18 +72,18 @@ tab:-moz-focusring > .tab-middle {
}
tab[beforeselected="true"]:-moz-locale-dir(ltr),
tab[selected="true"]:-moz-locale-dir(rtl) + tab {
tab[visuallyselected="true"]:-moz-locale-dir(rtl) + tab {
border-right: none;
border-top-right-radius: 0;
}
tab[selected="true"]:-moz-locale-dir(ltr) + tab,
tab[visuallyselected="true"]:-moz-locale-dir(ltr) + tab,
tab[beforeselected="true"]:-moz-locale-dir(rtl) {
border-left: none;
border-top-left-radius: 0;
}
tab:first-of-type[selected="true"] {
tab:first-of-type[visuallyselected="true"] {
padding-right: 5px;
padding-left: 5px;
}
@ -107,18 +107,18 @@ tab:first-of-type[selected="true"] {
padding: 2px 4px 1px 4px;
}
.tab-bottom[selected="true"] {
.tab-bottom[visuallyselected="true"] {
margin-bottom: 0;
-moz-border-top-colors: -moz-Dialog;
padding: 4px 6px 1px 6px;
}
.tab-bottom[beforeselected="true"]:-moz-locale-dir(ltr),
.tab-bottom[selected="true"]:-moz-locale-dir(rtl) + .tab-bottom {
.tab-bottom[visuallyselected="true"]:-moz-locale-dir(rtl) + .tab-bottom {
border-bottom-right-radius: 0;
}
.tab-bottom[selected="true"]:-moz-locale-dir(ltr) + .tab-bottom,
.tab-bottom[visuallyselected="true"]:-moz-locale-dir(ltr) + .tab-bottom,
.tab-bottom[beforeselected="true"]:-moz-locale-dir(rtl) {
border-bottom-left-radius: 0;
}

1
widget/cocoa/nsNativeThemeCocoa.mm
Просмотреть файл

@ -3527,6 +3527,7 @@ nsNativeThemeCocoa::WidgetStateChanged(nsIFrame* aFrame, uint8_t aWidgetType,
if (aAttribute == nsGkAtoms::disabled ||
aAttribute == nsGkAtoms::checked ||
aAttribute == nsGkAtoms::selected ||
aAttribute == nsGkAtoms::visuallyselected ||
aAttribute == nsGkAtoms::menuactive ||
aAttribute == nsGkAtoms::sortDirection ||
aAttribute == nsGkAtoms::focused ||

1
widget/gtk/nsNativeThemeGTK.cpp
Просмотреть файл

@ -1354,6 +1354,7 @@ nsNativeThemeGTK::WidgetStateChanged(nsIFrame* aFrame, uint8_t aWidgetType,
if (aAttribute == nsGkAtoms::disabled ||
aAttribute == nsGkAtoms::checked ||
aAttribute == nsGkAtoms::selected ||
aAttribute == nsGkAtoms::visuallyselected ||
aAttribute == nsGkAtoms::focused ||
aAttribute == nsGkAtoms::readonly ||
aAttribute == nsGkAtoms::_default ||

2
widget/nsNativeTheme.h
Просмотреть файл

@ -90,7 +90,7 @@ class nsNativeTheme : public nsITimerCallback
// tab:
bool IsSelectedTab(nsIFrame* aFrame) {
return CheckBooleanAttr(aFrame, nsGkAtoms::selected);
return CheckBooleanAttr(aFrame, nsGkAtoms::visuallyselected);
}
bool IsNextToSelectedTab(nsIFrame* aFrame, int32_t aOffset);

1
widget/windows/nsNativeThemeWin.cpp
Просмотреть файл

@ -2573,6 +2573,7 @@ nsNativeThemeWin::WidgetStateChanged(nsIFrame* aFrame, uint8_t aWidgetType,
if (aAttribute == nsGkAtoms::disabled ||
aAttribute == nsGkAtoms::checked ||
aAttribute == nsGkAtoms::selected ||
aAttribute == nsGkAtoms::visuallyselected ||
aAttribute == nsGkAtoms::readonly ||
aAttribute == nsGkAtoms::open ||
aAttribute == nsGkAtoms::menuactive ||