mirrors/desktop
1
0
Fork 0
mirror of https://github.com/zen-browser/desktop.git synced 2025-09-07 03:48:22 +00:00
Code Issues Packages Projects Releases Wiki Activity

Enhance styling and functionality in Zen components; adjust URL bar border radius, update tab unloading logic, and refine element separation settings

Browse Source
This commit is contained in:
mr. M
2025-03-06 12:50:42 +01:00
parent 8d3b9098c0
commit 713ceab89f
138 changed files with 196 additions and 191 deletions
Download Patch File Download Diff File Expand all files Collapse all files

71
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..2e28e3eba422e176c0536e6a6d0386de9d5b6d33 100644
index fa96568d366fd3608f9bd583fa793150bd815c8b..1e007c37cd204c63afad24c8b6d9201e6a02da2d 100644
--- a/browser/components/tabbrowser/content/tabs.js
+++ b/browser/components/tabbrowser/content/tabs.js
@@ -94,7 +94,7 @@
@@ -37,17 +37,18 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..2e28e3eba422e176c0536e6a6d0386de
let tabsPerRow = 0;
let position = 0;
for (let pinnedTab of pinnedTabs) {
@@ -883,6 +884,9 @@
@@ -883,6 +884,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 +1001,14 @@
this._tabDropIndicator.hidden = true;
event.stopPropagation();
@@ -62,7 +63,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..2e28e3eba422e176c0536e6a6d0386de
if (draggedTab && dropEffect == "copy") {
// copy the dropped tab (wherever it's from)
let newIndex = this._getDropIndex(event);
@@ -1034,10 +1046,11 @@
@@ -1034,10 +1047,11 @@
}
} else {
let pinned = draggedTab.pinned;
@@ -78,7 +79,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..2e28e3eba422e176c0536e6a6d0386de
);
let size = this.verticalMode ? "height" : "width";
let screenAxis = this.verticalMode ? "screenY" : "screenX";
@@ -1114,7 +1127,7 @@
@@ -1114,7 +1128,7 @@
let postTransitionCleanup = () => {
tab.removeAttribute("tabdrop-samewindow");
@@ -87,7 +88,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..2e28e3eba422e176c0536e6a6d0386de
if (dropIndex !== false) {
gBrowser.moveTabTo(tab, dropIndex);
if (!directionForward) {
@@ -1122,7 +1135,7 @@
@@ -1122,7 +1136,7 @@
}
}
};
@@ -96,7 +97,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..2e28e3eba422e176c0536e6a6d0386de
postTransitionCleanup();
} else {
let onTransitionEnd = transitionendEvent => {
@@ -1279,13 +1292,23 @@
@@ -1279,13 +1293,23 @@
return;
}
@@ -122,7 +123,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..2e28e3eba422e176c0536e6a6d0386de
) {
delete draggedTab._dragData;
return;
@@ -1517,7 +1540,7 @@
@@ -1517,7 +1541,7 @@
}
get newTabButton() {
@@ -131,7 +132,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..2e28e3eba422e176c0536e6a6d0386de
}
get verticalMode() {
@@ -1537,28 +1560,40 @@
@@ -1537,28 +1561,40 @@
if (this.#allTabs) {
return this.#allTabs;
}
@@ -180,7 +181,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..2e28e3eba422e176c0536e6a6d0386de
return children.filter(node => node.tagName == "tab-group");
}
@@ -1579,7 +1614,7 @@
@@ -1579,7 +1615,7 @@
*/
get visibleTabs() {
if (!this.#visibleTabs) {
@@ -189,7 +190,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..2e28e3eba422e176c0536e6a6d0386de
}
return this.#visibleTabs;
}
@@ -1613,10 +1648,8 @@
@@ -1613,10 +1649,8 @@
return this.#focusableItems;
}
@@ -202,7 +203,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..2e28e3eba422e176c0536e6a6d0386de
let focusableItems = [];
for (let child of children) {
@@ -1632,6 +1665,7 @@
@@ -1632,6 +1666,7 @@
}
this.#focusableItems = [
@@ -210,7 +211,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..2e28e3eba422e176c0536e6a6d0386de
...verticalPinnedTabsContainer.children,
...focusableItems,
];
@@ -1642,6 +1676,7 @@
@@ -1642,6 +1677,7 @@
_invalidateCachedTabs() {
this.#allTabs = null;
this._invalidateCachedVisibleTabs();
@@ -218,7 +219,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..2e28e3eba422e176c0536e6a6d0386de
}
_invalidateCachedVisibleTabs() {
@@ -1656,8 +1691,8 @@
@@ -1656,8 +1692,8 @@
#isContainerVerticalPinnedExpanded(tab) {
return (
this.verticalMode &&
@@ -229,7 +230,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..2e28e3eba422e176c0536e6a6d0386de
);
}
@@ -1672,7 +1707,7 @@
@@ -1672,7 +1708,7 @@
if (node == null) {
// We have a container for non-tab elements at the end of the scrollbox.
@@ -238,7 +239,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..2e28e3eba422e176c0536e6a6d0386de
}
node.before(tab);
@@ -1772,7 +1807,7 @@
@@ -1772,7 +1808,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 +248,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..2e28e3eba422e176c0536e6a6d0386de
const newTab2 = this.newTabButton;
const newTabVertical = document.getElementById(
"vertical-tabs-newtab-button"
@@ -1855,7 +1890,7 @@
@@ -1855,7 +1891,7 @@
let rect = ele => {
return window.windowUtils.getBoundsWithoutFlushing(ele);
};
@@ -256,7 +257,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..2e28e3eba422e176c0536e6a6d0386de
if (tab && rect(tab).width <= this._tabClipWidth) {
this.setAttribute("closebuttons", "activetab");
} else {
@@ -1867,10 +1902,12 @@
@@ -1867,10 +1903,12 @@
_handleTabSelect(aInstant) {
let selectedTab = this.selectedItem;
@@ -269,7 +270,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..2e28e3eba422e176c0536e6a6d0386de
selectedTab._notselectedsinceload = false;
}
@@ -1882,7 +1919,7 @@
@@ -1882,7 +1920,7 @@
return;
}
@@ -278,7 +279,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..2e28e3eba422e176c0536e6a6d0386de
if (!tabs.length) {
return;
}
@@ -1918,7 +1955,7 @@
@@ -1918,7 +1956,7 @@
if (isEndTab && !this._hasTabTempMaxWidth) {
return;
}
@@ -287,7 +288,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..2e28e3eba422e176c0536e6a6d0386de
// 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 +1971,7 @@
let tabsToReset = [];
for (let i = numPinned; i < tabs.length; i++) {
let tab = tabs[i];
@@ -296,7 +297,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..2e28e3eba422e176c0536e6a6d0386de
if (!isEndTab) {
// keep tabs the same width
tab.style.transition = "none";
@@ -1999,16 +2036,15 @@
@@ -1999,16 +2037,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 +320,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..2e28e3eba422e176c0536e6a6d0386de
}
}
@@ -2016,9 +2052,7 @@
@@ -2016,9 +2053,7 @@
}
_resetVerticalPinnedTabs() {
@@ -330,7 +331,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..2e28e3eba422e176c0536e6a6d0386de
if (!verticalTabsContainer.children.length) {
return;
@@ -2031,8 +2065,8 @@
@@ -2031,8 +2066,8 @@
}
_positionPinnedTabs() {
@@ -341,7 +342,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..2e28e3eba422e176c0536e6a6d0386de
let absPositionHorizontalTabs =
this.overflowing && tabs.length > numPinned && numPinned > 0;
@@ -2041,7 +2075,7 @@
@@ -2041,7 +2076,7 @@
if (this.verticalMode) {
this._updateVerticalPinnedTabs();
@@ -350,7 +351,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..2e28e3eba422e176c0536e6a6d0386de
let layoutData = this._pinnedTabsLayoutCache;
let uiDensity = document.documentElement.getAttribute("uidensity");
if (!layoutData || layoutData.uiDensity != uiDensity) {
@@ -2113,7 +2147,7 @@
@@ -2113,7 +2148,7 @@
return;
}
@@ -359,7 +360,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..2e28e3eba422e176c0536e6a6d0386de
let directionX = screenX > dragData.animLastScreenX;
let directionY = screenY > dragData.animLastScreenY;
@@ -2121,7 +2155,7 @@
@@ -2121,7 +2156,7 @@
dragData.animLastScreenX = screenX;
let { width: tabWidth, height: tabHeight } =
@@ -368,7 +369,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..2e28e3eba422e176c0536e6a6d0386de
let shiftSizeX = tabWidth * movingTabs.length;
let shiftSizeY = tabHeight;
dragData.tabWidth = tabWidth;
@@ -2296,10 +2330,11 @@
@@ -2296,10 +2331,11 @@
}
let pinned = draggedTab.pinned;
@@ -384,7 +385,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..2e28e3eba422e176c0536e6a6d0386de
);
if (this.#rtlMode) {
@@ -2347,8 +2382,12 @@
@@ -2347,8 +2383,12 @@
(lastMovingTabScreen + tabSize);
translate = Math.min(Math.max(translate, firstBound), lastBound);
@@ -399,7 +400,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..2e28e3eba422e176c0536e6a6d0386de
}
dragData.translatePos = translate;
@@ -2484,12 +2523,16 @@
@@ -2484,12 +2524,16 @@
// Shift background tabs to leave a gap where the dragged tab
// would currently be dropped.
for (let tab of tabs) {
@@ -417,7 +418,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..2e28e3eba422e176c0536e6a6d0386de
if (tab.group?.tabs[0] == tab) {
tab.group.style.setProperty(
"--tabgroup-dragover-transform",
@@ -2541,8 +2584,9 @@
@@ -2541,8 +2585,9 @@
);
}
@@ -429,7 +430,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..2e28e3eba422e176c0536e6a6d0386de
return;
}
@@ -2553,6 +2597,7 @@
@@ -2553,6 +2598,7 @@
tab.style.transform = "";
if (tab.group) {
tab.group.style.removeProperty("--tabgroup-dragover-transform");
@@ -437,7 +438,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..2e28e3eba422e176c0536e6a6d0386de
}
tab.removeAttribute("dragover-createGroup");
}
@@ -2604,7 +2649,7 @@
@@ -2604,7 +2650,7 @@
movingTab._moveTogetherSelectedTabsData.newIndex = movingTabNewIndex;
movingTab._moveTogetherSelectedTabsData.animate = false;
};
@@ -446,7 +447,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..2e28e3eba422e176c0536e6a6d0386de
postTransitionCleanup();
} else {
let onTransitionEnd = transitionendEvent => {
@@ -2707,9 +2752,9 @@
@@ -2707,9 +2753,9 @@
function newIndex(aTab, index) {
// Don't allow mixing pinned and unpinned tabs.
if (aTab.pinned) {
@@ -458,7 +459,7 @@ index fa96568d366fd3608f9bd583fa793150bd815c8b..2e28e3eba422e176c0536e6a6d0386de
}
}
@@ -2793,7 +2838,7 @@
@@ -2793,7 +2839,7 @@
}
_notifyBackgroundTab(aTab) {