mirror of
https://github.com/zen-browser/theme-store.git
synced 2025-07-07 08:55:31 +02:00
Merge pull request #1529 from CosmoCreeper/superpins
This commit is contained in:
mr. m
GitHub
commit
5aff48267a
1 changed files with 93 additions and 66 deletions
|
|
@ -77,88 +77,102 @@
|
|||
/* Enables legacy layout for pinned tabs (icon only in grid) */
|
||||
@media (-moz-bool-pref: "uc.pins.legacy-layout") {
|
||||
|
||||
#vertical-pinned-tabs-container .tabbrowser-tab[pinned] .tab-close-button {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
#vertical-pinned-tabs-container .tabbrowser-tab[pinned] .tab-reset-button {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
#vertical-pinned-tabs-container .tabbrowser-tab[pinned] .tab-reset-pin-button {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
#vertical-pinned-tabs-container .tabbrowser-tab[pinned] .tab-label-container {
|
||||
display: none !important;
|
||||
#vertical-pinned-tabs-container, .zen-workspace-pinned-tabs-section {
|
||||
.tabbrowser-tab[pinned] {
|
||||
.tab-close-button, .tab-reset-button,
|
||||
.tab-reset-pin-button, .tab-label-container {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/*disable icon shift when tab was renamed*/
|
||||
#navigator-toolbox[zen-sidebar-expanded="true"] {
|
||||
& #vertical-pinned-tabs-container>.zen-workspace-tabs-section>.tabbrowser-tab>.tab-stack>.tab-content>.tab-icon-stack {
|
||||
left: unset !important;
|
||||
& #vertical-pinned-tabs-container>.zen-workspace-tabs-section,
|
||||
& .zen-workspace-pinned-tabs-section {
|
||||
& .tabbrowser-tab>.tab-stack>.tab-content>.tab-icon-stack {
|
||||
left: unset !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* Make pinned tabs auto-grow to span full width of row */
|
||||
@media (-moz-bool-pref: "uc.pins.auto-grow") {
|
||||
#vertical-pinned-tabs-container>.zen-workspace-tabs-section>.tabbrowser-tab {
|
||||
width: auto !important;
|
||||
min-width: var(--tab-pinned-min-width-expanded) !important;
|
||||
flex: 1 1 auto !important;
|
||||
}
|
||||
|
||||
#vertical-pinned-tabs-container>.zen-workspace-tabs-section>tab-group {
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
@media (-moz-bool-pref: "uc.pins.grid-count") {
|
||||
|
||||
/* Logic for pinned tabs that have auto-grow and grid-count. Must use +1 to fix */
|
||||
#vertical-pinned-tabs-container>.zen-workspace-tabs-section>.tabbrowser-tab {
|
||||
width: calc(100% / (var(--mod-superpins-pins-grid-count) + 1)) !important;
|
||||
}
|
||||
}
|
||||
|
||||
#vertical-pinned-tabs-container>.zen-workspace-tabs-section {
|
||||
#vertical-pinned-tabs-container>.zen-workspace-tabs-section,
|
||||
.zen-workspace-pinned-tabs-section {
|
||||
display: flex !important;
|
||||
flex-wrap: wrap !important;
|
||||
flex-direction: row !important;
|
||||
|
||||
&>.tabbrowser-tab {
|
||||
width: auto !important;
|
||||
min-width: var(--tab-pinned-min-width-expanded) !important;
|
||||
flex: 1 1 auto !important;
|
||||
}
|
||||
|
||||
&>tab-group {
|
||||
width: 100% !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (-moz-bool-pref: "uc.pins.grid-count") {
|
||||
/* Logic for pinned tabs that have auto-grow and grid-count. Must use +1 to fix */
|
||||
#vertical-pinned-tabs-container>.zen-workspace-tabs-section,
|
||||
.zen-workspace-pinned-tabs-section {
|
||||
&>.tabbrowser-tab {
|
||||
width: calc(100% / (var(--mod-superpins-pins-grid-count) + 1)) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (not (-moz-bool-pref: "uc.pins.auto-grow")) {
|
||||
#vertical-pinned-tabs-container>.zen-workspace-tabs-section {
|
||||
#vertical-pinned-tabs-container>.zen-workspace-tabs-section,
|
||||
.zen-workspace-pinned-tabs-section {
|
||||
grid-template-columns: repeat(auto-fit, minmax(var(--tab-pinned-min-width-expanded), auto)) !important;
|
||||
display: grid !important;
|
||||
}
|
||||
|
||||
@media (-moz-bool-pref: "uc.pins.grid-count") {
|
||||
#vertical-pinned-tabs-container>.zen-workspace-tabs-section {
|
||||
#vertical-pinned-tabs-container>.zen-workspace-tabs-section,
|
||||
.zen-workspace-pinned-tabs-section {
|
||||
grid-template-columns: repeat(var(auto-fit, --mod-superpins-pins-grid-count), minmax(var(--tab-pinned-min-width-expanded), auto)) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/*The actual grid layout*/
|
||||
#vertical-pinned-tabs-container>.zen-workspace-tabs-section:has(> :nth-child(2)) {
|
||||
padding: 0 var(--zen-toolbox-padding) !important;
|
||||
overflow: visible !important;
|
||||
padding-bottom: 17px !important;
|
||||
gap: 3px 3px !important;
|
||||
max-width: calc(100% - var(--zen-toolbox-padding) * 2) !important;
|
||||
#vertical-pinned-tabs-container>.zen-workspace-tabs-section,
|
||||
.zen-workspace-pinned-tabs-section {
|
||||
&:has(> :nth-child(2)) {
|
||||
margin: 0 var(--zen-toolbox-padding) !important;
|
||||
padding: 0 var(--zen-toolbox-padding) !important;
|
||||
overflow: visible !important;
|
||||
padding-bottom: 17px !important;
|
||||
gap: 3px 3px !important;
|
||||
max-width: calc(100% - var(--zen-toolbox-padding) * 2) !important;
|
||||
}
|
||||
|
||||
.tabbrowser-tab {
|
||||
--toolbarbutton-inner-padding: 0;
|
||||
}
|
||||
|
||||
&>*:not(tab-group) {
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
&>tab-group .tab-icon-stack {
|
||||
margin: auto !important;
|
||||
}
|
||||
}
|
||||
|
||||
#vertical-pinned-tabs-container>.zen-workspace-tabs-section .tabbrowser-tab {
|
||||
--toolbarbutton-inner-padding: 0;
|
||||
}
|
||||
.zen-workspace-pinned-tabs-section {
|
||||
position: relative !important;
|
||||
|
||||
#vertical-pinned-tabs-container>.zen-workspace-tabs-section>*:not(tab-group) {
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
#vertical-pinned-tabs-container>.zen-workspace-tabs-section>tab-group .tab-icon-stack {
|
||||
margin: auto !important;
|
||||
.tab-icon-stack {
|
||||
margin-left: 50% !important;
|
||||
transform: translateX(-50%) !important;
|
||||
}
|
||||
}
|
||||
|
||||
.vertical-pinned-tabs-container-separator {
|
||||
|
|
@ -174,8 +188,11 @@
|
|||
display: none !important;
|
||||
}
|
||||
|
||||
#vertical-pinned-tabs-container>.zen-workspace-tabs-section:has(> :nth-child(2)) {
|
||||
padding-bottom: 5px !important;
|
||||
#vertical-pinned-tabs-container>.zen-workspace-tabs-section,
|
||||
.zen-workspace-pinned-tabs-section {
|
||||
:has(> :nth-child(2)) {
|
||||
padding-bottom: 5px !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -224,7 +241,7 @@
|
|||
|
||||
/* Puts Essentials at the bottom */
|
||||
:has(#theme-SuperPins[uc-essentials-position="bottom"]) {
|
||||
#zen-essentials-container, #zen-essentials-wrapper {
|
||||
#zen-essentials-container, #zen-essentials-wrapper, #zen-essentials {
|
||||
order: 999 !important;
|
||||
margin-top: auto !important;
|
||||
padding-top: 5px !important;
|
||||
|
|
@ -289,14 +306,18 @@
|
|||
}
|
||||
|
||||
:root:has(#theme-SuperPins[uc-superpins-border="pins"]) {
|
||||
.tabbrowser-tab[pinned]:not([zen-essential="true"]) .tab-stack .tab-background, #vertical-pinned-tabs-container>.zen-workspace-tabs-section tab-group {
|
||||
.tabbrowser-tab[pinned]:not([zen-essential="true"]) .tab-stack .tab-background,
|
||||
#vertical-pinned-tabs-container>.zen-workspace-tabs-section tab-group,
|
||||
.zen-workspace-pinned-tabs-section tab-group {
|
||||
border: 1px solid light-dark(color-mix(in srgb, var(--zen-colors-secondary) 80%, black),
|
||||
color-mix(in srgb, var(--zen-colors-secondary) 80%, white)) !important;
|
||||
}
|
||||
}
|
||||
|
||||
:root:has(#theme-SuperPins[uc-superpins-border="both"]) {
|
||||
.tabbrowser-tab[pinned] .tab-stack .tab-background, #vertical-pinned-tabs-container>.zen-workspace-tabs-section tab-group {
|
||||
.tabbrowser-tab[pinned] .tab-stack .tab-background,
|
||||
#vertical-pinned-tabs-container>.zen-workspace-tabs-section tab-group,
|
||||
.zen-workspace-pinned-tabs-section tab-group {
|
||||
border: 1px solid light-dark(color-mix(in srgb, var(--zen-colors-secondary) 80%, black),
|
||||
color-mix(in srgb, var(--zen-colors-secondary) 80%, white)) !important;
|
||||
}
|
||||
|
|
@ -306,20 +327,22 @@
|
|||
@media (-moz-bool-pref: "uc.pins.essentials-layout") {
|
||||
|
||||
/* Specific query to overwrite previous one */
|
||||
#vertical-pinned-tabs-container>.zen-workspace-tabs-section:has(> :nth-child(2)) {
|
||||
gap: var(--essentials-gap) var(--essentials-gap) !important;
|
||||
}
|
||||
|
||||
#vertical-pinned-tabs-container>.zen-workspace-tabs-section {
|
||||
#vertical-pinned-tabs-container>.zen-workspace-tabs-section,
|
||||
.zen-workspace-pinned-tabs-section {
|
||||
grid-template-columns: repeat(auto-fit, minmax(var(--essentials-width), auto)) !important;
|
||||
}
|
||||
|
||||
#vertical-pinned-tabs-container>.zen-workspace-tabs-section>.tabbrowser-tab {
|
||||
min-width: var(--essentials-width) !important;
|
||||
&:has(> :nth-child(2)) {
|
||||
gap: var(--essentials-gap) var(--essentials-gap) !important;
|
||||
}
|
||||
|
||||
&>.tabbrowser-tab {
|
||||
min-width: var(--essentials-width) !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (-moz-bool-pref: "uc.pins.grid-count") {
|
||||
#vertical-pinned-tabs-container>.zen-workspace-tabs-section {
|
||||
#vertical-pinned-tabs-container>.zen-workspace-tabs-section,
|
||||
.zen-workspace-pinned-tabs-section {
|
||||
grid-template-columns: repeat(var(auto-fit, --mod-superpins-pins-grid-count), minmax(var(--essentials-width), auto)) !important;
|
||||
}
|
||||
}
|
||||
|
|
@ -440,6 +463,10 @@
|
|||
|
||||
/* Increase margin below Essentials in case the workspace indicator is not visible. */
|
||||
@media (not (-moz-bool-pref: "zen.workspaces.show-workspace-indicator")) {
|
||||
.zen-current-workspace-indicator {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
:root:has(#theme-SuperPins[uc-tabs-show-separator="essentials-shown"]) {
|
||||
#zen-essentials-container, .zen-essentials-container {
|
||||
&:has(~ #zen-tabs-wrapper #zen-browser-tabs-container #vertical-pinned-tabs-container .zen-workspace-tabs-section[active="true"] .tabbrowser-tab) {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue