1
0
Fork 1
mirror of https://github.com/zen-browser/desktop.git synced 2025-07-08 05:59:58 +02:00

chore: Made an URL revamp! Fixed lots of things in different layouts and made it's UI a bit cleaner, b=(no-bug), c=common

This commit is contained in:
Mr. M 2025-04-29 12:52:05 +02:00
parent c5515fc3ae
commit a35ef0e735
No known key found for this signature in database
GPG key ID: 6292C4C8F8652B18
4 changed files with 40 additions and 18 deletions

View file

@ -387,7 +387,7 @@ pref('zen.widget.linux.transparency', false);
#endif #endif
// Urlbar and autocomplete // Urlbar and autocomplete
pref("browser.urlbar.maxRichResults", 6); pref("browser.urlbar.maxRichResults", 8);
pref("browser.urlbar.trimHttps", true); pref("browser.urlbar.trimHttps", true);
pref("browser.search.separatePrivateDefault.ui.enabled", true); pref("browser.search.separatePrivateDefault.ui.enabled", true);
pref("browser.urlbar.update2.engineAliasRefresh", true); pref("browser.urlbar.update2.engineAliasRefresh", true);

View file

@ -1,5 +1,5 @@
diff --git a/browser/components/urlbar/UrlbarInput.sys.mjs b/browser/components/urlbar/UrlbarInput.sys.mjs diff --git a/browser/components/urlbar/UrlbarInput.sys.mjs b/browser/components/urlbar/UrlbarInput.sys.mjs
index 4b69136aa31bfef3a1d3b57ad0c75fe07fa26be0..a864dd8854611d78e3ace9db301cf7c4f1357a32 100644 index 4b69136aa31bfef3a1d3b57ad0c75fe07fa26be0..2de9f51784a92442da84ead54312e879c1da127b 100644
--- a/browser/components/urlbar/UrlbarInput.sys.mjs --- a/browser/components/urlbar/UrlbarInput.sys.mjs
+++ b/browser/components/urlbar/UrlbarInput.sys.mjs +++ b/browser/components/urlbar/UrlbarInput.sys.mjs
@@ -68,6 +68,13 @@ XPCOMUtils.defineLazyPreferenceGetter( @@ -68,6 +68,13 @@ XPCOMUtils.defineLazyPreferenceGetter(
@ -108,6 +108,15 @@ index 4b69136aa31bfef3a1d3b57ad0c75fe07fa26be0..a864dd8854611d78e3ace9db301cf7c4
this.removeAttribute("breakout-extend"); this.removeAttribute("breakout-extend");
this.#updateTextboxPosition(); this.#updateTextboxPosition();
} }
@@ -2485,7 +2529,7 @@ export class UrlbarInput {
this.textbox.parentNode.style.setProperty(
"--urlbar-container-height",
- px(getBoundsWithoutFlushing(this.textbox.parentNode).height)
+ px(getBoundsWithoutFlushing(this.textbox.parentNode).height + 8)
);
this.textbox.style.setProperty(
"--urlbar-height",
@@ -2998,7 +3042,7 @@ export class UrlbarInput { @@ -2998,7 +3042,7 @@ export class UrlbarInput {
*/ */
_trimValue(val) { _trimValue(val) {
@ -158,7 +167,7 @@ index 4b69136aa31bfef3a1d3b57ad0c75fe07fa26be0..a864dd8854611d78e3ace9db301cf7c4
} }
_on_click(event) { _on_click(event) {
+ if (lazy.ZEN_URLBAR_BEHAVIOR === 'float' && event.target == this.inputField) { + if (event.target == this.inputField) {
+ event.zenOriginalTarget = this.textbox; + event.zenOriginalTarget = this.textbox;
+ this._on_mousedown(event); + this._on_mousedown(event);
+ } + }
@ -183,7 +192,7 @@ index 4b69136aa31bfef3a1d3b57ad0c75fe07fa26be0..a864dd8854611d78e3ace9db301cf7c4
+ switch (event.zenOriginalTarget || event.currentTarget) { + switch (event.zenOriginalTarget || event.currentTarget) {
case this.textbox: { case this.textbox: {
this._mousedownOnUrlbarDescendant = true; this._mousedownOnUrlbarDescendant = true;
+ if (event.type != "click" && lazy.ZEN_URLBAR_BEHAVIOR === 'float') { + if (event.type != "click") {
+ return true; + return true;
+ } + }

View file

@ -1,5 +1,5 @@
diff --git a/browser/themes/shared/urlbar-searchbar.css b/browser/themes/shared/urlbar-searchbar.css diff --git a/browser/themes/shared/urlbar-searchbar.css b/browser/themes/shared/urlbar-searchbar.css
index 574f83af7fa49ddcdff6711ca8b1d3bed1a35e0c..c2e8cb8b37438176db07a47e1e975ae1aea42252 100644 index e237ee9edea85c1d2ef22f988df6b22755e343e6..b06fc06686a7a969e924ad0df662dec937b3c70d 100644
--- a/browser/themes/shared/urlbar-searchbar.css --- a/browser/themes/shared/urlbar-searchbar.css
+++ b/browser/themes/shared/urlbar-searchbar.css +++ b/browser/themes/shared/urlbar-searchbar.css
@@ -5,7 +5,7 @@ @@ -5,7 +5,7 @@
@ -7,11 +7,11 @@ index 574f83af7fa49ddcdff6711ca8b1d3bed1a35e0c..c2e8cb8b37438176db07a47e1e975ae1
:root { :root {
- --urlbar-container-padding: 1px; - --urlbar-container-padding: 1px;
+ --urlbar-container-padding: 4px; + --urlbar-container-padding: 2px;
--urlbar-margin-inline: 5px; --urlbar-margin-inline: 5px;
--urlbar-padding-block: 4px; --urlbar-padding-block: 4px;
} }
@@ -291,7 +291,9 @@ @@ -292,7 +292,9 @@
} }
#urlbar[breakout][breakout-extend] { #urlbar[breakout][breakout-extend] {

View file

@ -9,19 +9,30 @@
padding-block: 0 !important; padding-block: 0 !important;
} }
:root[zen-single-toolbar='true'] {
--urlbar-container-padding: 4px;
& #urlbar:not([breakout-extend='true']) {
padding: 1px;
--toolbarbutton-border-radius: 6px;
}
}
#urlbar { #urlbar {
--toolbarbutton-border-radius: 8px;
--urlbarView-separator-color: light-dark(hsl(0, 0%, 90%), hsl(0, 0%, 20%)); --urlbarView-separator-color: light-dark(hsl(0, 0%, 90%), hsl(0, 0%, 20%));
--urlbarView-hover-background: var(--toolbarbutton-hover-background); --urlbarView-hover-background: var(--toolbarbutton-hover-background);
--urlbarView-highlight-background: var(--toolbarbutton-hover-background); --urlbarView-highlight-background: var(--toolbarbutton-hover-background);
border-radius: var(--toolbarbutton-border-radius); border-radius: calc(var(--toolbarbutton-border-radius) - 2px);
padding: 1px; --urlbarView-results-padding: 10px !important;
:root:not([zen-single-toolbar='true']) &[zen-floating-urlbar='true'] { :root:not([zen-single-toolbar='true']) &[zen-floating-urlbar='true'] {
--urlbar-container-padding: 2px !important; --urlbar-container-padding: 2px !important;
} }
} }
:root:not([zen-single-toolbar='true']) #urlbar:not([zen-floating-urlbar='true']) {
--urlbarView-results-padding: 6px !important;
}
.urlbar-input::placeholder { .urlbar-input::placeholder {
text-overflow: ellipsis; text-overflow: ellipsis;
} }
@ -84,8 +95,11 @@
position: relative; position: relative;
} }
#urlbar:not([breakout-extend='true']) #identity-box { :root[zen-single-toolbar='true'] #urlbar:not([breakout-extend='true']) #identity-box {
margin-inline-end: 0 !important; margin-inline-end: 0 !important;
&.chromeUI:not([pageproxystate='invalid']) #identity-icon-box {
border-radius: 10px !important;
}
} }
.urlbar-page-action, .urlbar-page-action,
@ -177,7 +191,7 @@
transform: none !important; transform: none !important;
display: flex; display: flex;
#urlbar:not(:hover) & { #urlbar:not(:hover) & {
transition: 0; transition: none;
} }
} }
@ -325,11 +339,6 @@ button.popup-notification-dropmarker {
border-radius: var(--urlbar-icon-border-radius) !important; border-radius: var(--urlbar-icon-border-radius) !important;
} }
/* Extensions or similar */
#urlbar:not([breakout-extend='true']) #identity-box.chromeUI:not([pageproxystate='invalid']) #identity-icon-box {
border-radius: 10px !important;
}
/* Notification Stack */ /* Notification Stack */
.notificationbox-stack { .notificationbox-stack {
@ -407,7 +416,7 @@ button.popup-notification-dropmarker {
#urlbar[open] { #urlbar[open] {
z-index: 2; z-index: 2;
--urlbar-margin-inline: 5px !important; --urlbar-margin-inline: 5px;
& #identity-box { & #identity-box {
margin-right: var(--urlbar-margin-inline); margin-right: var(--urlbar-margin-inline);
@ -538,4 +547,8 @@ button.popup-notification-dropmarker {
color: color-mix(in srgb, var(--zen-colors-primary) 30%, lightgray) !important; color: color-mix(in srgb, var(--zen-colors-primary) 30%, lightgray) !important;
} }
} }
&[selected] {
background-color: color-mix(in srgb, var(--zen-primary-color) 50%, transparent 50%) !important;
}
} }