mirror of
https://github.com/zen-browser/desktop.git
synced 2025-09-30 15:08:40 +00:00
Insert splitters in right location for splitview.
This commit is contained in:
@@ -1,8 +1,8 @@
|
||||
diff --git a/browser/base/content/browser-box.inc.xhtml b/browser/base/content/browser-box.inc.xhtml
|
||||
index 16559b2c0e3aef391b43e09281aee24007feb0bd..2579cea92a55fabb73fdd130c3706af08c3fd849 100644
|
||||
index 108160d9469d44f47c93a3808402e4b27ff59777..39a7b691302bf13e1b5990f46428cff6807a8e56 100644
|
||||
--- a/browser/base/content/browser-box.inc.xhtml
|
||||
+++ b/browser/base/content/browser-box.inc.xhtml
|
||||
@@ -21,11 +21,15 @@
|
||||
@@ -23,11 +23,16 @@
|
||||
</vbox>
|
||||
<splitter id="sidebar-splitter" class="chromeclass-extrachrome sidebar-splitter" resizebefore="sibling" resizeafter="none" hidden="true"/>
|
||||
<vbox id="appcontent" flex="1">
|
||||
@@ -12,6 +12,7 @@ index 16559b2c0e3aef391b43e09281aee24007feb0bd..2579cea92a55fabb73fdd130c3706af0
|
||||
<tabbox id="tabbrowser-tabbox"
|
||||
flex="1" tabcontainer="tabbrowser-tabs">
|
||||
+#include zen-sidebar-panel.inc.xhtml
|
||||
+#include zen-splitview-overlay.inc.xhtml
|
||||
<tabpanels id="tabbrowser-tabpanels"
|
||||
flex="1" selectedIndex="0"/>
|
||||
</tabbox>
|
||||
|
5
src/browser/base/content/zen-splitview-overlay.inc.xhtml
Normal file
5
src/browser/base/content/zen-splitview-overlay.inc.xhtml
Normal file
@@ -0,0 +1,5 @@
|
||||
<hbox id="zen-splitview-overlay">
|
||||
<hbox id="zen-splitview-splitterbox">
|
||||
|
||||
</hbox>
|
||||
</hbox>
|
@@ -30,29 +30,56 @@
|
||||
--uc-tweak-rounded-corners-shadow-color: var(--zen-primary-color) !important;
|
||||
}
|
||||
|
||||
#tabbrowser-tabpanels:has(> [zen-split='true']) {
|
||||
#tabbrowser-tabbox {
|
||||
--zen-split-row-gap: calc(var(--zen-element-separation) + 2px);
|
||||
--zen-split-column-gap: calc(var(--zen-element-separation) + 1px);
|
||||
margin-right: calc(var(--zen-element-separation) - var(--zen-split-row-gap)/2);
|
||||
margin-bottom: calc(var(--zen-element-separation) - var(--zen-split-column-gap)/2);
|
||||
margin-top: calc(-var(--zen-split-row-gap)/2);
|
||||
margin-left: calc(-var(--zen-split-row-gap)/2);
|
||||
}
|
||||
|
||||
#tabbrowser-tabpanels:has(> [zen-split='true']) {
|
||||
margin-right: calc(var(--zen-element-separation) - var(--zen-split-row-gap)/2);
|
||||
margin-bottom: calc(var(--zen-element-separation) - var(--zen-split-column-gap)/2);
|
||||
margin-top: calc(var(--zen-split-row-gap)/-2);
|
||||
margin-left: calc(var(--zen-split-row-gap)/-2);
|
||||
}
|
||||
|
||||
margin-top: calc(-var(--zen-split-row-gap)/2);
|
||||
margin-left: calc(-var(--zen-split-row-gap)/2);
|
||||
#tabbrowser-tabpanels[zen-split-view] {
|
||||
.zen-split-view-splitter {
|
||||
display: inherit;
|
||||
}
|
||||
}
|
||||
|
||||
#zen-splitview-overlay {
|
||||
position: absolute;
|
||||
width: calc(100% - var(--zen-element-separation));
|
||||
height: calc(100% - var(--zen-element-separation));
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
#zen-splitview-splitterbox {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.zen-split-view-splitter {
|
||||
display: none;
|
||||
visibility: inherit;
|
||||
cursor: ew-resize;
|
||||
-moz-subtree-hidden-only-visually: 0;
|
||||
position: absolute;
|
||||
pointer-events: all;
|
||||
}
|
||||
|
||||
.zen-split-view-splitter[orient='vertical'] {
|
||||
width: var(--zen-split-column-gap);
|
||||
margin-left: calc(var(--zen-split-row-gap) * -1);
|
||||
}
|
||||
|
||||
.zen-split-view-splitter[orient='horizontal'] {
|
||||
height: var(--zen-split-column-gap);
|
||||
margin-top: calc(var(--zen-split-column-gap) * -1);
|
||||
cursor: n-resize;
|
||||
}
|
||||
|
||||
|
Reference in New Issue
Block a user