Added zen essentials!

This commit is contained in:
mr. M
2024-11-04 19:34:32 +01:00
parent 1f45db0fac
commit 649d82425a
8 changed files with 100 additions and 51 deletions

View File

@@ -1,5 +1,5 @@
diff --git a/browser/base/content/navigator-toolbox.inc.xhtml b/browser/base/content/navigator-toolbox.inc.xhtml
index 12fa0cf79aade28581016adf96df85386dabdcef..8ad1d14884e8698437ebf0d1f41a16fe654515d2 100644
index 12fa0cf79aade28581016adf96df85386dabdcef..5198bbbee13df7acfab9a7446c618d5627b4b830 100644
--- a/browser/base/content/navigator-toolbox.inc.xhtml
+++ b/browser/base/content/navigator-toolbox.inc.xhtml
@@ -2,7 +2,7 @@
@@ -27,7 +27,7 @@ index 12fa0cf79aade28581016adf96df85386dabdcef..8ad1d14884e8698437ebf0d1f41a16fe
aria-pressed="false"
oncommand="FirefoxViewHandler.openTab();"
onmousedown="FirefoxViewHandler.openToolbarMouseEvent(event);"
@@ -50,7 +51,7 @@
@@ -50,16 +51,17 @@
aria-multiselectable="true"
setfocus="false"
tooltip="tabbrowser-tab-tooltip"
@@ -36,8 +36,10 @@ index 12fa0cf79aade28581016adf96df85386dabdcef..8ad1d14884e8698437ebf0d1f41a16fe
stopwatchid="FX_TAB_CLICK_MS">
<hbox class="tab-drop-indicator" hidden="true"/>
# If the name (tabbrowser-arrowscrollbox) or structure of this changes
@@ -59,7 +60,7 @@
# significantly, there is an optimization in
# DisplayPortUtils::MaybeCreateDisplayPortInFirstScrollFrameEncountered based
# the current structure that we may want to revisit.
+ <html:div id="zen-essentials-container"></html:div>
<html:div id="vertical-pinned-tabs-container"></html:div>
<html:div id="vertical-pinned-tabs-container-separator"></html:div>
- <arrowscrollbox id="tabbrowser-arrowscrollbox" orient="horizontal" flex="1" clicktoscroll="" scrolledtostart="" scrolledtoend="">
@@ -45,7 +47,7 @@ index 12fa0cf79aade28581016adf96df85386dabdcef..8ad1d14884e8698437ebf0d1f41a16fe
<tab is="tabbrowser-tab" class="tabbrowser-tab" selected="true" visuallyselected="" fadein=""/>
<hbox id="tabbrowser-arrowscrollbox-periphery">
<toolbartabstop/>
@@ -113,9 +114,10 @@
@@ -113,9 +115,10 @@
<toolbarbutton id="content-analysis-indicator"
oncommand="ContentAnalysis.showPanel(this, PanelUI);"
class="toolbarbutton-1 content-analysis-indicator-icon"/>
@@ -58,7 +60,7 @@ index 12fa0cf79aade28581016adf96df85386dabdcef..8ad1d14884e8698437ebf0d1f41a16fe
</toolbar>
</vbox>
@@ -531,6 +533,7 @@
@@ -531,6 +534,7 @@
consumeanchor="PanelUI-button"
data-l10n-id="appmenu-menu-button-closed2"/>
</toolbaritem>

View File

@@ -21,7 +21,7 @@
#vertical-pinned-tabs-container-separator {
background: light-dark(rgba(1, 1, 1, 0.075), rgba(255, 255, 255, 0.18));
margin: var(--zen-toolbox-padding) auto;
margin: 8px auto;
border: none;
height: 1px;
width: 98%;
@@ -721,7 +721,7 @@
--zen-colors-border: var(--zen-colors-tertiary);
}
margin-top: 11px;
margin-top: 15px;
position: relative;
&::before {
@@ -731,7 +731,7 @@
background: light-dark(rgba(1, 1, 1, 0.075), rgba(255, 255, 255, 0.18));
width: 98%;
position: absolute;
top: -7px;
top: -8px;
left: 50%;
transform: translateX(-50%);
}
@@ -740,18 +740,14 @@
}
/* Mark: Essentials Toolbar */
#EssentialsToolbar {
#zen-essentials-container {
padding-bottom: var(--zen-toolbox-padding);
margin-bottom: var(--zen-toolbox-padding);
& .bookmark-item {
max-width: unset;
padding: 10px 0;
gap: 8px;
}
gap: 3px;
overflow: hidden;
}
#EssentialsToolbarItems {
#zen-essentials-container {
overflow: hidden;
transition: max-height 0.3s ease-out;
opacity: 1;
@@ -763,21 +759,33 @@
padding: 0;
}
#EssentialsToolbarItems .bookmark-item {
#zen-essentials-container .tabbrowser-tab {
max-width: unset;
width: 100% !important;
border-radius: var(--border-radius-medium);
--zen-essential-tabs-bgcolor: light-dark(rgba(1, 1, 1, 0.075), rgba(255, 255, 255, 0.18));
background: var(--tab-hover-background-color);
&:hover {
background: var(--zen-essential-tabs-bgcolor) !important;
&:not([selected]):not(:hover) .tab-background {
background: light-dark(rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.2));
}
backdrop-filter: blur(10px);
& label {
& .tab-content {
display: flex;
justify-content: center;
}
& .tab-label-container {
display: none !important;
}
& .tab-close-button {
display: none !important;
}
& .tab-icon-image,
& .tab-icon-overlay {
margin-inline-end: 0 !important;
}
}