mirrors/desktop
1
0
Fork 0
mirror of https://github.com/zen-browser/desktop.git synced 2026-04-04 22:59:46 +00:00
Code Issues Packages Projects Releases Wiki Activity

Fixed some bugs and better styled buttons, welcome screen and sidebar

Browse Source
This commit is contained in:
Mauro Balades
2024-04-09 21:28:09 +02:00
parent bd0fea215d
commit dbdae61f8b
12 changed files with 366 additions and 59 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/browser/app/profile/zen-browser.js
View File

@@ -94,6 +94,7 @@ pref("alerts.showFavicons", true);
pref('zen.welcomeScreen.enabled', true);
pref('zen.welcomeScreen.seen', false);
pref('zen.tabs.vertical', true);
// From: https://github.com/yokoffing/Betterfox

9
src/browser/base/content/browser-css.patch
View File

@@ -1,5 +1,5 @@
diff --git a/browser/base/content/browser.css b/browser/base/content/browser.css
index 8a2a20280954eb9db144a723f477e7afc603fda3..a3b93a2e49c28a12b9bdc00ff290d768bba9e88b 100644
index 8a2a20280954eb9db144a723f477e7afc603fda3..7b2ab2815b51e8b569c0db42e231f1ee70adc30c 100644
--- a/browser/base/content/browser.css
+++ b/browser/base/content/browser.css
@@ -2,6 +2,8 @@
@@ -11,17 +11,16 @@ index 8a2a20280954eb9db144a723f477e7afc603fda3..a3b93a2e49c28a12b9bdc00ff290d768
@namespace html url("http://www.w3.org/1999/xhtml");
:root,
@@ -156,8 +158,7 @@ panelview:not([visible]) {
@@ -156,8 +158,6 @@ panelview:not([visible]) {
flex: 100 100;
max-width: 225px;
min-width: var(--tab-min-width);
- transition: min-width 100ms ease-out,
- max-width 100ms ease-out;
+ transition: 100ms;
}
:root[uidensity=touch] .tabbrowser-tab:not([pinned]) {
@@ -1319,13 +1320,13 @@ printpreview-pagination:focus-within,
@@ -1319,13 +1319,13 @@ printpreview-pagination:focus-within,
#sidebar-box {
@@ -38,7 +37,7 @@ index 8a2a20280954eb9db144a723f477e7afc603fda3..a3b93a2e49c28a12b9bdc00ff290d768
list-style-image: var(--webextension-menuitem-image, inherit);
-moz-context-properties: fill;
fill: currentColor;
@@ -1526,3 +1527,42 @@ toolbar[keyNav=true]:not([collapsed=true], [customizing=true]) toolbartabstop {
@@ -1526,3 +1526,42 @@ toolbar[keyNav=true]:not([collapsed=true], [customizing=true]) toolbartabstop {
/**
* End Dialogs
*/

12
src/browser/base/content/browser-sidebar-js.patch Normal file
View File

@@ -0,0 +1,12 @@
diff --git a/browser/base/content/browser-sidebar.js b/browser/base/content/browser-sidebar.js
index ea6457a5c42f7bd2e002bd9234b8eb9bd23bbcc0..9a7b75481fc0968c295bae9ca46ac5da4aec96dc 100644
--- a/browser/base/content/browser-sidebar.js
+++ b/browser/base/content/browser-sidebar.js
@@ -305,6 +305,7 @@ var SidebarUI = {
this._box.setAttribute("positionend", true);
} else {
this._box.removeAttribute("positionend");
+ this._box.style.order = 0;
}
this.hideSwitcherPanel();

4
src/browser/base/content/browser-xhtml.patch
View File

@@ -1,5 +1,5 @@
diff --git a/browser/base/content/browser.xhtml b/browser/base/content/browser.xhtml
index b4886fb5f74568b4c09eb620be9efb74e39c599c..f6506e972bc464aaddf087d994ce439c02f9a2f9 100644
index b4886fb5f74568b4c09eb620be9efb74e39c599c..0993ee1258dfd83ade68500f11dc2e833df4ae51 100644
--- a/browser/base/content/browser.xhtml
+++ b/browser/base/content/browser.xhtml
@@ -163,9 +163,15 @@
@@ -13,7 +13,7 @@ index b4886fb5f74568b4c09eb620be9efb74e39c599c..f6506e972bc464aaddf087d994ce439c
+#include titlebar-items.inc.xhtml
+ </hbox>
+
+ <hbox flex="1">
+ <hbox id="zen-main-app-wrapper" flex="1">
+ #include navigator-toolbox.inc.xhtml
+ #include zen-sidebar-box.inc.xhtml
+ #include browser-box.inc.xhtml

15
src/browser/base/content/navigator-toolbox-inc-xhtml.patch
View File

@@ -1,8 +1,15 @@
diff --git a/browser/base/content/navigator-toolbox.inc.xhtml b/browser/base/content/navigator-toolbox.inc.xhtml
index dce7bacdb3678a95dc97085390a7e6102090ffb2..2d91d95dc458c3ffe53e324576e44003d8472209 100644
index dce7bacdb3678a95dc97085390a7e6102090ffb2..adc160df554e19b5d7cc874cedf2fae6e98a1e60 100644
--- a/browser/base/content/navigator-toolbox.inc.xhtml
+++ b/browser/base/content/navigator-toolbox.inc.xhtml
@@ -56,15 +56,17 @@
@@ -50,21 +50,24 @@
aria-multiselectable="true"
setfocus="false"
tooltip="tabbrowser-tab-tooltip"
+ orient="vertical"
stopwatchid="FX_TAB_CLICK_MS">
<hbox class="tab-drop-indicator" hidden="true"/>
# If the name (tabbrowser-arrowscrollbox) or structure of this changes
# significantly, there is an optimization in
# DisplayPortUtils::MaybeCreateDisplayPortInFirstScrollFrameEncountered based
# the current structure that we may want to revisit.
@@ -21,7 +28,7 @@ index dce7bacdb3678a95dc97085390a7e6102090ffb2..2d91d95dc458c3ffe53e324576e44003
<spacer class="closing-tabs-spacer" style="width: 0;"/>
</hbox>
</arrowscrollbox>
@@ -101,12 +103,16 @@
@@ -101,12 +104,16 @@
<label data-l10n-id="private-browsing-indicator-label"></label>
</hbox>
@@ -38,7 +45,7 @@ index dce7bacdb3678a95dc97085390a7e6102090ffb2..2d91d95dc458c3ffe53e324576e44003
<toolbar id="nav-bar"
class="browser-toolbar"
data-l10n-id="navbar-accessible"
@@ -575,7 +581,7 @@
@@ -575,7 +582,7 @@
<html:template id="tab-notification-deck-template">
<html:named-deck id="tab-notification-deck"></html:named-deck>
</html:template>

254
src/browser/base/content/tabbrowser-tabs-js.patch
View File

@@ -1,17 +1,136 @@
diff --git a/browser/base/content/tabbrowser-tabs.js b/browser/base/content/tabbrowser-tabs.js
index 4733e6d0b66f254c72a592bf3eabeb1a939e76fa..b7256bec7d0da3ce065c005ba857a4317bf0d714 100644
index 4733e6d0b66f254c72a592bf3eabeb1a939e76fa..ab16fe96e1e8036df7e8321c992624170bde0e63 100644
--- a/browser/base/content/tabbrowser-tabs.js
+++ b/browser/base/content/tabbrowser-tabs.js
@@ -743,7 +743,7 @@
if (oldTranslateX && oldTranslateX != newTranslateX && !gReduceMotion) {
@@ -538,19 +538,36 @@
}
dt.setDragImage(toDrag, dragImageOffset, dragImageOffset);
+ const zenVerticalTabs = Services.prefs.getBoolPref(
+ "zen.tabs.vertical",
+ false
+ );
+
// _dragData.offsetX/Y give the coordinates that the mouse should be
// positioned relative to the corner of the new window created upon
// dragend such that the mouse appears to have the same position
// relative to the corner of the dragged tab.
function clientX(ele) {
+ if (zenVerticalTabs) {
+ return 0;
+ }
return ele.getBoundingClientRect().left;
}
+ function clientY(ele) {
+ if (!zenVerticalTabs) {
+ return 0;
+ }
+ return ele.getBoundingClientRect().top;
+ }
let tabOffsetX = clientX(tab) - clientX(this);
+ let tabOffsetY = clientY(tab) - clientY(this);
tab._dragData = {
offsetX: event.screenX - window.screenX - tabOffsetX,
- offsetY: event.screenY - window.screenY,
+ offsetY: event.screenY - window.screenY - tabOffsetY,
scrollX: this.arrowScrollbox.scrollbox.scrollLeft,
+ scrollY: this.arrowScrollbox.scrollbox.scrollTop,
screenX: event.screenX,
+ screenY: event.screenY,
movingTabs: (tab.multiselected ? gBrowser.selectedTabs : [tab]).filter(
t => t.pinned == tab.pinned
),
@@ -637,21 +654,30 @@
}
}
+ const verticalTabs = Services.prefs.getBoolPref(
+ "zen.tabs.vertical",
+ false
+ );
+ const left = verticalTabs ? "top" : "left";
+ const right = verticalTabs ? "bottom" : "right";
+ const width = verticalTabs ? "height" : "width";
+ const clientWidth = verticalTabs ? "clientHeight" : "clientWidth";
+
var rect = arrowScrollbox.getBoundingClientRect();
var newMargin;
if (pixelsToScroll) {
// if we are scrolling, put the drop indicator at the edge
// so that it doesn't jump while scrolling
let scrollRect = arrowScrollbox.scrollClientRect;
- let minMargin = scrollRect.left - rect.left;
+ let minMargin = scrollRect[left] - rect[left];
let maxMargin = Math.min(
- minMargin + scrollRect.width,
- scrollRect.right
+ minMargin + scrollRect[width],
+ scrollRect[right]
);
if (RTL_UI) {
[minMargin, maxMargin] = [
- this.clientWidth - maxMargin,
- this.clientWidth - minMargin,
+ this[clientWidth] - maxMargin,,
+ this[clientWidth] - minMargin,
];
}
newMargin = pixelsToScroll > 0 ? maxMargin : minMargin;
@@ -661,29 +687,38 @@
if (newIndex == children.length) {
let tabRect = this._getVisibleTabs().at(-1).getBoundingClientRect();
if (RTL_UI) {
- newMargin = rect.right - tabRect.left;
+ newMargin = rect[right] - tabRect[left];
} else {
- newMargin = tabRect.right - rect.left;
+ newMargin = tabRect[right] - rect[left];
}
} else {
let tabRect = children[newIndex].getBoundingClientRect();
if (RTL_UI) {
- newMargin = rect.right - tabRect.right;
+ newMargin = rect[right] - tabRect[right];
} else {
- newMargin = tabRect.left - rect.left;
+ newMargin = tabRect[left] - rect[left];
}
}
}
ind.hidden = false;
- newMargin += ind.clientWidth / 2;
- if (RTL_UI) {
+ newMargin += ind[clientWidth] / 2;
+ if (RTL_UI && !verticalTabs) {
newMargin *= -1;
}
ind.style.transform = "translate(" + Math.round(newMargin) + "px)";
+
+ ind.style.transform =
+ "translate(" + verticalTabs
+ ? "0, "
+ : "" + Math.round(newMargin) + "px)";
}
on_drop(event) {
+ const verticalTabs = Services.prefs.getBoolPref(
+ "zen.tabs.vertical",
+ false
+ );
var dt = event.dataTransfer;
var dropEffect = dt.dropEffect;
var draggedTab;
@@ -740,7 +775,7 @@
incrementDropIndex = false;
}
- if (oldTranslateX && oldTranslateX != newTranslateX && !gReduceMotion) {
+ if (oldTranslateX && oldTranslateX != newTranslateX && !(gReduceMotion || verticalTabs)) {
for (let tab of movingTabs) {
tab.toggleAttribute("tabdrop-samewindow", true);
- tab.style.transform = "translateX(" + newTranslateX + "px)";
+ tab.style.transform = "translateY(" + newTranslateX + "px)";
let postTransitionCleanup = () => {
tab.removeAttribute("tabdrop-samewindow");
@@ -1126,10 +1126,13 @@
tab.style.transform = "translateX(" + newTranslateX + "px)";
@@ -1126,10 +1161,13 @@
}
_initializeArrowScrollbox() {
@@ -25,25 +144,132 @@ index 4733e6d0b66f254c72a592bf3eabeb1a939e76fa..b7256bec7d0da3ce065c005ba857a431
// Ignore underflow events:
// - from nested scrollable elements
// - for vertical orientation
@@ -1542,7 +1545,7 @@
@@ -1492,19 +1530,30 @@
}
}
- if (!("animLastScreenX" in draggedTab._dragData)) {
- draggedTab._dragData.animLastScreenX = draggedTab._dragData.screenX;
- }
-
- let screenX = event.screenX;
- if (screenX == draggedTab._dragData.animLastScreenX) {
- return;
+ const verticalTabs = Services.prefs.getBoolPref(
+ "zen.tabs.vertical",
+ false
+ );
+ const animLastScreen = verticalTabs
+ ? "animLastScreenY"
+ : "animLastScreenX";
+ const screen = verticalTabs ? "screenY" : "screenX";
+ const dimensions = verticalTabs ? "height" : "width";
+ const scrollEdge = verticalTabs ? "scrollTop" : "scrollLeft";
+ const scrollDimension = verticalTabs ? "scrollY" : "scrollX";
+ const translate = verticalTabs ? "translateY" : "translateX";
+ if (!(animLastScreen in draggedTab._dragData)) {
+ draggedTab._dragData[animLastScreen] = draggedTab._dragData[screen];
+ }
+ let screenX = event[screen];
+ if (screenX == draggedTab._dragData[animLastScreen]) {
+ return;
}
// Direction of the mouse movement.
- let ltrMove = screenX > draggedTab._dragData.animLastScreenX;
+ let ltrMove = screenX > draggedTab._dragData[animLastScreen];
- draggedTab._dragData.animLastScreenX = screenX;
+ draggedTab._dragData[animLastScreen] = screenX;
let pinned = draggedTab.pinned;
let numPinned = gBrowser._numPinnedTabs;
@@ -1513,36 +1562,39 @@
pinned ? numPinned : undefined
);
- if (RTL_UI) {
+ if (RTL_UI && !verticalTabs) {
tabs.reverse();
// Copy moving tabs array to avoid infinite reversing.
movingTabs = [...movingTabs].reverse();
}
- let tabWidth = draggedTab.getBoundingClientRect().width;
+ let tabWidth = draggedTab.getBoundingClientRect()[dimensions];
let shiftWidth = tabWidth * movingTabs.length;
+ // We want to store the output value as the width and the height to force
+ // compatibility with code elsewhere
draggedTab._dragData.tabWidth = tabWidth;
+ draggedTab._dragData.tabHeight = tabWidth;
// Move the dragged tab based on the mouse position.
let leftTab = tabs[0];
let rightTab = tabs[tabs.length - 1];
- let rightMovingTabScreenX = movingTabs[movingTabs.length - 1].screenX;
- let leftMovingTabScreenX = movingTabs[0].screenX;
- let translateX = screenX - draggedTab._dragData.screenX;
+ let rightMovingTabScreenX = movingTabs[movingTabs.length - 1][screen];
+ let leftMovingTabScreenX = movingTabs[0][screen];
+ let translateX = screenX - draggedTab._dragData[screen];
if (!pinned) {
translateX +=
- this.arrowScrollbox.scrollbox.scrollLeft -
- draggedTab._dragData.scrollX;
+ this.arrowScrollbox.scrollbox[scrollEdge] -
+ draggedTab._dragData[scrollDimension];
}
- let leftBound = leftTab.screenX - leftMovingTabScreenX;
+ let leftBound = leftTab[screen] - leftMovingTabScreenX;
let rightBound =
- rightTab.screenX +
- rightTab.getBoundingClientRect().width -
+ rightTab[screen] +
+ rightTab.getBoundingClientRect()[dimensions] -
(rightMovingTabScreenX + tabWidth);
translateX = Math.min(Math.max(translateX, leftBound), rightBound);
for (let tab of movingTabs) {
- tab.style.transform = "translateX(" + translateX + "px)";
+ tab.style.transform = "translateY(" + translateX + "px)";
+ tab.style.transform = translate + "(" + translateX + "px)";
}
draggedTab._dragData.translateX = translateX;
@@ -1602,7 +1605,7 @@
@@ -1575,11 +1627,11 @@
if (tabs[mid] == draggedTab && ++mid > high) {
break;
}
- screenX = tabs[mid].screenX + getTabShift(tabs[mid], oldIndex);
+ screenX = tabs[mid][screen] + getTabShift(tabs[mid], oldIndex);
if (screenX > tabCenter) {
high = mid - 1;
} else if (
- screenX + tabs[mid].getBoundingClientRect().width <
+ screenX + tabs[mid].getBoundingClientRect()[dimensions] <
tabCenter
) {
low = mid + 1;
@@ -1602,16 +1654,16 @@
for (let tab of tabs) {
if (tab != draggedTab) {
let shift = getTabShift(tab, newIndex);
- tab.style.transform = shift ? "translateX(" + shift + "px)" : "";
+ tab.style.transform = shift ? "translateY(" + shift + "px)" : "";
+ tab.style.transform = shift ? translate + "(" + shift + "px)" : "";
}
}
@@ -1683,9 +1686,9 @@
function getTabShift(tab, dropIndex) {
if (tab._tPos < draggedTab._tPos && tab._tPos >= dropIndex) {
- return RTL_UI ? -shiftWidth : shiftWidth;
+ return RTL_UI && !verticalTabs ? -shiftWidth : shiftWidth;
}
if (tab._tPos > draggedTab._tPos && tab._tPos < dropIndex) {
- return RTL_UI ? shiftWidth : -shiftWidth;
+ return RTL_UI && !verticalTabs ? shiftWidth : -shiftWidth;
}
return 0;
}
@@ -1683,9 +1735,9 @@
// Slide the relevant tabs to their new position.
for (let t of this._getVisibleTabs()) {

23
src/browser/components/customizableui/CustomizeMode-sys-mjs.patch
View File

@@ -1,5 +1,5 @@
diff --git a/browser/components/customizableui/CustomizeMode.sys.mjs b/browser/components/customizableui/CustomizeMode.sys.mjs
index 5f6d01d8337efc515cc2687782a07af893ea85d8..c49027306ed783c419706521f01f0987e608ae12 100644
index 5f6d01d8337efc515cc2687782a07af893ea85d8..3a1af9f3969e283a5eb5b225ba8389fd82e22184 100644
--- a/browser/components/customizableui/CustomizeMode.sys.mjs
+++ b/browser/components/customizableui/CustomizeMode.sys.mjs
@@ -356,7 +356,7 @@ CustomizeMode.prototype = {
@@ -20,3 +20,24 @@ index 5f6d01d8337efc515cc2687782a07af893ea85d8..c49027306ed783c419706521f01f0987
customizer.hidden = true;
browser.hidden = false;
@@ -2278,6 +2278,20 @@ CustomizeMode.prototype = {
if (makeSpaceImmediately) {
aItem.setAttribute("notransition", "true");
}
+ if (aItem.parentElement.id === "TabsToolbar-customization-target") {
+ // We change the border values so we can properly implement the native vertical tabs
+ // drag and drop behavior.
+ aItem.style.borderColor = "transparent";
+ if (aValue == "before") {
+ prop = "borderTopWidth";
+ otherProp = "borderBottomWidth";
+ aItem.style.borderTopStyle = "solid";
+ } else {
+ prop = "borderBottomWidth";
+ otherProp = "borderTopWidth";
+ aItem.style.borderBottomStyle = "solid";
+ }
+ }
aItem.style[prop] = borderWidth + "px";
aItem.style.removeProperty(otherProp);
if (makeSpaceImmediately) {

4
src/browser/components/tabpreview/tabpreview-css.patch
View File

@@ -1,5 +1,5 @@
diff --git a/browser/components/tabpreview/tabpreview.css b/browser/components/tabpreview/tabpreview.css
index 8b288cb95da0e5fe307437e300d2c03ae19ab397..d03cbf2b15b62b3865be9caa63ad5c52633df3c2 100644
index 8b288cb95da0e5fe307437e300d2c03ae19ab397..13a1f652bfd44af6ef317e7c997e101ac84c0ece 100644
--- a/browser/components/tabpreview/tabpreview.css
+++ b/browser/components/tabpreview/tabpreview.css
@@ -3,9 +3,9 @@
@@ -34,8 +34,8 @@ index 8b288cb95da0e5fe307437e300d2c03ae19ab397..d03cbf2b15b62b3865be9caa63ad5c52
+
+.tab-preview-container {
+ --zen-border-color: #bdbcbc;
+ overflow: hidden;
+ border: 1px solid var(--zen-border-color);
+ box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
+}
+
+@media (prefers-color-scheme: dark) {

1
src/browser/components/zen-welcome/welcome.css
View File

@@ -18,6 +18,7 @@ body {
overflow: hidden;
background: var(--zen-characteristic-gradient);
transition: .1s;
-moz-transform: scale(1.1); /* zoom */
}
body.normal-background {

66
src/browser/themes/shared/zen-browser-shared.css
View File

@@ -18,6 +18,8 @@
--fp-contextmenu-separator-vertical: calc(4px - var(--fp-contextmenu-menuitem-border-width));
--fp-contextmenu-separator-horizontal: 0;
--fp-contextmenu-bgcolor: light-dark(Menu, rgb(43 42 51 / 0.95));
/* TODO: This could be cooked a bit more */
/*--toolbar-bgcolor: light-dark(rgba(255,255,255,.9), #282828) !important;*/
}
#PersonalToolbar {
@@ -147,6 +149,14 @@ toolbar .toolbarbutton-1 {
flex-direction: column;
}
:root[customizing] .customization-target:not(#widget-overflow-fixed-list) {
min-width: 0 !important;
}
toolbarpaletteitem {
justify-content: center !important;
}
toolbarbutton#scrollbutton-down,
toolbarbutton#scrollbutton-up {
display: none !important;
@@ -167,6 +177,23 @@ toolbarbutton#scrollbutton-up {
margin-inline-end: 0 !important;
}
.tab-icon-stack .tab-icon-image {
transform: scale(0.5);
opacity: 0;
animation: zen-zoom-in 0.12s ease-in-out 0.3s forwards;
}
@keyframes zen-zoom-in {
from {
transform: scale(0.5);
opacity: 0;
}
to {
opacity: 1;
transform: scale(1);
}
}
.tab-background {
display: none;
}
@@ -174,16 +201,20 @@ toolbarbutton#scrollbutton-up {
.tabbrowser-tab {
--zen-browser-tab-icon-size: 16px;
--tab-min-width: 0 !important;
box-shadow: none !important;
margin: 5px auto !important;
margin: 3px auto !important;
border-radius: 50%;
position: relative;
color-scheme: var(--tab-selected-color-scheme);
background: light-dark(#ececec, #4a4a4a);
border: 2px solid transparent;
border: 1px solid transparent;
padding: 0 !important;
align-items: center;
animation: zen-slide-in 0.2s ease-in-out;
animation: zen-slide-in 0.3s;
transition: .1s transform;
}
.tabbrowser-tab:active {
transform: scale(0.9);
}
.tab-stack {
@@ -208,20 +239,8 @@ toolbarbutton#scrollbutton-up {
}
}
.tabbrowser-tab[collapsed="true"] {
display: block !important;
animation: zen-slide-out 0.2s ease-in-out;
}
@keyframes zen-slide-out {
from {
transform: translateX(0);
opacity: 1;
}
to {
transform: translateX(-10px);
opacity: 0;
}
.tabbrowser-tab:not([pinned], [fadein]) {
display: none;
}
.tabbrowser-tab:is([multiselected="true"], [selected]) {
@@ -254,8 +273,11 @@ toolbarbutton#scrollbutton-up {
border: none !important;
/*background: light-dark(rgba(0,0,0,.05), rgba(255,255,255,.05));*/
margin: 0 !important;
border-radius: 5px;
border: 1px solid var(--zen-dialog-border-color);
border: none;
}
#tabbrowser-arrowscrollbox {
margin: 3px 0 !important;
}
#alltabs-button stack {
@@ -275,3 +297,7 @@ toolbarbutton#scrollbutton-up {
justify-content: end;
-moz-window-dragging: drag;
}
.footer-button {
padding: 0.60em 1.9em !important;
}

5
src/browser/themes/shared/zen-panel-ui.css
View File

@@ -24,7 +24,7 @@
background-size: cover;
background-position: center;
margin: 0 auto;
transform: translateY(55%);
transform: translateY(60%);
}
.PanelUI-zen-profiles-item {
@@ -129,6 +129,3 @@
margin-bottom: 5px;
}
.panel-subview-footer-button {
margin-bottom: 0 !important;
}

31
src/browser/themes/shared/zen-sidebar.css
View File

@@ -4,12 +4,33 @@
}
#sidebar-box {
--zen-sidebar-box-border-radius: var(--zen-panel-radius);
margin: var(--zen-appcontent-separator-from-window) !important;
border-radius: 15px !important;
box-shadow: var(--zen-sidebar-box-shadow) !important;
border-radius: var(--zen-sidebar-box-border-radius) !important;
box-shadow: none !important;
overflow: hidden;
transition: .2s;
border: 1px solid var(--zen-dialog-border-color);
margin-left: 0 !important;
}
#sidebar-box:not([positionend="true"]) {
border-left-width: 0px !important;
border-top-left-radius: 0px !important;
border-bottom-left-radius: 0px !important;
margin-right: 0 !important;
}
#sidebar-box[hidden="true"] {
width: 0 !important;
opacity: 0 !important;
}
#zen-main-app-wrapper:has(#sidebar-box:not([hidden="true"], [positionend="true"])) #TabsToolbar {
border-top-right-radius: 0 !important;
border-bottom-right-radius: 0 !important;
margin-right: 0 !important;
box-shadow: none !important;
}
#sidebar-splitter {
@@ -20,11 +41,7 @@
}
#sidebar-box[positionend] {
margin-left: 0 !important;
}
#sidebar-box:not([positionend]) {
margin-right: 0 !important;
margin-left: 0 !important;
}
.zen-sidebar-action-button {