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

Enhance tab animations and transition effects for improved user experience

Browse Source
This commit is contained in:
mr. M
2025-01-29 20:43:17 +01:00
parent cb9c7d5c48
commit d158472709
5 changed files with 9 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -221,14 +221,13 @@ var gZenVerticalTabsManager = {
.animate( .animate(
aTab, aTab,
{ {
opacity: [0.7, 1], opacity: [0, 1],
transform: ['translateY(-20px)', 'translateY(0px)'], transform: ['translateY(-50px)', 'translateY(0px)'],
marginBottom: isLastTab ? [] : ['-20px', '0px'], marginBottom: isLastTab ? [] : ['-20px', '0px'],
}, },
{ {
duration: 0.2, duration: 0.2,
type: 'spring', easing: 'ease-out',
bounce: 0,
} }
) )
.then(() => { .then(() => {

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

@@ -228,8 +228,8 @@
1.003423 100% 1.003423 100%
); );
transition: transition:
left 0.3125s var(--zen-compact-mode-func), left 0.3s var(--zen-compact-mode-func),
right 0.3125s var(--zen-compact-mode-func); right 0.3s var(--zen-compact-mode-func);
opacity: 1; opacity: 1;
left: -1px; left: -1px;

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

@@ -72,7 +72,7 @@
} }
#browser { #browser {
--zen-toolbox-padding: max(5px, calc(var(--zen-element-separation) / 1.5)); --zen-toolbox-padding: max(.4rem, calc(var(--zen-element-separation) / 1.5));
} }
:root[zen-single-toolbar='true'] { :root[zen-single-toolbar='true'] {

4
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 diff --git a/browser/components/tabbrowser/content/tabbrowser.js b/browser/components/tabbrowser/content/tabbrowser.js
index ce68c339f35416574b7bc7ebf8c93378f653242b..810b9c96bc26cc75e37c8b1ed6a61c1a51e123b8 100644 index ce68c339f35416574b7bc7ebf8c93378f653242b..751dfb93d39b9e066b8c2c0aabdebb5581606e12 100644
--- a/browser/components/tabbrowser/content/tabbrowser.js --- a/browser/components/tabbrowser/content/tabbrowser.js
+++ b/browser/components/tabbrowser/content/tabbrowser.js +++ b/browser/components/tabbrowser/content/tabbrowser.js
@@ -409,11 +409,39 @@ @@ -409,11 +409,39 @@
@@ -204,7 +204,7 @@ index ce68c339f35416574b7bc7ebf8c93378f653242b..810b9c96bc26cc75e37c8b1ed6a61c1a
if (typeof index != "number") { if (typeof index != "number") {
// Move the new tab after another tab if needed, to the end otherwise. // Move the new tab after another tab if needed, to the end otherwise.
- index = Infinity; - index = Infinity;
+ index = Services.prefs.getBoolPref("zen.view.show-newtab-button-top") ? this.pinnedTabCount + 1 : Infinity; + index = Services.prefs.getBoolPref("zen.view.show-newtab-button-top") ? this.pinnedTabCount : Infinity;
if ( if (
!bulkOrderedOpen && !bulkOrderedOpen &&
((openerTab && ((openerTab &&

7
src/browser/components/zen-welcome/welcome.css
View File

@@ -39,7 +39,7 @@ body {
#welcome .zen-branding-title, #welcome .zen-branding-title,
#thanks .zen-branding-title { #thanks .zen-branding-title {
text-align: center; text-align: center;
font-size: 9rem; font-size: 7rem;
} }
#buttons-footer { #buttons-footer {
@@ -62,11 +62,6 @@ body {
} }
} }
body:has(#welcome:not([hidden='true'])) {
background: var(--zen-branding-coral);
color: var(--zen-branding-paper);
}
body:has(:is(#welcome, #thanks):not([hidden='true'])) { body:has(:is(#welcome, #thanks):not([hidden='true'])) {
& #buttons-footer { & #buttons-footer {
justify-content: center; justify-content: center;