ZenBrowserMirrors/zen-desktop
1
0
Fork 1
mirror of https://github.com/zen-browser/desktop.git synced 2025-07-10 02:06:24 +02:00
Code Releases Wiki Activity

Started working on nested groups

Browse source
This commit is contained in:
mr. m 2025-04-08 15:48:36 +02:00
parent 225d17eb88
commit 6a23d198a4
No known key found for this signature in database
GPG key ID: 419302196C23B258
4 changed files with 77 additions and 62 deletions
Download patch file Download diff file Expand all files Collapse all files

13
src/browser/base/content/zen-styles/zen-folders.css
View file

@ -1,5 +1,10 @@
tab-group[split-view-group] { tab-group[split-view-group] {
display: flex; display: flex;
}
tab-group[split-view-group] > .tab-group-container {
display: flex;
flex: 1;
flex-wrap: nowrap; flex-wrap: nowrap;
border-radius: var(--border-radius-medium); border-radius: var(--border-radius-medium);
padding: 0 2px; padding: 0 2px;
@ -147,7 +152,7 @@ tab-group:not([split-view-group]) {
margin: var(--tab-block-margin) auto !important; margin: var(--tab-block-margin) auto !important;
} }
& .tab-group-container { & > .tab-group-container {
padding-top: var(--tab-block-margin); padding-top: var(--tab-block-margin);
padding-left: var(--zen-folder-indent, 0.5em); padding-left: var(--zen-folder-indent, 0.5em);
@ -158,7 +163,7 @@ tab-group:not([split-view-group]) {
margin: var(--tab-block-margin); margin: var(--tab-block-margin);
& .tab-group-label-container { & > .tab-group-label-container {
flex: 0 0 auto !important; flex: 0 0 auto !important;
position: sticky !important; position: sticky !important;
top: 0 !important; top: 0 !important;
@ -208,11 +213,11 @@ tab-group:not([split-view-group]) {
} }
&[collapsed] { &[collapsed] {
& .tabbrowser-tab:not([hidden]) { & > .tabbrowser-tab:not([hidden]) {
display: flex; display: flex;
} }
& .tab-group-container { & > .tab-group-container {
overflow-y: hidden; overflow-y: hidden;
} }
} }

1
src/browser/base/zen-components/ZenWorkspaces.mjs
View file

@ -176,7 +176,6 @@ var ZenWorkspaces = new (class extends ZenMultiWindowFeature {
} }
get tabboxChildren() { get tabboxChildren() {
console.log(new Error().stack);
return Array.from(this.activeWorkspaceStrip?.children || []); return Array.from(this.activeWorkspaceStrip?.children || []);
} }

31
src/browser/components/tabbrowser/content/tabgroup-js.patch
View file

@ -1,5 +1,5 @@
diff --git a/browser/components/tabbrowser/content/tabgroup.js b/browser/components/tabbrowser/content/tabgroup.js diff --git a/browser/components/tabbrowser/content/tabgroup.js b/browser/components/tabbrowser/content/tabgroup.js
index 670fe2b309863102f63246e26194c8958e28bbb7..9585c7b8a2e35b29a7630fd6bd2e4a972a1700c7 100644 index 670fe2b309863102f63246e26194c8958e28bbb7..ba99c89d0aba16e8f77ed8493f0a97d151b02cb3 100644
--- a/browser/components/tabbrowser/content/tabgroup.js --- a/browser/components/tabbrowser/content/tabgroup.js
+++ b/browser/components/tabbrowser/content/tabgroup.js +++ b/browser/components/tabbrowser/content/tabgroup.js
@@ -9,10 +9,13 @@ @@ -9,10 +9,13 @@
@ -10,11 +10,12 @@ index 670fe2b309863102f63246e26194c8958e28bbb7..9585c7b8a2e35b29a7630fd6bd2e4a97
+ <hbox class="tab-group-label-container" pack="center"> + <hbox class="tab-group-label-container" pack="center">
+ <image class="tab-group-folder-icon"/> + <image class="tab-group-folder-icon"/>
<label class="tab-group-label" role="button"/> <label class="tab-group-label" role="button"/>
+ </hbox> - </vbox>
+ <vbox class="tab-group-container">
+ <html:div class="zen-tab-group-start" />
</vbox>
- <html:slot/> - <html:slot/>
+ </hbox>
+ <html:div class="tab-group-container">
+ <html:div class="zen-tab-group-start" />
+ </html:div>
`; `;
/** @type {string} */ /** @type {string} */
@ -27,16 +28,30 @@ index 670fe2b309863102f63246e26194c8958e28bbb7..9585c7b8a2e35b29a7630fd6bd2e4a97
this.#updateLabelAriaAttributes(); this.#updateLabelAriaAttributes();
this.#updateCollapsedAriaAttributes(); this.#updateCollapsedAriaAttributes();
@@ -213,7 +216,7 @@ @@ -213,7 +216,21 @@
} }
get tabs() { get tabs() {
- return Array.from(this.children).filter(node => node.matches("tab")); - return Array.from(this.children).filter(node => node.matches("tab"));
+ return Array.from(this.querySelector('.tab-group-container').children).filter(node => node.matches("tab")); + // add other group tabs if they are under this group
+ let childs = Array.from(this.querySelector('.tab-group-container').children);
+ for (let item of childs) {
+ if (item.tagName == "tab-group") {
+ childs = childs.concat(item.tabs);
+ }
+ }
+ return childs.filter(node => node.matches("tab"));
+ }
+
+ get group() {
+ if (this.parentElement?.parentElement?.tagName == "tab-group") {
+ return this.parentElement.parentElement;
+ }
+ return null;
} }
/** /**
@@ -270,7 +273,7 @@ @@ -270,7 +287,7 @@
* @param {PointerEvent} event * @param {PointerEvent} event
*/ */
on_click(event) { on_click(event) {

94
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 diff --git a/browser/components/tabbrowser/content/tabs.js b/browser/components/tabbrowser/content/tabs.js
index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..71bcc2b6221fb0a54667d1a72155b500869e6c1a 100644 index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..c89077bcd00cf33267934e5a020728e311cc0a18 100644
--- a/browser/components/tabbrowser/content/tabs.js --- a/browser/components/tabbrowser/content/tabs.js
+++ b/browser/components/tabbrowser/content/tabs.js +++ b/browser/components/tabbrowser/content/tabs.js
@@ -93,7 +93,7 @@ @@ -93,7 +93,7 @@
@ -144,7 +144,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..71bcc2b6221fb0a54667d1a72155b500
} }
get verticalMode() { get verticalMode() {
@@ -1524,29 +1553,52 @@ @@ -1524,29 +1553,47 @@
if (this.#allTabs) { if (this.#allTabs) {
return this.#allTabs; return this.#allTabs;
} }
@ -169,20 +169,15 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..71bcc2b6221fb0a54667d1a72155b500
...children, ...children,
]; ];
+ let pinnedTabIdx = 0; + let pinnedTabIdx = 0;
+ let hasFoundGroup = true; + for (let i = 0; i < allTabs.length; i++) {
+ while (hasFoundGroup) { + if (allTabs[i].classList.contains("vertical-pinned-tabs-container-separator")) {
+ hasFoundGroup = false; + // remove the separator from the list
+ for (let i = 0; i < allTabs.length; i++) { + allTabs.splice(i, 1);
+ if (allTabs[i].classList.contains("vertical-pinned-tabs-container-separator")) { + i--;
+ // remove the separator from the list + } else if (allTabs[i].tagName == "tab-group") {
+ allTabs.splice(i, 1); + allTabs.splice(i, 1, ...allTabs[i].tabs);
+ i--; + } else if (allTabs[i].pinned) {
+ } else if (allTabs[i].tagName == "tab-group") { + pinnedTabIdx++;
+ allTabs.splice(i, 1, ...allTabs[i].tabs);
+ hasFoundGroup = true; // Recursively explode tab groups
+ } else if (allTabs[i].pinned) {
+ pinnedTabIdx++;
+ }
+ } + }
+ } + }
+ for (let i = 0; i < allTabs.length; i++) { + for (let i = 0; i < allTabs.length; i++) {
@ -206,7 +201,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..71bcc2b6221fb0a54667d1a72155b500
} }
/** /**
@@ -1566,7 +1618,7 @@ @@ -1566,7 +1613,7 @@
*/ */
get visibleTabs() { get visibleTabs() {
if (!this.#visibleTabs) { if (!this.#visibleTabs) {
@ -215,7 +210,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..71bcc2b6221fb0a54667d1a72155b500
} }
return this.#visibleTabs; return this.#visibleTabs;
} }
@@ -1601,23 +1653,18 @@ @@ -1601,23 +1648,18 @@
} }
let elementIndex = 0; let elementIndex = 0;
@ -243,7 +238,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..71bcc2b6221fb0a54667d1a72155b500
let visibleTabsInGroup = child.tabs.filter(tab => tab.visible); let visibleTabsInGroup = child.tabs.filter(tab => tab.visible);
visibleTabsInGroup.forEach(tab => { visibleTabsInGroup.forEach(tab => {
tab.elementIndex = elementIndex++; tab.elementIndex = elementIndex++;
@@ -1627,10 +1674,7 @@ @@ -1627,10 +1669,7 @@
} }
} }
@ -255,7 +250,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..71bcc2b6221fb0a54667d1a72155b500
return this.#focusableItems; return this.#focusableItems;
} }
@@ -1638,6 +1682,7 @@ @@ -1638,6 +1677,7 @@
_invalidateCachedTabs() { _invalidateCachedTabs() {
this.#allTabs = null; this.#allTabs = null;
this._invalidateCachedVisibleTabs(); this._invalidateCachedVisibleTabs();
@ -263,7 +258,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..71bcc2b6221fb0a54667d1a72155b500
} }
_invalidateCachedVisibleTabs() { _invalidateCachedVisibleTabs() {
@@ -1652,8 +1697,8 @@ @@ -1652,8 +1692,8 @@
#isContainerVerticalPinnedExpanded(tab) { #isContainerVerticalPinnedExpanded(tab) {
return ( return (
this.verticalMode && this.verticalMode &&
@ -274,7 +269,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..71bcc2b6221fb0a54667d1a72155b500
); );
} }
@@ -1668,7 +1713,7 @@ @@ -1668,7 +1708,7 @@
if (node == null) { if (node == null) {
// We have a container for non-tab elements at the end of the scrollbox. // We have a container for non-tab elements at the end of the scrollbox.
@ -283,7 +278,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..71bcc2b6221fb0a54667d1a72155b500
} }
node.before(tab); node.before(tab);
@@ -1763,7 +1808,7 @@ @@ -1763,7 +1803,7 @@
// There are separate "new tab" buttons for horizontal tabs toolbar, vertical tabs and // 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); // for when the tab strip is overflowed (which is shared by vertical and horizontal tabs);
// Attach the long click popup to all of them. // Attach the long click popup to all of them.
@ -292,7 +287,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..71bcc2b6221fb0a54667d1a72155b500
const newTab2 = this.newTabButton; const newTab2 = this.newTabButton;
const newTabVertical = document.getElementById( const newTabVertical = document.getElementById(
"vertical-tabs-newtab-button" "vertical-tabs-newtab-button"
@@ -1846,7 +1891,7 @@ @@ -1846,7 +1886,7 @@
let rect = ele => { let rect = ele => {
return window.windowUtils.getBoundsWithoutFlushing(ele); return window.windowUtils.getBoundsWithoutFlushing(ele);
}; };
@ -301,7 +296,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..71bcc2b6221fb0a54667d1a72155b500
if (tab && rect(tab).width <= this._tabClipWidth) { if (tab && rect(tab).width <= this._tabClipWidth) {
this.setAttribute("closebuttons", "activetab"); this.setAttribute("closebuttons", "activetab");
} else { } else {
@@ -1858,10 +1903,12 @@ @@ -1858,10 +1898,12 @@
_handleTabSelect(aInstant) { _handleTabSelect(aInstant) {
let selectedTab = this.selectedItem; let selectedTab = this.selectedItem;
@ -314,7 +309,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..71bcc2b6221fb0a54667d1a72155b500
selectedTab._notselectedsinceload = false; selectedTab._notselectedsinceload = false;
} }
@@ -1873,7 +1920,7 @@ @@ -1873,7 +1915,7 @@
return; return;
} }
@ -323,7 +318,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..71bcc2b6221fb0a54667d1a72155b500
if (!tabs.length) { if (!tabs.length) {
return; return;
} }
@@ -1909,7 +1956,7 @@ @@ -1909,7 +1951,7 @@
if (isEndTab && !this._hasTabTempMaxWidth) { if (isEndTab && !this._hasTabTempMaxWidth) {
return; return;
} }
@ -332,7 +327,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..71bcc2b6221fb0a54667d1a72155b500
// Force tabs to stay the same width, unless we're closing the last tab, // 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 // which case we need to let them expand just enough so that the overall
// tabbar width is the same. // tabbar width is the same.
@@ -1924,7 +1971,7 @@ @@ -1924,7 +1966,7 @@
let tabsToReset = []; let tabsToReset = [];
for (let i = numPinned; i < tabs.length; i++) { for (let i = numPinned; i < tabs.length; i++) {
let tab = tabs[i]; let tab = tabs[i];
@ -341,7 +336,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..71bcc2b6221fb0a54667d1a72155b500
if (!isEndTab) { if (!isEndTab) {
// keep tabs the same width // keep tabs the same width
tab.style.transition = "none"; tab.style.transition = "none";
@@ -1990,16 +2037,15 @@ @@ -1990,16 +2032,16 @@
// Move pinned tabs to another container when the tabstrip is toggled to vertical // Move pinned tabs to another container when the tabstrip is toggled to vertical
// and when session restore code calls _positionPinnedTabs; update styling whenever // and when session restore code calls _positionPinnedTabs; update styling whenever
// the number of pinned tabs changes. // the number of pinned tabs changes.
@ -358,13 +353,14 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..71bcc2b6221fb0a54667d1a72155b500
+ if (gBrowser.pinnedTabCount !== (verticalTabsContainer.children.length - count - 1 + document.getElementById("zen-essentials-container").children.length)) { + if (gBrowser.pinnedTabCount !== (verticalTabsContainer.children.length - count - 1 + document.getElementById("zen-essentials-container").children.length)) {
+ let tabs = this.allTabs.filter(tab => !tab.hasAttribute("zen-glance-tab")); + let tabs = this.allTabs.filter(tab => !tab.hasAttribute("zen-glance-tab"));
for (let i = 0; i < numPinned; i++) { for (let i = 0; i < numPinned; i++) {
+ if (tabs[i].group) continue;
tabs[i].style.marginInlineStart = ""; tabs[i].style.marginInlineStart = "";
- verticalTabsContainer.appendChild(tabs[i]); - verticalTabsContainer.appendChild(tabs[i]);
+ tabs[i].hasAttribute("zen-essential") ? document.getElementById("zen-essentials-container").appendChild(tabs[i].group ?? tabs[i]) : verticalTabsContainer.insertBefore(tabs[i].group ?? tabs[i], verticalTabsContainer.lastChild); + tabs[i].hasAttribute("zen-essential") ? document.getElementById("zen-essentials-container").appendChild(tabs[i]) : verticalTabsContainer.insertBefore(tabs[i], verticalTabsContainer.lastChild);
} }
} }
@@ -2007,9 +2053,7 @@ @@ -2007,9 +2049,7 @@
} }
_resetVerticalPinnedTabs() { _resetVerticalPinnedTabs() {
@ -375,7 +371,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..71bcc2b6221fb0a54667d1a72155b500
if (!verticalTabsContainer.children.length) { if (!verticalTabsContainer.children.length) {
return; return;
@@ -2022,8 +2066,8 @@ @@ -2022,8 +2062,8 @@
} }
_positionPinnedTabs() { _positionPinnedTabs() {
@ -386,7 +382,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..71bcc2b6221fb0a54667d1a72155b500
let absPositionHorizontalTabs = let absPositionHorizontalTabs =
this.overflowing && tabs.length > numPinned && numPinned > 0; this.overflowing && tabs.length > numPinned && numPinned > 0;
@@ -2032,7 +2076,7 @@ @@ -2032,7 +2072,7 @@
if (this.verticalMode) { if (this.verticalMode) {
this._updateVerticalPinnedTabs(); this._updateVerticalPinnedTabs();
@ -395,7 +391,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..71bcc2b6221fb0a54667d1a72155b500
let layoutData = this._pinnedTabsLayoutCache; let layoutData = this._pinnedTabsLayoutCache;
let uiDensity = document.documentElement.getAttribute("uidensity"); let uiDensity = document.documentElement.getAttribute("uidensity");
if (!layoutData || layoutData.uiDensity != uiDensity) { if (!layoutData || layoutData.uiDensity != uiDensity) {
@@ -2104,7 +2148,7 @@ @@ -2104,7 +2144,7 @@
return; return;
} }
@ -404,7 +400,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..71bcc2b6221fb0a54667d1a72155b500
let directionX = screenX > dragData.animLastScreenX; let directionX = screenX > dragData.animLastScreenX;
let directionY = screenY > dragData.animLastScreenY; let directionY = screenY > dragData.animLastScreenY;
@@ -2112,7 +2156,7 @@ @@ -2112,7 +2152,7 @@
dragData.animLastScreenX = screenX; dragData.animLastScreenX = screenX;
let { width: tabWidth, height: tabHeight } = let { width: tabWidth, height: tabHeight } =
@ -413,7 +409,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..71bcc2b6221fb0a54667d1a72155b500
let shiftSizeX = tabWidth * movingTabs.length; let shiftSizeX = tabWidth * movingTabs.length;
let shiftSizeY = tabHeight; let shiftSizeY = tabHeight;
dragData.tabWidth = tabWidth; dragData.tabWidth = tabWidth;
@@ -2296,11 +2340,15 @@ @@ -2296,11 +2336,15 @@
this.#clearDragOverCreateGroupTimer(); this.#clearDragOverCreateGroupTimer();
let isPinned = draggedTab.pinned; let isPinned = draggedTab.pinned;
@ -433,7 +429,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..71bcc2b6221fb0a54667d1a72155b500
if (this.#rtlMode) { if (this.#rtlMode) {
tabs.reverse(); tabs.reverse();
@@ -2314,7 +2362,7 @@ @@ -2314,7 +2358,7 @@
let size = this.verticalMode ? "height" : "width"; let size = this.verticalMode ? "height" : "width";
let translateAxis = this.verticalMode ? "translateY" : "translateX"; let translateAxis = this.verticalMode ? "translateY" : "translateX";
let scrollDirection = this.verticalMode ? "scrollTop" : "scrollLeft"; let scrollDirection = this.verticalMode ? "scrollTop" : "scrollLeft";
@ -442,7 +438,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..71bcc2b6221fb0a54667d1a72155b500
let translateX = event.screenX - dragData.screenX; let translateX = event.screenX - dragData.screenX;
let translateY = event.screenY - dragData.screenY; let translateY = event.screenY - dragData.screenY;
@@ -2328,6 +2376,12 @@ @@ -2328,6 +2372,12 @@
let lastTab = tabs.at(-1); let lastTab = tabs.at(-1);
let lastMovingTab = movingTabs.at(-1); let lastMovingTab = movingTabs.at(-1);
let firstMovingTab = movingTabs[0]; let firstMovingTab = movingTabs[0];
@ -455,7 +451,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..71bcc2b6221fb0a54667d1a72155b500
let endEdge = ele => ele[screenAxis] + bounds(ele)[size]; let endEdge = ele => ele[screenAxis] + bounds(ele)[size];
let lastMovingTabScreen = endEdge(lastMovingTab); let lastMovingTabScreen = endEdge(lastMovingTab);
let firstMovingTabScreen = firstMovingTab[screenAxis]; let firstMovingTabScreen = firstMovingTab[screenAxis];
@@ -2348,7 +2402,11 @@ @@ -2348,7 +2398,11 @@
translate = Math.min(Math.max(translate, firstBound), lastBound); translate = Math.min(Math.max(translate, firstBound), lastBound);
for (let tab of movingTabs) { for (let tab of movingTabs) {
@ -468,7 +464,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..71bcc2b6221fb0a54667d1a72155b500
} }
dragData.translatePos = translate; dragData.translatePos = translate;
@@ -2485,6 +2543,9 @@ @@ -2485,6 +2539,9 @@
break; break;
} }
let element = tabs[mid]; let element = tabs[mid];
@ -478,7 +474,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..71bcc2b6221fb0a54667d1a72155b500
let elementForSize = isTabGroupLabel(element) let elementForSize = isTabGroupLabel(element)
? element.parentElement ? element.parentElement
: element; : element;
@@ -2507,6 +2568,10 @@ @@ -2507,6 +2564,10 @@
if (!dropElement) { if (!dropElement) {
dropElement = this.ariaFocusableItems[oldDropElementIndex]; dropElement = this.ariaFocusableItems[oldDropElementIndex];
} }
@ -489,7 +485,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..71bcc2b6221fb0a54667d1a72155b500
let newDropElementIndex = dropElement let newDropElementIndex = dropElement
? dropElement.elementIndex ? dropElement.elementIndex
: oldDropElementIndex; : oldDropElementIndex;
@@ -2515,7 +2580,7 @@ @@ -2515,7 +2576,7 @@
let shouldCreateGroupOnDrop; let shouldCreateGroupOnDrop;
let dropBefore; let dropBefore;
if (dropElement) { if (dropElement) {
@ -498,7 +494,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..71bcc2b6221fb0a54667d1a72155b500
? dropElement.parentElement ? dropElement.parentElement
: dropElement; : dropElement;
@@ -2566,12 +2631,12 @@ @@ -2566,12 +2627,12 @@
} }
} }
@ -513,7 +509,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..71bcc2b6221fb0a54667d1a72155b500
dropElement != draggedTab && dropElement != draggedTab &&
isTab(dropElement) && isTab(dropElement) &&
!dropElement?.group && !dropElement?.group &&
@@ -2639,7 +2704,7 @@ @@ -2639,7 +2700,7 @@
// Shift background tabs to leave a gap where the dragged tab // Shift background tabs to leave a gap where the dragged tab
// would currently be dropped. // would currently be dropped.
for (let item of tabs) { for (let item of tabs) {
@ -522,7 +518,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..71bcc2b6221fb0a54667d1a72155b500
continue; continue;
} }
@@ -2648,6 +2713,9 @@ @@ -2648,6 +2709,9 @@
if (isTabGroupLabel(item)) { if (isTabGroupLabel(item)) {
// Shift the `.tab-group-label-container` to shift the label element. // Shift the `.tab-group-label-container` to shift the label element.
item = item.parentElement; item = item.parentElement;
@ -532,7 +528,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..71bcc2b6221fb0a54667d1a72155b500
} }
item.style.transform = transform; item.style.transform = transform;
} }
@@ -2697,8 +2765,9 @@ @@ -2697,8 +2761,9 @@
); );
} }
@ -544,7 +540,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..71bcc2b6221fb0a54667d1a72155b500
return; return;
} }
@@ -2711,6 +2780,12 @@ @@ -2711,6 +2776,12 @@
item = item.parentElement; item = item.parentElement;
} }
item.style.transform = ""; item.style.transform = "";
@ -557,7 +553,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..71bcc2b6221fb0a54667d1a72155b500
item.removeAttribute("dragover-createGroup"); item.removeAttribute("dragover-createGroup");
} }
this.removeAttribute("movingtab-createGroup"); this.removeAttribute("movingtab-createGroup");
@@ -2754,7 +2829,7 @@ @@ -2754,7 +2825,7 @@
let postTransitionCleanup = () => { let postTransitionCleanup = () => {
movingTab._moveTogetherSelectedTabsData.animate = false; movingTab._moveTogetherSelectedTabsData.animate = false;
}; };
@ -566,7 +562,7 @@ index 0fbdbf3aefc467880e6b0bae2615cb145735cb0f..71bcc2b6221fb0a54667d1a72155b500
postTransitionCleanup(); postTransitionCleanup();
} else { } else {
let onTransitionEnd = transitionendEvent => { let onTransitionEnd = transitionendEvent => {
@@ -2924,7 +2999,7 @@ @@ -2924,7 +2995,7 @@
} }
_notifyBackgroundTab(aTab) { _notifyBackgroundTab(aTab) {