forked from mirrors/gecko-dev
Bug 1587521 - Enable FullScreen in FxR for Desktop This change enables Fullscreen functionality in the UI for Firefox Reality for Desktop. On Fullscreen, the window (rather than the desktop) is taken over, and it is up to the host to render the contents as fullscreen. To mitigate the impact on Desktop's implementation, browser-fullScreenAndPointerLock.js is forked and removes the dependencies on browser.js. These two files will be rationalized at a later time. Differential Revision: https://phabricator.services.mozilla.com/D48913 --HG-- rename : browser/base/content/browser-fullScreenAndPointerLock.js => browser/fxr/content/fxr-fullScreen.js extra : moz-landing-system : lando
132 lines
2.3 KiB
CSS
132 lines
2.3 KiB
CSS
/* This Source Code Form is subject to the terms of the Mozilla Public
|
|
* License, v. 2.0. If a copy of the MPL was not distributed with this
|
|
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
|
|
|
|
@namespace xul url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
|
|
|
|
html, body {
|
|
height: 100%;
|
|
}
|
|
|
|
|
|
body {
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.navbar_container {
|
|
width: 100%;
|
|
|
|
margin-top: 20px;
|
|
|
|
display: flex;
|
|
flex-direction: row;
|
|
}
|
|
|
|
/* Sizing and positioning properties for all icons
|
|
Color is determined by enabled/disabled classes below
|
|
*/
|
|
.icon_container {
|
|
width: 44px;
|
|
height: 44px;
|
|
margin-inline-end: 10px;
|
|
|
|
border-radius: 22px;
|
|
border-width: 2px;
|
|
border-style: solid;
|
|
|
|
background-size: 22px;
|
|
background-repeat: no-repeat;
|
|
background-position: center;
|
|
background-color: inherit;
|
|
|
|
-moz-context-properties: fill;
|
|
}
|
|
|
|
.icon_disabled_hide:disabled {
|
|
display:none;
|
|
}
|
|
.icon_backward {
|
|
background-image: url("assets/icon-backward.svg");
|
|
}
|
|
.icon_forward {
|
|
background-image: url("assets/icon-forward.svg");
|
|
}
|
|
.icon_refresh {
|
|
background-image: url("assets/icon-refresh.svg");
|
|
}
|
|
.icon_stop {
|
|
background-image: url("assets/icon-stop-reload.svg");
|
|
}
|
|
.icon_home {
|
|
background-image: url("assets/icon-home.svg");
|
|
}
|
|
.icon_prefs {
|
|
background-image: url("assets/icon-settings.svg");
|
|
}
|
|
|
|
.urlbar_container {
|
|
height: 40px;
|
|
flex-grow: 1;
|
|
|
|
padding: 0;
|
|
|
|
border-radius: 22px;
|
|
border: 2px solid transparent;
|
|
|
|
vertical-align: top;
|
|
|
|
display: flex;
|
|
flex-direction: row;
|
|
}
|
|
|
|
.urlbar_secure_icon {
|
|
-moz-context-properties: fill;
|
|
|
|
height: 32px;
|
|
padding: 2px;
|
|
|
|
visibility: hidden;
|
|
|
|
display: inline-block;
|
|
}
|
|
|
|
.urlbar_input {
|
|
background-color: transparent;
|
|
|
|
flex-grow: 1;
|
|
|
|
border: none;
|
|
|
|
font-size: 18px;
|
|
font-family: 'Open Sans', sans-serif;
|
|
|
|
mask-image: linear-gradient(to left, transparent, black 8ch);
|
|
}
|
|
|
|
.browser_container {
|
|
width: 100%;
|
|
flex-grow: 1;
|
|
}
|
|
|
|
.browser_instance {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
/* Hide the navbar when in fullscreen so that <browser> can
|
|
* fill the entire viewport
|
|
*/
|
|
:root[inFullScreen] .navbar_container {
|
|
display:none;
|
|
}
|
|
|
|
.browser_settings {
|
|
width: 600px;
|
|
height: 400px;
|
|
border-radius: 20px;
|
|
}
|
|
|
|
.modal_mask:not([hidden]) {
|
|
background-color: var(--num13_alpha);
|
|
}
|