mirrors/desktop
1
0
Fork 0
mirror of https://github.com/zen-browser/desktop.git synced 2025-10-16 23:06:30 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'dev' into glance-buttons-overflow

Browse Source
This commit is contained in:
Vrezh Fedora
2025-03-14 22:22:20 +09:00
parent 02a860ba19 2e1354cdb9
commit d808e72d2a
212 changed files with 2915 additions and 4476 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
.github/workflows/build.yml vendored
View File

@@ -384,6 +384,8 @@ jobs:
- name: Execute AppImage build
run: |
set -eux
export ARCH=${{ matrix.arch }}
UPINFO="gh-releases-zsync|$GITHUB_REPOSITORY_OWNER|desktop|latest|zen-$ARCH.AppImage.zsync"
rm AppDir/.DirIcon || true
cp configs/branding/${{ inputs.update_branch }}/logo128.png AppDir/usr/share/icons/hicolor/128x128/apps/zen.png
cp configs/branding/${{ inputs.update_branch }}/logo128.png AppDir/zen.png && ln -s zen.png AppDir/.DirIcon
@@ -396,18 +398,23 @@ jobs:
APPDIR=AppDir
tar -xvf *.tar.* && rm -rf *.tar.*
mv zen/* $APPDIR/
wget https://github.com/AppImage/appimagetool/releases/download/continuous/appimagetool-x86_64.AppImage
wget "https://github.com/AppImage/appimagetool/releases/download/continuous/appimagetool-x86_64.AppImage"
wget "https://github.com/VHSgunzo/uruntime/releases/latest/download/uruntime-appimage-squashfs-lite-$ARCH"
chmod +x *.AppImage
chmod +x ./uruntime-appimage-squashfs-lite-"$ARCH"
chmod +x ./AppDir/AppRun
# keep the uruntime mountpoint (massively speeds up launch time)
sed -i 's|URUNTIME_MOUNT=[0-9]|URUNTIME_MOUNT=0|' ./uruntime-appimage-squashfs-lite-"$ARCH"
echo "AppDir: $APPDIR"
ls -al
find .
ls -al "$APPDIR"
ARCH=${{ matrix.arch }} ./appimagetool-x86_64.AppImage --comp zstd --mksquashfs-opt -Xcompression-level --mksquashfs-opt 10 \
-u "gh-releases-zsync|$GITHUB_REPOSITORY_OWNER|desktop|latest|zen-${{ matrix.arch }}.AppImage.zsync" \
"$APPDIR" zen-${{ matrix.arch }}.AppImage
./appimagetool-x86_64.AppImage -u "$UPINFO" "$APPDIR" zen-"$ARCH".AppImage --runtime-file ./uruntime-appimage-squashfs-lite-"$ARCH"
mkdir dist
mv zen*AppImage* dist/.
unset ARCH
- name: Upload artifact
uses: actions/upload-artifact@v4
@@ -464,10 +471,6 @@ jobs:
submodules: recursive
token: ${{ secrets.DEPLOY_KEY }}
- name: Git pull
run: |
git pull
- name: Download artifact
uses: actions/download-artifact@v4
@@ -513,11 +516,15 @@ jobs:
commit_user_email: zen-browser-auto@users.noreply.github.com
repository: ./updates-server
- name: Generate Release Notes
run: bash .github/workflows/src/generate_release_notes.sh
# If we are on Twilight, we want to just update the Twilight tag's release
- name: Update Twilight tag
if: ${{ inputs.update_branch == 'twilight' }}
uses: softprops/action-gh-release@v2
with:
body_path: release_notes.md
files: |
./zen.source.tar.zst/*
./zen.linux-x86_64.tar.xz/*
@@ -556,6 +563,7 @@ jobs:
fail_on_unmatched_files: false
generate_release_notes: false
name: 'Release build - ${{ needs.build-data.outputs.version }} (${{ needs.build-data.outputs.build_date }})'
body_path: release_notes.md
files: |
./zen.source.tar.zst/*
./zen.linux-x86_64.tar.xz/*

11
.github/workflows/linux-release-build.yml vendored
View File

@@ -39,6 +39,10 @@ jobs:
with:
tool-cache: false
# Bug: https://github.com/actions/checkout/issues/1153
- name: Remove zombie lock file
run: rm -f /home/ubuntu/actions-runner/_work/desktop/desktop/.git/modules/l10n/index.lock
- name: Checkout repository
uses: actions/checkout@v4
with:
@@ -55,6 +59,13 @@ jobs:
with:
disable_annotations: true
- name: Expose actions cache variables
uses: actions/github-script@v6
with:
script: |
core.exportVariable('ACTIONS_CACHE_URL', process.env['ACTIONS_CACHE_URL'])
core.exportVariable('ACTIONS_RUNTIME_TOKEN', process.env['ACTIONS_RUNTIME_TOKEN'])
- name: Setup Git
run: |
git config --global user.email "mauro-balades@users.noreply.github.com"

7
.github/workflows/macos-release-build.yml vendored
View File

@@ -47,6 +47,13 @@ jobs:
with:
disable_annotations: true
- name: Expose actions cache variables
uses: actions/github-script@v6
with:
script: |
core.exportVariable('ACTIONS_CACHE_URL', process.env['ACTIONS_CACHE_URL'])
core.exportVariable('ACTIONS_RUNTIME_TOKEN', process.env['ACTIONS_RUNTIME_TOKEN'])
- name: Setup Python
uses: actions/setup-python@v5
# note: This will use the version defined in '.python-version' by default

108
.github/workflows/src/generate_release_notes.sh vendored Normal file
View File

@@ -0,0 +1,108 @@
#!/usr/bin/env bash
RELEASE_NOTES_URL="https://raw.githubusercontent.com/zen-browser/www/refs/heads/main/src/release-notes/stable.json"
if [ "$RELEASE_BRANCH" = "release" ]; then
RELEASE_TYPE="Stable"
echo "Fetching release notes from GitHub..."
RELEASE_NOTES_JSON=$(curl -s "$RELEASE_NOTES_URL")
if [ -z "$RELEASE_NOTES_JSON" ]; then
echo "Error: Failed to fetch release notes from GitHub"
exit 1
fi
LATEST_RELEASE=$(echo "$RELEASE_NOTES_JSON" | jq -r 'last')
EXTRA_NOTES=$(echo "$LATEST_RELEASE" | jq -r '.extra // ""')
else
RELEASE_TYPE="Twilight"
fi
cat << EOF > "release_notes.md"
# Zen ${RELEASE_TYPE} Release
EOF
if [ "$RELEASE_BRANCH" = "release" ]; then
echo "${EXTRA_NOTES}" >> "release_notes.md"
if echo "$LATEST_RELEASE" | jq -e 'has("features")' > /dev/null; then
cat << EOF >> "release_notes.md"
## New Features
$(echo "$LATEST_RELEASE" | jq -r '.features[] | "- " + .')
EOF
fi
if echo "$LATEST_RELEASE" | jq -e 'has("fixes")' > /dev/null; then
cat << EOF >> "release_notes.md"
## Fixes
EOF
echo "$LATEST_RELEASE" | jq -r '.fixes[] | if type=="object" then "- " + .description + " ([#" + (.issue|tostring) + "](" + "https://github.com/zen-browser/desktop/issues/" + (.issue|tostring) + "))" else "- " + . end' >> "release_notes.md"
fi
if echo "$LATEST_RELEASE" | jq -e 'has("breakingChanges")' > /dev/null; then
cat << EOF >> "release_notes.md"
## Breaking Changes
EOF
echo "$LATEST_RELEASE" | jq -r '.breakingChanges[] | if type=="string" then "- " + . else "- " + .description + " [Learn more](" + .link + ")" end' >> "release_notes.md"
fi
if echo "$LATEST_RELEASE" | jq -e 'has("themeChanges")' > /dev/null; then
cat << EOF >> "release_notes.md"
## Theme Changes
$(echo "$LATEST_RELEASE" | jq -r '.themeChanges[] | "- " + .')
EOF
fi
fi
cat << EOF >> "release_notes.md"
<details>
<summary>File Checksums (SHA-256)</summary>
\`\`\`
EOF
generate_checksum() {
local file=$1
if [ -f "$file" ]; then
echo "Generating checksum for $file"
sha256sum "$file" | awk '{print $1 " " $2}' >> "release_notes.md"
else
echo "Warning: $file not found, skipping checksum"
fi
}
files=(
"./zen.source.tar.zst"
"./zen.linux-x86_64.tar.xz"
"./zen.linux-aarch64.tar.xz"
"./zen-x86_64.AppImage"
"./zen-x86_64.AppImage.zsync"
"./zen-aarch64.AppImage"
"./zen-aarch64.AppImage.zsync"
"./.github/workflows/object/windows-x64-signed-x86_64/zen.win-x86_64.zip"
"./.github/workflows/object/windows-x64-signed-arm64/zen.win-arm64.zip"
"./linux.mar"
"./linux-aarch64.mar"
"./.github/workflows/object/windows-x64-signed-x86_64/windows.mar"
"./.github/workflows/object/windows-x64-signed-arm64/windows-arm64.mar"
"./macos.mar"
"./.github/workflows/object/windows-x64-signed-x86_64/zen.installer.exe"
"./.github/workflows/object/windows-x64-signed-arm64/zen.installer-arm64.exe"
"./zen.macos-universal.dmg"
)
for file in "${files[@]}"; do
generate_checksum "$file"
done
cat << EOF >> "release_notes.md"
\`\`\`
</details>
EOF
echo "Release notes generated: release_notes.md"

11
.github/workflows/windows-release-build.yml vendored
View File

@@ -45,6 +45,10 @@ jobs:
with:
tool-cache: false
# Bug: https://github.com/actions/checkout/issues/1153
- name: Remove zombie lock file
run: rm -f /home/ubuntu/actions-runner/_work/desktop/desktop/.git/modules/l10n/index.lock
- name: Checkout repository
uses: actions/checkout@v4
with:
@@ -61,6 +65,13 @@ jobs:
with:
disable_annotations: true
- name: Expose actions cache variables
uses: actions/github-script@v6
with:
script: |
core.exportVariable('ACTIONS_CACHE_URL', process.env['ACTIONS_CACHE_URL'])
core.exportVariable('ACTIONS_RUNTIME_TOKEN', process.env['ACTIONS_RUNTIME_TOKEN'])
- name: Setup Git
run: |
git config --global user.email "mauro-balades@users.noreply.github.com"

16
AppDir/AppRun
View File

@@ -1,14 +1,6 @@
#!/bin/sh
SELF=$(readlink -f "$0")
HERE=${SELF%/*}
export PATH="${HERE}:${HERE}/usr/bin/:${HERE}/usr/sbin/:${HERE}/usr/games/:${HERE}/bin/:${HERE}/sbin/${PATH:+:$PATH}"
export LD_LIBRARY_PATH="${HERE}/usr/lib/:${HERE}/usr/lib/i386-linux-gnu/:${HERE}/usr/lib/x86_64-linux-gnu/:${HERE}/usr/lib32/:${HERE}/usr/lib64/:${HERE}/lib/:${HERE}/lib/i386-linux-gnu/:${HERE}/lib/x86_64-linux-gnu/:${HERE}/lib32/:${HERE}/lib64/${LD_LIBRARY_PATH:+:$LD_LIBRARY_PATH}"
export PYTHONPATH="${HERE}/usr/share/pyshared/${PYTHONPATH:+:$PYTHONPATH}"
CURRENTDIR="$(dirname "$(readlink -f "$0")")"
export PATH="${CURRENTDIR}:${PATH}"
export MOZ_LEGACY_PROFILES=1 # Prevent per installation profiles
DEFAULT_XDG_DATA_DIRS='./share/:/usr/share/gnome:/usr/local/share/:/usr/share/'
export XDG_DATA_DIRS="${HERE}/usr/share/:${XDG_DATA_DIRS:-$DEFAULT_XDG_DATA_DIRS}"
export PERLLIB="${HERE}/usr/share/perl5/:${HERE}/usr/lib/perl5/${PERLLIB:+:$PERLLIB}"
export GSETTINGS_SCHEMA_DIR="${HERE}/usr/share/glib-2.0/schemas/${GSETTINGS_SCHEMA_DIR:+:$GSETTINGS_SCHEMA_DIR}"
export QT_PLUGIN_PATH="${HERE}/usr/lib/qt4/plugins/:${HERE}/usr/lib/i386-linux-gnu/qt4/plugins/:${HERE}/usr/lib/x86_64-linux-gnu/qt4/plugins/:${HERE}/usr/lib32/qt4/plugins/:${HERE}/usr/lib64/qt4/plugins/:${HERE}/usr/lib/qt5/plugins/:${HERE}/usr/lib/i386-linux-gnu/qt5/plugins/:${HERE}/usr/lib/x86_64-linux-gnu/qt5/plugins/:${HERE}/usr/lib32/qt5/plugins/:${HERE}/usr/lib64/qt5/plugins/${QT_PLUGIN_PATH:+:$QT_PLUGIN_PATH}"
EXEC=$(grep -e '^Exec=.*' "${HERE}"/*.desktop | head -n 1 | cut -d "=" -f 2 | cut -d " " -f 1)
exec "${EXEC}" "$@"
export MOZ_APP_LAUNCHER="${APPIMAGE}" # Allows setting as default browser
exec "${CURRENTDIR}/zen" "$@"

4
README.md
View File

@@ -28,7 +28,7 @@
## 🖥️ Compatibility
Zen is currently built using Firefox version `135.0.1`! 🚀
Zen is currently built using Firefox version `136.0.1`! 🚀
- [`Zen Twilight`](https://zen-browser.app/download?twilight) - Is currently built using Firefox version `RC 136.0`!
- Check out the latest [release notes](https://zen-browser.app/release-notes)!
@@ -44,7 +44,7 @@ We keep track of how many issues are closed at the end of the month in [docs/iss
### Versioning
Zen uses [Semantic Versioning](https://semver.org/), meaning versions are displayed as `a.bc.d` where:
Zen uses [Semantic Versioning](https://semver.org/), meaning versions are displayed as `a.b.cd` where:
- `a` is the major version
- `b` is the minor version

1
configs/common/mozconfig
View File

@@ -59,7 +59,6 @@ if test "$ZEN_RELEASE"; then
ac_add_options --disable-rust-tests
ac_add_options --disable-default-browser-agent
# ac_add_options --enable-minify=js,properties
if ! test "$ZEN_DISABLE_LTO"; then
# only enable full LTO when ZEN_RELEASE_BRANCH is 'release'

1
firefox-cache/l10n-last-commit-hash
View File

@@ -0,0 +1 @@
6ad0ab3c43a6208d8bcd997b40e802fccd48ba0a

2
l10n

Submodule l10n updated: 92e05a383d...1db9cb464e

2256
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

4
package.json
View File

@@ -13,7 +13,7 @@
"export": "surfer export",
"init": "npm run download && npm run bootstrap && npm run import",
"download": "surfer download",
"bootstrap": "surfer bootstrap && surfer bootstrap",
"bootstrap": "surfer bootstrap",
"package": "surfer package",
"update-ff": "python3 scripts/update_ff.py",
"update-ff:raw": "surfer update",
@@ -41,7 +41,7 @@
},
"homepage": "https://github.com/zen-browser/core#readme",
"dependencies": {
"@zen-browser/surfer": "^1.9.19"
"@zen-browser/surfer": "^1.10.4"
},
"devDependencies": {
"husky": "^9.1.7",

1916
pnpm-lock.yaml generated
View File

File diff suppressed because it is too large Load Diff

10
scripts/update-surfer.sh Normal file
View File

@@ -0,0 +1,10 @@
#!/bin/bash
# make sure we are on root
if [ ! -f "package.json" ]; then
echo "Please run this script from the root of the project"
exit 1
fi
npm update @zen-browser/surfer
npm i @zen-browser/surfer@latest

18
src/browser/app/profile/zen-browser.js
View File

@@ -81,7 +81,7 @@ pref('zen.tabs.vertical', true);
pref('zen.tabs.vertical.right-side', false);
pref('zen.tabs.rename-tabs', true);
pref('zen.theme.accent-color', "#ffb787");
pref('zen.theme.content-element-separation', 6); // In pixels
pref('zen.theme.content-element-separation', 8); // In pixels
pref('zen.theme.gradient', true);
pref('zen.theme.gradient.show-custom-colors', false);
pref('zen.theme.essentials-favicon-bg', true);
@@ -118,9 +118,11 @@ pref('zen.view.compact.animate-sidebar', true);
pref('zen.view.compact.show-sidebar-and-toolbar-on-hover', true);
pref('zen.urlbar.replace-newtab', true);
pref('zen.urlbar.show-protections-icon', false);
pref('zen.urlbar.behavior', 'floating-on-type'); // default, floating-on-type, float
pref('zen.urlbar.wait-to-clear', 45000); // in ms (default 45s)
pref('zen.urlbar.show-domain-only-in-sidebar', true);
pref('zen.urlbar.hide-one-offs', true);
#ifdef XP_MACOSX
// Disable for macos in the meantime until @HarryHeres finds a solution for hight DPI screens
@@ -177,15 +179,17 @@ pref('zen.pinned-tab-manager.restore-pinned-tabs-to-pinned-url', false);
pref('zen.pinned-tab-manager.close-shortcut-behavior', 'reset-unload-switch');
// TODO: Check this out!
pref("browser.profiles.enabled", true);
pref("browser.profiles.enabled", false);
// Zen webpanels (calling it sidebar due to legacy reasons)
pref('zen.sidebar.data', "{\"data\":\n {\"p1\":{\n \"url\":\"https://www.wikipedia.org/\"\n },\n\"p2\":{\n \"url\":\"https://m.twitter.com/\",\n\"ua\": true\n },\n\"p3\": {\n \"url\": \"https://www.youtube.com/\",\n\"ua\": true\n},\n\"p4\": {\n \"url\": \"https://translate.google.com/\",\n\"ua\": true\n},\n\"p5\": {\n \"url\": \"https://todoist.com/\",\n\"ua\": true\n}},\n\"index\":[\"p1\",\"p2\",\"p3\",\"p4\",\"p5\"]}");
pref('zen.sidebar.enabled', true);
pref('zen.sidebar.close-on-blur', true);
pref('zen.sidebar.max-webpanels', 8);
pref('zen.sidebar.use-google-favicons', true);
// Zen Split View
pref('zen.splitView.enable-tab-drop', true);
pref('zen.splitView.min-resize-width', 7);
pref('zen.splitView.change-on-hover', false);
pref('zen.splitView.rearrange-hover-size', 24);
@@ -197,7 +201,6 @@ pref('zen.startup.smooth-scroll-in-tabs', true);
pref('zen.workspaces.disabled_for_testing', false);
pref('zen.workspaces.hide-deactivated-workspaces', false);
pref('zen.workspaces.hide-default-container-indicator', true);
pref('zen.workspaces.individual-pinned-tabs', true);
pref('zen.workspaces.show-icon-strip', true);
pref('zen.workspaces.force-container-workspace', false);
pref('zen.workspaces.open-new-tab-if-last-unpinned-tab-is-closed', false);
@@ -378,7 +381,7 @@ pref('widget.macos.titlebar-blend-mode.behind-window', true);
// 5. toolTip
// 6. headerView
// 7. underlay
pref('zen.widget.macos.window-material', 7);
pref('zen.widget.macos.window-material', 3);
#endif
// Urlbar and autocomplete
@@ -437,6 +440,13 @@ pref("browser.newtabpage.activity-stream.asrouter.userprefs.cfr.features", false
pref("browser.preferences.moreFromMozilla", false, locked);
pref("browser.aboutwelcome.enabled", false);
// AI/ML stuff
pref("browser.ml.chat.enabled", false);
pref("browser.ml.chat.shortcuts", false);
pref("browser.ml.chat.shortcuts.custom", false);
pref("browser.ml.chat.sidebar", false);
pref("browser.ml.enable", false);
// ---- Experimental settings to try make zen faster
pref("gfx.canvas.accelerated.cache-items", 32768);
pref("gfx.canvas.accelerated.cache-size", 256);

1
src/browser/base/content/ZenStartup.mjs
View File

@@ -48,6 +48,7 @@
openWatermark() {
if (!Services.prefs.getBoolPref('zen.watermark.enabled', false)) {
document.documentElement.removeAttribute('zen-before-loaded');
return;
}
for (let elem of document.querySelectorAll('#browser > *, #urlbar')) {

13
src/browser/base/content/ZenUIManager.mjs
View File

@@ -37,6 +37,8 @@ var gZenUIManager = {
window.addEventListener('TabClose', this.onTabClose.bind(this));
this.tabsWrapper.addEventListener('scroll', this.saveScrollbarState.bind(this));
gZenMediaController.init();
},
updateTabsToolbar() {
@@ -62,6 +64,7 @@ var gZenUIManager = {
}
tabs.style.removeProperty('flex');
tabs.style.maxHeight = height + 'px';
gZenVerticalTabsManager.actualWindowButtons.removeAttribute('zen-has-hover');
},
get tabsWrapper() {
@@ -346,6 +349,7 @@ var gZenVerticalTabsManager = {
return visibleTabs[visibleTabs.length - 1] === aTab;
};
try {
const tabSize = aTab.getBoundingClientRect().height;
const transform = `-${tabSize}px`;
gZenUIManager.motion
@@ -373,6 +377,9 @@ var gZenVerticalTabsManager = {
.then(() => {
aTab.querySelector('.tab-stack').style.removeProperty('filter');
});
} catch (e) {
console.error(e);
}
},
get actualWindowButtons() {
@@ -619,6 +626,12 @@ var gZenVerticalTabsManager = {
}
gZenCompactModeManager.updateCompactModeContext(isSingleToolbar);
document.getElementById('urlbar').removeAttribute('--urlbar-height');
if (!isSingleToolbar) {
document.getElementById('urlbar').style.setProperty('--urlbar-height', '32px');
} else {
gURLBar.updateLayoutBreakout();
}
// Always move the splitter next to the sidebar
this.navigatorToolbox.after(document.getElementById('zen-sidebar-splitter'));

22
src/browser/base/content/main-popupset-inc-xhtml.patch
View File

@@ -1,8 +1,8 @@
diff --git a/browser/base/content/main-popupset.inc.xhtml b/browser/base/content/main-popupset.inc.xhtml
index e5f3424eaeeec0ba552537f167dd99e912216d94..4bdfcdb23fe9c44ad3d4de273c64f4cc31cb4034 100644
index 959c523b21c642f29353b9de37b3ce6b5505b01b..4cd26ea85ad4905bade71dcd470b8678079787bd 100644
--- a/browser/base/content/main-popupset.inc.xhtml
+++ b/browser/base/content/main-popupset.inc.xhtml
@@ -181,6 +181,10 @@
@@ -206,6 +206,10 @@
hidden="true"
tabspecific="true"
aria-labelledby="editBookmarkPanelTitle">
@@ -13,7 +13,7 @@ index e5f3424eaeeec0ba552537f167dd99e912216d94..4bdfcdb23fe9c44ad3d4de273c64f4cc
<box class="panel-header">
<html:h1>
<html:span id="editBookmarkPanelTitle"/>
@@ -206,6 +210,7 @@
@@ -231,6 +235,7 @@
class="footer-button"/>
</html:moz-button-group>
</vbox>
@@ -21,7 +21,21 @@ index e5f3424eaeeec0ba552537f167dd99e912216d94..4bdfcdb23fe9c44ad3d4de273c64f4cc
</panel>
</html:template>
@@ -535,6 +540,8 @@
@@ -426,11 +431,13 @@
observes="cmd_CustomizeToolbars"
class="viewCustomizeToolbar"
data-lazy-l10n-id="toolbar-context-menu-view-customize-toolbar-2"/>
+#if 0
<menuseparator id="sidebarRevampSeparator"/>
<menuitem id="toolbar-context-toggle-vertical-tabs"
data-lazy-l10n-id="toolbar-context-turn-on-vertical-tabs"/>
<menuitem id="toolbar-context-customize-sidebar"
data-lazy-l10n-id="toolbar-context-customize-sidebar"/>
+#endif
<menuseparator contexttype="fullscreen"/>
<menuitem id="toolbar-context-full-screen-autohide"
class="fullscreen-context-autohide"
@@ -565,6 +572,8 @@
#include popup-notifications.inc.xhtml

2
src/browser/base/content/zen-assets.inc.xhtml
View File

@@ -26,6 +26,7 @@
<link rel="stylesheet" type="text/css" href="chrome://browser/skin/zen-icons/icons.css" />
<link rel="stylesheet" type="text/css" href="chrome://browser/content/zen-styles/zen-branding.css" />
<link rel="stylesheet" type="text/css" href="chrome://browser/content/zen-styles/zen-welcome.css" />
<link rel="stylesheet" type="text/css" href="chrome://browser/content/zen-styles/zen-media-controls.css" />
</linkset>
# Scripts used all over the browser
@@ -42,6 +43,7 @@
<script src="chrome://browser/content/zen-components/ZenGradientGenerator.mjs" />
<script src="chrome://browser/content/zen-components/ZenViewSplitter.mjs"/>
<script src="chrome://browser/content/zen-components/ZenGlanceManager.mjs" />
<script src="chrome://browser/content/zen-components/ZenMediaController.mjs" />
# Unimportant scripts
<script src="chrome://browser/content/zen-components/ZenRices.mjs" />

3
src/browser/base/content/zen-assets.jar.inc.mn
View File

@@ -25,6 +25,7 @@
content/browser/zen-components/ZenRices.mjs (zen-components/ZenRices.mjs)
content/browser/zen-components/ZenEmojies.mjs (zen-components/ZenEmojies.mjs)
content/browser/zen-components/ZenWelcome.mjs (zen-components/ZenWelcome.mjs)
content/browser/zen-components/ZenMediaController.mjs (zen-components/ZenMediaController.mjs)
content/browser/zen-styles/zen-theme.css (content/zen-styles/zen-theme.css)
content/browser/zen-styles/zen-buttons.css (content/zen-styles/zen-buttons.css)
@@ -49,6 +50,7 @@
content/browser/zen-styles/zen-rices.css (content/zen-styles/zen-rices.css)
content/browser/zen-styles/zen-branding.css (content/zen-styles/zen-branding.css)
content/browser/zen-styles/zen-welcome.css (content/zen-styles/zen-welcome.css)
content/browser/zen-styles/zen-media-controls.css (content/zen-styles/zen-media-controls.css)
content/browser/zen-styles/zen-panels/bookmarks.css (content/zen-styles/zen-panels/bookmarks.css)
content/browser/zen-styles/zen-panels/extensions.css (content/zen-styles/zen-panels/extensions.css)
@@ -64,6 +66,7 @@
content/browser/zen-images/layouts/multiple-toolbar.png (content/zen-images/layouts/multiple-toolbar.png)
content/browser/zen-images/layouts/single-toolbar.png (content/zen-images/layouts/single-toolbar.png)
content/browser/zen-images/grain-bg.png (content/zen-images/grain-bg.png)
content/browser/zen-images/note-indicator.svg (content/zen-images/note-indicator.svg)
# Actors
content/browser/zen-components/actors/ZenThemeMarketplaceParent.sys.mjs (zen-components/actors/ZenThemeMarketplaceParent.sys.mjs)

BIN
src/browser/base/content/zen-fonts/JunicodeVF-Italic.woff2
View File

Binary file not shown.

BIN
src/browser/base/content/zen-fonts/JunicodeVF-Roman.woff2
View File

Binary file not shown.

2
src/browser/base/content/zen-glance.inc.xhtml
View File

@@ -1,6 +1,6 @@
<vbox id="glance-wrapper">
<vbox id="zen-glance-sidebar-container" hidden="true">
<toolbarbutton id="zen-glance-sidebar-close" class="toolbarbutton-1" oncommand="gZenGlanceManager.closeGlance({ onTabClose: true })"/>
<toolbarbutton id="zen-glance-sidebar-close" data-l10n-id="zen-general-confrim" class="toolbarbutton-1" oncommand="gZenGlanceManager.closeGlance({ onTabClose: true })"/>
<toolbarbutton id="zen-glance-sidebar-open" class="toolbarbutton-1" oncommand="gZenGlanceManager.fullyOpenGlance()"/>
</vbox>
</vbox>

100
src/browser/base/content/zen-images/note-indicator.svg Normal file
View File

@@ -0,0 +1,100 @@
<svg viewBox="0 0 36 36" xmlns="http://www.w3.org/2000/svg">
<rect width="100%" height="100%" fill="none"/>
<style type="text/css"><![CDATA[
.note {
fill: white;
transform-box: fill-box;
transform-origin: center;
}
@keyframes flyUpLeft {
from {
opacity: 1;
transform: translate(0px, 0px) scale(0.5) rotate(0deg);
}
to {
opacity: 0;
transform: translate(-9px, -35px) scale(5) rotate(0deg);
}
}
@keyframes flyUpRight {
from {
opacity: 1;
transform: translate(0px, 0px) scale(0.5) rotate(0deg);
}
to {
opacity: 0;
transform: translate(9px, -35px) scale(5) rotate(0deg);
}
}
@keyframes flyUpCenter {
from {
opacity: 1;
transform: translate(0px, 0px) scale(0.5) rotate(0deg);
}
to {
opacity: 0;
transform: translate(0px, -35px) scale(5) rotate(0deg);
}
}
}*/
]]></style>
<g class="note-group">
<g class="note" style="animation: flyUpLeft 3s ease-in-out infinite; animation-delay: 0s;">
<path transform="translate(15,40) scale(0.0078)" d="M448.231,166.755C352.139,64.989,240.998,2.38,240.998,2.38
c-3.297-2.625-7.813-3.125-11.609-1.281c-3.813,1.844-6.219,5.688-6.219,9.906v329
c-20.078-8.281-44.688-11.656-71.344-8.344C84.717,340.005,30.514,386.849,30.67,436.255
c0.188,49.453,54.703,82.813,121.75,74.469c67.078-8.328,121.297-55.188,121.125-104.641V164.817
c15.828,3.313,34.391,10.531,54.391,25.219c67.703,49.625,100.905,81.484,58.218,166.859
C475.403,321.974,514.2,236.599,448.231,166.755z"/>
</g>
<g class="note" style="animation: flyUpRight 3s ease-in-out infinite; animation-delay: 0.5s;">
<path transform="translate(15,40) scale(0.0078)" d="M133.703,45.86v86.43v240.66c-16.8-6.173-36.654-8.012-57.11-4.054
c-49.141,9.454-82.977,48.227-75.577,86.559c7.389,38.353,53.195,61.757,102.326,52.292
c43.602-8.4,75.093-39.892,76.449-73.727h0.28V129.246L465.644,93.83v237.595
c-16.811-6.162-36.644-7.98-57.1-4.033c-49.152,9.443-82.966,48.217-75.6,86.559
c7.389,38.342,53.185,61.746,102.327,52.271c43.612-8.389,75.115-39.892,76.449-73.706
H512V90.785V2.152L133.703,45.86z"/>
</g>
<g class="note" style="animation: flyUpCenter 3s ease-in-out infinite; animation-delay: 1s;">
<path transform="translate(15,40) scale(0.0078)" d="M448.231,166.755C352.139,64.989,240.998,2.38,240.998,2.38
c-3.297-2.625-7.813-3.125-11.609-1.281c-3.813,1.844-6.219,5.688-6.219,9.906v329
c-20.078-8.281-44.688-11.656-71.344-8.344C84.717,340.005,30.514,386.849,30.67,436.255
c0.188,49.453,54.703,82.813,121.75,74.469c67.078-8.328,121.297-55.188,121.125-104.641V164.817
c15.828,3.313,34.391,10.531,54.391,25.219c67.703,49.625,100.905,81.484,58.218,166.859
C475.403,321.974,514.2,236.599,448.231,166.755z"/>
</g>
<g class="note" style="animation: flyUpLeft 3s ease-in-out infinite; animation-delay: 1.5s;">
<path transform="translate(15,40) scale(0.0078)" d="M133.703,45.86v86.43v240.66c-16.8-6.173-36.654-8.012-57.11-4.054
c-49.141,9.454-82.977,48.227-75.577,86.559c7.389,38.353,53.195,61.757,102.326,52.292
c43.602-8.4,75.093-39.892,76.449-73.727h0.28V129.246L465.644,93.83v237.595
c-16.811-6.162-36.644-7.98-57.1-4.033c-49.152,9.443-82.966,48.217-75.6,86.559
c7.389,38.342,53.185,61.746,102.327,52.271c43.612-8.389,75.115-39.892,76.449-73.706
H512V90.785V2.152L133.703,45.86z"/>
</g>
<g class="note" style="animation: flyUpRight 3s ease-in-out infinite; animation-delay: 2s;">
<path transform="translate(15,40) scale(0.0078)" d="M448.231,166.755C352.139,64.989,240.998,2.38,240.998,2.38
c-3.297-2.625-7.813-3.125-11.609-1.281c-3.813,1.844-6.219,5.688-6.219,9.906v329
c-20.078-8.281-44.688-11.656-71.344-8.344C84.717,340.005,30.514,386.849,30.67,436.255
c0.188,49.453,54.703,82.813,121.75,74.469c67.078-8.328,121.297-55.188,121.125-104.641V164.817
c15.828,3.313,34.391,10.531,54.391,25.219c67.703,49.625,100.905,81.484,58.218,166.859
C475.403,321.974,514.2,236.599,448.231,166.755z"/>
</g>
<g class="note" style="animation: flyUpCenter 3s ease-in-out infinite; animation-delay: 2.5s;">
<path transform="translate(15,40) scale(0.0078)" d="M133.703,45.86v86.43v240.66c-16.8-6.173-36.654-8.012-57.11-4.054
c-49.141,9.454-82.977,48.227-75.577,86.559c7.389,38.353,53.195,61.757,102.326,52.292
c43.602-8.4,75.093-39.892,76.449-73.727h0.28V129.246L465.644,93.83v237.595
c-16.811-6.162-36.644-7.98-57.1-4.033c-49.152,9.443-82.966,48.217-75.6,86.559
c7.389,38.342,53.185,61.746,102.327,52.271c43.612-8.389,75.115-39.892,76.449-73.706
H512V90.785V2.152L133.703,45.86z"/>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 4.8 KiB

51
src/browser/base/content/zen-media-player.inc.xhtml Normal file
View File

@@ -0,0 +1,51 @@
<toolbar id="zen-media-controls-toolbar"
class="browser-toolbar customization-target zen-sidebar-toolbar"
context="toolbar-context-menu"
mode="icons"
hidden="true">
<toolbaritem>
<vbox id="zen-media-main-vbox">
<hbox id="zen-media-service-hbox" class="show-on-hover">
<hbox id="zen-media-service-button">
<image/>
</hbox>
<hbox id="zen-media-service-title" fadein="true">
<label class="service" />
<label class="tld" />
</hbox>
</hbox>
<vbox id="zen-media-info-vbox" class="show-on-hover">
<label id="zen-media-title" fadein="true"/>
<label id="zen-media-artist" fadein="true"/>
</vbox>
<hbox id="zen-media-progress-hbox" class="show-on-hover">
<label id="zen-media-current-time">0:00</label>
<html:input type="range" id="zen-media-progress-bar"
value="0" min="0" max="100" step="0.1"
oninput="gZenMediaController.onMediaSeekDrag(event);"
onchange="gZenMediaController.onMediaSeekComplete(event);"/>
<label id="zen-media-duration">0:00</label>
</hbox>
<hbox id="zen-media-controls-hbox">
<toolbarbutton id="zen-media-focus-button"
class="toolbarbutton-1"
oncommand="gZenMediaController.onMediaFocus();" />
<toolbarbutton id="zen-media-previoustrack-button"
class="toolbarbutton-1"
oncommand="gZenMediaController.onMediaPlayPrev();" />
<toolbarbutton id="zen-media-playpause-button"
class="toolbarbutton-1"
oncommand="gZenMediaController.onMediaToggle();" />
<toolbarbutton id="zen-media-nexttrack-button"
class="toolbarbutton-1"
oncommand="gZenMediaController.onMediaPlayNext();" />
<toolbarbutton id="zen-media-mute-button"
class="toolbarbutton-1"
oncommand="gZenMediaController.onMediaMute();" />
</hbox>
</vbox>
</toolbaritem>
</toolbar>

1
src/browser/base/content/zen-sidebar-icons.inc.xhtml
View File

@@ -1,3 +1,4 @@
#include zen-media-player.inc.xhtml
<toolbar brighttext="true"
id="zen-sidebar-bottom-buttons"
fullscreentoolbar="true"

43
src/browser/base/content/zen-styles/zen-compact-mode.css
View File

@@ -38,6 +38,9 @@
--zen-toolbox-max-width: 64px !important;
--zen-compact-float: var(--zen-element-separation);
/* Initial padding for when we are animating */
padding: 0 0 0 var(--zen-toolbox-padding) !important;
&:not([animate='true']) {
position: absolute;
z-index: 10;
@@ -51,7 +54,12 @@
opacity: 0;
:root[zen-single-toolbar='true'] & {
top: var(--zen-element-separation);
top: calc(var(--zen-element-separation) / 2);
height: calc(100% - var(--zen-element-separation));
}
& #zen-sidebar-top-buttons {
margin: 0 0 calc(var(--zen-toolbox-padding) / 2) 0;
}
}
@@ -61,7 +69,7 @@
}
&:not([zen-right-side='true']) #navigator-toolbox {
left: calc(-1 * var(--zen-sidebar-width) + 1px);
left: calc(-1 * var(--actual-zen-sidebar-width) + 1px);
}
/* When we have multiple toolbars and the top-toolbar is NOT being hidden,
@@ -78,7 +86,7 @@
--zen-compact-float: calc(var(--zen-element-separation) + 1px);
&:not([animate='true']) {
right: calc(-1 * var(--zen-sidebar-width) + 1px);
right: calc(-1 * var(--actual-zen-sidebar-width) + 1px);
}
}
@@ -90,12 +98,21 @@
#navigator-toolbox:not([animate='true']) #titlebar {
box-shadow: var(--zen-big-shadow);
border-radius: var(--zen-native-inner-radius);
border-radius: calc(var(--zen-native-inner-radius) + var(--zen-element-separation) / 4);
padding: var(--zen-toolbox-padding) !important;
position: relative;
background: var(--zen-dialog-background);
border: 1px solid var(--zen-colors-border-contrast);
width: calc(100% - var(--zen-toolbox-padding));
/* times 4 because we have the inner padding and the outter padding to consider */
:root[zen-sidebar-expanded='true'] & {
&[has-animated-padding='true'] {
width: calc(var(--zen-sidebar-width) + var(--zen-toolbox-padding));
}
&:not([has-animated-padding='true']) {
width: calc(var(--zen-sidebar-width) - var(--zen-toolbox-padding));
}
}
:root[zen-single-toolbar='true'] {
padding-top: 0 !important;
@@ -113,6 +130,7 @@
& #urlbar[open][zen-floating-urlbar='true'] {
transition: left 0.05s ease;
visibility: visible;
#navigator-toolbox:has(&) {
opacity: 1;
@@ -134,17 +152,18 @@
}
}
#navigator-toolbox[zen-has-hover],
#navigator-toolbox[zen-has-hover]:not(:has(#urlbar[zen-floating-urlbar='true']:hover)),
#navigator-toolbox[zen-user-show],
#navigator-toolbox[zen-has-empty-tab],
#navigator-toolbox[flash-popup],
#navigator-toolbox[has-popup-menu],
#navigator-toolbox[movingtab],
#navigator-toolbox:has(.tabbrowser-tab:active),
&[zen-renaming-tab='true'] #navigator-toolbox,
#navigator-toolbox:has(
*:is([panelopen='true'], [open='true'], #urlbar:not([zen-floating-urlbar='true']):focus-within):not(tab):not(.zen-compact-mode-ignore)
*:is([panelopen='true'], [open='true'], #urlbar:focus-within):not(#urlbar[zen-floating-urlbar='true']):not(tab):not(.zen-compact-mode-ignore)
) {
&:not([animate='true']):not(:has(#urlbar[zen-floating-urlbar='true']:hover)) {
&:not([animate='true']) {
--zen-compact-mode-func: linear(
0 0%,
0.002748 1%,
@@ -249,14 +268,14 @@
1.003423 100%
);
transition:
left 0.3s var(--zen-compact-mode-func),
right 0.3s var(--zen-compact-mode-func);
left 0.25s var(--zen-compact-mode-func),
right 0.25s var(--zen-compact-mode-func);
opacity: 1;
&:not([supress-primary-adjustment='true']) {
left: -1px;
left: calc(var(--zen-element-separation) / -2);
:root[zen-right-side='true'] & {
right: -1px;
right: calc(var(--zen-element-separation) / -2);
left: auto;
}
}

123
src/browser/base/content/zen-styles/zen-decks.css
View File

@@ -17,7 +17,7 @@
margin: 0;
}
#zen-splitview-dropzone {
border-radius: var(--zen-webview-border-radius, var(--zen-border-radius));
border-radius: var(--zen-native-inner-radius);
transition: inset ease-out 0.08s;
display: none;
background-color: color-mix(in srgb, var(--zen-colors-secondary) 30%, transparent 70%);
@@ -29,12 +29,11 @@
#tabbrowser-tabpanels[zen-split-view='true'] > [zen-split='true'],
#zen-splitview-dropzone {
flex: 1;
margin: var(--zen-split-column-gap) calc(var(--zen-split-row-gap) + 1px) !important;
margin: var(--zen-split-column-gap) var(--zen-split-row-gap) !important;
margin-bottom: 0 !important;
margin-left: 0 !important;
position: absolute !important;
overflow: hidden;
transition: inset 0.1s;
}
#tabbrowser-tabpanels[zen-split-view='true']:not([zen-split-resizing]) > [zen-split-anim='true'] {
@@ -45,12 +44,11 @@
}
#tabbrowser-tabpanels[zen-split-view='true'] .browserSidebarContainer.deck-selected {
outline: 2px solid var(--zen-primary-color) !important;
outline-offset: -1px;
outline: 1px solid var(--zen-primary-color) !important;
}
#tabbrowser-tabbox:has(#tabbrowser-tabpanels[zen-split-view='true']) {
--zen-split-row-gap: calc(var(--zen-element-separation) + 1px);
--zen-split-row-gap: var(--zen-element-separation);
--zen-split-column-gap: calc(var(--zen-element-separation) + 1px);
margin-right: calc(-1 * var(--zen-split-column-gap));
}
@@ -92,12 +90,6 @@
pointer-events: all;
}
.zen-split-view-splitter[orient='vertical'] {
width: var(--zen-split-row-gap);
margin-left: calc(var(--zen-split-row-gap) / -2);
cursor: ew-resize;
}
.zen-split-view-splitter[orient='horizontal'] {
height: var(--zen-split-column-gap);
cursor: ns-resize;
@@ -214,37 +206,104 @@
display: revert;
}
.zen-view-splitter-header {
display: flex;
width: 100%;
height: 20px;
/*TODO: update with appropriate color*/
background-color: var(--zen-colors-secondary);
align-items: center;
.zen-view-splitter-header-container {
position: absolute;
top: calc(var(--zen-split-column-gap) / -2);
left: 50%;
opacity: 0;
transition: opacity 0.2s;
z-index: 100;
cursor: move;
transform: translateX(-50%);
pointer-events: none;
}
.zen-tab-unsplit-button {
.zen-view-splitter-header {
display: flex;
align-items: center;
position: fixed;
padding: 0.4rem 0.6rem;
border-radius: 8px;
background-color: light-dark(rgba(255, 255, 255, 1), rgba(0, 0, 0, 1));
box-shadow: 0 0 0 1px var(--button-primary-border-color);
gap: 0.8rem;
transform: translateX(-50%);
box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.1);
border-top-left-radius: 0;
border-top-right-radius: 0;
}
:root:not([inDOMFullscreen='true']) .browserSidebarContainer:hover .zen-view-splitter-header-container,
.zen-view-splitter-header-container:hover {
pointer-events: all;
opacity: 1;
transition-delay: 0.2s;
}
.zen-view-splitter-header-container toolbarbutton {
display: block;
-moz-context-properties: fill, fill-opacity;
border-radius: var(--tab-border-radius);
/*TODO: update with appropriate color*/
color: inherit;
fill: currentColor;
padding: var(--tab-close-button-padding);
width: 24px;
height: 24px;
width: 16px;
height: 16px;
cursor: pointer;
appearance: none;
margin-left: auto;
outline: var(--toolbarbutton-outline);
list-style-image: url('chrome://global/skin/icons/close-fill.svg') !important;
&:hover {
outline-color: var(--toolbarbutton-hover-outline-color);
outline: none;
color: var(--button-primary-bgcolor);
border-top-left-radius: 0;
border-top-right-radius: 0;
& image {
width: 14px;
height: 14px;
}
&:hover:active {
outline-color: var(--toolbarbutton-active-outline-color);
&.zen-tab-rearrange-button {
cursor: move;
& image {
transform: rotate(90deg);
}
}
}
#zen-split-view-fake-browser {
position: absolute;
height: 100%;
background: rgba(255, 255, 255, 0.1);
border-radius: var(--zen-native-inner-radius);
box-shadow: var(--zen-big-shadow);
overflow: hidden;
&[side='right'] {
right: 0;
}
&::after {
content: '';
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 3.5rem;
pointer-events: none;
height: 3.5rem;
background: var(--zen-split-view-fake-icon);
background-size: contain;
background-repeat: no-repeat;
background-position: center;
opacity: 0.8;
transition: opacity 0.2s;
transition-delay: 0.1s;
@starting-style {
opacity: 0;
}
}
&.fade-out::after {
opacity: 0;
transition-delay: 0s;
}
}

8
src/browser/base/content/zen-styles/zen-folders.css
View File

@@ -14,7 +14,11 @@ tab-group[split-view-group] {
--zen-split-view-active-tab-bg: color-mix(in srgb, var(--zen-toolbar-element-bg), transparent 40%);
:root:not([zen-sidebar-expanded='true']) & {
padding: 2px 0;
padding: 0 2px;
--tab-min-height: 30px;
--tab-collapsed-width: 38px;
margin: 0 auto;
--tab-min-width: 34px;
}
& > .tabbrowser-tab {
@@ -56,7 +60,7 @@ tab-group[split-view-group] {
}
}
&:has(> tab[visuallyselected]) {
&:has(> tab:is([visuallyselected], [multiselected])) {
background-color: var(--tab-selected-bgcolor);
box-shadow: var(--tab-selected-shadow);

37
src/browser/base/content/zen-styles/zen-glance.css
View File

@@ -34,14 +34,22 @@
width: 32px;
height: 32px;
background: light-dark(rgb(24, 24, 24), rgb(231, 231, 231));
transition: background 0.2s ease;
transition:
background 0.05s ease,
scale 0.05s ease;
border-radius: 999px;
appearance: none;
box-shadow: 0 0 12px 1px rgba(0, 0, 0, 0.07);
opacity: 0;
padding: 8px;
&:hover {
background: light-dark(rgb(41, 41, 41), rgb(204, 204, 204));
scale: 1.05;
}
&:hover:active {
scale: 0.95;
}
& label {
@@ -52,6 +60,33 @@
filter: invert(1);
}
}
& #zen-glance-sidebar-close {
width: fit-content;
& label {
display: block;
max-width: 0px;
margin: 0;
overflow: hidden;
transition:
max-width 0.2s ease,
margin-left 0.2s ease;
}
&[waitconfirmation] {
background: rgb(220, 53, 69);
color: white;
fill: white;
& label {
max-width: 100px;
margin-left: 8px;
}
& image {
filter: none;
}
}
}
}
#zen-glance-sidebar-container[hidden='true'] {

18
src/browser/base/content/zen-styles/zen-gradient-generator.css
View File

@@ -89,6 +89,7 @@
border-radius: 50%;
cursor: pointer;
position: relative;
transition: transform 0.1s;
&::after {
content: '';
position: absolute;
@@ -99,6 +100,23 @@
outline: 2px solid var(--zen-toolbar-element-bg);
border-radius: 50%;
pointer-events: none;
transition: transform 0.1s;
}
&:hover {
transform: scale(1.05);
&::after {
transform: scale(1.05);
}
}
&:hover:active {
transform: scale(0.95);
&::after {
transform: scale(0.95);
}
}
}
}

256
src/browser/base/content/zen-styles/zen-media-controls.css Normal file
View File

@@ -0,0 +1,256 @@
#zen-media-controls-toolbar {
--progress-height: 5px;
--button-spacing: 2px;
display: flex;
justify-content: space-between;
min-width: 0;
background: transparent;
container-type: inline-size;
.toolbarbutton-1 {
border-radius: 5px;
color: white;
}
#zen-media-prev-button,
#zen-media-play-pause-button,
#zen-media-next-button {
margin: 0;
}
image.toolbarbutton-icon {
padding: 5px;
width: 26px;
height: 26px;
}
#zen-media-progress-bar {
appearance: none;
width: 100%;
height: var(--progress-height);
margin: 0 8px;
border-radius: 2px;
background-color: rgba(255, 255, 255, 0.2);
cursor: pointer;
transition: height 0.15s ease-out;
&::-moz-range-track {
background: var(--zen-colors-border);
border-radius: 999px;
height: var(--progress-height);
}
&::-moz-range-progress {
background: var(--zen-primary-color);
border-radius: 999px;
height: var(--progress-height);
}
&::-moz-range-thumb {
background: var(--zen-primary-color);
border: none;
width: 14px;
height: 14px;
border-radius: 50%;
cursor: pointer;
}
}
&:hover {
& #zen-media-main-vbox {
transition-delay: 0s;
gap: 6px;
}
.show-on-hover {
max-height: 50px;
padding: 2px 6px;
margin-bottom: 0;
opacity: 1;
transform: translateY(0);
}
}
&:not(:hover) {
&.playing:not([muted]) #zen-media-focus-button::after {
content: '';
position: absolute;
width: 100%;
height: 100%;
background-repeat: no-repeat;
opacity: 1;
background: url('chrome://browser/content/zen-images/note-indicator.svg') no-repeat;
top: -50%;
left: 50%;
transform: translateX(-50%);
z-index: -1;
}
}
#zen-media-focus-button {
align-self: center;
transition:
opacity 0.2s ease,
transform 0.2s ease;
@container (max-width: 185px) {
width: 0;
height: 0;
opacity: 0;
padding: 0;
margin-right: -10%;
transform: translateX(-20px);
transition: margin 0.15s ease-in-out;
}
@container (min-width: 185px) {
opacity: 1;
transform: translateX(0);
}
}
toolbaritem {
flex-grow: 1;
padding: 0;
transition: padding 0.3s ease-out;
position: absolute;
left: 0;
bottom: 0;
padding: 4px;
border-radius: var(--border-radius-medium);
background: light-dark(rgb(255, 255, 255), rgb(11, 11, 11)) !important;
width: 100%;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
}
.show-on-hover {
max-height: 0;
opacity: 0;
transform: translateY(5px);
padding: 0 6px;
transition:
max-height 0.1s ease-in-out,
opacity 0.1s ease-in-out,
transform 0.05s ease-in-out,
padding 0.15s ease-in-out;
}
#zen-media-current-time,
#zen-media-duration {
margin: 0 0 0 1px;
font-size: x-small;
opacity: 0.7;
font-weight: 500;
}
}
#zen-media-controls-toolbar {
display: none;
animation: none;
transition: none;
&:not([hidden]) {
display: flex;
height: 2.5rem;
overflow: visible;
position: relative;
z-index: 2;
}
}
#zen-media-service-title,
#zen-media-title,
#zen-media-artist {
white-space: nowrap;
width: 0;
margin-left: 0;
}
#zen-media-service-title {
align-self: center;
font-size: math;
margin-left: 6px;
& label {
margin: 0;
}
& .tld {
opacity: 0.5;
}
}
#zen-media-title,
#zen-media-artist {
align-self: start;
}
#zen-media-artist {
opacity: 0.7;
font-weight: 500;
font-size: smaller;
}
#zen-media-title {
height: 16px;
font-size: math;
font-weight: bold;
}
#zen-media-main-vbox,
#zen-media-service-hbox,
#zen-media-info-vbox,
#zen-media-progress-hbox {
width: 100%;
}
#zen-media-service-hbox {
padding-top: 6px;
}
#zen-media-info-vbox {
& label {
width: 100%;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
}
#zen-media-main-vbox {
height: 100%;
justify-content: space-between;
transition: gap 0.1s ease-out;
transition-delay: 0.1s;
gap: 0px;
}
#zen-media-progress-hbox {
flex-grow: 1;
height: 1.1rem;
align-items: center;
}
#zen-media-controls-hbox {
align-items: flex-end;
justify-content: space-between;
max-width: 100%;
--toolbarbutton-outer-padding: 0;
}
#zen-media-service-button {
align-items: center;
& image {
width: 16px;
height: 16px;
border-radius: 4px;
}
}
:root:not([zen-sidebar-expanded='true']) {
#zen-media-controls-toolbar {
display: none;
}
}

15
src/browser/base/content/zen-styles/zen-sidebar-panels.css
View File

@@ -111,24 +111,25 @@
background: transparent;
border: none;
cursor: ew-resize;
z-index: 2;
&:is(.zen-split-view-splitter[orient='vertical']) {
/* Bit of a hacky solution, but it works */
width: calc(var(--zen-element-separation) - 3px);
margin-left: calc(-1 * var(--zen-element-separation) / 2 - 2px);
width: var(--zen-split-row-gap);
margin-left: calc(var(--zen-element-separation) * -1 - 1px);
height: unset;
cursor: ew-resize;
}
&::before {
height: 50px;
width: 4px;
background: var(--zen-colors-primary);
width: 2px;
background: var(--button-primary-bgcolor);
border-radius: 2px;
content: '';
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
opacity: 0;
transition: opacity 0.1s ease-in-out;
pointer-events: none;
@@ -139,10 +140,6 @@
}
}
.zen-split-view-splitter[orient='vertical']::before {
transform: translate(-75%, -50%);
}
.zen-sidebar-web-panel-splitter[side='right'] {
left: 100%;
}

6
src/browser/base/content/zen-styles/zen-single-components.css
View File

@@ -19,12 +19,6 @@
text-overflow: ellipsis;
}
@media not (-moz-bool-pref: 'zen.watermark.enabled') {
#zen-watermark {
display: none;
}
}
#customization-footer #customization-toolbar-visibility-button {
display: none !important;
}

30
src/browser/base/content/zen-styles/zen-tabs/vertical-tabs.css
View File

@@ -94,9 +94,8 @@
padding: 6px !important;
}
& #urlbar-container,
& #urlbar {
--urlbar-container-height: 40px;
& #urlbar-container[breakout='true']:has([zen-floating-urlbar='true']) {
--urlbar-container-height: 36px !important;
--urlbar-height: 38px !important;
}
@@ -109,7 +108,7 @@
}
& #zen-sidebar-top-buttons {
margin: 4px 0;
margin: var(--zen-element-separation) 0 calc(var(--zen-toolbox-padding) / 2) 0;
}
& #PanelUI-menu-button {
@@ -264,7 +263,7 @@
display: none;
}
&:active {
#tabbrowser-tabs:not([movingtab]) &:active {
scale: var(--zen-active-tab-scale);
}
@@ -374,6 +373,12 @@
overflow-y: auto;
height: 100%;
scrollbar-width: thin;
/* Only do this hack if we have workspaces enabled */
:root[zen-workspace-id] & {
margin-left: calc(-1 * var(--zen-toolbox-padding));
width: calc(100% + var(--zen-toolbox-padding) * 2);
}
}
#zen-browser-tabs-container {
@@ -440,7 +445,7 @@
padding-right: 0;
:root[zen-single-toolbar='true'] & {
& #urlbar:not([breakout-extend='true']) .urlbar-input-container {
& #urlbar:not([breakout-extend='true']):not([pageproxystate='invalid']) .urlbar-input-container {
padding-left: 8px;
padding-right: 4px;
}
@@ -865,6 +870,7 @@
pointer-events: none;
width: 16px;
height: 16px;
border-radius: 4px;
}
&::after {
@@ -1050,7 +1056,7 @@
overflow: hidden;
transition: max-height 0.3s ease-out;
opacity: 1;
grid-template-columns: repeat(auto-fit, minmax(var(--tab-pinned-min-width-expanded), auto));
grid-template-columns: repeat(auto-fit, minmax(48px, auto));
overflow: hidden;
scrollbar-width: thin;
display: grid;
@@ -1102,7 +1108,7 @@
&::after {
content: "";
inset: -50%;
filter: blur(15px);
filter: blur(15px) brightness(1.2);
position: absolute;
background-size: 100% 100%;
background-clip: padding-box;
@@ -1168,7 +1174,7 @@
}
& .titlebar-buttonbox-container {
margin-left: calc(-1 * var(--zen-toolbox-max-width)) !important;
margin-left: calc(-1 * var(--zen-toolbox-max-width) + var(--zen-toolbox-padding) / 2) !important;
}
& #zen-appcontent-wrapper {
@@ -1261,5 +1267,9 @@
.zen-workspace-tabs-section {
position: absolute;
transform: translateX(-100%);
min-width: 100%;
min-width: calc(100% - var(--zen-toolbox-padding) * 2);
&:not(.zen-current-workspace-indicator) {
margin: 0 var(--zen-toolbox-padding);
}
}

6
src/browser/base/content/zen-styles/zen-theme.css
View File

@@ -79,7 +79,7 @@
--focus-outline-color: var(--button-bgcolor) !important;
--toolbarbutton-icon-fill-attention: var(--zen-primary-color) !important;
--toolbarbutton-icon-fill: light-dark(rgb(57, 57, 58), rgb(251, 251, 254)) !important;
--toolbarbutton-icon-fill: light-dark(rgba(57, 57, 58, 0.6), rgba(251, 251, 254, 0.6)) !important;
--button-primary-bgcolor: var(--in-content-primary-button-background) !important;
--button-primary-hover-bgcolor: var(--in-content-primary-button-background-hover) !important;
@@ -155,7 +155,7 @@
--input-bgcolor: var(--zen-colors-tertiary) !important;
--input-border-color: var(--zen-input-border-color) !important;
--zen-themed-toolbar-bg: light-dark(var(--zen-branding-bg), #161616);
--zen-themed-toolbar-bg: light-dark(rgb(240, 240, 244), #161616);
--zen-themed-toolbar-bg-transparent: light-dark(var(--zen-branding-bg), #161616);
--zen-workspace-indicator-height: 45px;
@@ -164,7 +164,7 @@
background: transparent;
--zen-themed-toolbar-bg-transparent: transparent;
@media (-moz-bool-pref: 'zen.widget.windows.acrylic') {
--zen-themed-toolbar-bg-transparent: color-mix(in srgb, var(--zen-themed-toolbar-bg) 80%, transparent 20%);
--zen-themed-toolbar-bg-transparent: color-mix(in srgb, var(--zen-themed-toolbar-bg) 75%, transparent 25%);
}
}

50
src/browser/base/content/zen-styles/zen-urlbar.css
View File

@@ -16,6 +16,10 @@
--urlbarView-highlight-background: var(--toolbarbutton-hover-background);
border-radius: var(--toolbarbutton-border-radius);
padding: 1px;
:root:not([zen-single-toolbar='true']) &[zen-floating-urlbar='true'] {
--urlbar-container-padding: 2px !important;
}
}
.urlbar-input::placeholder {
@@ -44,6 +48,16 @@
outline-color: none !important;
}
#urlbar:not([breakout-extend='true']) {
& #urlbar-background {
transition: background-color 0.15s ease;
}
&:hover #urlbar-background {
background-color: light-dark(rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.2)) !important;
}
}
#identity-box.chromeUI:not([pageproxystate='invalid']) {
& #identity-icon-box {
background: light-dark(rgba(0, 0, 0, 0.1), rgba(255, 255, 255, 0.1)) !important;
@@ -70,7 +84,7 @@
position: relative;
}
#urlbar:not([breakout-extend='true']) #identity-box:is(:not(.chromeUI), [pageproxystate='invalid']) {
#urlbar:not([breakout-extend='true']) #identity-box {
margin-inline-end: 0 !important;
}
@@ -80,6 +94,12 @@
justify-content: center !important;
align-items: center !important;
margin: 0;
:root[zen-single-toolbar='true'] & {
padding: 6px !important;
width: unset !important;
height: unset !important;
}
}
#tracking-protection-icon-container {
@@ -88,8 +108,6 @@
.urlbar-page-action,
#tracking-protection-icon-container {
width: calc(var(--urlbar-min-height) - 6 * var(--urlbar-container-padding)) !important;
height: calc(var(--urlbar-min-height) - 6 * var(--urlbar-container-padding)) !important;
margin-top: auto !important;
margin-bottom: auto !important;
}
@@ -119,10 +137,11 @@
box-shadow: 0px 0px 90px -10px rgba(0, 0, 0, 0.6) !important;
border: 1px solid hsla(0, 0%, 100%, 0.1) !important;
backdrop-filter: none !important;
border-radius: 0.8rem !important;
}
#urlbar-go-button {
margin: auto 0;
display: none;
}
:root[zen-single-toolbar='true'] {
@@ -133,11 +152,11 @@
display: none;
}
#identity-icon-box:not([open]) {
margin-inline-start: calc(-8px - 2 * var(--urlbar-icon-padding)) !important;
#identity-box:not([pageproxystate='invalid']) #identity-icon-box:not([open]) {
margin-inline-start: calc(-8px - 2 * var(--urlbar-icon-padding));
transform: translateX(100%);
opacity: 0;
transition: all 0.1s ease;
opacity: 0;
}
#identity-permission-box > *:not(#permissions-granted-icon) {
@@ -153,9 +172,9 @@
#identity-permission-box
),
#urlbar:hover #identity-icon-box {
opacity: 1;
opacity: 1 !important;
margin-inline-start: 0 !important;
transform: none;
transform: none !important;
display: flex;
#urlbar:not(:hover) & {
transition: 0;
@@ -167,7 +186,7 @@
}
#urlbar:not([open]) {
#identity-box {
#identity-box:not([pageproxystate='invalid']) {
order: 9;
}
}
@@ -317,7 +336,7 @@ button.popup-notification-dropmarker {
background: transparent;
&[notificationside='top'] {
position: absolute;
position: fixed;
bottom: calc(var(--zen-element-separation) * 1.5);
right: calc(var(--zen-element-separation) * 1.5);
width: fit-content;
@@ -435,9 +454,8 @@ button.popup-notification-dropmarker {
font-size: 1.5em !important;
width: min(90%, 60rem) !important;
}
top: 50vh !important;
top: 25vh !important;
transform: translateX(-50%);
margin-top: -20%;
left: 50% !important;
#urlbar-container:has(&) {
@@ -446,6 +464,12 @@ button.popup-notification-dropmarker {
}
}
@media not (-moz-bool-pref: 'zen.urlbar.show-protections-icon') {
#tracking-protection-icon-container {
display: none !important;
}
}
/* Code ~~stolen~~ taken inspiration from https://github.com/greeeen-dev/zen-arc-cmd-bar
*
* MIT License

24
src/browser/base/content/zen-styles/zen-welcome.css
View File

@@ -24,10 +24,6 @@
list-style-image: url(chrome://browser/skin/zen-icons/forward.svg);
position: absolute;
bottom: 10%;
.button-icon {
filter: invert(1);
}
}
#zen-welcome-title {
@@ -58,6 +54,7 @@
width: 60%;
height: 60%;
box-shadow: var(--zen-big-shadow);
overflow: hidden;
/* Small screens */
@media (max-width: 1400px) {
@@ -89,13 +86,18 @@
width: 100%;
height: 100%;
opacity: 0;
color: var(--zen-primary-color);
fill: var(--zen-primary-color);
color: currentColor;
fill: currentColor;
-moz-context-properties: fill, fill-opacity;
background-image: url(chrome://browser/skin/zen-icons/essential-add.svg);
background-size: 15%;
background-repeat: no-repeat;
background-position: center;
}
&[animate-heart] {
overflow: hidden;
}
}
#zen-welcome-page-sidebar-buttons {
@@ -129,6 +131,7 @@
#zen-welcome-page-content {
background: light-dark(rgba(0, 0, 0, 0.1), rgba(255, 255, 255, 0.1));
width: 60%;
max-width: 80rem;
height: 100%;
position: relative;
overflow: hidden;
@@ -205,7 +208,7 @@
#zen-welcome-initial-essentials-browser-sidebar-essentials {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 0.8rem;
gap: 0.4rem 1.2rem;
visibility: visible;
& * {
@@ -245,15 +248,10 @@
&[visuallyselected] {
transform: scale(1.04);
& .tab-background {
--zen-essential-bg-margin: 3px;
box-shadow: var(--zen-big-shadow);
}
}
& .tab-background::after {
filter: blur(30px) !important;
filter: blur(30px) brightness(1.2);
}
}
}

5
src/browser/base/content/zen-styles/zen-workspaces.css
View File

@@ -9,6 +9,7 @@
justify-content: center;
align-items: center;
display: flex;
font-size: x-small;
position: relative;
@@ -451,6 +452,7 @@
/* Mark workspaces indicator */
#zen-current-workspace-indicator-container {
position: relative;
margin-bottom: var(--zen-workspace-indicator-height);
}
@@ -464,6 +466,7 @@
align-items: center;
flex-direction: row !important;
max-width: 100%;
width: 100%;
&::before {
border-radius: var(--border-radius-medium);
@@ -488,6 +491,7 @@
& .zen-current-workspace-indicator-icon {
font-size: 12px;
line-height: 1;
}
.zen-current-workspace-indicator-name {
@@ -497,6 +501,7 @@
overflow: hidden;
text-overflow: ellipsis;
pointer-events: none;
font-size: small;
}
}

10
src/browser/base/moz-build.patch Normal file
View File

@@ -0,0 +1,10 @@
diff --git a/browser/base/moz.build b/browser/base/moz.build
index 636e0841786735a63ddea00e819c0b6f0b8a5d4d..6685d857180944d68bf4f049919f81361084c481 100644
--- a/browser/base/moz.build
+++ b/browser/base/moz.build
@@ -87,3 +87,5 @@ if CONFIG["MOZ_WIDGET_TOOLKIT"] in ("windows", "gtk"):
DEFINES["MENUBAR_CAN_AUTOHIDE"] = 1
JAR_MANIFESTS += ["jar.mn"]
+
+DIRS += ["zen-components"]

61
src/browser/base/zen-components/ZenCompactMode.mjs
View File

@@ -37,6 +37,9 @@ var gZenCompactModeManager = {
this.addMouseActions();
this.addContextMenu();
// Clear hover states when window state changes (minimize, maximize, etc.)
window.addEventListener('sizemodechange', () => this._clearAllHoverStates());
},
get preference() {
@@ -141,10 +144,17 @@ var gZenCompactModeManager = {
this.animateCompactMode();
},
getAndApplySidebarWidth() {
// NOTE: Dont actually use event, it's just so we make sure
// the caller is from the ResizeObserver
getAndApplySidebarWidth(event = undefined) {
let sidebarWidth = this.sidebar.getBoundingClientRect().width;
if (sidebarWidth > 1) {
gZenUIManager.restoreScrollbarState();
// Second variable to get the genuine width of the sidebar
this.sidebar.style.setProperty('--actual-zen-sidebar-width', `${sidebarWidth}px`);
if (event && this.preference) {
return;
}
this.sidebar.style.setProperty('--zen-sidebar-width', `${sidebarWidth}px`);
}
return sidebarWidth;
@@ -158,10 +168,15 @@ var gZenCompactModeManager = {
const canAnimate =
lazyCompactMode.COMPACT_MODE_CAN_ANIMATE_SIDEBAR &&
!this.sidebar.hasAttribute('zen-user-show') &&
!this.sidebar.hasAttribute('zen-has-empty-tab') &&
!this.sidebar.hasAttribute('zen-has-hover');
// Do this so we can get the correct width ONCE compact mode styled have been applied
const titlebar = this.sidebar.querySelector('#titlebar');
if (canAnimate) {
this.sidebar.setAttribute('animate', 'true');
titlebar.setAttribute('has-animated-padding', 'true');
} else {
titlebar.removeAttribute('has-animated-padding');
}
this.sidebar.style.removeProperty('margin-right');
this.sidebar.style.removeProperty('margin-left');
@@ -191,15 +206,18 @@ var gZenCompactModeManager = {
)
.then(() => {
window.requestAnimationFrame(() => {
this.sidebar.style.transition = 'none';
this.sidebar.removeAttribute('animate');
this.sidebar.style.visibility = 'hidden';
this.sidebar.style.removeProperty('margin-right');
this.sidebar.style.removeProperty('margin-left');
this.sidebar.style.removeProperty('transform');
this.sidebar.style.transition = 'none';
setTimeout(() => {
this._animating = false;
this.sidebar.style.removeProperty('visibility');
this.sidebar.style.removeProperty('transition');
});
this.sidebar.style.removeProperty('opacity');
}, 300);
});
});
} else if (canHideSidebar && !isCompactMode) {
@@ -308,9 +326,6 @@ var gZenCompactModeManager = {
{
element: gZenVerticalTabsManager.actualWindowButtons,
},
{
element: gZenVerticalTabsManager.actualWindowButtons,
},
];
},
@@ -346,14 +361,13 @@ var gZenCompactModeManager = {
addMouseActions() {
for (let i = 0; i < this.hoverableElements.length; i++) {
let target = this.hoverableElements[i].element;
target.addEventListener('mouseenter', (event) => {
if (!event.target.matches(':hover')) return;
const onEnter = (event) => {
if (event.type === 'mouseenter' && !event.target.matches(':hover')) return;
this.clearFlashTimeout('has-hover' + target.id);
window.requestAnimationFrame(() => target.setAttribute('zen-has-hover', 'true'));
});
};
target.addEventListener('mouseleave', (event) => {
// If on Mac, ignore mouseleave in the area of window buttons
const onLeave = (event) => {
if (AppConstants.platform == 'macosx') {
const buttonRect = gZenVerticalTabsManager.actualWindowButtons.getBoundingClientRect();
const MAC_WINDOW_BUTTONS_X_BORDER = buttonRect.width + buttonRect.x;
@@ -368,6 +382,12 @@ var gZenCompactModeManager = {
}
}
// When moving the cursor between the url bar and bookmarks, or in-between bookmarks in the bookmark bar, the
// mouseLeave event is triggered without a relatedTarget.
if (event.relatedTarget == null) {
return;
}
// If it's a child element but not the target, ignore the event
if (target.contains(event.explicitOriginalTarget) && event.explicitOriginalTarget !== target) {
return;
@@ -378,7 +398,13 @@ var gZenCompactModeManager = {
} else {
this._removeHoverFrames[target.id] = window.requestAnimationFrame(() => target.removeAttribute('zen-has-hover'));
}
});
};
target.addEventListener('mouseenter', onEnter);
target.addEventListener('dragover', onEnter);
target.addEventListener('mouseleave', onLeave);
target.addEventListener('dragleave', onLeave);
}
document.documentElement.addEventListener('mouseleave', (event) => {
@@ -427,4 +453,15 @@ var gZenCompactModeManager = {
let toolbar = document.getElementById('zen-appcontent-navbar-container');
toolbar.toggleAttribute('zen-user-show');
},
_clearAllHoverStates() {
// Clear hover attributes from all hoverable elements
for (let entry of this.hoverableElements) {
const target = entry.element;
if (target && !target.matches(':hover') && target.hasAttribute('zen-has-hover')) {
target.removeAttribute('zen-has-hover');
this.clearFlashTimeout('has-hover' + target.id);
}
}
},
};

2
src/browser/base/zen-components/ZenEmojies.mjs
View File

File diff suppressed because one or more lines are too long

68
src/browser/base/zen-components/ZenGlanceManager.mjs
View File

@@ -6,8 +6,9 @@
#glances = new Map();
#currentGlanceID = null;
#confirmationTimeout = null;
init() {
window.addEventListener('keydown', this.onKeyDown.bind(this));
window.addEventListener('TabClose', this.onTabClose.bind(this));
window.addEventListener('TabSelect', this.onLocationChange.bind(this));
@@ -33,16 +34,6 @@
return this.#glances.get(this.#currentGlanceID)?.parentTab;
}
// If the user presses Escape while a Glance is open, close it
onKeyDown(event) {
if (event.defaultPrevented) return;
if (event.key === 'Escape' && this.#currentGlanceID) {
event.preventDefault();
event.stopPropagation();
this.closeGlance({ onTabClose: true });
}
}
onOverlayClick(event) {
// If user clicks outside content area, close glance
if (event.target === this.overlay && event.originalTarget !== this.contentWrapper) {
@@ -67,7 +58,7 @@
// Figure out where to insert new tabs
getTabPosition(tab) {
return Math.max(gBrowser._numVisiblePinTabs, tab._tPos);
return Math.max(gBrowser.pinnedTabCount, tab._tPos);
}
// Create a new tab for Glance
@@ -77,7 +68,7 @@
skipBackgroundNotify: true,
insertTab: true,
skipLoad: false,
index: this.getTabPosition(currentTab),
index: this.getTabPosition(currentTab) + 1,
};
currentTab._selected = true;
@@ -247,11 +238,26 @@
});
}
closeGlance({ noAnimation = false, onTabClose = false, setNewID = null, isDifferent = false } = {}) {
closeGlance({ noAnimation = false, onTabClose = false, setNewID = null, isDifferent = false, hasFocused = false } = {}) {
if (this._animating || !this.#currentBrowser || this.animatingOpen || this._duringOpening) {
return;
}
let { permitUnload } = this.#currentBrowser.permitUnload();
if (!permitUnload) {
return;
}
if (onTabClose && hasFocused && !this.#confirmationTimeout) {
const cancelButton = document.getElementById('zen-glance-sidebar-close');
cancelButton.setAttribute('waitconfirmation', true);
this.#confirmationTimeout = setTimeout(() => {
cancelButton.removeAttribute('waitconfirmation');
this.#confirmationTimeout = null;
}, 3000);
return;
}
this.browserWrapper.removeAttribute('has-finished-animation');
if (noAnimation) {
this.#currentParentTab.linkedBrowser.closest('.browserSidebarContainer').removeAttribute('style');
@@ -301,16 +307,15 @@
.then(() => {
this.#currentParentTab.linkedBrowser.closest('.browserSidebarContainer').removeAttribute('style');
});
// Animate the browser wrapper back
this.browserWrapper.style.opacity = 1;
gZenUIManager.motion
.animate(
this.browserWrapper,
{
...originalPosition,
opacity: 0.3,
opacity: 0,
},
{ type: 'spring', bounce: 0, duration: 0.4, easing: 'ease' }
{ type: 'spring', bounce: 0, duration: 0.5, easing: 'ease-in' }
)
.then(() => {
this.browserWrapper.removeAttribute('animate');
@@ -336,8 +341,7 @@
this.#currentParentTab._visuallySelected = false;
}
// Reset everything
const prevOverlay = this.overlay;
// reset everything
this.browserWrapper = null;
this.overlay = null;
this.contentWrapper = null;
@@ -349,7 +353,7 @@
gBrowser.selectedTab = this.#currentParentTab;
}
this._ignoreClose = true;
gBrowser.removeTab(this.lastCurrentTab, { animate: true });
gBrowser.removeTab(this.lastCurrentTab, { animate: true, skipPermitUnload: true });
gBrowser.tabContainer._invalidateCachedTabs();
this.#currentParentTab.removeAttribute('glance-id');
@@ -437,9 +441,18 @@
}
}
// If location changes to a tab with a different glance-id, close the old one
clearConfirmationTimeout() {
if (this.#confirmationTimeout) {
clearTimeout(this.#confirmationTimeout);
this.#confirmationTimeout = null;
}
document.getElementById('zen-glance-sidebar-close')?.removeAttribute('waitconfirmation');
}
// note: must be sync to avoid timing issues
onLocationChange(event) {
const tab = event.target;
this.clearConfirmationTimeout();
if (this.animatingFullOpen || this.closingGlance) {
return;
}
@@ -502,7 +515,6 @@
owner &&
owner.pinned &&
this._lazyPref.SHOULD_OPEN_EXTERNAL_TABS_IN_GLANCE &&
owner.linkedBrowser?.docShellIsActive &&
owner.linkedBrowser?.browsingContext?.isAppTab &&
this.tabDomainsDiffer(owner, uri) &&
Services.prefs.getBoolPref('zen.glance.enabled', true)
@@ -515,7 +527,11 @@
try {
if (this.shouldOpenTabInGlance(tab, uri)) {
const browserRect = gBrowser.tabbox.getBoundingClientRect();
this.openGlance({ url: undefined, x: browserRect.width / 2, y: browserRect.height / 2, width: 0, height: 0 });
this.openGlance(
{ url: undefined, x: browserRect.width / 2, y: browserRect.height / 2, width: 0, height: 0 },
tab,
tab.owner
);
}
} catch (e) {
console.error(e);
@@ -610,8 +626,12 @@
esModuleURI: 'chrome://browser/content/zen-components/actors/ZenGlanceChild.sys.mjs',
events: {
DOMContentLoaded: {},
keydown: {
capture: true,
},
},
},
allFrames: true,
matches: ['https://*/*'],
});
}

2
src/browser/base/zen-components/ZenGradientGenerator.mjs
View File

@@ -863,7 +863,7 @@
getToolbarModifiedBase() {
return this.isDarkMode
? 'color-mix(in srgb, var(--zen-themed-toolbar-bg) 80%, #fff 20%)'
: 'color-mix(in srgb, var(--zen-themed-toolbar-bg) 95%, #000 5%)';
: 'color-mix(in srgb, var(--zen-themed-toolbar-bg) 95%, #000 6%)';
}
getSingleRGBColor(color, forToolbar = false) {

322
src/browser/base/zen-components/ZenMediaController.mjs Normal file
View File

@@ -0,0 +1,322 @@
class ZenMediaController {
_currentMediaController = null;
_currentBrowser = null;
_mediaUpdateInterval = null;
mediaTitle = null;
mediaArtist = null;
mediaControlBar = null;
mediaServiceIcon = null;
mediaServiceTitle = null;
mediaProgressBar = null;
mediaCurrentTime = null;
mediaDuration = null;
mediaFocusButton = null;
mediaProgressBarContainer = null;
supportedKeys = ['playpause', 'previoustrack', 'nexttrack'];
init() {
this.mediaTitle = document.querySelector('#zen-media-title');
this.mediaArtist = document.querySelector('#zen-media-artist');
this.mediaControlBar = document.querySelector('#zen-media-controls-toolbar');
this.mediaServiceIcon = document.querySelector('#zen-media-service-button > image');
this.mediaServiceTitle = document.querySelector('#zen-media-service-title');
this.mediaProgressBar = document.querySelector('#zen-media-progress-bar');
this.mediaCurrentTime = document.querySelector('#zen-media-current-time');
this.mediaDuration = document.querySelector('#zen-media-duration');
this.mediaFocusButton = document.querySelector('#zen-media-focus-button');
this.mediaProgressBarContainer = document.querySelector('#zen-media-progress-hbox');
window.addEventListener('TabSelect', (event) => {
if (this._currentBrowser) {
if (event.target.linkedBrowser.browserId === this._currentBrowser.browserId) {
gZenUIManager.motion
.animate(this.mediaControlBar, {
opacity: [1, 0],
y: [0, 10],
})
.then(() => {
this.mediaControlBar.setAttribute('hidden', 'true');
});
} else if (this.mediaControlBar.hasAttribute('hidden')) {
this.mediaControlBar.removeAttribute('hidden');
window.requestAnimationFrame(() => {
this.mediaControlBar.style.height =
this.mediaControlBar.querySelector('toolbaritem').getBoundingClientRect().height + 'px';
gZenUIManager.motion.animate(
this.mediaControlBar,
{
opacity: [0, 1],
y: [10, 0],
},
{}
);
});
}
gZenUIManager.updateTabsToolbar();
}
});
window.addEventListener('TabClose', (event) => {
if (this._currentBrowser) {
if (event.target.linkedBrowser.browserId === this._currentBrowser.browserId) {
this.deinitMediaController(this._currentMediaController);
}
}
});
}
/**
* Deinitializes a media controller, removing all event listeners and resetting state.
* @param {Object} mediaController - The media controller to deinitialize.
*/
deinitMediaController(mediaController) {
if (!mediaController) return;
mediaController.onpositionstatechange = null;
mediaController.onplaybackstatechange = null;
mediaController.onsupportedkeyschange = null;
mediaController.onmetadatachange = null;
mediaController.ondeactivated = null;
this._currentMediaController = null;
this._currentBrowser = null;
if (this._mediaUpdateInterval) {
clearInterval(this._mediaUpdateInterval);
this._mediaUpdateInterval = null;
}
this.mediaControlBar.setAttribute('hidden', 'true');
this.mediaControlBar.removeAttribute('muted');
this.mediaControlBar.classList.remove('playing');
gZenUIManager.updateTabsToolbar();
}
/**
* Sets up the media control UI with metadata and position state.
* @param {Object} metadata - The media metadata (title, artist, etc.).
* @param {Object} positionState - The position state (position, duration).
*/
setupMediaControl(metadata, positionState) {
if (!this.mediaControlBar.classList.contains('playing')) {
this.mediaControlBar.classList.add('playing');
}
// Have it displayed as e.g. <white>youtube</white><grey>.com</grey>
let host = this._currentBrowser._originalURI.displayHost;
if (host.startsWith('www.')) host = host.slice(4);
// note: we might have subdomains, so we need to split the host
const [service, ...tld] = host.split('.');
this.mediaServiceTitle.querySelector('.service').textContent = service;
this.mediaServiceTitle.querySelector('.tld').textContent = '.' + tld.join('.');
this.mediaServiceIcon.src = this._currentBrowser.mIconURL;
this.mediaFocusButton.style.listStyleImage = `url(${this._currentBrowser.mIconURL})`;
this.mediaTitle.textContent = metadata.title || '';
this.mediaArtist.textContent = metadata.artist || '';
gZenUIManager.updateTabsToolbar();
this._currentPosition = positionState.position;
this._currentDuration = positionState.duration;
this.updateMediaPosition();
for (const key of this.supportedKeys) {
const button = this.mediaControlBar.querySelector(`#zen-media-${key}-button`);
button.disabled = !this._currentMediaController.supportedKeys.includes(key);
}
}
/**
* @param {Object} mediaController - The media controller to activate.
* @param {Object} browser - The browser associated with the media controller.
*/
activateMediaControls(mediaController, browser) {
this.updateMuteState();
if (this._currentBrowser?.browserId === browser.browserId) return;
else {
this.deinitMediaController(this._currentMediaController);
this._currentMediaController = mediaController;
this._currentBrowser = browser;
}
mediaController.onpositionstatechange = this.onPositionstateChange.bind(this);
mediaController.onplaybackstatechange = this.onPlaybackstateChange.bind(this);
mediaController.onsupportedkeyschange = this.onSupportedKeysChange.bind(this);
mediaController.onmetadatachange = this.onMetadataChange.bind(this);
mediaController.ondeactivated = this.onDeactivated.bind(this);
const metadata = mediaController.getMetadata();
const positionState = mediaController.getPositionState();
this.setupMediaControl(metadata, positionState);
}
/**
* @param {Event} event - The deactivation event.
*/
onDeactivated(event) {
if (event.target === this._currentMediaController) {
this.deinitMediaController(event.target);
}
}
/**
* Updates playback state and UI based on changes.
* @param {Event} event - The playback state change event.
*/
onPlaybackstateChange(event) {
this.mediaControlBar.classList.toggle('playing', event.target.isPlaying);
}
/**
* Updates supported keys in the UI.
* @param {Event} event - The supported keys change event.
*/
onSupportedKeysChange(event) {
for (const key of this.supportedKeys) {
const button = this.mediaControlBar.querySelector(`#zen-media-${key}-button`);
button.disabled = !event.target.supportedKeys.includes(key);
}
}
/**
* Updates position state and UI when the media position changes.
* @param {Event} event - The position state change event.
*/
onPositionstateChange(event) {
if (event.target !== this._currentMediaController) return;
this._currentPosition = event.position;
this._currentDuration = event.duration;
this.updateMediaPosition();
}
/**
* Updates the media progress bar and time display.
*/
updateMediaPosition() {
if (this._mediaUpdateInterval) {
clearInterval(this._mediaUpdateInterval);
this._mediaUpdateInterval = null;
}
if (this._currentDuration >= 900_000) return this.mediaProgressBarContainer.setAttribute('hidden', 'true');
else this.mediaProgressBarContainer.removeAttribute('hidden');
this.mediaCurrentTime.textContent = this.formatSecondsToTime(this._currentPosition);
this.mediaDuration.textContent = this.formatSecondsToTime(this._currentDuration);
this.mediaProgressBar.value = (this._currentPosition / this._currentDuration) * 100;
if (this._currentMediaController?.isPlaying) {
this._mediaUpdateInterval = setInterval(() => {
if (this._currentMediaController?.isPlaying) {
this._currentPosition += 1;
if (this._currentPosition > this._currentDuration) {
this._currentPosition = this._currentDuration;
}
this.mediaCurrentTime.textContent = this.formatSecondsToTime(this._currentPosition);
this.mediaProgressBar.value = (this._currentPosition / this._currentDuration) * 100;
} else {
clearInterval(this._mediaUpdateInterval);
this._mediaUpdateInterval = null;
}
}, 1000);
}
}
/**
* Formats seconds into a hours:minutes:seconds string.
* @param {number} seconds - The time in seconds.
* @returns {string} Formatted time string.
*/
formatSecondsToTime(seconds) {
if (!seconds || isNaN(seconds)) return '0:00';
const totalSeconds = Math.max(0, Math.ceil(seconds));
const hours = Math.floor(totalSeconds / 3600);
const minutes = Math.floor((totalSeconds % 3600) / 60).toString();
const secs = (totalSeconds % 60).toString();
if (hours > 0) {
return `${hours}:${minutes.padStart(2, '0')}:${secs.padStart(2, '0')}`;
}
return `${minutes}:${secs.padStart(2, '0')}`;
}
/**
* Updates metadata in the UI.
* @param {Event} event - The metadata change event.
*/
onMetadataChange(event) {
const metadata = event.target.getMetadata();
this.mediaTitle.textContent = metadata.title || '';
this.mediaArtist.textContent = metadata.artist || '';
}
onMediaPlayPrev() {
if (this._currentMediaController?.supportedKeys.includes('previoustrack')) {
this._currentMediaController.prevTrack();
}
}
onMediaPlayNext() {
if (this._currentMediaController?.supportedKeys.includes('nexttrack')) {
this._currentMediaController.nextTrack();
}
}
onMediaSeekDrag(event) {
this._currentMediaController?.pause();
const newTime = (event.target.value / 100) * this._currentDuration;
this.mediaCurrentTime.textContent = this.formatSecondsToTime(newTime);
}
onMediaSeekComplete(event) {
const newPosition = (event.target.value / 100) * this._currentDuration;
if (this._currentMediaController?.supportedKeys.includes('seekto')) {
this._currentMediaController.seekTo(newPosition);
this._currentMediaController.play();
}
}
onMediaFocus() {
this._currentMediaController?.focus();
}
onMediaMute() {
if (!this.mediaControlBar.hasAttribute('muted')) {
this._currentBrowser.mute();
this.mediaControlBar.setAttribute('muted', '');
} else {
this._currentBrowser.unmute();
this.mediaControlBar.removeAttribute('muted');
}
}
onMediaToggle() {
if (this.mediaControlBar.classList.contains('playing')) {
this._currentMediaController?.pause();
} else {
this._currentMediaController?.play();
}
}
updateMuteState() {
if (!this._currentBrowser) return;
if (this._currentBrowser._audioMuted) {
this.mediaControlBar.setAttribute('muted', '');
} else {
this.mediaControlBar.removeAttribute('muted');
}
}
}
window.gZenMediaController = new ZenMediaController();

42
src/browser/base/zen-components/ZenPinnedTabManager.mjs
View File

@@ -211,8 +211,9 @@
continue;
}
if (pin.title && pin.editedTitle) {
gBrowser._setTabLabel(tab, pin.title);
if (pin.title && (pin.editedTitle || tab.hasAttribute('zen-has-static-label'))) {
tab.removeAttribute('zen-has-static-label'); // So we can set it again
gBrowser._setTabLabel(tab, pin.title, { beforeTabOpen: true });
tab.setAttribute('zen-has-static-label', 'true');
}
}
@@ -339,7 +340,7 @@
tab.position = tab._tPos;
for (let otherTab of gBrowser.tabs) {
if (otherTab.pinned) {
if (otherTab.pinned && otherTab.getAttribute('zen-pin-id') !== tab.getAttribute('zen-pin-id')) {
const actualPin = this._pinsCache.find((pin) => pin.uuid === otherTab.getAttribute('zen-pin-id'));
if (!actualPin) {
continue;
@@ -356,6 +357,13 @@
}
actualPin.position = tab.position;
actualPin.isEssential = tab.hasAttribute('zen-essential');
// There was a bug where the title and hasStaticLabel attribute were not being set
// This is a workaround to fix that
if (tab.hasAttribute('zen-has-static-label')) {
actualPin.editedTitle = true;
actualPin.title = tab.label;
}
await this.savePin(actualPin);
}
@@ -458,6 +466,7 @@
if (!isClosing) {
tab.removeAttribute('zen-pin-id');
tab.removeAttribute('zen-essential'); // Just in case
if (!tab.hasAttribute('zen-workspace-id') && ZenWorkspaces.workspaceEnabled) {
const workspace = await ZenWorkspaces.getActiveWorkspace();
@@ -600,7 +609,14 @@
}
addToEssentials(tab) {
const tabs = tab ? [tab] : TabContextMenu.contextTab.multiselected ? gBrowser.selectedTabs : [TabContextMenu.contextTab];
const tabs = tab
? // if it's already an array, dont make it [tab]
tab?.length
? tab
: [tab]
: TabContextMenu.contextTab.multiselected
? gBrowser.selectedTabs
: [TabContextMenu.contextTab];
for (let i = 0; i < tabs.length; i++) {
const tab = tabs[i];
if (tab.hasAttribute('zen-essential')) {
@@ -621,8 +637,8 @@
} else {
gBrowser.pinTab(tab);
}
this.onTabIconChanged(tab);
this._onTabMove(tab);
this.onTabIconChanged(tab);
}
gZenUIManager.updateTabsToolbar();
}
@@ -701,6 +717,7 @@
}
moveToAnotherTabContainerIfNecessary(event, movingTabs) {
try {
const pinnedTabsTarget =
event.target.closest('#vertical-pinned-tabs-container') || event.target.closest('.zen-current-workspace-indicator');
const essentialTabsTarget = event.target.closest('#zen-essentials-container');
@@ -722,7 +739,7 @@
}
// Check for essentials container
else if (essentialTabsTarget) {
if (!draggedTab.hasAttribute('zen-essential')) {
if (!draggedTab.hasAttribute('zen-essential') && !draggedTab?.group?.hasAttribute('split-view-group')) {
this.addToEssentials(draggedTab);
moved = true;
isVertical = false;
@@ -767,6 +784,10 @@
}
return moved;
} catch (ex) {
console.error('Error moving tabs:', ex);
return false;
}
}
async onLocationChange(browser) {
@@ -837,6 +858,15 @@
// update the label for the same pin across all windows
for (const browser of browsers) {
const tabs = browser.gBrowser.tabs;
// Fix pinned cache for the browser
const browserCache = browser.gZenPinnedTabManager?._pinsCache;
if (browserCache) {
const pin = browserCache.find((pin) => pin.uuid === uuid);
if (pin) {
pin.title = newTitle;
pin.editedTitle = isEdited;
}
}
for (let i = 0; i < tabs.length; i++) {
const tabToEdit = tabs[i];
if (tabToEdit.getAttribute('zen-pin-id') === uuid && tabToEdit !== tab) {

2
src/browser/base/zen-components/ZenRices.mjs
View File

@@ -176,7 +176,7 @@
<checkbox data-l10n-id="zen-rice-share-include-workspace-themes" id="zen-rice-share-include-workspace-themes" />
</vbox>
<html:moz-button-group class="panel-footer">
<button onclick="gZenThemePicker.riceManager.cancel()" class="footer-button" data-l10n-id="zen-rice-share-cancel" />
<button onclick="gZenThemePicker.riceManager.cancel()" class="footer-button" data-l10n-id="zen-general-cancel" />
<button onclick="gZenThemePicker.riceManager.submit()" class="footer-button" data-l10n-id="zen-rice-share-save" default="true" slot="primary" id="zen-rice-share-save" disabled="true" />
</html:moz-button-group>
</vbox>

7
src/browser/base/zen-components/ZenSidebarManager.mjs
View File

@@ -27,7 +27,6 @@ class ZenBrowserManagerSidebar extends ZenDOMOperatedFeature {
this.onlySafeWidthAndHeight();
this.initProgressListener();
this.update();
this.close(); // avoid caching
this.tabBox.prepend(this.sidebarWrapper);
this.listenForPrefChanges();
@@ -182,8 +181,8 @@ class ZenBrowserManagerSidebar extends ZenDOMOperatedFeature {
const leftMouseOffset = startLeft - mouseDownEvent.screenX;
const moveListener = (mouseMoveEvent) => {
window.requestAnimationFrame(() => {
let top = mouseMoveEvent.screenY + topMouseOffset;
let left = mouseMoveEvent.screenX + leftMouseOffset;
let top = mouseMoveEvent.clientY + topMouseOffset;
let left = mouseMoveEvent.clientX + leftMouseOffset;
const wrapperBounds = this.sidebarWrapper.getBoundingClientRect();
top = Math.max(0, Math.min(top, wrapperBounds.height - sideBarHeight));
@@ -557,6 +556,7 @@ class ZenBrowserManagerSidebar extends ZenDOMOperatedFeature {
_getWebPanelIcon(url, element) {
let { preferredURI } = Services.uriFixup.getFixupURIInfo(url);
element.setAttribute('image', `page-icon:${preferredURI.spec}`);
if (Services.prefs.getBoolPref('zen.sidebar.use-google-favicons')) {
fetch(`https://s2.googleusercontent.com/s2/favicons?domain_url=${preferredURI.spec}`).then(async (response) => {
if (response.ok) {
let blob = await response.blob();
@@ -568,6 +568,7 @@ class ZenBrowserManagerSidebar extends ZenDOMOperatedFeature {
}
});
}
}
_getBrowserById(id) {
let sidebar = document.getElementById('zen-sidebar-web-panel');

5
src/browser/base/zen-components/ZenTabUnloader.mjs
View File

@@ -264,7 +264,7 @@
(tab.pinned && !ignoreTimestamp) ||
tab.selected ||
(tab.multiselected && !ignoreTimestamp) ||
tab.hasAttribute('busy') ||
(tab.hasAttribute('busy') && !ignoreTimestamp) ||
tab.hasAttribute('pending') ||
!tab.linkedPanel ||
tab.splitView ||
@@ -274,7 +274,8 @@
(tab.pictureinpicture && !ignoreTimestamp) ||
(tab.soundPlaying && !ignoreTimestamp) ||
(tab.zenIgnoreUnload && !ignoreTimestamp) ||
excludedUrls.some((url) => url.test(tab.linkedBrowser?.currentURI.spec))
(excludedUrls.some((url) => url.test(tab.linkedBrowser?.currentURI.spec)) &&
tab.linkedBrowser?.currentURI.spec !== 'about:blank')
) {
return false;
}

396
src/browser/base/zen-components/ZenViewSplitter.mjs
View File

@@ -51,7 +51,7 @@ class SplitNode extends SplitLeafNode {
addChild(child) {
child.parent = this;
this._children.push(child);
this._children.unshift(child);
}
}
@@ -69,6 +69,8 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
_edgeHoverSize;
minResizeWidth;
_lastOpenedTab = null;
MAX_TABS = 4;
init() {
@@ -81,9 +83,17 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
ChromeUtils.defineLazyGetter(this, 'dropZone', () => document.getElementById('zen-splitview-dropzone'));
window.addEventListener('TabClose', this.handleTabClose.bind(this));
window.addEventListener('TabSelect', this.onTabSelect.bind(this));
this.initializeContextMenu();
this.insertPageActionButton();
this.insertIntoContextMenu();
// Add drag over listener to the browser view
if (Services.prefs.getBoolPref('zen.splitView.enable-tab-drop')) {
const tabBox = document.getElementById('tabbrowser-tabbox');
tabBox.addEventListener('dragover', this.onBrowserDragOverToSplit.bind(this));
this.onBrowserDragEndToSplit = this.onBrowserDragEndToSplit.bind(this);
}
}
insertIntoContextMenu() {
@@ -102,6 +112,9 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
*/
handleTabClose(event) {
const tab = event.target;
if (tab === this._lastOpenedTab) {
this._lastOpenedTab = null;
}
const groupIndex = this._data.findIndex((group) => group.tabs.includes(tab));
if (groupIndex < 0) {
return;
@@ -109,6 +122,18 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
this.removeTabFromGroup(tab, groupIndex, event.forUnsplit);
}
/**
* @param {Event} event - The event that triggered the tab select.
* @description Handles the tab select event.
* @returns {void}
*/
onTabSelect(event) {
const previousTab = event.detail.previousTab;
if (previousTab && !previousTab.hasAttribute('zen-empty-tab')) {
this._lastOpenedTab = previousTab;
}
}
/**
* Removes a tab from a group.
*
@@ -142,6 +167,188 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
}
}
onBrowserDragOverToSplit(event) {
var dt = event.dataTransfer;
var draggedTab;
if (dt.mozTypesAt(0)[0] == TAB_DROP_TYPE) {
// tab copy or move
draggedTab = dt.mozGetDataAt(TAB_DROP_TYPE, 0);
// not our drop then
if (!draggedTab || gBrowser.selectedTab.hasAttribute('zen-empty-tab')) {
return;
}
draggedTab.container._finishMoveTogetherSelectedTabs(draggedTab);
}
if (
!draggedTab ||
this._canDrop ||
this._hasAnimated ||
this.fakeBrowser ||
!this._lastOpenedTab ||
(this._lastOpenedTab &&
(this._lastOpenedTab.getAttribute('zen-workspace-id') !== draggedTab.getAttribute('zen-workspace-id') ||
this._lastOpenedTab.hasAttribute('zen-essential')))
) {
return;
}
if (draggedTab.splitView) {
return;
}
const currentView = this._data[this._lastOpenedTab.splitViewValue];
if (currentView?.tabs.length >= this.MAX_TABS) {
return;
}
const panelsRect = gBrowser.tabbox.getBoundingClientRect();
const panelsWidth = panelsRect.width;
if (
event.clientX > panelsRect.left + panelsWidth - 10 ||
event.clientX < panelsRect.left + 10 ||
event.clientY < panelsRect.top + 10 ||
event.clientY > panelsRect.bottom - 10
) {
return;
}
// first quarter or last quarter of the screen, but not the middle
if (!(event.clientX < panelsRect.left + panelsWidth / 4 || event.clientX > panelsRect.left + (panelsWidth / 4) * 3)) {
return;
}
dt.mozCursor = 'default';
const oldTab = this._lastOpenedTab;
this._canDrop = true;
{
this._draggingTab = draggedTab;
gBrowser.selectedTab = oldTab;
this._hasAnimated = true;
for (const tab of gBrowser.tabs) {
tab.style.removeProperty('transform');
}
const panelsWidth = gBrowser.tabbox.getBoundingClientRect().width;
const halfWidth = panelsWidth / 2;
const side = event.clientX > halfWidth ? 'right' : 'left';
this.fakeBrowser = document.createXULElement('vbox');
this.fakeBrowser.addEventListener('dragleave', this.onBrowserDragEndToSplit);
window.addEventListener('dragend', this.onBrowserDragEndToSplit, { once: true });
const padding = Services.prefs.getIntPref('zen.theme.content-element-separation', 0);
this.fakeBrowser.setAttribute('flex', '1');
this.fakeBrowser.id = 'zen-split-view-fake-browser';
gBrowser.tabbox.appendChild(this.fakeBrowser);
this.fakeBrowser.style.setProperty('--zen-split-view-fake-icon', `url(${draggedTab.getAttribute('image')})`);
draggedTab._visuallySelected = true;
this.fakeBrowser.setAttribute('side', side);
this._finishAllAnimatingPromise = Promise.all([
gZenUIManager.motion.animate(
gBrowser.tabbox,
side === 'left'
? {
paddingLeft: [0, `${halfWidth}px`],
paddingRight: 0,
}
: {
paddingRight: [0, `${halfWidth}px`],
paddingLeft: 0,
},
{
duration: 0.08,
easing: 'ease-out',
}
),
gZenUIManager.motion.animate(
this.fakeBrowser,
{
width: [0, `${halfWidth - padding}px`],
...(side === 'left'
? {
marginLeft: [0, `${-halfWidth}px`],
}
: {}),
},
{
duration: 0.08,
easing: 'ease-out',
}
),
]);
if (this._finishAllAnimatingPromise) {
this._finishAllAnimatingPromise.then(() => {
this._canDrop = true;
draggedTab._visuallySelected = true;
});
}
}
}
onBrowserDragEndToSplit(event) {
if (!this._canDrop) {
return;
}
const panelsRect = gBrowser.tabbox.getBoundingClientRect();
const fakeBrowserRect = this.fakeBrowser && this.fakeBrowser.getBoundingClientRect();
if (
(event.target.closest('#tabbrowser-tabbox') && event.target != this.fakeBrowser) ||
(fakeBrowserRect &&
event.clientX > fakeBrowserRect.left &&
event.clientX < fakeBrowserRect.left + fakeBrowserRect.width &&
event.clientY > fakeBrowserRect.top &&
event.clientY < fakeBrowserRect.top + fakeBrowserRect.height) ||
(event.screenX === 0 && event.screenY === 0) // It's equivalent to 0 if the event has been dropped
) {
return;
}
if (!this._hasAnimated || !this.fakeBrowser) {
return;
}
const panelsWidth = panelsRect.width;
const halfWidth = panelsWidth / 2;
const padding = Services.prefs.getIntPref('zen.theme.content-element-separation', 0);
if (!this.fakeBrowser) {
return;
}
this.fakeBrowser.classList.add('fade-out');
const side = this.fakeBrowser.getAttribute('side');
if (this._draggingTab) this._draggingTab.setAttribute('zen-has-splitted', 'true');
this._lastOpenedTab = gBrowser.selectedTab;
this._draggingTab = null;
try {
Promise.all([
gZenUIManager.motion.animate(
gBrowser.tabbox,
side === 'left'
? {
paddingLeft: [`${halfWidth}px`, 0],
}
: {
paddingRight: [`${halfWidth}px`, 0],
},
{
duration: 0.1,
easing: 'ease-out',
}
),
gZenUIManager.motion.animate(
this.fakeBrowser,
{
width: [`${halfWidth - padding * 2}px`, 0],
...(side === 'left'
? {
marginLeft: [`${-halfWidth}px`, 0],
}
: {}),
},
{
duration: 0.1,
easing: 'ease-out',
}
),
]).then(() => {
this._canDrop = false;
this._maybeRemoveFakeBrowser();
});
} catch (e) {
this._canDrop = false;
this._maybeRemoveFakeBrowser();
}
}
/**
* Remove a SplitNode from its tree and the view
* @param {SplitNode} toRemove
@@ -204,14 +411,13 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
afterRearangeAction() {
document.getElementById('zenSplitViewModifier').hidePopup();
ConfirmationHint.show(document.getElementById('zen-split-views-box'), 'zen-split-view-modifier-enabled-toast', {
gZenUIManager.showToast('zen-split-view-modifier-enabled-toast', {
descriptionId: 'zen-split-view-modifier-enabled-toast-description',
showDescription: true,
});
}
afterRearangeRemove() {
ConfirmationHint.show(document.getElementById('zen-split-views-box'), 'zen-split-view-modifier-disabled-toast');
gZenUIManager.showToast('zen-split-view-modifier-disabled-toast');
}
toggleWrapperDisplay(value) {
@@ -289,7 +495,7 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
let isSplitHeaderDrag = false;
const container = event.target.closest('.browserSidebarContainer[zen-split]');
if (container && event.offsetY < 20) {
if (container && event.target.closest('.zen-tab-rearrange-button')) {
// Split tab header drag case
const containerRect = container.getBoundingClientRect();
const clickX = event.clientX - containerRect.left;
@@ -549,6 +755,7 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
*/
resetTabState(tab, forUnsplit) {
tab.splitView = false;
delete tab.splitViewValue;
tab.removeAttribute('split-view');
tab.linkedBrowser.zenModeActive = false;
const container = tab.linkedBrowser.closest('.browserSidebarContainer');
@@ -679,7 +886,7 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
return false;
}
for (const tab of window.gBrowser.selectedTabs) {
if (tab.splitView) {
if (tab.splitView || tab.hasAttribute('zen-empty-tab') || tab.hasAttribute('zen-essential')) {
return false;
}
}
@@ -699,6 +906,27 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
this.updateSplitView(tab);
tab.linkedBrowser.docShellIsActive = true;
}
this._maybeRemoveFakeBrowser();
}
/**
* @param {Tab} tab
*/
_moveTabsToContainer(tabs, relativeTab) {
const relativeTabIsPinned = relativeTab.pinned;
const relativeTabIsEssential = relativeTab.hasAttribute('zen-essential');
if (relativeTabIsEssential) {
gZenPinnedTabManager.addToEssentials(tabs);
} else {
for (const tab of tabs) {
if (relativeTabIsPinned) {
gBrowser.pinTab(tab);
} else {
gBrowser.unpinTab(tab);
}
}
}
}
/**
@@ -707,14 +935,13 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
* @param {Tab[]} tabs - The tabs to split.
* @param {string} gridType - The type of grid layout.
*/
splitTabs(tabs, gridType) {
const firstisPinned = tabs[0].pinned;
tabs = tabs.filter(
(t) => t.pinned === firstisPinned && !t.hidden && !t.hasAttribute('zen-empty-tab') && !t.hasAttribute('zen-essential')
);
splitTabs(tabs, gridType, initialIndex = 0) {
// TODO: Add support for splitting essential tabs
tabs = tabs.filter((t) => !t.hidden && !t.hasAttribute('zen-empty-tab') && !t.hasAttribute('zen-essential'));
if (tabs.length < 2 || tabs.length > this.MAX_TABS) {
return;
}
this._moveTabsToContainer(tabs, tabs[initialIndex]);
const existingSplitTab = tabs.find((tab) => tab.splitView);
if (existingSplitTab) {
@@ -861,9 +1088,10 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
applyGridToTabs(tabs) {
tabs.forEach((tab, index) => {
tab.splitView = true;
tab.splitViewValue = this.currentView;
tab.setAttribute('split-view', 'true');
const container = tab.linkedBrowser.closest('.browserContainer');
if (!container.querySelector('.zen-view-splitter-header')) {
const container = tab.linkedBrowser?.closest('.browserSidebarContainer');
if (!container?.querySelector('.zen-tab-rearrange-button')) {
// insert a header into the container
const header = this._createHeader(container);
container.insertBefore(header, container.firstChild);
@@ -879,6 +1107,8 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
* @private
*/
_createHeader(container) {
const headerContainer = document.createElement('div');
headerContainer.classList.add('zen-view-splitter-header-container');
const header = document.createElement('div');
header.classList.add('zen-view-splitter-header');
const removeButton = document.createXULElement('toolbarbutton');
@@ -886,12 +1116,16 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
removeButton.addEventListener('click', () => {
this.removeTabFromSplit(container);
});
const rearrangeButton = document.createXULElement('toolbarbutton');
rearrangeButton.classList.add('zen-tab-rearrange-button');
header.appendChild(rearrangeButton);
header.appendChild(removeButton);
return header;
headerContainer.appendChild(header);
return headerContainer;
}
_removeHeader(container) {
const header = container.querySelector('.zen-view-splitter-header');
const header = container.querySelector('.zen-view-splitter-header-container');
if (header) {
header.remove();
}
@@ -1029,7 +1263,7 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
this.tabBrowserPanel.setAttribute('zen-split-resizing', true);
const isVertical = event.target.getAttribute('orient') === 'vertical';
const dimension = isVertical ? 'width' : 'height';
const clientAxis = isVertical ? 'screenX' : 'screenY';
const clientAxis = isVertical ? 'clientX' : 'clientY';
const gridIdx = parseInt(event.target.getAttribute('gridIdx'));
const startPosition = event[clientAxis];
@@ -1245,7 +1479,7 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
return;
}
const tabs = gBrowser.visibleTabs;
if (tabs.length < 2) {
if (tabs.length < 2 || this.currentView >= 0) {
return;
}
let nextTabIndex = tabs.indexOf(gBrowser.selectedTab) + 1;
@@ -1275,6 +1509,7 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
const tab = gBrowser.getTabForBrowser(browser);
if (tab) {
const groupIndex = this._data.findIndex((group) => group.tabs.includes(tab));
this.deactivateCurrentSplitView();
if (groupIndex >= 0) {
this.removeTabFromGroup(tab, groupIndex, true);
}
@@ -1282,6 +1517,20 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
}
};
_maybeRemoveFakeBrowser(select = true) {
gBrowser.tabbox.removeAttribute('style');
if (this.fakeBrowser) {
delete this._hasAnimated;
this.fakeBrowser.remove();
this.fakeBrowser = null;
if (this._draggingTab) this._draggingTab._visuallySelected = false;
if (select) {
gBrowser.selectedTab = this._draggingTab;
this._draggingTab = null;
}
}
}
/**
* @description moves the tab to the split view if dragged on a browser
* @param event - The event
@@ -1289,18 +1538,41 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
* @returns {boolean} true if the tab was moved to the split view
*/
moveTabToSplitView(event, draggedTab) {
const dropTarget = document.elementFromPoint(event.clientX, event.clientY);
const canDrop = this._canDrop;
this._canDrop = false;
if (!canDrop || !this.fakeBrowser) {
this._maybeRemoveFakeBrowser(false);
return false;
}
const dropSide = this.fakeBrowser?.getAttribute('side');
const containerRect = this.fakeBrowser.getBoundingClientRect();
const padding = Services.prefs.getIntPref('zen.theme.content-element-separation', 0);
const dropTarget = document.elementFromPoint(
dropSide === 'left' ? containerRect.left + containerRect.width + padding + 5 : containerRect.left - padding - 5,
event.clientY
);
const browser = dropTarget?.closest('browser');
if (!browser) {
this._maybeRemoveFakeBrowser(false);
return false;
}
gBrowser.selectedTab = this._draggingTab;
this._draggingTab = null;
const browserContainer = draggedTab.linkedBrowser?.closest('.browserSidebarContainer');
if (browserContainer) {
browserContainer.style.opacity = '0';
}
const droppedOnTab = gBrowser.getTabForBrowser(browser);
if (droppedOnTab && droppedOnTab !== draggedTab) {
// Calculate which side of the target browser the drop occurred
const browserRect = browser.getBoundingClientRect();
const hoverSide = this.calculateHoverSide(event.clientX, event.clientY, browserRect);
// const browserRect = browser.getBoundingClientRect();
// const hoverSide = this.calculateHoverSide(event.clientX, event.clientY, browserRect);
const hoverSide = dropSide;
if (droppedOnTab.splitView) {
// Add to existing split view
@@ -1311,6 +1583,7 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
// First move the tab to the split view group
let splitGroup = droppedOnTab.group;
if (splitGroup && (!draggedTab.group || draggedTab.group !== splitGroup)) {
this._moveTabsToContainer([draggedTab], droppedOnTab);
gBrowser.moveTabToGroup(draggedTab, splitGroup);
}
@@ -1336,29 +1609,80 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
}
} else {
// Create new split view with layout based on drop position
let gridType;
switch (hoverSide) {
case 'left':
case 'right':
gridType = 'vsep';
break;
case 'top':
case 'bottom':
gridType = 'hsep';
break;
default:
gridType = 'grid';
let gridType = 'vsep';
//switch (hoverSide) {
// case 'left':
// case 'right':
// gridType = 'vsep';
// break;
// case 'top':
// case 'bottom':
// gridType = 'hsep';
// break;
// default:
// gridType = 'grid';
//}
// Put tabs always as if it was dropped from the left
this.splitTabs(dropSide == 'left' ? [draggedTab, droppedOnTab] : [droppedOnTab, draggedTab], gridType, 1);
}
}
if (this._finishAllAnimatingPromise) {
this._finishAllAnimatingPromise.then(() => {
this._maybeRemoveFakeBrowser(false);
});
}
// Put tabs in correct order based on drop side
const tabs = ['left', 'top'].includes(hoverSide) ? [draggedTab, droppedOnTab] : [droppedOnTab, draggedTab];
this.splitTabs(tabs, gridType);
if (browserContainer) {
gZenUIManager.motion
.animate(
browserContainer,
{
scale: [0.97, 1],
opacity: [0, 1],
},
{
type: 'spring',
bounce: 0.4,
duration: 0.2,
delay: 0.1,
}
)
.then(() => {
this._maybeRemoveFakeBrowser(false);
this._finishAllAnimatingPromise = null;
});
}
return true;
}
handleTabDrop(event, urls, replace, inBackground) {
if (replace || urls.length !== 1) {
return false;
}
const url = urls[0];
if (!url.startsWith('panel-')) {
return false;
}
const browserContainer = document.getElementById(url);
const browser = browserContainer?.querySelector('browser');
if (!browser) {
return false;
}
const tab = gBrowser.getTabForBrowser(browser);
if (!tab) {
return false;
}
if (tab.splitView) {
// Unsplit the tab and exit from the drag view
this.dropZone?.removeAttribute('enabled');
this.disableTabRearrangeView(event);
this.removeTabFromSplit(browserContainer);
return true;
}
return false;
}
/**
* Gets or creates a tab group for split view tabs
* @param {Array} tabs Initial tabs to add to the group if creating new

17
src/browser/base/zen-components/ZenWelcome.mjs
View File

@@ -226,6 +226,7 @@
const sidebar = document.getElementById('zen-welcome-page-sidebar');
sidebar.style.width = '100%';
sidebar.appendChild(heart);
sidebar.setAttribute('animate-heart', 'true');
await animate(
'#zen-welcome-heart',
{ opacity: [0, 1, 1, 1, 0], scale: [0.5, 1, 1.2, 1, 1.2] },
@@ -334,17 +335,17 @@
<html:div></html:div>
</hbox>
<html:div id="zen-welcome-initial-essentials-browser-sidebar-essentials">
<html:div class="tabbrowser-tab" fadein="" visuallyselected="" data-url="https://web.whatsapp.com" style="--zen-tab-icon: url('https://web.whatsapp.com/favicon.ico');">
<html:div class="tabbrowser-tab" fadein="" data-url="https://web.whatsapp.com" style="--zen-tab-icon: url('https://web.whatsapp.com/favicon.ico');">
<stack class="tab-stack">
<html:div class="tab-background"></html:div>
</stack>
</html:div>
<html:div class="tabbrowser-tab" fadein="" visuallyselected="" data-url="https://discord.com" style="--zen-tab-icon: url('http://www.google.com/s2/favicons?domain=discord.com');">
<html:div class="tabbrowser-tab" fadein="" visuallyselected="" data-url="https://discord.com" style="--zen-tab-icon: url('https://www.google.com/s2/favicons?domain=discord.com');">
<stack class="tab-stack">
<html:div class="tab-background"></html:div>
</stack>
</html:div>
<html:div class="tabbrowser-tab" fadein="" data-url="https://reddit.com" style="--zen-tab-icon: url('https://www.redditstatic.com/desktop2x/img/favicon/favicon-96x96.png');">
<html:div class="tabbrowser-tab" fadein="" data-url="https://trello.com" style="--zen-tab-icon: url('https://trello.com/favicon.ico');">
<stack class="tab-stack">
<html:div class="tab-background"></html:div>
</stack>
@@ -354,7 +355,7 @@
<html:div class="tab-background"></html:div>
</stack>
</html:div>
<html:div class="tabbrowser-tab" fadein="" visuallyselected="" data-url="https://google.com" style="--zen-tab-icon: url('https://www.google.com/s2/favicons?domain=google.com');">
<html:div class="tabbrowser-tab" fadein="" data-url="https://github.com" style="--zen-tab-icon: url('https://github.githubassets.com/favicons/favicon-dark.png');">
<stack class="tab-stack">
<html:div class="tab-background"></html:div>
</stack>
@@ -364,17 +365,17 @@
<html:div class="tab-background"></html:div>
</stack>
</html:div>
<html:div class="tabbrowser-tab" fadein="" data-url="https://notion.com" style="--zen-tab-icon: url('https://www.notion.so/front-static/favicon.ico');">
<html:div class="tabbrowser-tab" fadein="" visuallyselected="" data-url="https://notion.com" style="--zen-tab-icon: url('https://www.notion.so/front-static/favicon.ico');">
<stack class="tab-stack">
<html:div class="tab-background"></html:div>
</stack>
</html:div>
<html:div class="tabbrowser-tab" fadein="" data-url="https://instagram.com" style="--zen-tab-icon: url('https://www.instagram.com/static/images/ico/favicon-192.png/68d99ba29cc8.png');">
<html:div class="tabbrowser-tab" fadein="" visuallyselected="" data-url="https://calendar.google.com" style="--zen-tab-icon: url('https://calendar.google.com/googlecalendar/images/favicons_2020q4/calendar_6.ico');">
<stack class="tab-stack">
<html:div class="tab-background"></html:div>
</stack>
</html:div>
<html:div class="tabbrowser-tab" fadein="" visuallyselected="" data-url="https://element.io" style="--zen-tab-icon: url('http://www.google.com/s2/favicons?domain=element.io');">
<html:div class="tabbrowser-tab" fadein="" data-url="https://youtube.com" style="--zen-tab-icon: url('https://www.youtube.com/favicon.ico');">
<stack class="tab-stack">
<html:div class="tab-background"></html:div>
</stack>
@@ -453,9 +454,7 @@
async fadeOut() {
gZenThemePicker.panel.removeAttribute('noautohide');
gZenThemePicker.panel.removeAttribute('consumeoutsideclicks');
if (AppConstants.platform != 'macosx') {
await animate(gZenThemePicker.panel, { opacity: [1, 0] });
}
gZenThemePicker.panel.hidePopup();
gZenThemePicker.panel.removeAttribute('style');
},

70
src/browser/base/zen-components/ZenWorkspaces.mjs
View File

@@ -36,6 +36,10 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
this._resolveInitialized = resolve;
});
promiseEmptyTabInitialized = new Promise((resolve) => {
this._resolveEmptyTabInitialized = resolve;
});
workspaceIndicatorXUL = `
<hbox class="zen-current-workspace-indicator-icon"></hbox>
<hbox class="zen-current-workspace-indicator-name"></hbox>
@@ -111,12 +115,13 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
);
}
selectEmptyTab() {
selectEmptyTab(newTabTarget = null) {
if (this._emptyTab && gZenVerticalTabsManager._canReplaceNewTab) {
gBrowser.selectedTab = this._emptyTab;
return this._emptyTab;
}
let tab = gZenUIManager.openAndChangeToTab(Services.prefs.getStringPref('browser.startup.homepage'));
const newTabUrl = newTabTarget || Services.prefs.getStringPref('browser.startup.homepage');
let tab = gZenUIManager.openAndChangeToTab(newTabUrl);
if (window.uuid) {
tab.setAttribute('zen-workspace-id', this.activeWorkspace);
}
@@ -144,6 +149,9 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
}
_initializeEmptyTab() {
if (Services.prefs.getBoolPref('zen.workspaces.disable_empty_state_for_testing', false)) {
return;
}
this._emptyTab = gBrowser.addTrustedTab('about:blank', { inBackground: true, userContextId: 0, _forZenEmptyTab: true });
}
@@ -602,15 +610,22 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
} catch (e) {
console.error('ZenWorkspaces: Error initializing theme picker', e);
}
this._selectStartPage();
await this._selectStartPage();
this._fixTabPositions();
this._resolveInitialized();
this._clearAnyZombieTabs(); // Dont call with await
}
}
_selectStartPage() {
async _selectStartPage() {
if (Services.prefs.getBoolPref('zen.workspaces.disable_empty_state_for_testing', false)) {
return;
}
const currentTab = gBrowser.selectedTab;
let showed = false;
await this.promiseEmptyTabInitialized;
this._resolveEmptyTabInitialized = null;
this.promiseEmptyTabInitialized = null;
if (currentTab.pinned) {
this.selectEmptyTab();
try {
@@ -625,7 +640,8 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
if (
(currentTab.isEmpty &&
(currentTab.getAttribute('image') === gPageIcons[currentTabURL] || !currentTab.hasAttribute('image'))) ||
currentTab.hasAttribute('zen-empty-tab')
currentTab.hasAttribute('zen-empty-tab') ||
(currentTab._possibleEmptyTab && currentTab.isEmpty)
) {
this.selectEmptyTab();
this._removedByStartupPage = true;
@@ -652,6 +668,26 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
return !window.toolbar.visible || Services.prefs.getBoolPref('browser.tabs.closeWindowWithLastTab');
}
async _clearAnyZombieTabs() {
const tabs = this.allStoredTabs;
const workspaces = await this._workspaces();
for (let tab of tabs) {
const workspaceID = tab.getAttribute('zen-workspace-id');
if (
workspaceID &&
!tab.hasAttribute('zen-essential') &&
!workspaces.workspaces.find((workspace) => workspace.uuid === workspaceID)
) {
// Remove any tabs where their workspace doesn't exist anymore
gBrowser.removeTab(tab, {
animate: false,
skipSessionStore: true,
closeWindowWithLastTab: false,
});
}
}
}
handleTabBeforeClose(tab) {
if (!this.workspaceEnabled || this.__contextIsDelete || this._removedByStartupPage) {
return null;
@@ -1382,15 +1418,16 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
}
_deleteAllTabsInWorkspace(workspaceID) {
for (let tab of gBrowser.tabs) {
if (tab.getAttribute('zen-workspace-id') === workspaceID) {
gBrowser.removeTab(tab, {
animate: true,
gBrowser.removeTabs(
Array.from(gBrowser.tabs).filter(
(tab) => tab.getAttribute('zen-workspace-id') === workspaceID && !tab.hasAttribute('zen-empty-tab')
),
{
animate: false,
skipSessionStore: true,
closeWindowWithLastTab: false,
});
}
}
);
}
moveTabToWorkspace(tab, workspaceID) {
@@ -1508,18 +1545,19 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
const previousWorkspace = await this.getActiveWorkspace();
alwaysChange = alwaysChange || onInit;
this.activeWorkspace = window.uuid;
if (previousWorkspace && previousWorkspace.uuid === window.uuid && !alwaysChange) {
this._cancelSwipeAnimation();
return;
}
this.activeWorkspace = window.uuid;
const containerId = window.containerTabId?.toString();
const workspaces = await this._workspaces();
// Refresh tab cache
gBrowser.verticalPinnedTabsContainer = this.pinnedTabsContainer;
gBrowser.tabContainer.verticalPinnedTabsContainer = this.pinnedTabsContainer;
gBrowser.verticalPinnedTabsContainer = this.pinnedTabsContainer || gBrowser.verticalPinnedTabsContainer;
gBrowser.tabContainer.verticalPinnedTabsContainer =
this.pinnedTabsContainer || gBrowser.tabContainer.verticalPinnedTabsContainer;
// Move empty tab to the new workspace
this._moveEmptyTabToWorkspace(window.uuid);
@@ -1967,6 +2005,7 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
}
async onLocationChange(browser) {
gZenCompactModeManager.sidebar.toggleAttribute('zen-has-empty-tab', gBrowser.selectedTab.hasAttribute('zen-empty-tab'));
if (!this.workspaceEnabled || this._inChangingWorkspace || this._isClosingWindow) {
return;
}
@@ -1993,6 +2032,7 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
// Switch workspace if needed
if (workspaceID && workspaceID !== activeWorkspace.uuid && parent.ZenWorkspaces._hasInitializedTabsStrip) {
const workspaces = await parent.ZenWorkspaces._workspaces();
await parent.ZenWorkspaces.changeWorkspace({ uuid: workspaceID });
}
}
@@ -2231,7 +2271,7 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
const activeWorkspace = this.getActiveWorkspaceFromCache();
const activeWorkspaceUserContextId = activeWorkspace?.containerTabId;
if (typeof userContextId !== 'undefined' && userContextId !== activeWorkspaceUserContextId) {
if (fromExternal !== true && typeof userContextId !== 'undefined' && userContextId !== activeWorkspaceUserContextId) {
return [userContextId, false, undefined];
}
return [activeWorkspaceUserContextId, true, undefined];

1
src/browser/base/zen-components/ZenWorkspacesStorage.mjs
View File

@@ -7,6 +7,7 @@ var ZenWorkspacesStorage = {
Weave: 'resource://services-sync/main.sys.mjs',
});
if (!window.ZenWorkspaces) return;
await this._ensureTable();
await ZenWorkspaceBookmarksStorage.init();
},

12
src/browser/base/zen-components/actors/ZenGlanceChild.sys.mjs
View File

@@ -12,6 +12,9 @@ export class ZenGlanceChild extends JSWindowActorChild {
case 'DOMContentLoaded':
await this.initiateGlance();
break;
case 'keydown':
this.onKeyDown(event);
break;
default:
}
}
@@ -120,4 +123,13 @@ export class ZenGlanceChild extends JSWindowActorChild {
this.openGlance(target);
}
}
onKeyDown(event) {
if (event.defaultPrevented || event.key !== 'Escape') {
return;
}
this.sendAsyncMessage('ZenGlance:CloseGlance', {
hasFocused: this.contentWindow.document.activeElement !== this.contentWindow.document.body,
});
}
}

10
src/browser/base/zen-components/actors/ZenGlanceParent.sys.mjs
View File

@@ -15,6 +15,16 @@ export class ZenGlanceParent extends JSWindowActorParent {
this.openGlance(this.browsingContext.topChromeWindow, message.data);
break;
}
case 'ZenGlance:CloseGlance': {
const params = {
onTabClose: true,
...message.data,
};
this.browsingContext.topChromeWindow.gZenGlanceManager.closeGlance(params);
break;
}
default:
console.warn(`[glance]: Unknown message: ${message.name}`);
}
}

4
src/browser/base/zen-components/moz.build Normal file
View File

@@ -0,0 +1,4 @@
BROWSER_CHROME_MANIFESTS += [
"tests/browser.toml",
]

22
src/browser/components/customizableui/ToolbarContextMenu-sys-mjs.patch Normal file
View File

@@ -0,0 +1,22 @@
diff --git a/browser/components/customizableui/ToolbarContextMenu.sys.mjs b/browser/components/customizableui/ToolbarContextMenu.sys.mjs
index 9879487f9ed9ddf825f5fb5c1467ddbd7fbe7a32..9e2565fafe0f5f9afa6065c9f4f522fec745db2a 100644
--- a/browser/components/customizableui/ToolbarContextMenu.sys.mjs
+++ b/browser/components/customizableui/ToolbarContextMenu.sys.mjs
@@ -237,17 +237,6 @@ export var ToolbarContextMenu = {
// autohide item's checked state to mirror the autohide pref.
showFullScreenViewContextMenuItems(popup);
- let toggleVerticalTabsItem = document.getElementById(
- "toolbar-context-toggle-vertical-tabs"
- );
- document.l10n.setAttributes(
- toggleVerticalTabsItem,
- gBrowser.tabContainer?.verticalMode
- ? "toolbar-context-turn-off-vertical-tabs"
- : "toolbar-context-turn-on-vertical-tabs"
- );
- document.getElementById("toolbar-context-customize-sidebar").hidden =
- !gBrowser.tabContainer?.verticalMode;
// View -> Toolbars menu doesn't have the moveToPanel or removeFromToolbar items.
if (!moveToPanel || !removeFromToolbar) {

15
src/browser/components/extensions/parent/ext-browser-js.patch Normal file
View File

@@ -0,0 +1,15 @@
diff --git a/browser/components/extensions/parent/ext-browser.js b/browser/components/extensions/parent/ext-browser.js
index 179816fa96ccf26604d52f71232296398dd9bdbd..c35814bae4eab774892af1f6df7465601d4f87ac 100644
--- a/browser/components/extensions/parent/ext-browser.js
+++ b/browser/components/extensions/parent/ext-browser.js
@@ -1218,6 +1218,10 @@ class TabManager extends TabManagerBase {
}
canAccessTab(nativeTab) {
+ if (nativeTab.hasAttribute("zen-empty-tab")) {
+ return false
+ }
+
// Check private browsing access at browser window level.
if (!this.extension.canAccessWindow(nativeTab.ownerGlobal)) {
return false;

12
src/browser/components/extensions/parent/ext-tabs-js.patch Normal file
View File

@@ -0,0 +1,12 @@
diff --git a/browser/components/extensions/parent/ext-tabs.js b/browser/components/extensions/parent/ext-tabs.js
index b47f0510e32d788dfe7c3109474c4512c9900d4a..49697125a2998bbd50d87c54e2c5974baaf9a7e2 100644
--- a/browser/components/extensions/parent/ext-tabs.js
+++ b/browser/components/extensions/parent/ext-tabs.js
@@ -468,6 +468,7 @@ this.tabs = class extends ExtensionAPIPersistent {
}
let tab = tabManager.getWrapper(event.originalTarget);
+ if (!tab) return;
let changeInfo = {};
for (let prop of needed) {

20
src/browser/components/places/content/editBookmark-js.patch
View File

@@ -1,8 +1,8 @@
diff --git a/browser/components/places/content/editBookmark.js b/browser/components/places/content/editBookmark.js
index 9f17174fdd9cc1eaefb4330da1e10f40eeda2f31..e2c38872ee3a5c45d2e288e67d33f9ce24cab2b9 100644
index 9ab4e96cc4738d0ba549dca67b8559e0f9534f37..07b9087b0b17e33853d78c66ea1e5321a2bfef80 100644
--- a/browser/components/places/content/editBookmark.js
+++ b/browser/components/places/content/editBookmark.js
@@ -370,6 +370,10 @@ var gEditItemOverlay = {
@@ -386,6 +386,10 @@ var gEditItemOverlay = {
this._keywordField.readOnly = this.readOnly;
}
@@ -13,7 +13,7 @@ index 9f17174fdd9cc1eaefb4330da1e10f40eeda2f31..e2c38872ee3a5c45d2e288e67d33f9ce
// Collapse the tag selector if the item does not accept tags.
if (showOrCollapse("tagsRow", isBookmark || bulkTagging, "tags")) {
this._initTagsField();
@@ -682,6 +686,7 @@ var gEditItemOverlay = {
@@ -692,6 +696,7 @@ var gEditItemOverlay = {
if (this._paneInfo.isBookmark) {
options.tags = this._element("tagsField").value;
options.keyword = this._keyword;
@@ -21,7 +21,17 @@ index 9f17174fdd9cc1eaefb4330da1e10f40eeda2f31..e2c38872ee3a5c45d2e288e67d33f9ce
}
if (this._paneInfo.bulkTagging) {
@@ -1232,6 +1237,148 @@ var gEditItemOverlay = {
@@ -1193,6 +1198,9 @@ var gEditItemOverlay = {
case "editBMPanel_tagsSelectorExpander":
this.toggleTagsSelector().catch(console.error);
break;
+ case "editBMPanel_workspacesSelectorExpander":
+ this.onWorkspaceDropdownToggle();
+ break;
}
break;
}
@@ -1279,6 +1287,148 @@ var gEditItemOverlay = {
get bookmarkState() {
return this._bookmarkState;
},
@@ -170,7 +180,7 @@ index 9f17174fdd9cc1eaefb4330da1e10f40eeda2f31..e2c38872ee3a5c45d2e288e67d33f9ce
};
ChromeUtils.defineLazyGetter(gEditItemOverlay, "_folderTree", () => {
@@ -1267,6 +1414,9 @@ for (let elt of [
@@ -1317,6 +1467,9 @@ for (let elt of [
"locationField",
"keywordField",
"tagsField",

10
src/browser/components/places/content/editBookmarkPanel-inc-xhtml.patch
View File

@@ -1,5 +1,5 @@
diff --git a/browser/components/places/content/editBookmarkPanel.inc.xhtml b/browser/components/places/content/editBookmarkPanel.inc.xhtml
index 40366677b60123c66bf0739d1b2374b423d3061c..3e722dce6b21ab62535369f20afe5f0acd43838f 100644
index 40366677b60123c66bf0739d1b2374b423d3061c..a2774e99726407d95011126ea2a272f08eaf0961 100644
--- a/browser/components/places/content/editBookmarkPanel.inc.xhtml
+++ b/browser/components/places/content/editBookmarkPanel.inc.xhtml
@@ -12,14 +12,15 @@
@@ -20,11 +20,10 @@ index 40366677b60123c66bf0739d1b2374b423d3061c..3e722dce6b21ab62535369f20afe5f0a
<label data-l10n-id="bookmark-overlay-location-2"
class="editBMPanel_folderRow hideable"
control="editBMPanel_folderMenuList"/>
@@ -47,7 +48,26 @@
@@ -47,7 +48,25 @@
class="expander-down panel-button"
data-l10n-id="bookmark-overlay-folders-expander2"/>
</hbox>
-
+ </hbox>
+ <hbox flex="1" class="zenEditBMPanel_fieldContainer">
+ <label data-l10n-id="zen-bookmark-edit-panel-workspace-selector"
@@ -37,12 +36,11 @@ index 40366677b60123c66bf0739d1b2374b423d3061c..3e722dce6b21ab62535369f20afe5f0a
+ class="workspace-trigger">-</div>
+ <button id="editBMPanel_workspacesSelectorExpander"
+ class="expander-down panel-button"
+ data-l10n-id="bookmark-overlay-tags-expander2"
+ oncommand="gEditItemOverlay.onWorkspaceDropdownToggle();"/>
+ data-l10n-id="bookmark-overlay-tags-expander2"/>
+
+ </div>
+ </hbox>
+
+ <ul id="editBMPanel_workspaceList" class="workspace-list hideable" hidden="true">
+ </ul>
<vbox id="editBMPanel_folderTreeRow"

5
src/browser/components/preferences/zen-settings.js
View File

@@ -944,11 +944,6 @@ Preferences.addAll([
type: 'bool',
default: true,
},
{
id: 'zen.workspaces.individual-pinned-tabs',
type: 'bool',
default: true,
},
{
id: 'zen.workspaces.show-icon-strip',
type: 'bool',

3
src/browser/components/preferences/zenTabsManagement.inc.xhtml
View File

@@ -20,9 +20,6 @@
<checkbox id="zenWorkspacesHideDefaultContainer"
data-l10n-id="zen-settings-workspaces-hide-default-container-indicator"
preference="zen.workspaces.hide-default-container-indicator"/>
<checkbox id="zenWorkspacesAllowPinnedTabsForDifferentWorkspaces"
data-l10n-id="zen-settings-workspaces-allow-pinned-tabs-for-different-workspaces"
preference="zen.workspaces.individual-pinned-tabs"/>
<checkbox id="zenWorkspacesDisplayAsIconStrip"
data-l10n-id="zen-settings-workspaces-display-as-icon-strip"
preference="zen.workspaces.show-icon-strip"/>

13
src/browser/components/search/SearchOneOffs-sys-mjs.patch Normal file
View File

@@ -0,0 +1,13 @@
diff --git a/browser/components/search/SearchOneOffs.sys.mjs b/browser/components/search/SearchOneOffs.sys.mjs
index 6dcd68f7ec4da72f9510ac3c8ff1cecffbd70e92..f712b95d03be46f7d81bad4113f533f0515a92b9 100644
--- a/browser/components/search/SearchOneOffs.sys.mjs
+++ b/browser/components/search/SearchOneOffs.sys.mjs
@@ -446,7 +446,7 @@ export class SearchOneOffs {
// For the search-bar, always show the one-off buttons where there is an
// option to add an engine.
let addEngineNeeded = isSearchBar && addEngines.length;
- let hideOneOffs = (await this.willHide()) && !addEngineNeeded;
+ let hideOneOffs = (await this.willHide()) && !addEngineNeeded || Services.prefs.getBoolPref("zen.urlbar.hide-one-offs");
// The _engineInfo cache is used by more consumers, thus it is not a good
// representation of whether this method already updated the one-off buttons

47
src/browser/components/sessionstore/SessionStore-sys-mjs.patch
View File

@@ -1,16 +1,25 @@
diff --git a/browser/components/sessionstore/SessionStore.sys.mjs b/browser/components/sessionstore/SessionStore.sys.mjs
index 908743177d9f95e2e6549c689e7a493ca8668701..181c4819b052e444e56e75f1cb40b4bc299569fb 100644
index f814772114948f87cbb3c3a7231c95ea1f68d776..ae35daa518ca25f4fc95ef983519c390bf088a68 100644
--- a/browser/components/sessionstore/SessionStore.sys.mjs
+++ b/browser/components/sessionstore/SessionStore.sys.mjs
@@ -3848,6 +3848,7 @@ var SessionStoreInternal = {
aWindow.gBrowser.selectedTab = newTab;
@@ -3171,7 +3171,7 @@ var SessionStoreInternal = {
if (!isPrivateWindow && tabState.isPrivate) {
return;
}
- if (aTab == aWindow.FirefoxViewHandler.tab) {
+ if (aTab == aWindow.FirefoxViewHandler.tab || aTab.hasAttribute("zen-empty-tab")) {
return;
}
+ if (aTab.hasAttribute("zenDefaultUserContextId")) newTab.setAttribute("zenDefaultUserContextId", true);
// Restore the state into the new tab.
this.restoreTab(newTab, tabState, {
restoreImmediately: aRestoreImmediately,
@@ -5315,14 +5316,14 @@ var SessionStoreInternal = {
@@ -3876,6 +3876,7 @@ var SessionStoreInternal = {
Math.min(tabState.index, tabState.entries.length)
);
tabState.pinned = false;
+ tabState.zenEssential = undefined;
if (inBackground === false) {
aWindow.gBrowser.selectedTab = newTab;
@@ -5355,14 +5356,14 @@ var SessionStoreInternal = {
}
let tabbrowser = aWindow.gBrowser;
@@ -27,7 +36,16 @@ index 908743177d9f95e2e6549c689e7a493ca8668701..181c4819b052e444e56e75f1cb40b4bc
continue;
}
let tabData = lazy.TabState.collect(tab, TAB_CUSTOM_VALUES.get(tab));
@@ -6042,6 +6043,15 @@ var SessionStoreInternal = {
@@ -5381,7 +5382,7 @@ var SessionStoreInternal = {
// We don't store the Firefox View tab in Session Store, so if it was the last selected "tab" when
// a window is closed, point to the first item in the tab strip instead (it will never be the Firefox View tab,
// since it's only inserted into the tab strip after it's selected).
- if (aWindow.FirefoxViewHandler.tab?.selected) {
+ if (aWindow.FirefoxViewHandler.tab?.selected || tabbrowser.selectedTab.hasAttribute("zen-empty-tab")) {
selectedIndex = 1;
winData.title = tabbrowser.tabs[0].label;
}
@@ -6086,8 +6087,23 @@ var SessionStoreInternal = {
// Most of tabData has been restored, now continue with restoring
// attributes that may trigger external events.
@@ -37,9 +55,18 @@ index 908743177d9f95e2e6549c689e7a493ca8668701..181c4819b052e444e56e75f1cb40b4bc
+ if (tabData.zenIsEmpty) {
+ tab.setAttribute("zen-empty-tab", "true");
+ }
+ if (tabData.zenHasStaticLabel) {
+ tab.setAttribute("zen-has-static-label", "true");
+ }
+ if (tabData.zenPinnedId) {
+ tab.setAttribute("zen-pin-id", tabData.zenPinnedId);
+ }
+ if (tabData.zenDefaultUserContextId) {
+ tab.setAttribute("zenDefaultUserContextId", true);
+ }
if (tabData.pinned) {
- if (tabData.pinned) {
+ if (tabData.pinned || tabData.zenEssential) {
tabbrowser.pinTab(tab);
} else {
tabbrowser.unpinTab(tab);

6
src/browser/components/sessionstore/TabState-sys-mjs.patch
View File

@@ -1,8 +1,8 @@
diff --git a/browser/components/sessionstore/TabState.sys.mjs b/browser/components/sessionstore/TabState.sys.mjs
index 8f7ed557e6aa61e7e16ed4a8d785ad5fe651b3d8..8b0781488e8f250666f1d542e3aa0cb34e018f24 100644
index 8f7ed557e6aa61e7e16ed4a8d785ad5fe651b3d8..aff63696d198055886960072a6130318e099ae42 100644
--- a/browser/components/sessionstore/TabState.sys.mjs
+++ b/browser/components/sessionstore/TabState.sys.mjs
@@ -80,10 +80,18 @@ class _TabState {
@@ -80,10 +80,20 @@ class _TabState {
tabData.muteReason = tab.muteReason;
}
@@ -14,10 +14,12 @@ index 8f7ed557e6aa61e7e16ed4a8d785ad5fe651b3d8..8b0781488e8f250666f1d542e3aa0cb3
+ tabData.zenWorkspace = tab.getAttribute("zen-workspace-id");
+ tabData.zenPinnedId = tab.getAttribute("zen-pin-id");
+ tabData.zenEssential = tab.getAttribute("zen-essential");
+ tabData.pinned = tabData.pinned || tabData.zenEssential;
+ tabData.zenDefaultUserContextId = tab.getAttribute("zenDefaultUserContextId");
+ tabData.zenPinnedEntry = tab.getAttribute("zen-pinned-entry");
+ tabData.zenPinnedIcon = tab.getAttribute("zen-pinned-icon");
+ tabData.zenIsEmpty = tab.hasAttribute("zen-empty-tab");
+ tabData.zenHasStaticLabel = tab.hasAttribute("zen-has-static-label");
+
tabData.searchMode = tab.ownerGlobal.gURLBar.getSearchMode(browser, true);

95
src/browser/components/tabbrowser/content/tabbrowser-js.patch
View File

@@ -1,5 +1,5 @@
diff --git a/browser/components/tabbrowser/content/tabbrowser.js b/browser/components/tabbrowser/content/tabbrowser.js
index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd71c4dfe1 100644
index 628aa6596627c85efe361fc1ece8fd58f7ee653e..cd3ad53dbe399383178d0eff459ad72079b02024 100644
--- a/browser/components/tabbrowser/content/tabbrowser.js
+++ b/browser/components/tabbrowser/content/tabbrowser.js
@@ -412,11 +412,50 @@
@@ -197,7 +197,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
+ let hasZenDefaultUserContextId = false;
+ let zenForcedWorkspaceId = undefined;
+ if (typeof ZenWorkspaces !== "undefined") {
+ if (typeof ZenWorkspaces !== "undefined" && !_forZenEmptyTab) {
+ [userContextId, hasZenDefaultUserContextId, zenForcedWorkspaceId] = ZenWorkspaces.getContextIdIfNeeded(userContextId, fromExternal, allowInheritPrincipal);
+ }
+
@@ -246,7 +246,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
} = {}
) {
if (!tabs?.length) {
@@ -2918,7 +2991,11 @@
@@ -2918,7 +2991,12 @@
id = `${Date.now()}-${Math.round(Math.random() * 100)}`;
}
let group = this._createTabGroup(id, color, false, label);
@@ -254,12 +254,13 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
+ if (forSplitView) {
+ group.setAttribute('split-view-group', true);
+ }
+ group.pinned = tabs.some(tab => tab.pinned);
+ (group.pinned ? this.verticalPinnedTabsContainer : this.tabContainer).insertBefore(
+ group.essential = tabs.some(tab => tab.hasAttribute("essential"));
+ group.pinned = group.essential || tabs.some(tab => tab.pinned);
+ (group.essential ? document.getElementById("zen-essentials-container") : (group.pinned ? this.verticalPinnedTabsContainer : this.tabContainer)).insertBefore(
group,
insertBefore?.group ?? insertBefore
);
@@ -3126,6 +3203,7 @@
@@ -3126,6 +3204,7 @@
initialBrowsingContextGroupId,
openWindowInfo,
skipLoad,
@@ -267,7 +268,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
}
) {
// If we don't have a preferred remote type, and we have a remote
@@ -3189,6 +3267,7 @@
@@ -3189,6 +3268,7 @@
openWindowInfo,
name,
skipLoad,
@@ -275,7 +276,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
});
}
@@ -3367,6 +3446,24 @@
@@ -3367,6 +3447,27 @@
) {
tabWasReused = true;
tab = this.selectedTab;
@@ -285,6 +286,9 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
+ if (tabData.zenIsEmpty) {
+ tab.setAttribute("zen-empty-tab", "true");
+ }
+ if (tabData.zenHasStaticLabel) {
+ tab.setAttribute("zen-has-static-label", "true");
+ }
+ if (tabData.zenPinnedId) {
+ tab.setAttribute("zen-pin-id", tabData.zenPinnedId);
+ }
@@ -300,7 +304,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
if (!tabData.pinned) {
this.unpinTab(tab);
} else {
@@ -3380,6 +3477,7 @@
@@ -3380,6 +3481,7 @@
restoreTabsLazily && !select && !tabData.pinned;
let url = "about:blank";
@@ -308,7 +312,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
if (tabData.entries?.length) {
let activeIndex = (tabData.index || tabData.entries.length) - 1;
// Ensure the index is in bounds.
@@ -3415,7 +3513,24 @@
@@ -3415,7 +3517,27 @@
skipLoad: true,
preferredRemoteType,
});
@@ -322,6 +326,9 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
+ if (tabData.zenIsEmpty) {
+ tab.setAttribute("zen-empty-tab", "true");
+ }
+ if (tabData.zenHasStaticLabel) {
+ tab.setAttribute("zen-has-static-label", "true");
+ }
+ if (tabData.zenEssential) {
+ tab.setAttribute("zen-essential", "true");
+ }
@@ -334,7 +341,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
if (select) {
tabToSelect = tab;
}
@@ -3428,8 +3543,8 @@
@@ -3428,8 +3550,8 @@
// inserted in the DOM. If the tab is not yet in the DOM,
// just insert it in the right place from the start.
if (!tab.parentNode) {
@@ -345,7 +352,17 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
tab.toggleAttribute("pinned", true);
this.tabContainer._invalidateCachedTabs();
// Then ensure all the tab open/pinning information is sent.
@@ -3693,7 +3808,7 @@
@@ -3504,6 +3626,9 @@
this.selectedTab = tabToSelect;
this.removeTab(leftoverTab);
}
+ else {
+ this.selectedTab._possibleEmptyTab = true; // Not needed, but just in case.
+ }
if (tabs.length > 1 || !tabs[0].selected) {
this._updateTabsAfterInsert();
@@ -3693,7 +3818,7 @@
// Ensure we have an index if one was not provided.
if (typeof index != "number") {
// Move the new tab after another tab if needed, to the end otherwise.
@@ -354,7 +371,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
if (
!bulkOrderedOpen &&
((openerTab &&
@@ -3736,18 +3851,18 @@
@@ -3736,18 +3861,18 @@
// Ensure index is within bounds.
if (tab.pinned) {
@@ -377,7 +394,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
if (tabAfter && tabAfter.group == tabGroup) {
// Place at the front of, or between tabs in, the same tab group
this.tabContainer.insertBefore(tab, tabAfter);
@@ -4059,6 +4174,9 @@
@@ -4059,6 +4184,9 @@
return;
}
@@ -387,7 +404,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
this.removeTabs(selectedTabs);
}
@@ -4391,6 +4509,7 @@
@@ -4391,6 +4519,7 @@
skipSessionStore,
} = {}
) {
@@ -395,7 +412,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
if (UserInteraction.running("browser.tabs.opening", window)) {
UserInteraction.finish("browser.tabs.opening", window);
}
@@ -4407,6 +4526,12 @@
@@ -4407,6 +4536,12 @@
TelemetryStopwatch.start("FX_TAB_CLOSE_TIME_NO_ANIM_MS", aTab);
}
@@ -408,7 +425,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
// Handle requests for synchronously removing an already
// asynchronously closing tab.
if (!animate && aTab.closing) {
@@ -4421,7 +4546,9 @@
@@ -4421,7 +4556,9 @@
// frame created for it (for example, by updating the visually selected
// state).
let tabWidth = window.windowUtils.getBoundsWithoutFlushing(aTab).width;
@@ -419,7 +436,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
if (
!this._beginRemoveTab(aTab, {
closeWindowFastpath: true,
@@ -4435,7 +4562,6 @@
@@ -4435,7 +4572,6 @@
TelemetryStopwatch.cancel("FX_TAB_CLOSE_TIME_NO_ANIM_MS", aTab);
return;
}
@@ -427,7 +444,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
let lockTabSizing =
!this.tabContainer.verticalMode &&
!aTab.pinned &&
@@ -4574,14 +4700,14 @@
@@ -4574,14 +4710,14 @@
!!this.tabsInCollapsedTabGroups.length;
if (
aTab.visible &&
@@ -444,7 +461,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
if (closeWindow) {
// We've already called beforeunload on all the relevant tabs if we get here,
@@ -4605,6 +4731,7 @@
@@ -4605,6 +4741,7 @@
newTab = true;
}
@@ -452,18 +469,18 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
aTab._endRemoveArgs = [closeWindow, newTab];
// swapBrowsersAndCloseOther will take care of closing the window without animation.
@@ -4645,9 +4772,7 @@
@@ -4645,9 +4782,7 @@
aTab._mouseleave();
if (newTab) {
- this.addTrustedTab(BROWSER_NEW_TAB_URL, {
- skipAnimation: true,
- });
+ ZenWorkspaces.selectEmptyTab();
+ ZenWorkspaces.selectEmptyTab(BROWSER_NEW_TAB_URL);
} else {
TabBarVisibility.update();
}
@@ -4776,6 +4901,8 @@
@@ -4776,6 +4911,8 @@
this.tabs[i]._tPos = i;
}
@@ -472,7 +489,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
if (!this._windowIsClosing) {
if (wasPinned) {
this.tabContainer._positionPinnedTabs();
@@ -4994,7 +5121,7 @@
@@ -4994,7 +5131,7 @@
!excludeTabs.has(aTab.owner) &&
Services.prefs.getBoolPref("browser.tabs.selectOwnerOnClose")
) {
@@ -481,7 +498,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
}
// Try to find a remaining tab that comes after the given tab
@@ -5016,7 +5143,7 @@
@@ -5016,7 +5153,7 @@
}
if (tab) {
@@ -490,7 +507,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
}
// If no qualifying visible tab was found, see if there is a tab in
@@ -5434,10 +5561,10 @@
@@ -5434,10 +5571,10 @@
SessionStore.deleteCustomTabValue(aTab, "hiddenBy");
}
@@ -503,7 +520,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
aTab.selected ||
aTab.closing ||
// Tabs that are sharing the screen, microphone or camera cannot be hidden.
@@ -5675,7 +5802,7 @@
@@ -5675,7 +5812,7 @@
// Don't allow mixing pinned and unpinned tabs.
if (aTab.pinned) {
@@ -512,13 +529,11 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
} else {
aIndex = Math.max(aIndex, this.pinnedTabCount);
}
@@ -5684,11 +5811,18 @@
}
@@ -5685,10 +5822,17 @@
this._handleTabMove(aTab, () => {
- let neighbor = this.tabs[aIndex];
let neighbor = this.tabs[aIndex];
- if (forceStandaloneTab && neighbor.group) {
+ let neighbor = this.tabs.filter(tab => !tab.hasAttribute("zen-glance-tab"))[aIndex];
+ const _tPos = aTab._tPos;
+ if ((forceStandaloneTab && neighbor.group) || neighbor.group?.hasAttribute("split-view-group")) {
neighbor = neighbor.group;
@@ -534,25 +549,27 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
neighbor.after(aTab);
} else {
this.tabContainer.insertBefore(aTab, neighbor);
@@ -5697,7 +5831,7 @@
@@ -5697,7 +5841,7 @@
}
moveTabToGroup(aTab, aGroup) {
- if (aTab.pinned) {
+ if (aTab.pinned != !!aGroup.pinned && !aTab.hasAttribute("zen-essential")) {
+ if (aTab.pinned != !!aGroup.pinned) {
return;
}
if (aTab.group && aTab.group.id === aGroup.id) {
@@ -5721,6 +5855,8 @@
@@ -5721,6 +5865,10 @@
moveActionCallback();
+ ZenWorkspaces._makeSureEmptyTabIsLast();
+ gZenViewSplitter._maybeRemoveFakeBrowser(false);
+ gZenViewSplitter._canDrop = false;
+
// Clear tabs cache after moving nodes because the order of tabs may have
// changed.
this.tabContainer._invalidateCachedTabs();
@@ -5771,7 +5907,7 @@
@@ -5771,7 +5919,7 @@
createLazyBrowser,
};
@@ -561,7 +578,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
if (aIndex < numPinned || (aTab.pinned && aIndex == numPinned)) {
params.pinned = true;
}
@@ -7415,6 +7551,7 @@
@@ -7415,6 +7563,7 @@
aWebProgress.isTopLevel
) {
this.mTab.setAttribute("busy", "true");
@@ -569,7 +586,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
gBrowser._tabAttrModified(this.mTab, ["busy"]);
this.mTab._notselectedsinceload = !this.mTab.selected;
}
@@ -8381,7 +8518,7 @@ var TabContextMenu = {
@@ -8381,7 +8530,7 @@ var TabContextMenu = {
);
contextUnpinSelectedTabs.hidden =
!this.contextTab.pinned || !multiselectionContext;
@@ -578,7 +595,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
// Move Tab items
let contextMoveTabOptions = document.getElementById(
"context_moveTabOptions"
@@ -8414,7 +8551,7 @@ var TabContextMenu = {
@@ -8414,7 +8563,7 @@ var TabContextMenu = {
let contextMoveTabToStart = document.getElementById("context_moveToStart");
let isFirstTab =
tabsToMove[0] == visibleTabs[0] ||
@@ -587,7 +604,7 @@ index 628aa6596627c85efe361fc1ece8fd58f7ee653e..f4a4ad413785e08bbb70df8cbb5feefd
contextMoveTabToStart.disabled = isFirstTab && allSelectedTabsAdjacent;
document.getElementById("context_openTabInWindow").disabled =
@@ -8647,6 +8784,7 @@ var TabContextMenu = {
@@ -8647,6 +8796,7 @@ var TabContextMenu = {
if (this.contextTab.multiselected) {
gBrowser.removeMultiSelectedTabs();
} else {

109
src/browser/components/tabbrowser/content/tabs-js.patch
View File

@@ -1,5 +1,5 @@
diff --git a/browser/components/tabbrowser/content/tabs.js b/browser/components/tabbrowser/content/tabs.js
index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7231958d0 100644
index fa96568d366fd3608f9bd583fa793150bd815c8b..89a3d8d63a045433f15fae37c8f5df2a84f01452 100644
--- a/browser/components/tabbrowser/content/tabs.js
+++ b/browser/components/tabbrowser/content/tabs.js
@@ -94,7 +94,7 @@
@@ -11,7 +11,16 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
}
return true;
};
@@ -339,7 +339,7 @@
@@ -135,6 +135,8 @@
this.previewPanel = null;
this.allTabs[0].label = this.emptyTabTitle;
+ this.allTabs[0]._possibleEmptyTab = true;
+ ZenWorkspaces._resolveEmptyTabInitialized();
// Hide the secondary text for locales where it is unsupported due to size constraints.
const language = Services.locale.appLocaleAsBCP47;
@@ -339,7 +341,7 @@
// and we're not hitting the scroll buttons.
if (
event.button != 0 ||
@@ -20,7 +29,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
event.composedTarget.localName == "toolbarbutton"
) {
return;
@@ -388,6 +388,7 @@
@@ -388,6 +390,7 @@
// Reset the "ignored click" flag
target._ignoredCloseButtonClicks = false;
}
@@ -28,7 +37,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
}
/* Protects from close-tab-button errant doubleclick:
@@ -683,7 +684,7 @@
@@ -683,7 +686,7 @@
if (this.#isContainerVerticalPinnedExpanded(tab)) {
// In expanded vertical mode, the max number of pinned tabs per row is dynamic
// Set this before adjusting dragged tab's position
@@ -37,20 +46,25 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
let tabsPerRow = 0;
let position = 0;
for (let pinnedTab of pinnedTabs) {
@@ -883,6 +884,9 @@
@@ -883,6 +886,10 @@
}
let draggedTab = event.dataTransfer.mozGetDataAt(TAB_DROP_TYPE, 0);
+ if (draggedTab && effects === "move") {
+ gZenPinnedTabManager.applyDragoverClass(event, draggedTab);
+ gZenViewSplitter.onBrowserDragEndToSplit(event);
+ }
if (
(effects == "move" || effects == "copy") &&
this == draggedTab.container &&
@@ -996,6 +1000,14 @@
@@ -996,6 +1003,18 @@
this._tabDropIndicator.hidden = true;
event.stopPropagation();
+ if (draggedTab?.hasAttribute("zen-has-splitted")) {
+ draggedTab.removeAttribute("zen-has-splitted");
+ draggedTab._visuallySelected = false;
+ }
+ if (draggedTab && dropEffect == "move") {
+ let moved = gZenPinnedTabManager.moveToAnotherTabContainerIfNecessary(event, movingTabs);
+
@@ -62,7 +76,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
if (draggedTab && dropEffect == "copy") {
// copy the dropped tab (wherever it's from)
let newIndex = this._getDropIndex(event);
@@ -1034,10 +1046,11 @@
@@ -1034,10 +1053,11 @@
}
} else {
let pinned = draggedTab.pinned;
@@ -78,7 +92,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
);
let size = this.verticalMode ? "height" : "width";
let screenAxis = this.verticalMode ? "screenY" : "screenX";
@@ -1114,7 +1127,7 @@
@@ -1114,7 +1134,7 @@
let postTransitionCleanup = () => {
tab.removeAttribute("tabdrop-samewindow");
@@ -87,7 +101,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
if (dropIndex !== false) {
gBrowser.moveTabTo(tab, dropIndex);
if (!directionForward) {
@@ -1122,7 +1135,7 @@
@@ -1122,7 +1142,7 @@
}
}
};
@@ -96,14 +110,23 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
postTransitionCleanup();
} else {
let onTransitionEnd = transitionendEvent => {
@@ -1279,13 +1292,23 @@
@@ -1249,7 +1269,7 @@
return;
}
}
-
+ if (gZenViewSplitter.handleTabDrop(event, urls, replace, inBackground)) return;
gBrowser.loadTabs(urls, {
inBackground,
replace,
@@ -1279,13 +1299,23 @@
return;
}
- this._finishMoveTogetherSelectedTabs(draggedTab);
this._finishAnimateTabMove();
+ if (event.ctrlKey && !dt.mozUserCancelled && dt.dropEffect == "none" && !this._isCustomizing) {
+ if (!dt.mozUserCancelled && dt.dropEffect == "none" && !this._isCustomizing) {
+ const moved = gZenViewSplitter.moveTabToSplitView(event, draggedTab);
+ if (moved) {
+ delete draggedTab._dragData;
@@ -122,7 +145,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
) {
delete draggedTab._dragData;
return;
@@ -1517,7 +1540,7 @@
@@ -1517,7 +1547,7 @@
}
get newTabButton() {
@@ -131,7 +154,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
}
get verticalMode() {
@@ -1537,28 +1560,40 @@
@@ -1537,28 +1567,40 @@
if (this.#allTabs) {
return this.#allTabs;
}
@@ -180,7 +203,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
return children.filter(node => node.tagName == "tab-group");
}
@@ -1579,7 +1614,7 @@
@@ -1579,7 +1621,7 @@
*/
get visibleTabs() {
if (!this.#visibleTabs) {
@@ -189,7 +212,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
}
return this.#visibleTabs;
}
@@ -1613,10 +1648,8 @@
@@ -1613,10 +1655,8 @@
return this.#focusableItems;
}
@@ -202,7 +225,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
let focusableItems = [];
for (let child of children) {
@@ -1632,6 +1665,7 @@
@@ -1632,6 +1672,7 @@
}
this.#focusableItems = [
@@ -210,7 +233,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
...verticalPinnedTabsContainer.children,
...focusableItems,
];
@@ -1642,6 +1676,7 @@
@@ -1642,6 +1683,7 @@
_invalidateCachedTabs() {
this.#allTabs = null;
this._invalidateCachedVisibleTabs();
@@ -218,7 +241,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
}
_invalidateCachedVisibleTabs() {
@@ -1656,8 +1691,8 @@
@@ -1656,8 +1698,8 @@
#isContainerVerticalPinnedExpanded(tab) {
return (
this.verticalMode &&
@@ -229,7 +252,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
);
}
@@ -1672,7 +1707,7 @@
@@ -1672,7 +1714,7 @@
if (node == null) {
// We have a container for non-tab elements at the end of the scrollbox.
@@ -238,7 +261,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
}
node.before(tab);
@@ -1772,7 +1807,7 @@
@@ -1772,7 +1814,7 @@
// There are separate "new tab" buttons for horizontal tabs toolbar, vertical tabs and
// for when the tab strip is overflowed (which is shared by vertical and horizontal tabs);
// Attach the long click popup to all of them.
@@ -247,7 +270,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
const newTab2 = this.newTabButton;
const newTabVertical = document.getElementById(
"vertical-tabs-newtab-button"
@@ -1855,7 +1890,7 @@
@@ -1855,7 +1897,7 @@
let rect = ele => {
return window.windowUtils.getBoundsWithoutFlushing(ele);
};
@@ -256,7 +279,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
if (tab && rect(tab).width <= this._tabClipWidth) {
this.setAttribute("closebuttons", "activetab");
} else {
@@ -1867,10 +1902,12 @@
@@ -1867,10 +1909,12 @@
_handleTabSelect(aInstant) {
let selectedTab = this.selectedItem;
@@ -269,7 +292,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
selectedTab._notselectedsinceload = false;
}
@@ -1882,7 +1919,7 @@
@@ -1882,7 +1926,7 @@
return;
}
@@ -278,7 +301,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
if (!tabs.length) {
return;
}
@@ -1918,7 +1955,7 @@
@@ -1918,7 +1962,7 @@
if (isEndTab && !this._hasTabTempMaxWidth) {
return;
}
@@ -287,7 +310,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
// Force tabs to stay the same width, unless we're closing the last tab,
// which case we need to let them expand just enough so that the overall
// tabbar width is the same.
@@ -1933,7 +1970,7 @@
@@ -1933,7 +1977,7 @@
let tabsToReset = [];
for (let i = numPinned; i < tabs.length; i++) {
let tab = tabs[i];
@@ -296,7 +319,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
if (!isEndTab) {
// keep tabs the same width
tab.style.transition = "none";
@@ -1999,16 +2036,15 @@
@@ -1999,16 +2043,15 @@
// Move pinned tabs to another container when the tabstrip is toggled to vertical
// and when session restore code calls _positionPinnedTabs; update styling whenever
// the number of pinned tabs changes.
@@ -319,7 +342,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
}
}
@@ -2016,9 +2052,7 @@
@@ -2016,9 +2059,7 @@
}
_resetVerticalPinnedTabs() {
@@ -330,7 +353,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
if (!verticalTabsContainer.children.length) {
return;
@@ -2031,8 +2065,8 @@
@@ -2031,8 +2072,8 @@
}
_positionPinnedTabs() {
@@ -341,7 +364,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
let absPositionHorizontalTabs =
this.overflowing && tabs.length > numPinned && numPinned > 0;
@@ -2041,7 +2075,7 @@
@@ -2041,7 +2082,7 @@
if (this.verticalMode) {
this._updateVerticalPinnedTabs();
@@ -350,7 +373,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
let layoutData = this._pinnedTabsLayoutCache;
let uiDensity = document.documentElement.getAttribute("uidensity");
if (!layoutData || layoutData.uiDensity != uiDensity) {
@@ -2113,7 +2147,7 @@
@@ -2113,7 +2154,7 @@
return;
}
@@ -359,7 +382,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
let directionX = screenX > dragData.animLastScreenX;
let directionY = screenY > dragData.animLastScreenY;
@@ -2121,7 +2155,7 @@
@@ -2121,7 +2162,7 @@
dragData.animLastScreenX = screenX;
let { width: tabWidth, height: tabHeight } =
@@ -368,7 +391,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
let shiftSizeX = tabWidth * movingTabs.length;
let shiftSizeY = tabHeight;
dragData.tabWidth = tabWidth;
@@ -2296,10 +2330,11 @@
@@ -2296,10 +2337,11 @@
}
let pinned = draggedTab.pinned;
@@ -384,22 +407,20 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
);
if (this.#rtlMode) {
@@ -2347,8 +2382,12 @@
(lastMovingTabScreen + tabSize);
@@ -2348,7 +2390,11 @@
translate = Math.min(Math.max(translate, firstBound), lastBound);
- for (let tab of movingTabs) {
for (let tab of movingTabs) {
- tab.style.transform = `${translateAxis}(${translate}px)`;
+ if (draggedTab.group?.hasAttribute("split-view-group")) {
+ draggedTab.group.style.transform = `${translateAxis}(${translate}px)`;
+ if (tab.group?.hasAttribute("split-view-group")) {
+ tab.group.style.transform = `${translateAxis}(${translate}px)`;
+ } else {
+ for (let tab of movingTabs) {
+ tab.style.transform = `${translateAxis}(${translate}px)`;
+ }
}
dragData.translatePos = translate;
@@ -2484,12 +2523,16 @@
@@ -2484,12 +2530,16 @@
// Shift background tabs to leave a gap where the dragged tab
// would currently be dropped.
for (let tab of tabs) {
@@ -417,7 +438,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
if (tab.group?.tabs[0] == tab) {
tab.group.style.setProperty(
"--tabgroup-dragover-transform",
@@ -2541,8 +2584,9 @@
@@ -2541,8 +2591,9 @@
);
}
@@ -429,7 +450,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
return;
}
@@ -2553,6 +2597,7 @@
@@ -2553,6 +2604,7 @@
tab.style.transform = "";
if (tab.group) {
tab.group.style.removeProperty("--tabgroup-dragover-transform");
@@ -437,7 +458,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
}
tab.removeAttribute("dragover-createGroup");
}
@@ -2604,7 +2649,7 @@
@@ -2604,7 +2656,7 @@
movingTab._moveTogetherSelectedTabsData.newIndex = movingTabNewIndex;
movingTab._moveTogetherSelectedTabsData.animate = false;
};
@@ -446,7 +467,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
postTransitionCleanup();
} else {
let onTransitionEnd = transitionendEvent => {
@@ -2707,9 +2752,9 @@
@@ -2707,9 +2759,9 @@
function newIndex(aTab, index) {
// Don't allow mixing pinned and unpinned tabs.
if (aTab.pinned) {
@@ -458,7 +479,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..9a288957781277246b66a911590a13e7
}
}
@@ -2793,7 +2838,7 @@
@@ -2793,7 +2845,7 @@
}
_notifyBackgroundTab(aTab) {

64
src/browser/themes/shared/tabbrowser/tabs-css.patch
View File

@@ -1,5 +1,5 @@
diff --git a/browser/themes/shared/tabbrowser/tabs.css b/browser/themes/shared/tabbrowser/tabs.css
index 01815c2114a627e5cac183c702bd82f1bd4f58f8..3a453164ee8a555db2a0ba28288d69857a4933bc 100644
index 01815c2114a627e5cac183c702bd82f1bd4f58f8..f47bd9c8490cd8fc4bb686ad0012ce70ab4bac8f 100644
--- a/browser/themes/shared/tabbrowser/tabs.css
+++ b/browser/themes/shared/tabbrowser/tabs.css
@@ -31,7 +31,7 @@
@@ -37,16 +37,60 @@ index 01815c2114a627e5cac183c702bd82f1bd4f58f8..3a453164ee8a555db2a0ba28288d6985
&::before {
position: absolute;
@@ -502,7 +501,7 @@
@@ -437,6 +436,7 @@
.tab-icon-image {
-moz-context-properties: fill, stroke;
fill: currentColor;
+ border-radius: 4px;
/* Apply crisp rendering for favicons at exactly 2dppx resolution */
@media (resolution: 2dppx) {
@@ -502,7 +502,7 @@
z-index: 1; /* Overlay tab title */
#tabbrowser-tabs[orient=vertical] & {
- top: 7px;
+ top: 0px;
+ top: -7px;
}
&[crashed] {
@@ -617,14 +616,14 @@
@@ -510,7 +510,7 @@
}
#tabbrowser-tabs[orient="vertical"]:not([expanded]) &:not([crashed]),
- &[pinned]:not([crashed]) {
+ &:not([crashed]) {
&[soundplaying] {
list-style-image: url("chrome://browser/skin/tabbrowser/tab-audio-playing-small.svg");
}
@@ -540,7 +540,7 @@
background-image: linear-gradient(var(--audio-overlay-extra-background)),
linear-gradient(var(--toolbox-bgcolor));
-moz-context-properties: fill;
- fill: var(--tab-selected-textcolor);
+ fill: var(--tab-selected-textcolor) !important;
color-scheme: var(--tab-selected-color-scheme);
border-radius: var(--border-radius-circle);
@@ -572,7 +572,7 @@
}
#tabbrowser-tabs[orient="vertical"]:not([expanded]) &:is([soundplaying], [muted], [activemedia-blocked]),
- &[pinned]:is([soundplaying], [muted], [activemedia-blocked]),
+ &:is([soundplaying], [muted], [activemedia-blocked]),
&[crashed] {
display: revert;
}
@@ -586,7 +586,7 @@
--button-min-height-small: 24px;
--button-border-radius: var(--border-radius-small);
- #tabbrowser-tabs:is([orient="vertical"][expanded], [orient="horizontal"]) &:not([pinned]):not([crashed]) {
+ #tabbrowser-tabs:is([orient="horizontal"]) &:not([pinned]):not([crashed]) {
&:is([soundplaying], [muted], [activemedia-blocked]) {
display: block;
}
@@ -617,14 +617,14 @@
}
&[textoverflow] {
@@ -65,7 +109,7 @@ index 01815c2114a627e5cac183c702bd82f1bd4f58f8..3a453164ee8a555db2a0ba28288d6985
direction: rtl;
mask-image: linear-gradient(to right, transparent, black var(--tab-label-mask-size));
}
@@ -1170,7 +1169,7 @@
@@ -1170,7 +1170,7 @@
}
}
@@ -74,7 +118,7 @@ index 01815c2114a627e5cac183c702bd82f1bd4f58f8..3a453164ee8a555db2a0ba28288d6985
#vertical-tabs-newtab-button {
appearance: none;
min-height: var(--tab-min-height);
@@ -1181,7 +1180,7 @@
@@ -1181,7 +1181,7 @@
margin-inline: var(--tab-inner-inline-margin);
#tabbrowser-tabs[orient="vertical"]:not([expanded]) & > .toolbarbutton-text {
@@ -83,7 +127,7 @@ index 01815c2114a627e5cac183c702bd82f1bd4f58f8..3a453164ee8a555db2a0ba28288d6985
}
&:hover {
@@ -1205,7 +1204,7 @@
@@ -1205,7 +1205,7 @@
* flex container. #tabs-newtab-button is a child of the arrowscrollbox where
* we don't want a gap (between tabs), so we have to add some margin.
*/
@@ -92,7 +136,7 @@ index 01815c2114a627e5cac183c702bd82f1bd4f58f8..3a453164ee8a555db2a0ba28288d6985
margin-block: var(--tab-block-margin);
}
@@ -1229,7 +1228,6 @@
@@ -1229,7 +1229,6 @@
}
#vertical-pinned-tabs-container {
@@ -100,7 +144,7 @@ index 01815c2114a627e5cac183c702bd82f1bd4f58f8..3a453164ee8a555db2a0ba28288d6985
display: none;
grid-template-columns: repeat(auto-fit, minmax(var(--tab-pinned-min-width-expanded), auto));
overflow-y: auto;
@@ -1439,7 +1437,7 @@
@@ -1439,7 +1438,7 @@
toolbarbutton:not(#firefox-view-button),
toolbarpaletteitem:not(#wrapper-firefox-view-button)
) ~ #tabbrowser-tabs {
@@ -109,7 +153,7 @@ index 01815c2114a627e5cac183c702bd82f1bd4f58f8..3a453164ee8a555db2a0ba28288d6985
padding-inline-start: calc(var(--tab-overflow-pinned-tabs-width) + 2px);
margin-inline-start: 2px;
}
@@ -1473,7 +1471,6 @@ toolbar:not(#TabsToolbar) #firefox-view-button {
@@ -1473,7 +1472,6 @@ toolbar:not(#TabsToolbar) #firefox-view-button {
list-style-image: url(chrome://global/skin/icons/plus.svg);
}

11
src/browser/themes/shared/urlbar-searchbar-css.patch
View File

@@ -1,7 +1,16 @@
diff --git a/browser/themes/shared/urlbar-searchbar.css b/browser/themes/shared/urlbar-searchbar.css
index 45aa61f93d354da432eceb1c276466609a6910d0..6585158b855af19689e86ef6a833f63736ec225c 100644
index 574f83af7fa49ddcdff6711ca8b1d3bed1a35e0c..c2e8cb8b37438176db07a47e1e975ae1aea42252 100644
--- a/browser/themes/shared/urlbar-searchbar.css
+++ b/browser/themes/shared/urlbar-searchbar.css
@@ -5,7 +5,7 @@
@namespace html url("http://www.w3.org/1999/xhtml");
:root {
- --urlbar-container-padding: 1px;
+ --urlbar-container-padding: 4px;
--urlbar-margin-inline: 5px;
--urlbar-padding-block: 4px;
}
@@ -291,7 +291,9 @@
}

13
src/browser/themes/shared/urlbarView-css.patch Normal file
View File

@@ -0,0 +1,13 @@
diff --git a/browser/themes/shared/urlbarView.css b/browser/themes/shared/urlbarView.css
index 1c654e053ca8a014d7c2a9fc076cf15afba9c903..f2f63809d0a36db2774755db2b782f41a9bbe82b 100644
--- a/browser/themes/shared/urlbarView.css
+++ b/browser/themes/shared/urlbarView.css
@@ -20,7 +20,7 @@
--urlbarView-small-font-size: 0.85em;
- --urlbarView-results-padding: 4px;
+ --urlbarView-results-padding: 8px;
--urlbarView-row-gutter: 2px;
--urlbarView-item-inline-padding: var(--urlbar-icon-padding);
--urlbarView-item-block-padding: 6px;

49
src/browser/themes/shared/zen-icons/icons.css
View File

@@ -4,7 +4,8 @@
* file, You can obtain one at http://mozilla.org/MPL/2.0/.
*/
.subviewbutton {
.subviewbutton,
#zen-welcome-start-button {
-moz-context-properties: fill, fill-opacity !important;
fill: currentColor !important;
}
@@ -23,6 +24,10 @@
list-style-image: url('move-tab.svg') !important;
}
.zen-tab-unsplit-button {
list-style-image: url('unpin.svg') !important;
}
#forward-button,
#zen-sidebar-web-panel-forward {
list-style-image: url('forward.svg') !important;
@@ -381,7 +386,8 @@
list-style-image: url('arrow-down.svg') !important;
}
.zen-workspace-actions-reorder-icon {
.zen-workspace-actions-reorder-icon,
.zen-tab-rearrange-button {
list-style-image: url('drag-indicator.svg') !important;
}
@@ -1140,6 +1146,41 @@ menupopup > menuitem:is([type='checkbox']) .menu-iconic-left {
}
#toolbar-context-toggle-vertical-tabs,
#toolbar-context-customize-sidebar {
display: none;
#toolbar-context-customize-sidebar,
#sidebarRevampSeparator {
display: none !important;
}
#zen-media-playpause-button {
list-style-image: url('media-play.svg') !important;
}
#zen-media-controls-toolbar.playing #zen-media-playpause-button {
list-style-image: url('media-pause.svg') !important;
}
#zen-media-nexttrack-button {
list-style-image: url('media-next.svg') !important;
}
#zen-media-previoustrack-button {
list-style-image: url('media-previous.svg') !important;
}
#zen-media-controls-toolbar[muted] #zen-media-mute-button {
list-style-image: url('media-mute.svg') !important;
}
#zen-media-mute-button {
list-style-image: url('media-unmute.svg') !important;
}
#zen-media-close-button {
list-style-image: url('close.svg') !important;
}
#zen-media-controls-toolbar:hover {
#zen-media-focus-button {
list-style-image: url('screen.svg') !important;
}
}

6
src/browser/themes/shared/zen-icons/jar.inc.mn
View File

@@ -66,9 +66,11 @@
skin/classic/browser/zen-icons/manage.svg (../shared/zen-icons/lin/manage.svg)
skin/classic/browser/zen-icons/media-loop.svg (../shared/zen-icons/lin/media-loop.svg)
skin/classic/browser/zen-icons/media-mute.svg (../shared/zen-icons/lin/media-mute.svg)
skin/classic/browser/zen-icons/media-next.svg (../shared/zen-icons/lin/media-next.svg)
skin/classic/browser/zen-icons/media-pause.svg (../shared/zen-icons/lin/media-pause.svg)
skin/classic/browser/zen-icons/media-pip.svg (../shared/zen-icons/lin/media-pip.svg)
skin/classic/browser/zen-icons/media-play.svg (../shared/zen-icons/lin/media-play.svg)
skin/classic/browser/zen-icons/media-previous.svg (../shared/zen-icons/lin/media-previous.svg)
skin/classic/browser/zen-icons/media-speed.svg (../shared/zen-icons/lin/media-speed.svg)
skin/classic/browser/zen-icons/media-unmute.svg (../shared/zen-icons/lin/media-unmute.svg)
skin/classic/browser/zen-icons/menu-bar.svg (../shared/zen-icons/lin/menu-bar.svg)
@@ -198,9 +200,11 @@
skin/classic/browser/zen-icons/manage.svg (../shared/zen-icons/lin/manage.svg)
skin/classic/browser/zen-icons/media-loop.svg (../shared/zen-icons/lin/media-loop.svg)
skin/classic/browser/zen-icons/media-mute.svg (../shared/zen-icons/lin/media-mute.svg)
skin/classic/browser/zen-icons/media-next.svg (../shared/zen-icons/lin/media-next.svg)
skin/classic/browser/zen-icons/media-pause.svg (../shared/zen-icons/lin/media-pause.svg)
skin/classic/browser/zen-icons/media-pip.svg (../shared/zen-icons/lin/media-pip.svg)
skin/classic/browser/zen-icons/media-play.svg (../shared/zen-icons/lin/media-play.svg)
skin/classic/browser/zen-icons/media-previous.svg (../shared/zen-icons/lin/media-previous.svg)
skin/classic/browser/zen-icons/media-speed.svg (../shared/zen-icons/lin/media-speed.svg)
skin/classic/browser/zen-icons/media-unmute.svg (../shared/zen-icons/lin/media-unmute.svg)
skin/classic/browser/zen-icons/menu-bar.svg (../shared/zen-icons/lin/menu-bar.svg)
@@ -330,9 +334,11 @@
skin/classic/browser/zen-icons/manage.svg (../shared/zen-icons/lin/manage.svg)
skin/classic/browser/zen-icons/media-loop.svg (../shared/zen-icons/lin/media-loop.svg)
skin/classic/browser/zen-icons/media-mute.svg (../shared/zen-icons/lin/media-mute.svg)
skin/classic/browser/zen-icons/media-next.svg (../shared/zen-icons/lin/media-next.svg)
skin/classic/browser/zen-icons/media-pause.svg (../shared/zen-icons/lin/media-pause.svg)
skin/classic/browser/zen-icons/media-pip.svg (../shared/zen-icons/lin/media-pip.svg)
skin/classic/browser/zen-icons/media-play.svg (../shared/zen-icons/lin/media-play.svg)
skin/classic/browser/zen-icons/media-previous.svg (../shared/zen-icons/lin/media-previous.svg)
skin/classic/browser/zen-icons/media-speed.svg (../shared/zen-icons/lin/media-speed.svg)
skin/classic/browser/zen-icons/media-unmute.svg (../shared/zen-icons/lin/media-unmute.svg)
skin/classic/browser/zen-icons/menu-bar.svg (../shared/zen-icons/lin/menu-bar.svg)

2
src/browser/themes/shared/zen-icons/lin/accessibility.svg
View File

@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><circle cx="9" cy="2.25" r="1.5" data-color="color-2"></circle><line x1="7.25" y1="16.5" x2="7.25" y2="6.24"></line><line x1="10.75" y1="6.24" x2="10.75" y2="16.5"></line><path d="M2.75,5.75c1.751,.3,3.86,.531,6.25,.531,1.777,0,3.894-.128,6.25-.531"></path><line x1="7.25" y1="11.25" x2="10.75" y2="11.25"></line></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="context-fill" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><circle cx="9" cy="2.25" r="1.5" data-color="color-2"></circle><line x1="7.25" y1="16.5" x2="7.25" y2="6.24"></line><line x1="10.75" y1="6.24" x2="10.75" y2="16.5"></line><path d="M2.75,5.75c1.751,.3,3.86,.531,6.25,.531,1.777,0,3.894-.128,6.25-.531"></path><line x1="7.25" y1="11.25" x2="10.75" y2="11.25"></line></g></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 572 B

After

Width:  |  Height:  |  Size: 572 B

2
src/browser/themes/shared/zen-icons/lin/add-to-dictionary.svg
View File

@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M14.181,3.257c-.221-.865-.998-1.507-1.931-1.507H5.75c-1.105,0-2,.896-2,2v12.5l5.25-3.5,5.25,3.5v-3"></path><line x1="14.25" y1="5.75" x2="14.25" y2="10.75" data-color="color-2"></line><line x1="16.75" y1="8.25" x2="11.75" y2="8.25" data-color="color-2"></line></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="context-fill" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M14.181,3.257c-.221-.865-.998-1.507-1.931-1.507H5.75c-1.105,0-2,.896-2,2v12.5l5.25-3.5,5.25,3.5v-3"></path><line x1="14.25" y1="5.75" x2="14.25" y2="10.75" data-color="color-2"></line><line x1="16.75" y1="8.25" x2="11.75" y2="8.25" data-color="color-2"></line></g></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 528 B

After

Width:  |  Height:  |  Size: 528 B

2
src/browser/themes/shared/zen-icons/lin/arrow-down.svg
View File

@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><polyline points="15.25 6.5 9 12.75 2.75 6.5"></polyline></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="context-fill" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><polyline points="15.25 6.5 9 12.75 2.75 6.5"></polyline></g></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 316 B

After

Width:  |  Height:  |  Size: 316 B

2
src/browser/themes/shared/zen-icons/lin/arrow-left.svg
View File

@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><polyline points="11.5 15.25 5.25 9 11.5 2.75"></polyline></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="context-fill" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><polyline points="11.5 15.25 5.25 9 11.5 2.75"></polyline></g></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 317 B

After

Width:  |  Height:  |  Size: 317 B

2
src/browser/themes/shared/zen-icons/lin/arrow-right.svg
View File

@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><polyline points="6.5 2.75 12.75 9 6.5 15.25"></polyline></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="context-fill" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><polyline points="6.5 2.75 12.75 9 6.5 15.25"></polyline></g></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 316 B

After

Width:  |  Height:  |  Size: 316 B

2
src/browser/themes/shared/zen-icons/lin/arrow-up.svg
View File

@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><polyline points="2.75 11.5 9 5.25 15.25 11.5"></polyline></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="context-fill" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><polyline points="2.75 11.5 9 5.25 15.25 11.5"></polyline></g></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 317 B

After

Width:  |  Height:  |  Size: 317 B

2
src/browser/themes/shared/zen-icons/lin/audio-save.svg
View File

@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><line x1="5.75" y1="7.25" x2="5.75" y2="13.75"></line><line x1="14.75" y1="5.75" x2="14.75" y2="12.25"></line><path d="m8.6399,3.0186l4.9461-.8246c.61-.102,1.164.368,1.164.986v2.57l-9,1.5"></path><circle cx="3.75" cy="13.75" r="2"></circle><circle cx="12.75" cy="12.25" r="2"></circle><line x1="3.75" y1="1.25" x2="3.75" y2="6.25" data-color="color-2"></line><line x1="6.25" y1="3.75" x2="1.25" y2="3.75" data-color="color-2"></line></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="context-fill" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><line x1="5.75" y1="7.25" x2="5.75" y2="13.75"></line><line x1="14.75" y1="5.75" x2="14.75" y2="12.25"></line><path d="m8.6399,3.0186l4.9461-.8246c.61-.102,1.164.368,1.164.986v2.57l-9,1.5"></path><circle cx="3.75" cy="13.75" r="2"></circle><circle cx="12.75" cy="12.25" r="2"></circle><line x1="3.75" y1="1.25" x2="3.75" y2="6.25" data-color="color-2"></line><line x1="6.25" y1="3.75" x2="1.25" y2="3.75" data-color="color-2"></line></g></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 692 B

After

Width:  |  Height:  |  Size: 692 B

2
src/browser/themes/shared/zen-icons/lin/autoplay-media-blocked.svg
View File

@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M9.25,8.75V1.75s1.303,2.048,3.427,3.573"></path><path d="M5.406,16.13c.268,.078,.551,.12,.844,.12,1.657,0,3-1.343,3-3,0-.293-.042-.577-.12-.844"></path><path d="M7.485,10.515c-.377-.17-.795-.265-1.235-.265-1.657,0-3,1.343-3,3,0,.44,.095,.858,.265,1.235"></path><line x1="2" y1="16" x2="16" y2="2" data-color="color-2"></line></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="context-fill" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M9.25,8.75V1.75s1.303,2.048,3.427,3.573"></path><path d="M5.406,16.13c.268,.078,.551,.12,.844,.12,1.657,0,3-1.343,3-3,0-.293-.042-.577-.12-.844"></path><path d="M7.485,10.515c-.377-.17-.795-.265-1.235-.265-1.657,0-3,1.343-3,3,0,.44,.095,.858,.265,1.235"></path><line x1="2" y1="16" x2="16" y2="2" data-color="color-2"></line></g></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 593 B

After

Width:  |  Height:  |  Size: 593 B

2
src/browser/themes/shared/zen-icons/lin/autoplay-media.svg
View File

@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M9.75,13.25V1.75s1.75,2.75,4.5,4.25" data-color="color-2"></path><circle cx="6.75" cy="13.25" r="3"></circle></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="context-fill" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M9.75,13.25V1.75s1.75,2.75,4.5,4.25" data-color="color-2"></path><circle cx="6.75" cy="13.25" r="3"></circle></g></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 377 B

After

Width:  |  Height:  |  Size: 377 B

2
src/browser/themes/shared/zen-icons/lin/back.svg
View File

@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><line x1="2.75" y1="9" x2="15.25" y2="9" data-color="color-2"></line><polyline points="7 13.25 2.75 9 7 4.75"></polyline></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="context-fill" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><line x1="2.75" y1="9" x2="15.25" y2="9" data-color="color-2"></line><polyline points="7 13.25 2.75 9 7 4.75"></polyline></g></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 380 B

After

Width:  |  Height:  |  Size: 380 B

2
src/browser/themes/shared/zen-icons/lin/bookmark-hollow.svg
View File

@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M12.25,16.25l-4.75-3.5-4.75,3.5V6.75c0-1.105,.895-2,2-2h5.5c1.105,0,2,.895,2,2v9.5Z"></path><path d="M6.781,2c.287-.159,.617-.25,.969-.25h5.5c1.105,0,2,.895,2,2V13.25" data-color="color-2"></path></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="context-fill" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M12.25,16.25l-4.75-3.5-4.75,3.5V6.75c0-1.105,.895-2,2-2h5.5c1.105,0,2,.895,2,2v9.5Z"></path><path d="M6.781,2c.287-.159,.617-.25,.969-.25h5.5c1.105,0,2,.895,2,2V13.25" data-color="color-2"></path></g></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 464 B

After

Width:  |  Height:  |  Size: 464 B

2
src/browser/themes/shared/zen-icons/lin/bookmark-star-on-tray.svg
View File

@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M12.25,16.25l-4.75-3.5-4.75,3.5V6.75c0-1.105,.895-2,2-2h5.5c1.105,0,2,.895,2,2v9.5Z"></path><path d="M6.781,2c.287-.159,.617-.25,.969-.25h5.5c1.105,0,2,.895,2,2V13.25" data-color="color-2"></path></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="context-fill" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M12.25,16.25l-4.75-3.5-4.75,3.5V6.75c0-1.105,.895-2,2-2h5.5c1.105,0,2,.895,2,2v9.5Z"></path><path d="M6.781,2c.287-.159,.617-.25,.969-.25h5.5c1.105,0,2,.895,2,2V13.25" data-color="color-2"></path></g></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 464 B

After

Width:  |  Height:  |  Size: 464 B

2
src/browser/themes/shared/zen-icons/lin/bookmark.svg
View File

@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M14.25,16.25l-5.25-3.5-5.25,3.5V3.75c0-1.105,.895-2,2-2h6.5c1.105,0,2,.895,2,2v12.5Z"></path><polyline points="6.497 8 8.106 9.5 11.503 5" data-color="color-2"></polyline></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="context-fill" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M14.25,16.25l-5.25-3.5-5.25,3.5V3.75c0-1.105,.895-2,2-2h6.5c1.105,0,2,.895,2,2v12.5Z"></path><polyline points="6.497 8 8.106 9.5 11.503 5" data-color="color-2"></polyline></g></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 439 B

After

Width:  |  Height:  |  Size: 439 B

2
src/browser/themes/shared/zen-icons/lin/camera-blocked.svg
View File

@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M7.285,14.25h6.965c1.105,0,2-.895,2-2V5.75c0-.138-.014-.273-.041-.403"></path><path d="M14.25,3.75h-2.25l-.507-1.351c-.146-.39-.519-.649-.936-.649h-3.114c-.417,0-.79,.259-.936,.649l-.507,1.351H3.75c-1.105,0-2,.895-2,2v6.5c0,1.105,.895,2,2,2"></path><path d="M7.055,10.945c-.498-.498-.805-1.185-.805-1.945,0-1.519,1.231-2.75,2.75-2.75,.759,0,1.447,.308,1.945,.805" data-color="color-2"></path><circle cx="4.25" cy="6.25" r=".75" fill="currentColor" data-color="color-2" data-stroke="none" stroke="none"></circle><line x1="2" y1="16" x2="16" y2="2" data-color="color-2"></line></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="context-fill" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M7.285,14.25h6.965c1.105,0,2-.895,2-2V5.75c0-.138-.014-.273-.041-.403"></path><path d="M14.25,3.75h-2.25l-.507-1.351c-.146-.39-.519-.649-.936-.649h-3.114c-.417,0-.79,.259-.936,.649l-.507,1.351H3.75c-1.105,0-2,.895-2,2v6.5c0,1.105,.895,2,2,2"></path><path d="M7.055,10.945c-.498-.498-.805-1.185-.805-1.945,0-1.519,1.231-2.75,2.75-2.75,.759,0,1.447,.308,1.945,.805" data-color="color-2"></path><circle cx="4.25" cy="6.25" r=".75" fill="currentColor" data-color="color-2" data-stroke="none" stroke="none"></circle><line x1="2" y1="16" x2="16" y2="2" data-color="color-2"></line></g></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 843 B

After

Width:  |  Height:  |  Size: 843 B

2
src/browser/themes/shared/zen-icons/lin/camera.svg
View File

@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M14.25,3.75h-2.25l-.507-1.351c-.146-.39-.519-.649-.936-.649h-3.114c-.417,0-.79,.259-.936,.649l-.507,1.351H3.75c-1.105,0-2,.895-2,2v6.5c0,1.105,.895,2,2,2H14.25c1.105,0,2-.895,2-2V5.75c0-1.105-.895-2-2-2Z"></path><circle cx="9" cy="9" r="2.75" data-color="color-2"></circle><circle cx="4.25" cy="6.25" r=".75" fill="currentColor" data-color="color-2" data-stroke="none" stroke="none"></circle></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="context-fill" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M14.25,3.75h-2.25l-.507-1.351c-.146-.39-.519-.649-.936-.649h-3.114c-.417,0-.79,.259-.936,.649l-.507,1.351H3.75c-1.105,0-2,.895-2,2v6.5c0,1.105,.895,2,2,2H14.25c1.105,0,2-.895,2-2V5.75c0-1.105-.895-2-2-2Z"></path><circle cx="9" cy="9" r="2.75" data-color="color-2"></circle><circle cx="4.25" cy="6.25" r=".75" fill="currentColor" data-color="color-2" data-stroke="none" stroke="none"></circle></g></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 660 B

After

Width:  |  Height:  |  Size: 660 B

2
src/browser/themes/shared/zen-icons/lin/canvas.svg
View File

@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M3.762,14.989l6.074-6.075c.781-.781,2.047-.781,2.828,0l2.586,2.586" data-color="color-2"></path><rect x="2.75" y="2.75" width="12.5" height="12.5" rx="2" ry="2"></rect><circle cx="6.25" cy="7.25" r="1.25" fill="currentColor" data-color="color-2" data-stroke="none" stroke="none"></circle></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="context-fill" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M3.762,14.989l6.074-6.075c.781-.781,2.047-.781,2.828,0l2.586,2.586" data-color="color-2"></path><rect x="2.75" y="2.75" width="12.5" height="12.5" rx="2" ry="2"></rect><circle cx="6.25" cy="7.25" r="1.25" fill="currentColor" data-color="color-2" data-stroke="none" stroke="none"></circle></g></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 556 B

After

Width:  |  Height:  |  Size: 556 B

2
src/browser/themes/shared/zen-icons/lin/checkmark.svg
View File

@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><polyline points="2.75 9.5 6.5 13.25 15.25 4.5"></polyline></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="context-fill" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><polyline points="2.75 9.5 6.5 13.25 15.25 4.5"></polyline></g></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 318 B

After

Width:  |  Height:  |  Size: 318 B

2
src/browser/themes/shared/zen-icons/lin/chevron.svg
View File

@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><polyline points="9.75 4.75 14 9 9.75 13.25" data-color="color-2"></polyline><polyline points="5 4.75 9.25 9 5 13.25"></polyline></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="context-fill" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><polyline points="9.75 4.75 14 9 9.75 13.25" data-color="color-2"></polyline><polyline points="5 4.75 9.25 9 5 13.25"></polyline></g></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 388 B

After

Width:  |  Height:  |  Size: 388 B

2
src/browser/themes/shared/zen-icons/lin/close-all.svg
View File

@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M1.75,16.25v-.5c0-1.105,.895-2,2-2H14.25c1.105,0,2,.895,2,2v.5"></path><path d="M3.75,11.25c0-.828,.672-1.5,1.5-1.5h7.5c.828,0,1.5,.672,1.5,1.5"></path><polyline points="11.5 4.75 9 7.25 6.5 4.75" data-color="color-2"></polyline><line x1="9" y1="7" x2="9" y2="1.75" data-color="color-2"></line></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="context-fill" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M1.75,16.25v-.5c0-1.105,.895-2,2-2H14.25c1.105,0,2,.895,2,2v.5"></path><path d="M3.75,11.25c0-.828,.672-1.5,1.5-1.5h7.5c.828,0,1.5,.672,1.5,1.5"></path><polyline points="11.5 4.75 9 7.25 6.5 4.75" data-color="color-2"></polyline><line x1="9" y1="7" x2="9" y2="1.75" data-color="color-2"></line></g></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 562 B

After

Width:  |  Height:  |  Size: 562 B

2
src/browser/themes/shared/zen-icons/lin/close.svg
View File

@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><line x1="14" y1="4" x2="4" y2="14" data-color="color-2"></line><line x1="4" y1="4" x2="14" y2="14"></line></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="context-fill" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><line x1="14" y1="4" x2="4" y2="14" data-color="color-2"></line><line x1="4" y1="4" x2="14" y2="14"></line></g></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 366 B

After

Width:  |  Height:  |  Size: 366 B

2
src/browser/themes/shared/zen-icons/lin/container-tab.svg
View File

@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M6.75,2.75h7c1.105,0,2,.895,2,2v1.5" data-color="color-2"></path><line x1="11.25" y1="2.75" x2="11.25" y2="6.25" data-color="color-2"></line><line x1="14.75" y1="11.75" x2="14.75" y2="16.75" data-color="color-2"></line><path d="M15.75,9.461v-3.211H6.75V2.75h-2.5c-1.105,0-2,.895-2,2V13.25c0,1.105,.895,2,2,2h5.711"></path><line x1="17.25" y1="14.25" x2="12.25" y2="14.25" data-color="color-2"></line></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="context-fill" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M6.75,2.75h7c1.105,0,2,.895,2,2v1.5" data-color="color-2"></path><line x1="11.25" y1="2.75" x2="11.25" y2="6.25" data-color="color-2"></line><line x1="14.75" y1="11.75" x2="14.75" y2="16.75" data-color="color-2"></line><path d="M15.75,9.461v-3.211H6.75V2.75h-2.5c-1.105,0-2,.895-2,2V13.25c0,1.105,.895,2,2,2h5.711"></path><line x1="17.25" y1="14.25" x2="12.25" y2="14.25" data-color="color-2"></line></g></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 668 B

After

Width:  |  Height:  |  Size: 668 B

2
src/browser/themes/shared/zen-icons/lin/customize.svg
View File

@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><polyline points="10.25 12.75 12.75 15.25 15.25 12.75" data-color="color-2"></polyline><polyline points="15.25 5.25 12.75 2.75 10.25 5.25" data-color="color-2"></polyline><line x1="12.75" y1="15" x2="12.75" y2="3" data-color="color-2"></line><rect x="2.75" y="10.25" width="5" height="5" rx="1" ry="1"></rect><rect x="2.75" y="2.75" width="5" height="5" rx="1" ry="1"></rect></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="context-fill" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><polyline points="10.25 12.75 12.75 15.25 15.25 12.75" data-color="color-2"></polyline><polyline points="15.25 5.25 12.75 2.75 10.25 5.25" data-color="color-2"></polyline><line x1="12.75" y1="15" x2="12.75" y2="3" data-color="color-2"></line><rect x="2.75" y="10.25" width="5" height="5" rx="1" ry="1"></rect><rect x="2.75" y="2.75" width="5" height="5" rx="1" ry="1"></rect></g></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 634 B

After

Width:  |  Height:  |  Size: 634 B

2
src/browser/themes/shared/zen-icons/lin/desktop-notification-blocked.svg
View File

@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M13.368,4.632c-.726-1.694-2.408-2.882-4.368-2.882h0c-2.623,0-4.75,2.127-4.75,4.75v4.75c0,1.105-.895,2-2,2h2.5"></path><path d="M8,13.25h7.75c-1.105,0-2-.895-2-2v-3.5"></path><path d="M10.588,15.185c-.095-.117-.237-.185-.388-.185h-2.399c-.151,0-.293,.068-.388,.185-.095,.117-.132,.271-.101,.418,.173,.822,.868,1.397,1.689,1.397s1.516-.575,1.689-1.397c.031-.147-.006-.301-.101-.418Z" fill="currentColor" data-color="color-2" data-stroke="none" stroke="none"></path><line x1="2" y1="16" x2="16" y2="2" data-color="color-2"></line></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="context-fill" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M13.368,4.632c-.726-1.694-2.408-2.882-4.368-2.882h0c-2.623,0-4.75,2.127-4.75,4.75v4.75c0,1.105-.895,2-2,2h2.5"></path><path d="M8,13.25h7.75c-1.105,0-2-.895-2-2v-3.5"></path><path d="M10.588,15.185c-.095-.117-.237-.185-.388-.185h-2.399c-.151,0-.293,.068-.388,.185-.095,.117-.132,.271-.101,.418,.173,.822,.868,1.397,1.689,1.397s1.516-.575,1.689-1.397c.031-.147-.006-.301-.101-.418Z" fill="currentColor" data-color="color-2" data-stroke="none" stroke="none"></path><line x1="2" y1="16" x2="16" y2="2" data-color="color-2"></line></g></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 795 B

After

Width:  |  Height:  |  Size: 795 B

2
src/browser/themes/shared/zen-icons/lin/desktop-notification.svg
View File

@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M15.75,13.25c-1.105,0-2-.895-2-2V6.5c0-2.623-2.127-4.75-4.75-4.75h0c-2.623,0-4.75,2.127-4.75,4.75v4.75c0,1.105-.895,2-2,2H15.75Z"></path><path d="M10.588,15.185c-.095-.117-.237-.185-.388-.185h-2.399c-.151,0-.293,.068-.388,.185-.095,.117-.132,.271-.101,.418,.173,.822,.868,1.397,1.689,1.397s1.516-.575,1.689-1.397c.031-.147-.006-.301-.101-.418Z" fill="currentColor" data-color="color-2" data-stroke="none" stroke="none"></path></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="context-fill" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M15.75,13.25c-1.105,0-2-.895-2-2V6.5c0-2.623-2.127-4.75-4.75-4.75h0c-2.623,0-4.75,2.127-4.75,4.75v4.75c0,1.105-.895,2-2,2H15.75Z"></path><path d="M10.588,15.185c-.095-.117-.237-.185-.388-.185h-2.399c-.151,0-.293,.068-.388,.185-.095,.117-.132,.271-.101,.418,.173,.822,.868,1.397,1.689,1.397s1.516-.575,1.689-1.397c.031-.147-.006-.301-.101-.418Z" fill="currentColor" data-color="color-2" data-stroke="none" stroke="none"></path></g></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 694 B

After

Width:  |  Height:  |  Size: 694 B

2
src/browser/themes/shared/zen-icons/lin/developer.svg
View File

@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><circle cx="9" cy="12.25" r=".75" fill="currentColor" data-color="color-2" data-stroke="none" stroke="none"></circle><circle cx="11.75" cy="12.25" r=".75" fill="currentColor" data-color="color-2" data-stroke="none" stroke="none"></circle><circle cx="6.25" cy="12.25" r=".75" fill="currentColor" data-color="color-2" data-stroke="none" stroke="none"></circle><path d="M6.25,15.25h-1c-1.105,0-2-.895-2-2v-2.625c0-.897-.728-1.625-1.625-1.625,.897,0,1.625-.728,1.625-1.625v-2.625c0-1.105,.895-2,2-2h1"></path><path d="M11.75,15.25h1c1.105,0,2-.895,2-2v-2.625c0-.897,.728-1.625,1.625-1.625-.897,0-1.625-.728-1.625-1.625v-2.625c0-1.105-.895-2-2-2h-1"></path></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="context-fill" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><circle cx="9" cy="12.25" r=".75" fill="currentColor" data-color="color-2" data-stroke="none" stroke="none"></circle><circle cx="11.75" cy="12.25" r=".75" fill="currentColor" data-color="color-2" data-stroke="none" stroke="none"></circle><circle cx="6.25" cy="12.25" r=".75" fill="currentColor" data-color="color-2" data-stroke="none" stroke="none"></circle><path d="M6.25,15.25h-1c-1.105,0-2-.895-2-2v-2.625c0-.897-.728-1.625-1.625-1.625,.897,0,1.625-.728,1.625-1.625v-2.625c0-1.105,.895-2,2-2h1"></path><path d="M11.75,15.25h1c1.105,0,2-.895,2-2v-2.625c0-.897,.728-1.625,1.625-1.625-.897,0-1.625-.728-1.625-1.625v-2.625c0-1.105-.895-2-2-2h-1"></path></g></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 911 B

After

Width:  |  Height:  |  Size: 911 B

2
src/browser/themes/shared/zen-icons/lin/downloads.svg
View File

@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M15.25,11.75v1.5c0,1.105-.895,2-2,2H4.75c-1.105,0-2-.895-2-2v-1.5"></path><polyline points="5.5 6.75 9 10.25 12.5 6.75" data-color="color-2"></polyline><line x1="9" y1="10.25" x2="9" y2="2.75" data-color="color-2"></line></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="context-fill" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><path d="M15.25,11.75v1.5c0,1.105-.895,2-2,2H4.75c-1.105,0-2-.895-2-2v-1.5"></path><polyline points="5.5 6.75 9 10.25 12.5 6.75" data-color="color-2"></polyline><line x1="9" y1="10.25" x2="9" y2="2.75" data-color="color-2"></line></g></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 489 B

After

Width:  |  Height:  |  Size: 489 B

2
src/browser/themes/shared/zen-icons/lin/drag-indicator.svg
View File

@@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="currentColor" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><circle cx="6.75" cy="9" r=".5" fill="currentColor" data-color="color-2"></circle><circle cx="6.75" cy="3.75" r=".5" fill="currentColor"></circle><circle cx="6.75" cy="14.25" r=".5" fill="currentColor"></circle><circle cx="11.25" cy="9" r=".5" fill="currentColor" data-color="color-2"></circle><circle cx="11.25" cy="3.75" r=".5" fill="currentColor"></circle><circle cx="11.25" cy="14.25" r=".5" fill="currentColor"></circle></g></svg>
<svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 18 18"><g stroke-linecap="round" stroke-width="1.5" fill="none" stroke="context-fill" stroke-opacity="context-fill-opacity" stroke-linejoin="round" class="nc-icon-wrapper"><circle cx="6.75" cy="9" r=".5" fill="currentColor" data-color="color-2"></circle><circle cx="6.75" cy="3.75" r=".5" fill="currentColor"></circle><circle cx="6.75" cy="14.25" r=".5" fill="currentColor"></circle><circle cx="11.25" cy="9" r=".5" fill="currentColor" data-color="color-2"></circle><circle cx="11.25" cy="3.75" r=".5" fill="currentColor"></circle><circle cx="11.25" cy="14.25" r=".5" fill="currentColor"></circle></g></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 684 B

After

Width:  |  Height:  |  Size: 684 B

Some files were not shown because too many files have changed in this diff Show More