fix(styles): adjust right positioning for split view in tab browser (closes https://github.com/zen-browser/desktop/issues/6451)

This commit is contained in:
mr. M
2025-03-16 00:51:18 +01:00
parent b6477b17d8
commit ac85bdfd3e
2 changed files with 16 additions and 5 deletions

View File

@@ -278,6 +278,10 @@
&[side='right'] {
right: 0;
&[has-split-view='true'] {
right: var(--zen-element-separation);
}
}
&::after {

View File

@@ -49,9 +49,13 @@ class SplitNode extends SplitLeafNode {
return this._children;
}
addChild(child) {
addChild(child, prepend = true) {
child.parent = this;
this._children.unshift(child);
if (prepend) {
this._children.unshift(child);
} else {
this._children.push(child);
}
}
}
@@ -231,6 +235,9 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
const padding = Services.prefs.getIntPref('zen.theme.content-element-separation', 0);
this.fakeBrowser.setAttribute('flex', '1');
this.fakeBrowser.id = 'zen-split-view-fake-browser';
if (oldTab.splitView) {
this.fakeBrowser.setAttribute('has-split-view', 'true');
}
gBrowser.tabbox.appendChild(this.fakeBrowser);
this.fakeBrowser.style.setProperty('--zen-split-view-fake-icon', `url(${draggedTab.getAttribute('image')})`);
draggedTab._visuallySelected = true;
@@ -988,10 +995,10 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
this.activateSplitView(splitData);
}
addTabToSplit(tab, splitNode) {
addTabToSplit(tab, splitNode, prepend = true) {
const reduce = splitNode.children.length / (splitNode.children.length + 1);
splitNode.children.forEach((c) => (c.sizeInParent *= reduce));
splitNode.addChild(new SplitLeafNode(tab, (1 - reduce) * 100));
splitNode.addChild(new SplitLeafNode(tab, (1 - reduce) * 100), prepend);
}
/**
@@ -1599,7 +1606,7 @@ class ZenViewSplitter extends ZenDOMOperatedFeature {
if (parentNode.direction !== splitDirection) {
this.splitIntoNode(droppedOnSplitNode, new SplitLeafNode(draggedTab, 50), hoverSide, 0.5);
} else {
this.addTabToSplit(draggedTab, parentNode);
this.addTabToSplit(draggedTab, parentNode, /* prepend = */ hoverSide === 'left' || hoverSide === 'top');
}
} else {
this.addTabToSplit(draggedTab, group.layoutTree);