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

Bug 1492582 - Use html root element in browser.xhtml and update styling to support html roots r=Gijs 

Differential Revision: https://phabricator.services.mozilla.com/D33558

--HG--
extra : moz-landing-system : lando
This commit is contained in:
Brendan Dahl 2019-11-08 23:33:43 +00:00
Родитель 7e0408d34c
Коммит 2e2ca37f8d
9 изменённых файлов: 75 добавлений и 44 удалений
Показать статистику Скачать Patch файл Скачать Diff файл Показать все файлы Свернуть все файлы

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

@ -4,7 +4,21 @@
@namespace html url("http://www.w3.org/1999/xhtml"); @namespace html url("http://www.w3.org/1999/xhtml");
:root,
body {
margin: 0;
padding: 0;
height: 100%;
width: 100%;
overflow: -moz-hidden-unscrollable;
}
:root { :root {
text-rendering: optimizeLegibility;
min-height: 95px;
min-width: 95px;
/* variables */
--panelui-subview-transition-duration: 150ms; --panelui-subview-transition-duration: 150ms;
--lwt-additional-images: none; --lwt-additional-images: none;
--lwt-background-alignment: right top; --lwt-background-alignment: right top;
@ -15,6 +29,10 @@
--toolbar-color: var(--toolbar-non-lwt-textcolor); --toolbar-color: var(--toolbar-non-lwt-textcolor);
} }
:root:-moz-locale-dir(rtl) {
direction: rtl;
}
:root:-moz-lwtheme { :root:-moz-lwtheme {
--toolbar-bgcolor: rgba(255,255,255,.4); --toolbar-bgcolor: rgba(255,255,255,.4);
--toolbar-bgimage: none; --toolbar-bgimage: none;
@ -34,6 +52,12 @@
background-color: var(--lwt-accent-color-inactive, var(--lwt-accent-color)); background-color: var(--lwt-accent-color-inactive, var(--lwt-accent-color));
} }
body {
display: -moz-box;
-moz-box-orient: vertical;
-moz-box-flex: 1;
}
/* Set additional backgrounds alignment relative to toolbox */ /* Set additional backgrounds alignment relative to toolbox */
#navigator-toolbox:-moz-lwtheme { #navigator-toolbox:-moz-lwtheme {
@ -117,7 +141,6 @@ panelview[mainview] > .panel-header {
.panel-viewcontainer.offscreen { .panel-viewcontainer.offscreen {
display: block; display: block;
position: absolute;
} }
.panel-viewstack { .panel-viewstack {
@ -258,7 +281,7 @@ toolbar[customizing] #whats-new-menu-button {
display: none; display: none;
} }
window:not([chromehidden~="toolbar"]) #nav-bar[nonemptyoverflow] > .overflow-button, :root:not([chromehidden~="toolbar"]) #nav-bar[nonemptyoverflow] > .overflow-button,
#nav-bar[customizing] > .overflow-button { #nav-bar[customizing] > .overflow-button {
display: -moz-box; display: -moz-box;
} }
@ -818,8 +841,7 @@ menupopup[emptyplacesresult="true"] > .hide-if-empty-places-result {
} }
/* Hide extension toolbars that neglected to set the proper class */ /* Hide extension toolbars that neglected to set the proper class */
window[chromehidden~="location"][chromehidden~="toolbar"] toolbar:not(.chromeclass-menubar), :root[chromehidden~="location"][chromehidden~="toolbar"] toolbar:not(.chromeclass-menubar) {
window[chromehidden~="toolbar"] toolbar:not(#nav-bar):not(#TabsToolbar):not(#print-preview-toolbar):not(.chromeclass-menubar) {
display: none; display: none;
} }

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

@ -36,12 +36,12 @@
#include browser-doctype.inc #include browser-doctype.inc
]> ]>
<window id="main-window" <html id="main-window"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg"
xmlns:html="http://www.w3.org/1999/xhtml" xmlns:html="http://www.w3.org/1999/xhtml"
xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" xmlns="http://www.w3.org/1999/xhtml"
title="&mainWindow.title;" title="&mainWindow.title;"
title_normal="&mainWindow.title;" title_normal="&mainWindow.title;"
#ifdef XP_MACOSX #ifdef XP_MACOSX
@ -71,15 +71,13 @@
retargetdocumentfocus="urlbar-input" retargetdocumentfocus="urlbar-input"
persist="screenX screenY width height sizemode" persist="screenX screenY width height sizemode"
data-l10n-sync="true"> data-l10n-sync="true">
<head>
<linkset> <link rel="localization" href="branding/brand.ftl"/>
<html:link rel="localization" href="branding/brand.ftl"/> <link rel="localization" href="browser/branding/sync-brand.ftl"/>
<html:link rel="localization" href="browser/branding/sync-brand.ftl"/> <link rel="localization" href="browser/browser.ftl"/>
<html:link rel="localization" href="browser/browser.ftl"/> <link rel="localization" href="browser/menubar.ftl"/>
<html:link rel="localization" href="browser/menubar.ftl"/> <link rel="localization" href="browser/protectionsPanel.ftl"/>
<html:link rel="localization" href="browser/protectionsPanel.ftl"/> <link rel="localization" href="browser/appmenu.ftl"/>
<html:link rel="localization" href="browser/appmenu.ftl"/>
</linkset>
# All JS files which are needed by browser.xhtml and other top level windows to # All JS files which are needed by browser.xhtml and other top level windows to
# support MacOS specific features *must* go into the global-scripts.inc file so # support MacOS specific features *must* go into the global-scripts.inc file so
@ -121,12 +119,12 @@
window.addEventListener("DOMContentLoaded", window.addEventListener("DOMContentLoaded",
gBrowserInit.onDOMContentLoaded.bind(gBrowserInit), { once: true }); gBrowserInit.onDOMContentLoaded.bind(gBrowserInit), { once: true });
</script> </script>
</head>
<html:body xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
# All sets except for popupsets (commands, keys, and stringbundles) # All sets except for popupsets (commands, keys, and stringbundles)
# *must* go into the browser-sets.inc file so that they can be shared with other # *must* go into the browser-sets.inc file so that they can be shared with other
# top level windows in macWindow.inc.xul. # top level windows in macWindow.inc.xul.
#include browser-sets.inc #include browser-sets.inc
<popupset id="mainPopupSet"> <popupset id="mainPopupSet">
<menupopup id="tabContextMenu" <menupopup id="tabContextMenu"
onpopupshowing="if (event.target == this) TabContextMenu.updateContextMenu(this);" onpopupshowing="if (event.target == this) TabContextMenu.updateContextMenu(this);"
@ -686,7 +684,10 @@
</popupset> </popupset>
<box id="appMenu-viewCache" hidden="true"/> <box id="appMenu-viewCache" hidden="true"/>
<toolbox id="navigator-toolbox"> <!-- Temporary wrapper until we move away from XUL flex to fix fullscreen
layout-->
<box>
<toolbox id="navigator-toolbox" flex="1">
<vbox id="titlebar"> <vbox id="titlebar">
<!-- Menu --> <!-- Menu -->
@ -1367,6 +1368,7 @@
</toolbaritem> </toolbaritem>
</toolbarpalette> </toolbarpalette>
</toolbox> </toolbox>
</box>
<hbox id="fullscr-toggler" hidden="true"/> <hbox id="fullscr-toggler" hidden="true"/>
@ -1417,4 +1419,5 @@
</vbox> </vbox>
<html:div id="a11y-announcement" role="alert"/> <html:div id="a11y-announcement" role="alert"/>
</window> </html:body>
</html>

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

@ -481,13 +481,13 @@ notification[value="translation"] menulist > .menulist-dropmarker {
} }
} }
:root[tabsintitlebar] > #navigator-toolbox > #titlebar { :root[tabsintitlebar] #navigator-toolbox > #titlebar {
-moz-appearance: -moz-window-titlebar-maximized; -moz-appearance: -moz-window-titlebar-maximized;
} }
:root[tabsintitlebar][sizemode="normal"]:not([gtktiledwindow="true"]) > #navigator-toolbox > #titlebar { :root[tabsintitlebar][sizemode="normal"]:not([gtktiledwindow="true"]) #navigator-toolbox > #titlebar {
-moz-appearance: -moz-window-titlebar; -moz-appearance: -moz-window-titlebar;
} }
:root[tabsintitlebar]:not([inDOMFullscreen]) > #navigator-toolbox > #titlebar:-moz-lwtheme { :root[tabsintitlebar]:not([inDOMFullscreen]) #navigator-toolbox > #titlebar:-moz-lwtheme {
visibility: hidden; visibility: hidden;
} }
:root[tabsintitlebar]:not([inDOMFullscreen]) #toolbar-menubar:-moz-lwtheme, :root[tabsintitlebar]:not([inDOMFullscreen]) #toolbar-menubar:-moz-lwtheme,

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

@ -9,8 +9,8 @@
@media (-moz-os-version: windows-win7), @media (-moz-os-version: windows-win7),
(-moz-os-version: windows-win8) { (-moz-os-version: windows-win8) {
@media (-moz-windows-classic: 0) { @media (-moz-windows-classic: 0) {
#main-window[sizemode="normal"] > #navigator-toolbox > #titlebar > #toolbar-menubar:not([autohide="true"]) > #menubar-items, #main-window[sizemode="normal"] #navigator-toolbox > #titlebar > #toolbar-menubar:not([autohide="true"]) > #menubar-items,
#main-window[sizemode="normal"] > #navigator-toolbox > #titlebar > #toolbar-menubar[autohide="true"][inactive] + #TabsToolbar > .toolbar-items { #main-window[sizemode="normal"] #navigator-toolbox > #titlebar > #toolbar-menubar[autohide="true"][inactive] + #TabsToolbar > .toolbar-items {
margin-top: 1px; margin-top: 1px;
} }
/** /**
@ -288,7 +288,7 @@
@media (-moz-os-version: windows-win8) { @media (-moz-os-version: windows-win8) {
/* Artificially draw window borders that are covered by lwtheme, see bug 591930. /* Artificially draw window borders that are covered by lwtheme, see bug 591930.
* Borders for win7 are below, win10 doesn't need them. */ * Borders for win7 are below, win10 doesn't need them. */
#main-window[sizemode="normal"] > #navigator-toolbox:-moz-lwtheme { #main-window[sizemode="normal"] #navigator-toolbox:-moz-lwtheme {
border-top: 1px solid @glassShadowColor@; border-top: 1px solid @glassShadowColor@;
} }
} }
@ -362,13 +362,13 @@
/* Artificially draw window borders that are covered by lwtheme, see bug 591930. /* Artificially draw window borders that are covered by lwtheme, see bug 591930.
* We use a different border for win8, and this is not necessary on win10+ */ * We use a different border for win8, and this is not necessary on win10+ */
#main-window[sizemode="normal"] > #navigator-toolbox:-moz-lwtheme { #main-window[sizemode="normal"] #navigator-toolbox:-moz-lwtheme {
border-top: 1px solid @glassActiveBorderColor@; border-top: 1px solid @glassActiveBorderColor@;
padding-top: 1px; padding-top: 1px;
box-shadow: 0 1px 0 rgba(255,255,255,.6) inset; box-shadow: 0 1px 0 rgba(255,255,255,.6) inset;
} }
#main-window[sizemode="normal"] > #navigator-toolbox:-moz-lwtheme:-moz-window-inactive { #main-window[sizemode="normal"] #navigator-toolbox:-moz-lwtheme:-moz-window-inactive {
border-top-color: @glassInactiveBorderColor@; border-top-color: @glassInactiveBorderColor@;
} }
} }
@ -384,13 +384,13 @@
} }
/* Render a window top border for lwthemes: */ /* Render a window top border for lwthemes: */
#main-window[tabsintitlebar][sizemode="normal"] > #navigator-toolbox:-moz-lwtheme { #main-window[tabsintitlebar][sizemode="normal"] #navigator-toolbox:-moz-lwtheme {
background-image: linear-gradient(to bottom, background-image: linear-gradient(to bottom,
@glassActiveBorderColor@ 0, @glassActiveBorderColor@ 1px, @glassActiveBorderColor@ 0, @glassActiveBorderColor@ 1px,
rgba(255,255,255,.6) 1px, rgba(255,255,255,.6) 2px, transparent 2px); rgba(255,255,255,.6) 1px, rgba(255,255,255,.6) 2px, transparent 2px);
} }
#main-window[tabsintitlebar][sizemode="normal"] > #navigator-toolbox:-moz-lwtheme:-moz-window-inactive { #main-window[tabsintitlebar][sizemode="normal"] #navigator-toolbox:-moz-lwtheme:-moz-window-inactive {
background-image: linear-gradient(to bottom, background-image: linear-gradient(to bottom,
@glassInactiveBorderColor@ 0, @glassInactiveBorderColor@ 1px, @glassInactiveBorderColor@ 0, @glassInactiveBorderColor@ 1px,
rgba(255,255,255,.6) 1px, rgba(255,255,255,.6) 2px, transparent 2px); rgba(255,255,255,.6) 1px, rgba(255,255,255,.6) 2px, transparent 2px);

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

@ -216,7 +216,7 @@
} }
/* Add a window top border for webextension themes */ /* Add a window top border for webextension themes */
:root[tabsintitlebar][sizemode="normal"] > #navigator-toolbox:-moz-lwtheme { :root[tabsintitlebar][sizemode="normal"] #navigator-toolbox:-moz-lwtheme {
background-image: linear-gradient(to bottom, background-image: linear-gradient(to bottom,
ThreeDLightShadow 0, ThreeDLightShadow 1px, ThreeDLightShadow 0, ThreeDLightShadow 1px,
ThreeDHighlight 1px, ThreeDHighlight 2px, ThreeDHighlight 1px, ThreeDHighlight 2px,
@ -252,11 +252,11 @@
/* ::::: titlebar ::::: */ /* ::::: titlebar ::::: */
#main-window[tabsintitlebar][sizemode="normal"] > #navigator-toolbox > #titlebar { #main-window[tabsintitlebar][sizemode="normal"] #navigator-toolbox > #titlebar {
-moz-appearance: -moz-window-titlebar; -moz-appearance: -moz-window-titlebar;
} }
#main-window[tabsintitlebar][sizemode="maximized"] > #navigator-toolbox > #titlebar { #main-window[tabsintitlebar][sizemode="maximized"] #navigator-toolbox > #titlebar {
-moz-appearance: -moz-window-titlebar-maximized; -moz-appearance: -moz-window-titlebar-maximized;
} }
@ -278,7 +278,7 @@
} }
@media (-moz-windows-classic) { @media (-moz-windows-classic) {
#main-window[tabsintitlebar][sizemode="normal"] > #navigator-toolbox > #titlebar > #toolbar-menubar { #main-window[tabsintitlebar][sizemode="normal"] #navigator-toolbox > #titlebar > #toolbar-menubar {
margin-top: 4px; margin-top: 4px;
} }
} }

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

@ -10,7 +10,7 @@
broken. So instead just show the normal titlebar in that case, and override broken. So instead just show the normal titlebar in that case, and override
the window color as transparent when the compositor is available. */ the window color as transparent when the compositor is available. */
@media (-moz-windows-compositor: 0) { @media (-moz-windows-compositor: 0) {
:root[tabsintitlebar]:not([inDOMFullscreen]) > #navigator-toolbox > #titlebar:-moz-lwtheme { :root[tabsintitlebar]:not([inDOMFullscreen]) #navigator-toolbox > #titlebar:-moz-lwtheme {
visibility: visible; visibility: visible;
} }

2
devtools/server/tests/mochitest/test_styles-applied.html
Просмотреть файл

@ -82,7 +82,7 @@ addTest(function inheritedSystemStyles() {
ok(!applied[1].rule.parentStyleSheet.system, "Entry 1 should be a system style"); ok(!applied[1].rule.parentStyleSheet.system, "Entry 1 should be a system style");
is(applied[1].rule.type, 1, "Entry 1 should be a rule style"); is(applied[1].rule.type, 1, "Entry 1 should be a rule style");
is(applied.length, 12, "Should have 12 rules."); is(applied.length, 13, "Should have 13 rules.");
}).then(runNextTest)); }).then(runNextTest));
}); });

22
toolkit/content/xul.css
Просмотреть файл

@ -24,10 +24,16 @@
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* set default namespace to XUL */ @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* set default namespace to XUL */
@namespace html url("http://www.w3.org/1999/xhtml"); /* namespace for HTML elements */ @namespace html url("http://www.w3.org/1999/xhtml"); /* namespace for HTML elements */
/* TODO: investigate unifying these two root selectors
* https://bugzilla.mozilla.org/show_bug.cgi?id=1592344
*/
*|*:root {
--animation-easing-function: cubic-bezier(.07, .95, 0, 1);
}
:root { :root {
text-rendering: optimizeLegibility; text-rendering: optimizeLegibility;
-moz-control-character-visibility: visible; -moz-control-character-visibility: visible;
--animation-easing-function: cubic-bezier(.07, .95, 0, 1);
} }
:root:-moz-locale-dir(rtl) { :root:-moz-locale-dir(rtl) {
@ -39,13 +45,13 @@
:: kinds of windows (not JUST browser windows) with toolbars :: kinds of windows (not JUST browser windows) with toolbars
::::: */ ::::: */
window[chromehidden~="menubar"] .chromeclass-menubar, *|*:root[chromehidden~="menubar"] .chromeclass-menubar,
window[chromehidden~="directories"] .chromeclass-directories, *|*:root[chromehidden~="directories"] .chromeclass-directories,
window[chromehidden~="status"] .chromeclass-status, *|*:root[chromehidden~="status"] .chromeclass-status,
window[chromehidden~="extrachrome"] .chromeclass-extrachrome, *|*:root[chromehidden~="extrachrome"] .chromeclass-extrachrome,
window[chromehidden~="location"] .chromeclass-location, *|*:root[chromehidden~="location"] .chromeclass-location,
window[chromehidden~="location"][chromehidden~="toolbar"] .chromeclass-toolbar, *|*:root[chromehidden~="location"][chromehidden~="toolbar"] .chromeclass-toolbar,
window[chromehidden~="toolbar"] .chromeclass-toolbar-additional { *|*:root[chromehidden~="toolbar"] .chromeclass-toolbar-additional {
display: none; display: none;
} }

2
toolkit/themes/shared/findBar.inc.css
Просмотреть файл

@ -41,7 +41,7 @@ findbar[noanim] {
/* Don't apply theme colors on findbar when header image is applied to avoid /* Don't apply theme colors on findbar when header image is applied to avoid
contrast issues, see bug 1506913 */ contrast issues, see bug 1506913 */
:root[lwtheme-image] findbar { html|html[lwtheme-image] findbar {
--lwt-toolbar-field-background-color: initial; --lwt-toolbar-field-background-color: initial;
--lwt-toolbar-field-color: initial; --lwt-toolbar-field-color: initial;
--lwt-toolbar-field-border-color: initial; --lwt-toolbar-field-border-color: initial;