Added glance overlay and functionality

This commit is contained in:
mr. M
2024-10-28 15:25:57 +01:00
parent 6e5d117720
commit 441379b6e8
9 changed files with 52 additions and 10 deletions

View File

@@ -1,8 +1,8 @@
diff --git a/browser/base/content/browser-box.inc.xhtml b/browser/base/content/browser-box.inc.xhtml
index 108160d9469d44f47c93a3808402e4b27ff59777..39a7b691302bf13e1b5990f46428cff6807a8e56 100644
index 108160d9469d44f47c93a3808402e4b27ff59777..7f81b4833bac6b2dac58cb22b0ee71a5a55e8381 100644
--- a/browser/base/content/browser-box.inc.xhtml
+++ b/browser/base/content/browser-box.inc.xhtml
@@ -23,11 +23,16 @@
@@ -23,11 +23,15 @@
</vbox>
<splitter id="sidebar-splitter" class="chromeclass-extrachrome sidebar-splitter" resizebefore="sibling" resizeafter="none" hidden="true"/>
<vbox id="appcontent" flex="1">
@@ -11,8 +11,7 @@ index 108160d9469d44f47c93a3808402e4b27ff59777..39a7b691302bf13e1b5990f46428cff6
+ <hbox id="zen-tabbox-wrapper" flex="1">
<tabbox id="tabbrowser-tabbox"
flex="1" tabcontainer="tabbrowser-tabs">
+#include zen-sidebar-panel.inc.xhtml
+#include zen-splitview-overlay.inc.xhtml
+#include zen-tabbrowser-elements.inc.xhtml
<tabpanels id="tabbrowser-tabpanels"
flex="1" selectedIndex="0"/>
</tabbox>

View File

@@ -1,5 +1,5 @@
diff --git a/browser/base/content/browser.js b/browser/base/content/browser.js
index a29d7a84e84651ea0bdc9be8e4ac650bde2e048a..bc22e55a66686fbae95047686f845f71a0c3aae9 100644
index ccd83c15d0d73a1e53bdbfdfbe6fed43a26c961d..f18a6abf7debb97539a4cdf8422315b4dff08adb 100644
--- a/browser/base/content/browser.js
+++ b/browser/base/content/browser.js
@@ -32,6 +32,7 @@ ChromeUtils.defineESModuleGetters(this, {
@@ -10,7 +10,7 @@ index a29d7a84e84651ea0bdc9be8e4ac650bde2e048a..bc22e55a66686fbae95047686f845f71
DevToolsSocketStatus:
"resource://devtools/shared/security/DevToolsSocketStatus.sys.mjs",
DownloadUtils: "resource://gre/modules/DownloadUtils.sys.mjs",
@@ -629,6 +630,15 @@ XPCOMUtils.defineLazyPreferenceGetter(
@@ -632,6 +633,15 @@ XPCOMUtils.defineLazyPreferenceGetter(
false
);
@@ -26,18 +26,19 @@ index a29d7a84e84651ea0bdc9be8e4ac650bde2e048a..bc22e55a66686fbae95047686f845f71
customElements.setElementCreationCallback("screenshots-buttons", () => {
Services.scriptloader.loadSubScript(
"chrome://browser/content/screenshots/screenshots-buttons.js",
@@ -3435,6 +3445,10 @@ var XULBrowserWindow = {
@@ -3438,6 +3448,11 @@ var XULBrowserWindow = {
AboutReaderParent.updateReaderButton(gBrowser.selectedBrowser);
TranslationsParent.onLocationChange(gBrowser.selectedBrowser);
+ gZenViewSplitter.onLocationChange(gBrowser.selectedBrowser);
+ ZenWorkspaces.onLocationChange(gBrowser.selectedBrowser);
+ gZenTabUnloader.onLocationChange(gBrowser.selectedBrowser);
+ gZenGlanceManager.onLocationChange(gBrowser.selectedBrowser);
+
PictureInPicture.updateUrlbarToggle(gBrowser.selectedBrowser);
if (!gMultiProcessBrowser) {
@@ -4769,7 +4783,7 @@ function setToolbarVisibility(
@@ -4608,7 +4623,7 @@ function setToolbarVisibility(
);
}
@@ -46,7 +47,7 @@ index a29d7a84e84651ea0bdc9be8e4ac650bde2e048a..bc22e55a66686fbae95047686f845f71
switch (isVisible) {
case true:
case "always":
@@ -7609,6 +7623,12 @@ var gDialogBox = {
@@ -7289,6 +7304,12 @@ var gDialogBox = {
parentElement.showModal();
this._didOpenHTMLDialog = true;

View File

@@ -16,6 +16,7 @@
<link rel="stylesheet" type="text/css" href="chrome://browser/content/zen-styles/zen-urlbar.css" />
<link rel="stylesheet" type="text/css" href="chrome://browser/content/zen-styles/zen-workspaces.css" />
<link rel="stylesheet" type="text/css" href="chrome://browser/content/zen-styles/zen-decks.css" />
<link rel="stylesheet" type="text/css" href="chrome://browser/content/zen-styles/zen-glance.css" />
<link rel="stylesheet" type="text/css" href="chrome://browser/content/zen-styles/zen-profile-dialog.css" />
<link rel="stylesheet" type="text/css" href="chrome://browser/content/zen-styles/zen-sidebar-panels.css" />
<link rel="stylesheet" type="text/css" href="chrome://browser/content/zen-styles/zen-popup.css" />

View File

@@ -34,6 +34,7 @@
content/browser/zen-styles/zen-sidebar.css (content/zen-styles/zen-sidebar.css)
content/browser/zen-styles/zen-toolbar.css (content/zen-styles/zen-toolbar.css)
content/browser/zen-styles/zen-decks.css (content/zen-styles/zen-decks.css)
content/browser/zen-styles/zen-glance.css (content/zen-styles/zen-glance.css)
content/browser/zen-styles/zen-browser-container.css (content/zen-styles/zen-browser-container.css)
content/browser/zen-styles/zen-workspaces.css (content/zen-styles/zen-workspaces.css)
content/browser/zen-styles/zen-profile-dialog.css (content/zen-styles/zen-profile-dialog.css)

View File

@@ -0,0 +1,6 @@
<hbox id="zen-glance-overlay" hidden="true" onclick="gZenGlanceManager.closeGlance()">
<hbox id="zen-glance-content">
<vbox id="zen-glance-browser-container"></vbox>
<vbox id="zen-glance-sidebar-container"></vbox>
</hbox>
</hbox>

View File

@@ -213,3 +213,16 @@
right: -2px;
}
}
/* Mark: Zen Glance */
@keyframes zen-glance-overlay-animation {
from {
opacity: 0;
transform: scale(0.8);
}
to {
opacity: 1;
transform: scale(1);
}
}

View File

@@ -0,0 +1,18 @@
#zen-glance-overlay {
width: 100%;
height: 100%;
display: flex;
position: absolute;
top: 0;
left: 0;
z-index: 3;
background: color-mix(in srgb, var(--zen-colors-tertiary) 20%, transparent 80%);
backdrop-filter: blur(3px);
animation: zen-glance-overlay-animation 0.2s ease-in-out forwards;
border-radius: var(--zen-border-radius);
&[hidden='true'] {
display: none;
}
}

View File

@@ -0,0 +1,3 @@
#include zen-sidebar-panel.inc.xhtml
#include zen-splitview-overlay.inc.xhtml
#include zen-glance.inc.xhtml