update librewolf configs
This commit is contained in:
Penelope Gwen
parent
d8f76ef84e
commit
9fd24e9c8b
12 changed files with 1341 additions and 1216 deletions
|
|
@ -1,4 +1,4 @@
|
|||
@import url("sidebery.css");
|
||||
/*@import url("sidebery.css");*/
|
||||
/*************************************************************************************************************************************************************************************************************************************************************
|
||||
|
||||
"userContent.css" is a custom CSS file that can be used to specify CSS style rules for Firefox's intenal site using "chrome" privileges.
|
||||
|
|
@ -20,90 +20,248 @@ NOTE: You can use the userContent.css file without change preferences (about:con
|
|||
************************************************************************************************************************************************************************************************************************************************************/
|
||||
|
||||
@charset "UTF-8";
|
||||
|
||||
/* Please write your custom CSS under this line*/
|
||||
:root {
|
||||
/* --pogmom-background-color: rgba({{{bg-red}}},{{{bg-green}}},{{{bg-blue}}},{{{bg-alpha}}});*/
|
||||
/* */
|
||||
--pogmom-background-color: transparent;
|
||||
/* --darkreader-background-ffffff: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--color-main-background-blur: var(--pogmom-background-color) !important;*/
|
||||
/* html,body {
|
||||
[class*="header"],[class*="wrap"] {
|
||||
background-color: var(--pogmom-background-color) !important;*/
|
||||
/* --background-color: var(--pogmom-background-color) !important;
|
||||
--image-background: none;
|
||||
--darkreader-bg--bgColor-default: var(--pogmom-background-color) !important;
|
||||
--darkreader-neutral-background: var(--pogmom-background-color) !important;
|
||||
--in-content-page-background: #00000000 !important;
|
||||
--in-content-box-background: #00000088 !important;
|
||||
--darkreader-bg--theme-bg-home: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--theme-bg-home-custom: var(--pogmom-background-color) !important;
|
||||
--color-background-plain: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--bgColor-canvas-default: var(--pogmom-background-color) !important;
|
||||
--darkreader-background-ffffff: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--main-bg-color: var(--pogmom-background-color) !important;*/
|
||||
/*background-color: transparent !important;*/
|
||||
/* }*/
|
||||
/* --background-color: var(--pogmom-background-color) !important;
|
||||
--image-background: none;
|
||||
--darkreader-bg--bgColor-default: var(--pogmom-background-color) !important;
|
||||
--darkreader-neutral-background: var(--pogmom-background-color) !important;
|
||||
--in-content-page-background: #00000000 !important;
|
||||
--in-content-box-background: #00000088 !important;
|
||||
--darkreader-bg--theme-bg-home: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--theme-bg-home-custom: var(--pogmom-background-color) !important;
|
||||
--color-background-plain: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--bgColor-canvas-default: var(--pogmom-background-color) !important;
|
||||
--darkreader-background-ffffff: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--main-bg-color: var(--pogmom-background-color) !important;*/
|
||||
/* background-color: transparent !important;*/
|
||||
}
|
||||
}
|
||||
|
||||
@-moz-document domain(cloud.pogmom.me) {
|
||||
|
||||
/* html,
|
||||
body {
|
||||
--darkreader-background-ffffff: var(--pogmom-background-color) !important;
|
||||
background-color: var(--pogmom-background-color) !important;
|
||||
}*/
|
||||
/* html,
|
||||
body {
|
||||
--image-background: none;
|
||||
--darkreader-bg--theme-bg-home-custom: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--theme-bg-home: var(--pogmom-background-color) !important;
|
||||
--color-background-plain: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--bgColor-default: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--bgColor-canvas-default: var(--pogmom-background-color) !important;
|
||||
--darkreader-background-ffffff: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--main-bg-color: var(--pogmom-background-color) !important;
|
||||
}*/
|
||||
@-moz-document domain(cloud.pogmom.me) {
|
||||
html,
|
||||
body {
|
||||
background-image: none !important;
|
||||
--image-background: none;
|
||||
background-color: var(--pogmom-background-color) !important;
|
||||
}
|
||||
}
|
||||
@-moz-document domain(pogmom.me) {
|
||||
}
|
||||
|
||||
@-moz-document domain(pogmom.me) {
|
||||
|
||||
html,
|
||||
body {
|
||||
background-image: none !important;
|
||||
--image-background: none;
|
||||
background-color: var(--pogmom-background-color) !important;
|
||||
}
|
||||
}
|
||||
@-moz-document url-prefix("about"){
|
||||
}
|
||||
|
||||
@-moz-document url-prefix("about") {
|
||||
* {
|
||||
background-color: var(--pogmom-background-color) !important;
|
||||
}
|
||||
}
|
||||
@-moz-document domain(*.*) {
|
||||
}
|
||||
|
||||
@-moz-document domain(*.*) {
|
||||
|
||||
html,
|
||||
body {
|
||||
background-image: none !important;
|
||||
background-color: var(--pogmom-background-color) !important;
|
||||
|
||||
* {
|
||||
background: var(--pogmom-background-color) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* SPDX-License-Identifier: MPL-2.0 */
|
||||
/* SPDX-FileCopyrightText: 2024 awwpotato */
|
||||
@-moz-document regexp("^moz-extension://.*?/sidebar/sidebar.html") {
|
||||
|
||||
:root,
|
||||
.root,
|
||||
#root {
|
||||
--general-border-radius: var(--uc-button-radius) !important;
|
||||
--tabs-margin: 1.5px !important;
|
||||
--tabs-pinned-height: 30px !important;
|
||||
--tabs-pinned-width: 30px !important;
|
||||
--tabs-height: 30px !important;
|
||||
--nav-btn-width: 30px !important;
|
||||
--nav-btn-height: 28px !important;
|
||||
--active-el-bg: [[[COLORHEX]]] !important;
|
||||
--tabs-border-radius: 8px !important;
|
||||
|
||||
@media -moz-pref("browser.tabs.allow_transparent_browser") and (not (-moz-platform: windows)) {
|
||||
background-color: transparent !important;
|
||||
--frame-bg: transparent !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 40px) {
|
||||
.TabsPanel {
|
||||
--tabs-indent: 0px !important;
|
||||
}
|
||||
|
||||
.bookmarks-tree {
|
||||
--bookmarks-indent: 0px !important;
|
||||
}
|
||||
|
||||
.Tab:not([data-active="true"]) .close {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.NavigationBar .main-items .nav-item[data-index="-1"]:not([data-active="true"]),
|
||||
.NavigationBar:not(:has(.nav-item:not([data-index="-1"]))) .static-btns {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
@media (max-width: 66px) {
|
||||
.NavigationBar .static-btns {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.NavigationBar .main-items .nav-item[data-index="-1"] {
|
||||
opacity: 1 !important;
|
||||
z-index: 1 !important;
|
||||
transform: scale(1, 1) !important;
|
||||
}
|
||||
|
||||
.central-box {
|
||||
margin-top: var(--tabs-margin) !important;
|
||||
}
|
||||
|
||||
.TabsPanel .new-tab-btns {
|
||||
padding: 0 var(--tabs-margin) !important;
|
||||
}
|
||||
|
||||
#new-tab-btn {
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
.NavigationBar {
|
||||
border-radius: 6px !important;
|
||||
margin: 0.3px !important;
|
||||
}
|
||||
|
||||
#nav_bar {
|
||||
background-color: transparent !important;
|
||||
padding: var(--tabs-margin) !important;
|
||||
}
|
||||
|
||||
@media not -moz-pref("uc.tweak.sidebery.top-navbar") {
|
||||
.top-horizontal-box {
|
||||
order: 100 !important;
|
||||
margin-bottom: var(--tabs-margin) !important;
|
||||
}
|
||||
|
||||
.NavigationBar.-top .hidden-panels-popup {
|
||||
position: absolute !important;
|
||||
margin-top: -1000px !important;
|
||||
top: auto !important;
|
||||
bottom: 36px !important;
|
||||
}
|
||||
|
||||
.NavigationBar.-top .hidden-panels-popup-layer::before {
|
||||
display: none !important;
|
||||
background-color: transparent !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media -moz-pref("uc.tweak.sidebery.top-navbar") {
|
||||
.top-horizontal-box {
|
||||
margin-top: var(--tabs-margin) !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media -moz-pref("uc.tweak.sidebery.big-pinned") {
|
||||
.PinnedTabsBar {
|
||||
display: grid !important;
|
||||
grid-gap: calc(3 * var(--tabs-margin)) !important;
|
||||
grid-template-rows: 3rem;
|
||||
grid-auto-rows: 3rem;
|
||||
grid-template-columns: repeat(auto-fit, minmax(min(100%, 3rem), 1fr));
|
||||
}
|
||||
|
||||
.Tab[data-pin="true"] {
|
||||
width: 100% !important;
|
||||
height: 100% !important;
|
||||
|
||||
&:not([data-active="true"]) .body {
|
||||
background-color: color-mix(in oklab,
|
||||
var(--tabs-activated-bg) 25%,
|
||||
transparent) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* tab audio indicator */
|
||||
.Tab .audio {
|
||||
top: 2px !important;
|
||||
left: 2px !important;
|
||||
height: 12px !important;
|
||||
width: 12px !important;
|
||||
}
|
||||
|
||||
.Tab .child-count {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.Tab[data-audible="true"] .t-box .title,
|
||||
.Tab[data-muted="true"] .t-box .title,
|
||||
.Tab[data-paused="true"] .t-box .title {
|
||||
transform: translateX(0px) !important;
|
||||
}
|
||||
|
||||
/* replace new tab panel and new tab button with plus */
|
||||
.NavigationBar #add_tp.nav-item .icon,
|
||||
.new-tab-btn>svg {
|
||||
fill: transparent;
|
||||
background-color: transparent;
|
||||
mask: url("chrome://global/skin/icons/plus.svg") !important;
|
||||
}
|
||||
|
||||
.nav-item .audio,
|
||||
.nav-item .bookmarks-badge-icon {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
/* new tab button */
|
||||
.TabsPanel .new-tab-btns {
|
||||
height: calc(var(--tabs-height) + var(--tabs-margin)) !important;
|
||||
width: calc(100% - var(--tabs-margin) * 2) !important;
|
||||
padding: 0px !important;
|
||||
padding-bottom: var(--tabs-margin) !important;
|
||||
margin: 0 var(--tabs-margin);
|
||||
border-radius: var(--tabs-border-radius);
|
||||
|
||||
position: relative !important;
|
||||
overflow: clip !important;
|
||||
|
||||
& .new-tab-btn {
|
||||
width: 100% !important;
|
||||
height: 100% !important;
|
||||
|
||||
justify-content: flex-start !important;
|
||||
flex-wrap: nowrap !important;
|
||||
overflow: clip !important;
|
||||
min-width: unset !important;
|
||||
position: relative !important;
|
||||
|
||||
&::after {
|
||||
content: "New Tab";
|
||||
position: relative;
|
||||
margin-left: calc(var(--tabs-inner-gap) + var(--tabs-inner-gap) + 2px + 16px) !important;
|
||||
width: calc(100% - (var(--tabs-inner-gap) + var(--tabs-inner-gap) + 2px + 16px)) !important;
|
||||
|
||||
font: var(--tabs-font);
|
||||
color: var(--tabs-normal-fg);
|
||||
white-space: nowrap;
|
||||
display: block !important;
|
||||
box-sizing: border-box;
|
||||
text-align: start;
|
||||
overflow: hidden;
|
||||
transition: transform var(--d-fast);
|
||||
mask: linear-gradient(-90deg, transparent, #000 8px, #000);
|
||||
margin-right: 2px !important;
|
||||
}
|
||||
}
|
||||
|
||||
& svg {
|
||||
margin: 0 var(--tabs-inner-gap) 0 calc(var(--tabs-inner-gap) + 2px);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,201 +0,0 @@
|
|||
/* SPDX-License-Identifier: MPL-2.0 */
|
||||
/* SPDX-FileCopyrightText: 2024 awwpotato */
|
||||
@-moz-document regexp("^moz-extension://.*?/sidebar/sidebar.html")
|
||||
{
|
||||
:root,
|
||||
.root,
|
||||
#root {
|
||||
--general-border-radius: var(--uc-button-radius) !important;
|
||||
--tabs-margin: 1.5px !important;
|
||||
--tabs-pinned-height: 30px !important;
|
||||
--tabs-pinned-width: 30px !important;
|
||||
--tabs-height: 30px !important;
|
||||
--nav-btn-width: 30px !important;
|
||||
--nav-btn-height: 28px !important;
|
||||
--active-el-bg: #795f7c7f !important;
|
||||
--tabs-border-radius: 8px !important;
|
||||
|
||||
@media -moz-pref( "browser.tabs.allow_transparent_browser") and (not (-moz-platform: windows)) {
|
||||
/* background-color: #795f7c7f !important;*/
|
||||
background-color: transparent !important;
|
||||
--frame-bg: transparent !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 40px) {
|
||||
.TabsPanel {
|
||||
--tabs-indent: 0px !important;
|
||||
}
|
||||
.bookmarks-tree {
|
||||
--bookmarks-indent: 0px !important;
|
||||
}
|
||||
.Tab:not([data-active="true"]) .close {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.NavigationBar
|
||||
.main-items
|
||||
.nav-item[data-index="-1"]:not([data-active="true"]),
|
||||
.NavigationBar:not(:has(.nav-item:not([data-index="-1"]))) .static-btns {
|
||||
display: none !important;
|
||||
}
|
||||
@media (max-width: 66px) {
|
||||
.NavigationBar .static-btns {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.NavigationBar .main-items .nav-item[data-index="-1"] {
|
||||
opacity: 1 !important;
|
||||
z-index: 1 !important;
|
||||
transform: scale(1, 1) !important;
|
||||
}
|
||||
|
||||
.central-box {
|
||||
margin-top: var(--tabs-margin) !important;
|
||||
}
|
||||
|
||||
.TabsPanel .new-tab-btns {
|
||||
padding: 0 var(--tabs-margin) !important;
|
||||
}
|
||||
|
||||
#new-tab-btn {
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
.NavigationBar {
|
||||
border-radius: 6px !important;
|
||||
margin: 0.3px !important;
|
||||
}
|
||||
|
||||
#nav_bar {
|
||||
background-color: transparent !important;
|
||||
padding: var(--tabs-margin) !important;
|
||||
}
|
||||
|
||||
@media not -moz-pref( "uc.tweak.sidebery.top-navbar") {
|
||||
.top-horizontal-box {
|
||||
order: 100 !important;
|
||||
margin-bottom: var(--tabs-margin) !important;
|
||||
}
|
||||
|
||||
.NavigationBar.-top .hidden-panels-popup {
|
||||
position: absolute !important;
|
||||
margin-top: -1000px !important;
|
||||
top: auto !important;
|
||||
bottom: 36px !important;
|
||||
}
|
||||
.NavigationBar.-top .hidden-panels-popup-layer::before {
|
||||
display: none !important;
|
||||
background-color: transparent !important;
|
||||
}
|
||||
} @media -moz-pref( "uc.tweak.sidebery.top-navbar") {
|
||||
.top-horizontal-box {
|
||||
margin-top: var(--tabs-margin) !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media -moz-pref( "uc.tweak.sidebery.big-pinned") {
|
||||
.PinnedTabsBar {
|
||||
display: grid !important;
|
||||
grid-gap: calc(3 * var(--tabs-margin)) !important;
|
||||
grid-template-rows: 3rem;
|
||||
grid-auto-rows: 3rem;
|
||||
grid-template-columns: repeat(auto-fit, minmax(min(100%, 3rem), 1fr));
|
||||
}
|
||||
|
||||
.Tab[data-pin="true"] {
|
||||
width: 100% !important;
|
||||
height: 100% !important;
|
||||
&:not([data-active="true"]) .body {
|
||||
background-color: color-mix(
|
||||
in oklab,
|
||||
var(--tabs-activated-bg) 25%,
|
||||
transparent
|
||||
) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* tab audio indicator */
|
||||
.Tab .audio {
|
||||
top: 2px !important;
|
||||
left: 2px !important;
|
||||
height: 12px !important;
|
||||
width: 12px !important;
|
||||
}
|
||||
.Tab .child-count {
|
||||
display: none !important;
|
||||
}
|
||||
.Tab[data-audible="true"] .t-box .title,
|
||||
.Tab[data-muted="true"] .t-box .title,
|
||||
.Tab[data-paused="true"] .t-box .title {
|
||||
transform: translateX(0px) !important;
|
||||
}
|
||||
|
||||
/* replace new tab panel and new tab button with plus */
|
||||
.NavigationBar #add_tp.nav-item .icon,
|
||||
.new-tab-btn > svg {
|
||||
fill: transparent;
|
||||
/* background-color: var(--nav-btn-fg);*/
|
||||
background-color: transparent;
|
||||
mask: url("chrome://global/skin/icons/plus.svg") !important;
|
||||
}
|
||||
|
||||
.nav-item .audio,
|
||||
.nav-item .bookmarks-badge-icon {
|
||||
/* background-color: var(--frame-bg) !important;*/
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
/* new tab button */
|
||||
.TabsPanel .new-tab-btns {
|
||||
height: calc(var(--tabs-height) + var(--tabs-margin)) !important;
|
||||
width: calc(100% - var(--tabs-margin) * 2) !important;
|
||||
padding: 0px !important;
|
||||
padding-bottom: var(--tabs-margin) !important;
|
||||
margin: 0 var(--tabs-margin);
|
||||
border-radius: var(--tabs-border-radius);
|
||||
|
||||
position: relative !important;
|
||||
overflow: clip !important;
|
||||
|
||||
& .new-tab-btn {
|
||||
width: 100% !important;
|
||||
height: 100% !important;
|
||||
|
||||
justify-content: flex-start !important;
|
||||
flex-wrap: nowrap !important;
|
||||
overflow: clip !important;
|
||||
min-width: unset !important;
|
||||
position: relative !important;
|
||||
|
||||
&::after {
|
||||
content: "New Tab";
|
||||
position: relative;
|
||||
margin-left: calc(
|
||||
var(--tabs-inner-gap) + var(--tabs-inner-gap) + 2px + 16px
|
||||
) !important;
|
||||
width: calc(
|
||||
100% - (var(--tabs-inner-gap) + var(--tabs-inner-gap) + 2px + 16px)
|
||||
) !important;
|
||||
|
||||
font: var(--tabs-font);
|
||||
color: var(--tabs-normal-fg);
|
||||
white-space: nowrap;
|
||||
display: block !important;
|
||||
box-sizing: border-box;
|
||||
text-align: start;
|
||||
overflow: hidden;
|
||||
transition: transform var(--d-fast);
|
||||
mask: linear-gradient(-90deg, transparent, #000 8px, #000);
|
||||
margin-right: 2px !important;
|
||||
}
|
||||
}
|
||||
|
||||
& svg {
|
||||
margin: 0 var(--tabs-inner-gap) 0 calc(var(--tabs-inner-gap) + 2px);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,4 +1,4 @@
|
|||
@import url("sidebery.css");
|
||||
/*@import url("sidebery.css");*/
|
||||
/*************************************************************************************************************************************************************************************************************************************************************
|
||||
|
||||
"userContent.css" is a custom CSS file that can be used to specify CSS style rules for Firefox's intenal site using "chrome" privileges.
|
||||
|
|
@ -20,90 +20,248 @@ NOTE: You can use the userContent.css file without change preferences (about:con
|
|||
************************************************************************************************************************************************************************************************************************************************************/
|
||||
|
||||
@charset "UTF-8";
|
||||
|
||||
/* Please write your custom CSS under this line*/
|
||||
:root {
|
||||
/* --pogmom-background-color: rgba({{{bg-red}}},{{{bg-green}}},{{{bg-blue}}},{{{bg-alpha}}});*/
|
||||
/* */
|
||||
--pogmom-background-color: transparent;
|
||||
/* --darkreader-background-ffffff: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--color-main-background-blur: var(--pogmom-background-color) !important;*/
|
||||
/* html,body {
|
||||
[class*="header"],[class*="wrap"] {
|
||||
background-color: var(--pogmom-background-color) !important;*/
|
||||
/* --background-color: var(--pogmom-background-color) !important;
|
||||
--image-background: none;
|
||||
--darkreader-bg--bgColor-default: var(--pogmom-background-color) !important;
|
||||
--darkreader-neutral-background: var(--pogmom-background-color) !important;
|
||||
--in-content-page-background: #00000000 !important;
|
||||
--in-content-box-background: #00000088 !important;
|
||||
--darkreader-bg--theme-bg-home: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--theme-bg-home-custom: var(--pogmom-background-color) !important;
|
||||
--color-background-plain: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--bgColor-canvas-default: var(--pogmom-background-color) !important;
|
||||
--darkreader-background-ffffff: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--main-bg-color: var(--pogmom-background-color) !important;*/
|
||||
/*background-color: transparent !important;*/
|
||||
/* }*/
|
||||
/* --background-color: var(--pogmom-background-color) !important;
|
||||
--image-background: none;
|
||||
--darkreader-bg--bgColor-default: var(--pogmom-background-color) !important;
|
||||
--darkreader-neutral-background: var(--pogmom-background-color) !important;
|
||||
--in-content-page-background: #00000000 !important;
|
||||
--in-content-box-background: #00000088 !important;
|
||||
--darkreader-bg--theme-bg-home: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--theme-bg-home-custom: var(--pogmom-background-color) !important;
|
||||
--color-background-plain: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--bgColor-canvas-default: var(--pogmom-background-color) !important;
|
||||
--darkreader-background-ffffff: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--main-bg-color: var(--pogmom-background-color) !important;*/
|
||||
/* background-color: transparent !important;*/
|
||||
}
|
||||
}
|
||||
|
||||
@-moz-document domain(cloud.pogmom.me) {
|
||||
|
||||
/* html,
|
||||
body {
|
||||
--darkreader-background-ffffff: var(--pogmom-background-color) !important;
|
||||
background-color: var(--pogmom-background-color) !important;
|
||||
}*/
|
||||
/* html,
|
||||
body {
|
||||
--image-background: none;
|
||||
--darkreader-bg--theme-bg-home-custom: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--theme-bg-home: var(--pogmom-background-color) !important;
|
||||
--color-background-plain: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--bgColor-default: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--bgColor-canvas-default: var(--pogmom-background-color) !important;
|
||||
--darkreader-background-ffffff: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--main-bg-color: var(--pogmom-background-color) !important;
|
||||
}*/
|
||||
@-moz-document domain(cloud.pogmom.me) {
|
||||
html,
|
||||
body {
|
||||
background-image: none !important;
|
||||
--image-background: none;
|
||||
background-color: var(--pogmom-background-color) !important;
|
||||
}
|
||||
}
|
||||
@-moz-document domain(pogmom.me) {
|
||||
}
|
||||
|
||||
@-moz-document domain(pogmom.me) {
|
||||
|
||||
html,
|
||||
body {
|
||||
background-image: none !important;
|
||||
--image-background: none;
|
||||
background-color: var(--pogmom-background-color) !important;
|
||||
}
|
||||
}
|
||||
@-moz-document url-prefix("about"){
|
||||
}
|
||||
|
||||
@-moz-document url-prefix("about") {
|
||||
* {
|
||||
background-color: var(--pogmom-background-color) !important;
|
||||
}
|
||||
}
|
||||
@-moz-document domain(*.*) {
|
||||
}
|
||||
|
||||
@-moz-document domain(*.*) {
|
||||
|
||||
html,
|
||||
body {
|
||||
background-image: none !important;
|
||||
background-color: var(--pogmom-background-color) !important;
|
||||
|
||||
* {
|
||||
background: var(--pogmom-background-color) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* SPDX-License-Identifier: MPL-2.0 */
|
||||
/* SPDX-FileCopyrightText: 2024 awwpotato */
|
||||
@-moz-document regexp("^moz-extension://.*?/sidebar/sidebar.html") {
|
||||
|
||||
:root,
|
||||
.root,
|
||||
#root {
|
||||
--general-border-radius: var(--uc-button-radius) !important;
|
||||
--tabs-margin: 1.5px !important;
|
||||
--tabs-pinned-height: 30px !important;
|
||||
--tabs-pinned-width: 30px !important;
|
||||
--tabs-height: 30px !important;
|
||||
--nav-btn-width: 30px !important;
|
||||
--nav-btn-height: 28px !important;
|
||||
--active-el-bg: #795f7c7f !important;
|
||||
--tabs-border-radius: 8px !important;
|
||||
|
||||
@media -moz-pref("browser.tabs.allow_transparent_browser") and (not (-moz-platform: windows)) {
|
||||
background-color: transparent !important;
|
||||
--frame-bg: transparent !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 40px) {
|
||||
.TabsPanel {
|
||||
--tabs-indent: 0px !important;
|
||||
}
|
||||
|
||||
.bookmarks-tree {
|
||||
--bookmarks-indent: 0px !important;
|
||||
}
|
||||
|
||||
.Tab:not([data-active="true"]) .close {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.NavigationBar .main-items .nav-item[data-index="-1"]:not([data-active="true"]),
|
||||
.NavigationBar:not(:has(.nav-item:not([data-index="-1"]))) .static-btns {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
@media (max-width: 66px) {
|
||||
.NavigationBar .static-btns {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.NavigationBar .main-items .nav-item[data-index="-1"] {
|
||||
opacity: 1 !important;
|
||||
z-index: 1 !important;
|
||||
transform: scale(1, 1) !important;
|
||||
}
|
||||
|
||||
.central-box {
|
||||
margin-top: var(--tabs-margin) !important;
|
||||
}
|
||||
|
||||
.TabsPanel .new-tab-btns {
|
||||
padding: 0 var(--tabs-margin) !important;
|
||||
}
|
||||
|
||||
#new-tab-btn {
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
.NavigationBar {
|
||||
border-radius: 6px !important;
|
||||
margin: 0.3px !important;
|
||||
}
|
||||
|
||||
#nav_bar {
|
||||
background-color: transparent !important;
|
||||
padding: var(--tabs-margin) !important;
|
||||
}
|
||||
|
||||
@media not -moz-pref("uc.tweak.sidebery.top-navbar") {
|
||||
.top-horizontal-box {
|
||||
order: 100 !important;
|
||||
margin-bottom: var(--tabs-margin) !important;
|
||||
}
|
||||
|
||||
.NavigationBar.-top .hidden-panels-popup {
|
||||
position: absolute !important;
|
||||
margin-top: -1000px !important;
|
||||
top: auto !important;
|
||||
bottom: 36px !important;
|
||||
}
|
||||
|
||||
.NavigationBar.-top .hidden-panels-popup-layer::before {
|
||||
display: none !important;
|
||||
background-color: transparent !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media -moz-pref("uc.tweak.sidebery.top-navbar") {
|
||||
.top-horizontal-box {
|
||||
margin-top: var(--tabs-margin) !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media -moz-pref("uc.tweak.sidebery.big-pinned") {
|
||||
.PinnedTabsBar {
|
||||
display: grid !important;
|
||||
grid-gap: calc(3 * var(--tabs-margin)) !important;
|
||||
grid-template-rows: 3rem;
|
||||
grid-auto-rows: 3rem;
|
||||
grid-template-columns: repeat(auto-fit, minmax(min(100%, 3rem), 1fr));
|
||||
}
|
||||
|
||||
.Tab[data-pin="true"] {
|
||||
width: 100% !important;
|
||||
height: 100% !important;
|
||||
|
||||
&:not([data-active="true"]) .body {
|
||||
background-color: color-mix(in oklab,
|
||||
var(--tabs-activated-bg) 25%,
|
||||
transparent) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* tab audio indicator */
|
||||
.Tab .audio {
|
||||
top: 2px !important;
|
||||
left: 2px !important;
|
||||
height: 12px !important;
|
||||
width: 12px !important;
|
||||
}
|
||||
|
||||
.Tab .child-count {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.Tab[data-audible="true"] .t-box .title,
|
||||
.Tab[data-muted="true"] .t-box .title,
|
||||
.Tab[data-paused="true"] .t-box .title {
|
||||
transform: translateX(0px) !important;
|
||||
}
|
||||
|
||||
/* replace new tab panel and new tab button with plus */
|
||||
.NavigationBar #add_tp.nav-item .icon,
|
||||
.new-tab-btn>svg {
|
||||
fill: transparent;
|
||||
background-color: transparent;
|
||||
mask: url("chrome://global/skin/icons/plus.svg") !important;
|
||||
}
|
||||
|
||||
.nav-item .audio,
|
||||
.nav-item .bookmarks-badge-icon {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
/* new tab button */
|
||||
.TabsPanel .new-tab-btns {
|
||||
height: calc(var(--tabs-height) + var(--tabs-margin)) !important;
|
||||
width: calc(100% - var(--tabs-margin) * 2) !important;
|
||||
padding: 0px !important;
|
||||
padding-bottom: var(--tabs-margin) !important;
|
||||
margin: 0 var(--tabs-margin);
|
||||
border-radius: var(--tabs-border-radius);
|
||||
|
||||
position: relative !important;
|
||||
overflow: clip !important;
|
||||
|
||||
& .new-tab-btn {
|
||||
width: 100% !important;
|
||||
height: 100% !important;
|
||||
|
||||
justify-content: flex-start !important;
|
||||
flex-wrap: nowrap !important;
|
||||
overflow: clip !important;
|
||||
min-width: unset !important;
|
||||
position: relative !important;
|
||||
|
||||
&::after {
|
||||
content: "New Tab";
|
||||
position: relative;
|
||||
margin-left: calc(var(--tabs-inner-gap) + var(--tabs-inner-gap) + 2px + 16px) !important;
|
||||
width: calc(100% - (var(--tabs-inner-gap) + var(--tabs-inner-gap) + 2px + 16px)) !important;
|
||||
|
||||
font: var(--tabs-font);
|
||||
color: var(--tabs-normal-fg);
|
||||
white-space: nowrap;
|
||||
display: block !important;
|
||||
box-sizing: border-box;
|
||||
text-align: start;
|
||||
overflow: hidden;
|
||||
transition: transform var(--d-fast);
|
||||
mask: linear-gradient(-90deg, transparent, #000 8px, #000);
|
||||
margin-right: 2px !important;
|
||||
}
|
||||
}
|
||||
|
||||
& svg {
|
||||
margin: 0 var(--tabs-inner-gap) 0 calc(var(--tabs-inner-gap) + 2px);
|
||||
}
|
||||
}
|
||||
}
|
||||
73
graphical/librewolf/housing/chrome/userChrome.css
Normal file
73
graphical/librewolf/housing/chrome/userChrome.css
Normal file
|
|
@ -0,0 +1,73 @@
|
|||
#TabsToolbar {
|
||||
display: none !important;
|
||||
}
|
||||
#navigator-toolbox {
|
||||
border-bottom: none !important;
|
||||
}
|
||||
#sidebar-splitter {
|
||||
display: none !important;
|
||||
}
|
||||
/* #sidebar-header is hidden by default, change "none" to "inherit" to restore it. */
|
||||
#sidebar-header {
|
||||
display: none !important;
|
||||
}
|
||||
:root {
|
||||
--tabpanel-background-color: #11131766 !important;
|
||||
--toolbar-bgcolor: #d7af8733 !important;
|
||||
--toolbar-field-background-color: transparent !important;
|
||||
--urlbar-box-bgcolor: transparent !important;
|
||||
}
|
||||
/*#tabbrowser-tabpanels {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-grow: 0;
|
||||
}*/
|
||||
/*.browserStack > browser {*/
|
||||
/*.deck-selected {
|
||||
border: 5px solid red;
|
||||
}*/
|
||||
.urlbar-input-container {
|
||||
text-align: center !important;
|
||||
}
|
||||
#tabbrowser-tabpanels {
|
||||
margin: 10px !important;
|
||||
margin-left: 10px !important;
|
||||
border-radius: 12px !important;
|
||||
* { border-radius: 12px !important; }
|
||||
}
|
||||
#urlbar-searchmode-switcher {
|
||||
display: none !important;
|
||||
}
|
||||
#sidebar-box {
|
||||
background-color: transparent !important;
|
||||
/* background-color: #11131766 !important;*/
|
||||
margin: 10px !important;
|
||||
margin-right: 0px !important;
|
||||
border-radius: 10px !important;
|
||||
* { border-radius: 10px !important; }
|
||||
}
|
||||
/*:root { --tabpanel-background-color: #11131700 !important; }*/
|
||||
/*:root { --tabpanel-background-color: rgba(17,19,23,1) !important; }*/
|
||||
|
||||
/*************************************************************************************************************************************************************************************************************************************************************
|
||||
|
||||
"userChrome.css" is a custom CSS file that can be used to specify CSS style rules for Floorp's interface (NOT internal site) using "chrome" privileges.
|
||||
For instance, if you want to hide the tab bar, you can use the following CSS rule:
|
||||
|
||||
**************************************
|
||||
#TabsToolbar { *
|
||||
display: none !important; *
|
||||
} *
|
||||
**************************************
|
||||
|
||||
NOTE: You can use the userChrome.css file without change preferences (about:config)
|
||||
|
||||
Quote: https://userChrome.org | https://github.com/topics/userchrome
|
||||
|
||||
************************************************************************************************************************************************************************************************************************************************************/
|
||||
|
||||
@charset "UTF-8";
|
||||
@-moz-document url(chrome://browser/content/browser.xhtml) {
|
||||
/* Please write your custom CSS under this line*/
|
||||
|
||||
}
|
||||
|
|
@ -1,7 +1,75 @@
|
|||
/*@import url("sidebery.css");*/
|
||||
/*************************************************************************************************************************************************************************************************************************************************************
|
||||
|
||||
"userContent.css" is a custom CSS file that can be used to specify CSS style rules for Firefox's intenal site using "chrome" privileges.
|
||||
For instance, if you want to apply CSS at "about:newtab" and "about:home", you can use the following CSS rule:
|
||||
|
||||
***********************************************************************
|
||||
@-moz-document url-prefix("about:newtab"), url-prefix("about:home") { *
|
||||
|
||||
background-color: green;
|
||||
|
||||
*
|
||||
* Write your css * *
|
||||
*
|
||||
} *
|
||||
***********************************************************************
|
||||
|
||||
NOTE: You can use the userContent.css file without change preferences (about:config)
|
||||
|
||||
************************************************************************************************************************************************************************************************************************************************************/
|
||||
|
||||
@charset "UTF-8";
|
||||
|
||||
/* Please write your custom CSS under this line*/
|
||||
:root {
|
||||
--pogmom-background-color: transparent;
|
||||
}
|
||||
|
||||
@-moz-document domain(cloud.pogmom.me) {
|
||||
|
||||
html,
|
||||
body {
|
||||
background-image: none !important;
|
||||
--image-background: none;
|
||||
background-color: var(--pogmom-background-color) !important;
|
||||
}
|
||||
}
|
||||
|
||||
@-moz-document domain(pogmom.me) {
|
||||
|
||||
html,
|
||||
body {
|
||||
background-image: none !important;
|
||||
--image-background: none;
|
||||
background-color: var(--pogmom-background-color) !important;
|
||||
}
|
||||
}
|
||||
|
||||
@-moz-document url-prefix("about") {
|
||||
* {
|
||||
background-color: var(--pogmom-background-color) !important;
|
||||
}
|
||||
}
|
||||
|
||||
@-moz-document domain(*.*) {
|
||||
|
||||
html,
|
||||
body {
|
||||
background-image: none !important;
|
||||
background-color: var(--pogmom-background-color) !important;
|
||||
|
||||
* {
|
||||
background: var(--pogmom-background-color) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* SPDX-License-Identifier: MPL-2.0 */
|
||||
/* SPDX-FileCopyrightText: 2024 awwpotato */
|
||||
@-moz-document regexp("^moz-extension://.*?/sidebar/sidebar.html")
|
||||
{
|
||||
@-moz-document regexp("^moz-extension://.*?/sidebar/sidebar.html") {
|
||||
|
||||
:root,
|
||||
.root,
|
||||
#root {
|
||||
|
|
@ -12,11 +80,10 @@
|
|||
--tabs-height: 30px !important;
|
||||
--nav-btn-width: 30px !important;
|
||||
--nav-btn-height: 28px !important;
|
||||
--active-el-bg: [[[COLORHEX]]] !important;
|
||||
--active-el-bg: #d7af8733 !important;
|
||||
--tabs-border-radius: 8px !important;
|
||||
|
||||
@media -moz-pref( "browser.tabs.allow_transparent_browser") and (not (-moz-platform: windows)) {
|
||||
/* background-color: [[[COLORHEX]]] !important;*/
|
||||
@media -moz-pref("browser.tabs.allow_transparent_browser") and (not (-moz-platform: windows)) {
|
||||
background-color: transparent !important;
|
||||
--frame-bg: transparent !important;
|
||||
}
|
||||
|
|
@ -26,20 +93,21 @@
|
|||
.TabsPanel {
|
||||
--tabs-indent: 0px !important;
|
||||
}
|
||||
|
||||
.bookmarks-tree {
|
||||
--bookmarks-indent: 0px !important;
|
||||
}
|
||||
|
||||
.Tab:not([data-active="true"]) .close {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.NavigationBar
|
||||
.main-items
|
||||
.nav-item[data-index="-1"]:not([data-active="true"]),
|
||||
.NavigationBar .main-items .nav-item[data-index="-1"]:not([data-active="true"]),
|
||||
.NavigationBar:not(:has(.nav-item:not([data-index="-1"]))) .static-btns {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
@media (max-width: 66px) {
|
||||
.NavigationBar .static-btns {
|
||||
display: none !important;
|
||||
|
|
@ -74,7 +142,7 @@
|
|||
padding: var(--tabs-margin) !important;
|
||||
}
|
||||
|
||||
@media not -moz-pref( "uc.tweak.sidebery.top-navbar") {
|
||||
@media not -moz-pref("uc.tweak.sidebery.top-navbar") {
|
||||
.top-horizontal-box {
|
||||
order: 100 !important;
|
||||
margin-bottom: var(--tabs-margin) !important;
|
||||
|
|
@ -86,17 +154,20 @@
|
|||
top: auto !important;
|
||||
bottom: 36px !important;
|
||||
}
|
||||
|
||||
.NavigationBar.-top .hidden-panels-popup-layer::before {
|
||||
display: none !important;
|
||||
background-color: transparent !important;
|
||||
}
|
||||
} @media -moz-pref( "uc.tweak.sidebery.top-navbar") {
|
||||
}
|
||||
|
||||
@media -moz-pref("uc.tweak.sidebery.top-navbar") {
|
||||
.top-horizontal-box {
|
||||
margin-top: var(--tabs-margin) !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media -moz-pref( "uc.tweak.sidebery.big-pinned") {
|
||||
@media -moz-pref("uc.tweak.sidebery.big-pinned") {
|
||||
.PinnedTabsBar {
|
||||
display: grid !important;
|
||||
grid-gap: calc(3 * var(--tabs-margin)) !important;
|
||||
|
|
@ -108,12 +179,11 @@
|
|||
.Tab[data-pin="true"] {
|
||||
width: 100% !important;
|
||||
height: 100% !important;
|
||||
|
||||
&:not([data-active="true"]) .body {
|
||||
background-color: color-mix(
|
||||
in oklab,
|
||||
background-color: color-mix(in oklab,
|
||||
var(--tabs-activated-bg) 25%,
|
||||
transparent
|
||||
) !important;
|
||||
transparent) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -125,9 +195,11 @@
|
|||
height: 12px !important;
|
||||
width: 12px !important;
|
||||
}
|
||||
|
||||
.Tab .child-count {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.Tab[data-audible="true"] .t-box .title,
|
||||
.Tab[data-muted="true"] .t-box .title,
|
||||
.Tab[data-paused="true"] .t-box .title {
|
||||
|
|
@ -136,16 +208,14 @@
|
|||
|
||||
/* replace new tab panel and new tab button with plus */
|
||||
.NavigationBar #add_tp.nav-item .icon,
|
||||
.new-tab-btn > svg {
|
||||
.new-tab-btn>svg {
|
||||
fill: transparent;
|
||||
/* background-color: var(--nav-btn-fg);*/
|
||||
background-color: transparent;
|
||||
mask: url("chrome://global/skin/icons/plus.svg") !important;
|
||||
}
|
||||
|
||||
.nav-item .audio,
|
||||
.nav-item .bookmarks-badge-icon {
|
||||
/* background-color: var(--frame-bg) !important;*/
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
|
|
@ -174,12 +244,8 @@
|
|||
&::after {
|
||||
content: "New Tab";
|
||||
position: relative;
|
||||
margin-left: calc(
|
||||
var(--tabs-inner-gap) + var(--tabs-inner-gap) + 2px + 16px
|
||||
) !important;
|
||||
width: calc(
|
||||
100% - (var(--tabs-inner-gap) + var(--tabs-inner-gap) + 2px + 16px)
|
||||
) !important;
|
||||
margin-left: calc(var(--tabs-inner-gap) + var(--tabs-inner-gap) + 2px + 16px) !important;
|
||||
width: calc(100% - (var(--tabs-inner-gap) + var(--tabs-inner-gap) + 2px + 16px)) !important;
|
||||
|
||||
font: var(--tabs-font);
|
||||
color: var(--tabs-normal-fg);
|
||||
|
|
@ -1,201 +0,0 @@
|
|||
/* SPDX-License-Identifier: MPL-2.0 */
|
||||
/* SPDX-FileCopyrightText: 2024 awwpotato */
|
||||
@-moz-document regexp("^moz-extension://.*?/sidebar/sidebar.html")
|
||||
{
|
||||
:root,
|
||||
.root,
|
||||
#root {
|
||||
--general-border-radius: var(--uc-button-radius) !important;
|
||||
--tabs-margin: 1.5px !important;
|
||||
--tabs-pinned-height: 30px !important;
|
||||
--tabs-pinned-width: 30px !important;
|
||||
--tabs-height: 30px !important;
|
||||
--nav-btn-width: 30px !important;
|
||||
--nav-btn-height: 28px !important;
|
||||
--active-el-bg: #746163a5 !important;
|
||||
--tabs-border-radius: 8px !important;
|
||||
|
||||
@media -moz-pref( "browser.tabs.allow_transparent_browser") and (not (-moz-platform: windows)) {
|
||||
/* background-color: #746163a5 !important;*/
|
||||
background-color: transparent !important;
|
||||
--frame-bg: transparent !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 40px) {
|
||||
.TabsPanel {
|
||||
--tabs-indent: 0px !important;
|
||||
}
|
||||
.bookmarks-tree {
|
||||
--bookmarks-indent: 0px !important;
|
||||
}
|
||||
.Tab:not([data-active="true"]) .close {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.NavigationBar
|
||||
.main-items
|
||||
.nav-item[data-index="-1"]:not([data-active="true"]),
|
||||
.NavigationBar:not(:has(.nav-item:not([data-index="-1"]))) .static-btns {
|
||||
display: none !important;
|
||||
}
|
||||
@media (max-width: 66px) {
|
||||
.NavigationBar .static-btns {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.NavigationBar .main-items .nav-item[data-index="-1"] {
|
||||
opacity: 1 !important;
|
||||
z-index: 1 !important;
|
||||
transform: scale(1, 1) !important;
|
||||
}
|
||||
|
||||
.central-box {
|
||||
margin-top: var(--tabs-margin) !important;
|
||||
}
|
||||
|
||||
.TabsPanel .new-tab-btns {
|
||||
padding: 0 var(--tabs-margin) !important;
|
||||
}
|
||||
|
||||
#new-tab-btn {
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
.NavigationBar {
|
||||
border-radius: 6px !important;
|
||||
margin: 0.3px !important;
|
||||
}
|
||||
|
||||
#nav_bar {
|
||||
background-color: transparent !important;
|
||||
padding: var(--tabs-margin) !important;
|
||||
}
|
||||
|
||||
@media not -moz-pref( "uc.tweak.sidebery.top-navbar") {
|
||||
.top-horizontal-box {
|
||||
order: 100 !important;
|
||||
margin-bottom: var(--tabs-margin) !important;
|
||||
}
|
||||
|
||||
.NavigationBar.-top .hidden-panels-popup {
|
||||
position: absolute !important;
|
||||
margin-top: -1000px !important;
|
||||
top: auto !important;
|
||||
bottom: 36px !important;
|
||||
}
|
||||
.NavigationBar.-top .hidden-panels-popup-layer::before {
|
||||
display: none !important;
|
||||
background-color: transparent !important;
|
||||
}
|
||||
} @media -moz-pref( "uc.tweak.sidebery.top-navbar") {
|
||||
.top-horizontal-box {
|
||||
margin-top: var(--tabs-margin) !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media -moz-pref( "uc.tweak.sidebery.big-pinned") {
|
||||
.PinnedTabsBar {
|
||||
display: grid !important;
|
||||
grid-gap: calc(3 * var(--tabs-margin)) !important;
|
||||
grid-template-rows: 3rem;
|
||||
grid-auto-rows: 3rem;
|
||||
grid-template-columns: repeat(auto-fit, minmax(min(100%, 3rem), 1fr));
|
||||
}
|
||||
|
||||
.Tab[data-pin="true"] {
|
||||
width: 100% !important;
|
||||
height: 100% !important;
|
||||
&:not([data-active="true"]) .body {
|
||||
background-color: color-mix(
|
||||
in oklab,
|
||||
var(--tabs-activated-bg) 25%,
|
||||
transparent
|
||||
) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* tab audio indicator */
|
||||
.Tab .audio {
|
||||
top: 2px !important;
|
||||
left: 2px !important;
|
||||
height: 12px !important;
|
||||
width: 12px !important;
|
||||
}
|
||||
.Tab .child-count {
|
||||
display: none !important;
|
||||
}
|
||||
.Tab[data-audible="true"] .t-box .title,
|
||||
.Tab[data-muted="true"] .t-box .title,
|
||||
.Tab[data-paused="true"] .t-box .title {
|
||||
transform: translateX(0px) !important;
|
||||
}
|
||||
|
||||
/* replace new tab panel and new tab button with plus */
|
||||
.NavigationBar #add_tp.nav-item .icon,
|
||||
.new-tab-btn > svg {
|
||||
fill: transparent;
|
||||
/* background-color: var(--nav-btn-fg);*/
|
||||
background-color: transparent;
|
||||
mask: url("chrome://global/skin/icons/plus.svg") !important;
|
||||
}
|
||||
|
||||
.nav-item .audio,
|
||||
.nav-item .bookmarks-badge-icon {
|
||||
/* background-color: var(--frame-bg) !important;*/
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
/* new tab button */
|
||||
.TabsPanel .new-tab-btns {
|
||||
height: calc(var(--tabs-height) + var(--tabs-margin)) !important;
|
||||
width: calc(100% - var(--tabs-margin) * 2) !important;
|
||||
padding: 0px !important;
|
||||
padding-bottom: var(--tabs-margin) !important;
|
||||
margin: 0 var(--tabs-margin);
|
||||
border-radius: var(--tabs-border-radius);
|
||||
|
||||
position: relative !important;
|
||||
overflow: clip !important;
|
||||
|
||||
& .new-tab-btn {
|
||||
width: 100% !important;
|
||||
height: 100% !important;
|
||||
|
||||
justify-content: flex-start !important;
|
||||
flex-wrap: nowrap !important;
|
||||
overflow: clip !important;
|
||||
min-width: unset !important;
|
||||
position: relative !important;
|
||||
|
||||
&::after {
|
||||
content: "New Tab";
|
||||
position: relative;
|
||||
margin-left: calc(
|
||||
var(--tabs-inner-gap) + var(--tabs-inner-gap) + 2px + 16px
|
||||
) !important;
|
||||
width: calc(
|
||||
100% - (var(--tabs-inner-gap) + var(--tabs-inner-gap) + 2px + 16px)
|
||||
) !important;
|
||||
|
||||
font: var(--tabs-font);
|
||||
color: var(--tabs-normal-fg);
|
||||
white-space: nowrap;
|
||||
display: block !important;
|
||||
box-sizing: border-box;
|
||||
text-align: start;
|
||||
overflow: hidden;
|
||||
transition: transform var(--d-fast);
|
||||
mask: linear-gradient(-90deg, transparent, #000 8px, #000);
|
||||
margin-right: 2px !important;
|
||||
}
|
||||
}
|
||||
|
||||
& svg {
|
||||
margin: 0 var(--tabs-inner-gap) 0 calc(var(--tabs-inner-gap) + 2px);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,4 +1,4 @@
|
|||
@import url("sidebery.css");
|
||||
/*@import url("sidebery.css");*/
|
||||
/*************************************************************************************************************************************************************************************************************************************************************
|
||||
|
||||
"userContent.css" is a custom CSS file that can be used to specify CSS style rules for Firefox's intenal site using "chrome" privileges.
|
||||
|
|
@ -20,90 +20,248 @@ NOTE: You can use the userContent.css file without change preferences (about:con
|
|||
************************************************************************************************************************************************************************************************************************************************************/
|
||||
|
||||
@charset "UTF-8";
|
||||
|
||||
/* Please write your custom CSS under this line*/
|
||||
:root {
|
||||
/* --pogmom-background-color: rgba({{{bg-red}}},{{{bg-green}}},{{{bg-blue}}},{{{bg-alpha}}});*/
|
||||
/* */
|
||||
--pogmom-background-color: transparent;
|
||||
/* --darkreader-background-ffffff: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--color-main-background-blur: var(--pogmom-background-color) !important;*/
|
||||
/* html,body {
|
||||
[class*="header"],[class*="wrap"] {
|
||||
background-color: var(--pogmom-background-color) !important;*/
|
||||
/* --background-color: var(--pogmom-background-color) !important;
|
||||
--image-background: none;
|
||||
--darkreader-bg--bgColor-default: var(--pogmom-background-color) !important;
|
||||
--darkreader-neutral-background: var(--pogmom-background-color) !important;
|
||||
--in-content-page-background: #00000000 !important;
|
||||
--in-content-box-background: #00000088 !important;
|
||||
--darkreader-bg--theme-bg-home: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--theme-bg-home-custom: var(--pogmom-background-color) !important;
|
||||
--color-background-plain: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--bgColor-canvas-default: var(--pogmom-background-color) !important;
|
||||
--darkreader-background-ffffff: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--main-bg-color: var(--pogmom-background-color) !important;*/
|
||||
/*background-color: transparent !important;*/
|
||||
/* }*/
|
||||
/* --background-color: var(--pogmom-background-color) !important;
|
||||
--image-background: none;
|
||||
--darkreader-bg--bgColor-default: var(--pogmom-background-color) !important;
|
||||
--darkreader-neutral-background: var(--pogmom-background-color) !important;
|
||||
--in-content-page-background: #00000000 !important;
|
||||
--in-content-box-background: #00000088 !important;
|
||||
--darkreader-bg--theme-bg-home: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--theme-bg-home-custom: var(--pogmom-background-color) !important;
|
||||
--color-background-plain: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--bgColor-canvas-default: var(--pogmom-background-color) !important;
|
||||
--darkreader-background-ffffff: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--main-bg-color: var(--pogmom-background-color) !important;*/
|
||||
/* background-color: transparent !important;*/
|
||||
}
|
||||
}
|
||||
|
||||
@-moz-document domain(cloud.pogmom.me) {
|
||||
|
||||
/* html,
|
||||
body {
|
||||
--darkreader-background-ffffff: var(--pogmom-background-color) !important;
|
||||
background-color: var(--pogmom-background-color) !important;
|
||||
}*/
|
||||
/* html,
|
||||
body {
|
||||
--image-background: none;
|
||||
--darkreader-bg--theme-bg-home-custom: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--theme-bg-home: var(--pogmom-background-color) !important;
|
||||
--color-background-plain: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--bgColor-default: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--bgColor-canvas-default: var(--pogmom-background-color) !important;
|
||||
--darkreader-background-ffffff: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--main-bg-color: var(--pogmom-background-color) !important;
|
||||
}*/
|
||||
@-moz-document domain(cloud.pogmom.me) {
|
||||
html,
|
||||
body {
|
||||
background-image: none !important;
|
||||
--image-background: none;
|
||||
background-color: var(--pogmom-background-color) !important;
|
||||
}
|
||||
}
|
||||
@-moz-document domain(pogmom.me) {
|
||||
}
|
||||
|
||||
@-moz-document domain(pogmom.me) {
|
||||
|
||||
html,
|
||||
body {
|
||||
background-image: none !important;
|
||||
--image-background: none;
|
||||
background-color: var(--pogmom-background-color) !important;
|
||||
}
|
||||
}
|
||||
@-moz-document url-prefix("about"){
|
||||
}
|
||||
|
||||
@-moz-document url-prefix("about") {
|
||||
* {
|
||||
background-color: var(--pogmom-background-color) !important;
|
||||
}
|
||||
}
|
||||
@-moz-document domain(*.*) {
|
||||
}
|
||||
|
||||
@-moz-document domain(*.*) {
|
||||
|
||||
html,
|
||||
body {
|
||||
background-image: none !important;
|
||||
background-color: var(--pogmom-background-color) !important;
|
||||
|
||||
* {
|
||||
background: var(--pogmom-background-color) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* SPDX-License-Identifier: MPL-2.0 */
|
||||
/* SPDX-FileCopyrightText: 2024 awwpotato */
|
||||
@-moz-document regexp("^moz-extension://.*?/sidebar/sidebar.html") {
|
||||
|
||||
:root,
|
||||
.root,
|
||||
#root {
|
||||
--general-border-radius: var(--uc-button-radius) !important;
|
||||
--tabs-margin: 1.5px !important;
|
||||
--tabs-pinned-height: 30px !important;
|
||||
--tabs-pinned-width: 30px !important;
|
||||
--tabs-height: 30px !important;
|
||||
--nav-btn-width: 30px !important;
|
||||
--nav-btn-height: 28px !important;
|
||||
--active-el-bg: #746163a5 !important;
|
||||
--tabs-border-radius: 8px !important;
|
||||
|
||||
@media -moz-pref("browser.tabs.allow_transparent_browser") and (not (-moz-platform: windows)) {
|
||||
background-color: transparent !important;
|
||||
--frame-bg: transparent !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 40px) {
|
||||
.TabsPanel {
|
||||
--tabs-indent: 0px !important;
|
||||
}
|
||||
|
||||
.bookmarks-tree {
|
||||
--bookmarks-indent: 0px !important;
|
||||
}
|
||||
|
||||
.Tab:not([data-active="true"]) .close {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.NavigationBar .main-items .nav-item[data-index="-1"]:not([data-active="true"]),
|
||||
.NavigationBar:not(:has(.nav-item:not([data-index="-1"]))) .static-btns {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
@media (max-width: 66px) {
|
||||
.NavigationBar .static-btns {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.NavigationBar .main-items .nav-item[data-index="-1"] {
|
||||
opacity: 1 !important;
|
||||
z-index: 1 !important;
|
||||
transform: scale(1, 1) !important;
|
||||
}
|
||||
|
||||
.central-box {
|
||||
margin-top: var(--tabs-margin) !important;
|
||||
}
|
||||
|
||||
.TabsPanel .new-tab-btns {
|
||||
padding: 0 var(--tabs-margin) !important;
|
||||
}
|
||||
|
||||
#new-tab-btn {
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
.NavigationBar {
|
||||
border-radius: 6px !important;
|
||||
margin: 0.3px !important;
|
||||
}
|
||||
|
||||
#nav_bar {
|
||||
background-color: transparent !important;
|
||||
padding: var(--tabs-margin) !important;
|
||||
}
|
||||
|
||||
@media not -moz-pref("uc.tweak.sidebery.top-navbar") {
|
||||
.top-horizontal-box {
|
||||
order: 100 !important;
|
||||
margin-bottom: var(--tabs-margin) !important;
|
||||
}
|
||||
|
||||
.NavigationBar.-top .hidden-panels-popup {
|
||||
position: absolute !important;
|
||||
margin-top: -1000px !important;
|
||||
top: auto !important;
|
||||
bottom: 36px !important;
|
||||
}
|
||||
|
||||
.NavigationBar.-top .hidden-panels-popup-layer::before {
|
||||
display: none !important;
|
||||
background-color: transparent !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media -moz-pref("uc.tweak.sidebery.top-navbar") {
|
||||
.top-horizontal-box {
|
||||
margin-top: var(--tabs-margin) !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media -moz-pref("uc.tweak.sidebery.big-pinned") {
|
||||
.PinnedTabsBar {
|
||||
display: grid !important;
|
||||
grid-gap: calc(3 * var(--tabs-margin)) !important;
|
||||
grid-template-rows: 3rem;
|
||||
grid-auto-rows: 3rem;
|
||||
grid-template-columns: repeat(auto-fit, minmax(min(100%, 3rem), 1fr));
|
||||
}
|
||||
|
||||
.Tab[data-pin="true"] {
|
||||
width: 100% !important;
|
||||
height: 100% !important;
|
||||
|
||||
&:not([data-active="true"]) .body {
|
||||
background-color: color-mix(in oklab,
|
||||
var(--tabs-activated-bg) 25%,
|
||||
transparent) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* tab audio indicator */
|
||||
.Tab .audio {
|
||||
top: 2px !important;
|
||||
left: 2px !important;
|
||||
height: 12px !important;
|
||||
width: 12px !important;
|
||||
}
|
||||
|
||||
.Tab .child-count {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.Tab[data-audible="true"] .t-box .title,
|
||||
.Tab[data-muted="true"] .t-box .title,
|
||||
.Tab[data-paused="true"] .t-box .title {
|
||||
transform: translateX(0px) !important;
|
||||
}
|
||||
|
||||
/* replace new tab panel and new tab button with plus */
|
||||
.NavigationBar #add_tp.nav-item .icon,
|
||||
.new-tab-btn>svg {
|
||||
fill: transparent;
|
||||
background-color: transparent;
|
||||
mask: url("chrome://global/skin/icons/plus.svg") !important;
|
||||
}
|
||||
|
||||
.nav-item .audio,
|
||||
.nav-item .bookmarks-badge-icon {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
/* new tab button */
|
||||
.TabsPanel .new-tab-btns {
|
||||
height: calc(var(--tabs-height) + var(--tabs-margin)) !important;
|
||||
width: calc(100% - var(--tabs-margin) * 2) !important;
|
||||
padding: 0px !important;
|
||||
padding-bottom: var(--tabs-margin) !important;
|
||||
margin: 0 var(--tabs-margin);
|
||||
border-radius: var(--tabs-border-radius);
|
||||
|
||||
position: relative !important;
|
||||
overflow: clip !important;
|
||||
|
||||
& .new-tab-btn {
|
||||
width: 100% !important;
|
||||
height: 100% !important;
|
||||
|
||||
justify-content: flex-start !important;
|
||||
flex-wrap: nowrap !important;
|
||||
overflow: clip !important;
|
||||
min-width: unset !important;
|
||||
position: relative !important;
|
||||
|
||||
&::after {
|
||||
content: "New Tab";
|
||||
position: relative;
|
||||
margin-left: calc(var(--tabs-inner-gap) + var(--tabs-inner-gap) + 2px + 16px) !important;
|
||||
width: calc(100% - (var(--tabs-inner-gap) + var(--tabs-inner-gap) + 2px + 16px)) !important;
|
||||
|
||||
font: var(--tabs-font);
|
||||
color: var(--tabs-normal-fg);
|
||||
white-space: nowrap;
|
||||
display: block !important;
|
||||
box-sizing: border-box;
|
||||
text-align: start;
|
||||
overflow: hidden;
|
||||
transition: transform var(--d-fast);
|
||||
mask: linear-gradient(-90deg, transparent, #000 8px, #000);
|
||||
margin-right: 2px !important;
|
||||
}
|
||||
}
|
||||
|
||||
& svg {
|
||||
margin: 0 var(--tabs-inner-gap) 0 calc(var(--tabs-inner-gap) + 2px);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -19,13 +19,18 @@ Name=Penelope
|
|||
IsRelative=1
|
||||
Path=penelope
|
||||
Default=1
|
||||
StoreID=bf331188
|
||||
StoreID=a61d59be
|
||||
ShowSelector=0
|
||||
|
||||
[General]
|
||||
StartWithLastProfile=1
|
||||
Version=2
|
||||
|
||||
[Profile4]
|
||||
Name=testing
|
||||
IsRelative=1
|
||||
Path=4z689ygf.testing
|
||||
|
||||
[Install6C4726F70D182CF7]
|
||||
Default=penelope
|
||||
Locked=1
|
||||
|
|
@ -35,8 +40,3 @@ Name=School
|
|||
IsRelative=1
|
||||
Path=school
|
||||
|
||||
[Profile4]
|
||||
Name=testing
|
||||
IsRelative=1
|
||||
Path=4z689ygf.testing
|
||||
|
||||
|
|
|
|||
|
|
@ -1,201 +0,0 @@
|
|||
/* SPDX-License-Identifier: MPL-2.0 */
|
||||
/* SPDX-FileCopyrightText: 2024 awwpotato */
|
||||
@-moz-document regexp("^moz-extension://.*?/sidebar/sidebar.html")
|
||||
{
|
||||
:root,
|
||||
.root,
|
||||
#root {
|
||||
--general-border-radius: var(--uc-button-radius) !important;
|
||||
--tabs-margin: 1.5px !important;
|
||||
--tabs-pinned-height: 30px !important;
|
||||
--tabs-pinned-width: 30px !important;
|
||||
--tabs-height: 30px !important;
|
||||
--nav-btn-width: 30px !important;
|
||||
--nav-btn-height: 28px !important;
|
||||
--active-el-bg: #d8af5f33 !important;
|
||||
--tabs-border-radius: 8px !important;
|
||||
|
||||
@media -moz-pref( "browser.tabs.allow_transparent_browser") and (not (-moz-platform: windows)) {
|
||||
/* background-color: #d8af5f33 !important;*/
|
||||
background-color: transparent !important;
|
||||
--frame-bg: transparent !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 40px) {
|
||||
.TabsPanel {
|
||||
--tabs-indent: 0px !important;
|
||||
}
|
||||
.bookmarks-tree {
|
||||
--bookmarks-indent: 0px !important;
|
||||
}
|
||||
.Tab:not([data-active="true"]) .close {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.NavigationBar
|
||||
.main-items
|
||||
.nav-item[data-index="-1"]:not([data-active="true"]),
|
||||
.NavigationBar:not(:has(.nav-item:not([data-index="-1"]))) .static-btns {
|
||||
display: none !important;
|
||||
}
|
||||
@media (max-width: 66px) {
|
||||
.NavigationBar .static-btns {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.NavigationBar .main-items .nav-item[data-index="-1"] {
|
||||
opacity: 1 !important;
|
||||
z-index: 1 !important;
|
||||
transform: scale(1, 1) !important;
|
||||
}
|
||||
|
||||
.central-box {
|
||||
margin-top: var(--tabs-margin) !important;
|
||||
}
|
||||
|
||||
.TabsPanel .new-tab-btns {
|
||||
padding: 0 var(--tabs-margin) !important;
|
||||
}
|
||||
|
||||
#new-tab-btn {
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
.NavigationBar {
|
||||
border-radius: 6px !important;
|
||||
margin: 0.3px !important;
|
||||
}
|
||||
|
||||
#nav_bar {
|
||||
background-color: transparent !important;
|
||||
padding: var(--tabs-margin) !important;
|
||||
}
|
||||
|
||||
@media not -moz-pref( "uc.tweak.sidebery.top-navbar") {
|
||||
.top-horizontal-box {
|
||||
order: 100 !important;
|
||||
margin-bottom: var(--tabs-margin) !important;
|
||||
}
|
||||
|
||||
.NavigationBar.-top .hidden-panels-popup {
|
||||
position: absolute !important;
|
||||
margin-top: -1000px !important;
|
||||
top: auto !important;
|
||||
bottom: 36px !important;
|
||||
}
|
||||
.NavigationBar.-top .hidden-panels-popup-layer::before {
|
||||
display: none !important;
|
||||
background-color: transparent !important;
|
||||
}
|
||||
} @media -moz-pref( "uc.tweak.sidebery.top-navbar") {
|
||||
.top-horizontal-box {
|
||||
margin-top: var(--tabs-margin) !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media -moz-pref( "uc.tweak.sidebery.big-pinned") {
|
||||
.PinnedTabsBar {
|
||||
display: grid !important;
|
||||
grid-gap: calc(3 * var(--tabs-margin)) !important;
|
||||
grid-template-rows: 3rem;
|
||||
grid-auto-rows: 3rem;
|
||||
grid-template-columns: repeat(auto-fit, minmax(min(100%, 3rem), 1fr));
|
||||
}
|
||||
|
||||
.Tab[data-pin="true"] {
|
||||
width: 100% !important;
|
||||
height: 100% !important;
|
||||
&:not([data-active="true"]) .body {
|
||||
background-color: color-mix(
|
||||
in oklab,
|
||||
var(--tabs-activated-bg) 25%,
|
||||
transparent
|
||||
) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* tab audio indicator */
|
||||
.Tab .audio {
|
||||
top: 2px !important;
|
||||
left: 2px !important;
|
||||
height: 12px !important;
|
||||
width: 12px !important;
|
||||
}
|
||||
.Tab .child-count {
|
||||
display: none !important;
|
||||
}
|
||||
.Tab[data-audible="true"] .t-box .title,
|
||||
.Tab[data-muted="true"] .t-box .title,
|
||||
.Tab[data-paused="true"] .t-box .title {
|
||||
transform: translateX(0px) !important;
|
||||
}
|
||||
|
||||
/* replace new tab panel and new tab button with plus */
|
||||
.NavigationBar #add_tp.nav-item .icon,
|
||||
.new-tab-btn > svg {
|
||||
fill: transparent;
|
||||
/* background-color: var(--nav-btn-fg);*/
|
||||
background-color: transparent;
|
||||
mask: url("chrome://global/skin/icons/plus.svg") !important;
|
||||
}
|
||||
|
||||
.nav-item .audio,
|
||||
.nav-item .bookmarks-badge-icon {
|
||||
/* background-color: var(--frame-bg) !important;*/
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
/* new tab button */
|
||||
.TabsPanel .new-tab-btns {
|
||||
height: calc(var(--tabs-height) + var(--tabs-margin)) !important;
|
||||
width: calc(100% - var(--tabs-margin) * 2) !important;
|
||||
padding: 0px !important;
|
||||
padding-bottom: var(--tabs-margin) !important;
|
||||
margin: 0 var(--tabs-margin);
|
||||
border-radius: var(--tabs-border-radius);
|
||||
|
||||
position: relative !important;
|
||||
overflow: clip !important;
|
||||
|
||||
& .new-tab-btn {
|
||||
width: 100% !important;
|
||||
height: 100% !important;
|
||||
|
||||
justify-content: flex-start !important;
|
||||
flex-wrap: nowrap !important;
|
||||
overflow: clip !important;
|
||||
min-width: unset !important;
|
||||
position: relative !important;
|
||||
|
||||
&::after {
|
||||
content: "New Tab";
|
||||
position: relative;
|
||||
margin-left: calc(
|
||||
var(--tabs-inner-gap) + var(--tabs-inner-gap) + 2px + 16px
|
||||
) !important;
|
||||
width: calc(
|
||||
100% - (var(--tabs-inner-gap) + var(--tabs-inner-gap) + 2px + 16px)
|
||||
) !important;
|
||||
|
||||
font: var(--tabs-font);
|
||||
color: var(--tabs-normal-fg);
|
||||
white-space: nowrap;
|
||||
display: block !important;
|
||||
box-sizing: border-box;
|
||||
text-align: start;
|
||||
overflow: hidden;
|
||||
transition: transform var(--d-fast);
|
||||
mask: linear-gradient(-90deg, transparent, #000 8px, #000);
|
||||
margin-right: 2px !important;
|
||||
}
|
||||
}
|
||||
|
||||
& svg {
|
||||
margin: 0 var(--tabs-inner-gap) 0 calc(var(--tabs-inner-gap) + 2px);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,4 +1,4 @@
|
|||
@import url("sidebery.css");
|
||||
/*@import url("sidebery.css");*/
|
||||
/*************************************************************************************************************************************************************************************************************************************************************
|
||||
|
||||
"userContent.css" is a custom CSS file that can be used to specify CSS style rules for Firefox's intenal site using "chrome" privileges.
|
||||
|
|
@ -20,90 +20,248 @@ NOTE: You can use the userContent.css file without change preferences (about:con
|
|||
************************************************************************************************************************************************************************************************************************************************************/
|
||||
|
||||
@charset "UTF-8";
|
||||
|
||||
/* Please write your custom CSS under this line*/
|
||||
:root {
|
||||
/* --pogmom-background-color: rgba({{{bg-red}}},{{{bg-green}}},{{{bg-blue}}},{{{bg-alpha}}});*/
|
||||
/* */
|
||||
--pogmom-background-color: transparent;
|
||||
/* --darkreader-background-ffffff: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--color-main-background-blur: var(--pogmom-background-color) !important;*/
|
||||
/* html,body {
|
||||
[class*="header"],[class*="wrap"] {
|
||||
background-color: var(--pogmom-background-color) !important;*/
|
||||
/* --background-color: var(--pogmom-background-color) !important;
|
||||
--image-background: none;
|
||||
--darkreader-bg--bgColor-default: var(--pogmom-background-color) !important;
|
||||
--darkreader-neutral-background: var(--pogmom-background-color) !important;
|
||||
--in-content-page-background: #00000000 !important;
|
||||
--in-content-box-background: #00000088 !important;
|
||||
--darkreader-bg--theme-bg-home: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--theme-bg-home-custom: var(--pogmom-background-color) !important;
|
||||
--color-background-plain: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--bgColor-canvas-default: var(--pogmom-background-color) !important;
|
||||
--darkreader-background-ffffff: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--main-bg-color: var(--pogmom-background-color) !important;*/
|
||||
/*background-color: transparent !important;*/
|
||||
/* }*/
|
||||
/* --background-color: var(--pogmom-background-color) !important;
|
||||
--image-background: none;
|
||||
--darkreader-bg--bgColor-default: var(--pogmom-background-color) !important;
|
||||
--darkreader-neutral-background: var(--pogmom-background-color) !important;
|
||||
--in-content-page-background: #00000000 !important;
|
||||
--in-content-box-background: #00000088 !important;
|
||||
--darkreader-bg--theme-bg-home: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--theme-bg-home-custom: var(--pogmom-background-color) !important;
|
||||
--color-background-plain: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--bgColor-canvas-default: var(--pogmom-background-color) !important;
|
||||
--darkreader-background-ffffff: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--main-bg-color: var(--pogmom-background-color) !important;*/
|
||||
/* background-color: transparent !important;*/
|
||||
}
|
||||
}
|
||||
|
||||
@-moz-document domain(cloud.pogmom.me) {
|
||||
|
||||
/* html,
|
||||
body {
|
||||
--darkreader-background-ffffff: var(--pogmom-background-color) !important;
|
||||
background-color: var(--pogmom-background-color) !important;
|
||||
}*/
|
||||
/* html,
|
||||
body {
|
||||
--image-background: none;
|
||||
--darkreader-bg--theme-bg-home-custom: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--theme-bg-home: var(--pogmom-background-color) !important;
|
||||
--color-background-plain: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--bgColor-default: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--bgColor-canvas-default: var(--pogmom-background-color) !important;
|
||||
--darkreader-background-ffffff: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--main-bg-color: var(--pogmom-background-color) !important;
|
||||
}*/
|
||||
@-moz-document domain(cloud.pogmom.me) {
|
||||
html,
|
||||
body {
|
||||
background-image: none !important;
|
||||
--image-background: none;
|
||||
background-color: var(--pogmom-background-color) !important;
|
||||
}
|
||||
}
|
||||
@-moz-document domain(pogmom.me) {
|
||||
}
|
||||
|
||||
@-moz-document domain(pogmom.me) {
|
||||
|
||||
html,
|
||||
body {
|
||||
background-image: none !important;
|
||||
--image-background: none;
|
||||
background-color: var(--pogmom-background-color) !important;
|
||||
}
|
||||
}
|
||||
@-moz-document url-prefix("about"){
|
||||
}
|
||||
|
||||
@-moz-document url-prefix("about") {
|
||||
* {
|
||||
background-color: var(--pogmom-background-color) !important;
|
||||
}
|
||||
}
|
||||
@-moz-document domain(*.*) {
|
||||
}
|
||||
|
||||
@-moz-document domain(*.*) {
|
||||
|
||||
html,
|
||||
body {
|
||||
background-image: none !important;
|
||||
background-color: var(--pogmom-background-color) !important;
|
||||
|
||||
* {
|
||||
background: var(--pogmom-background-color) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* SPDX-License-Identifier: MPL-2.0 */
|
||||
/* SPDX-FileCopyrightText: 2024 awwpotato */
|
||||
@-moz-document regexp("^moz-extension://.*?/sidebar/sidebar.html") {
|
||||
|
||||
:root,
|
||||
.root,
|
||||
#root {
|
||||
--general-border-radius: var(--uc-button-radius) !important;
|
||||
--tabs-margin: 1.5px !important;
|
||||
--tabs-pinned-height: 30px !important;
|
||||
--tabs-pinned-width: 30px !important;
|
||||
--tabs-height: 30px !important;
|
||||
--nav-btn-width: 30px !important;
|
||||
--nav-btn-height: 28px !important;
|
||||
--active-el-bg: #d8af5f33 !important;
|
||||
--tabs-border-radius: 8px !important;
|
||||
|
||||
@media -moz-pref("browser.tabs.allow_transparent_browser") and (not (-moz-platform: windows)) {
|
||||
background-color: transparent !important;
|
||||
--frame-bg: transparent !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 40px) {
|
||||
.TabsPanel {
|
||||
--tabs-indent: 0px !important;
|
||||
}
|
||||
|
||||
.bookmarks-tree {
|
||||
--bookmarks-indent: 0px !important;
|
||||
}
|
||||
|
||||
.Tab:not([data-active="true"]) .close {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.NavigationBar .main-items .nav-item[data-index="-1"]:not([data-active="true"]),
|
||||
.NavigationBar:not(:has(.nav-item:not([data-index="-1"]))) .static-btns {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
@media (max-width: 66px) {
|
||||
.NavigationBar .static-btns {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.NavigationBar .main-items .nav-item[data-index="-1"] {
|
||||
opacity: 1 !important;
|
||||
z-index: 1 !important;
|
||||
transform: scale(1, 1) !important;
|
||||
}
|
||||
|
||||
.central-box {
|
||||
margin-top: var(--tabs-margin) !important;
|
||||
}
|
||||
|
||||
.TabsPanel .new-tab-btns {
|
||||
padding: 0 var(--tabs-margin) !important;
|
||||
}
|
||||
|
||||
#new-tab-btn {
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
.NavigationBar {
|
||||
border-radius: 6px !important;
|
||||
margin: 0.3px !important;
|
||||
}
|
||||
|
||||
#nav_bar {
|
||||
background-color: transparent !important;
|
||||
padding: var(--tabs-margin) !important;
|
||||
}
|
||||
|
||||
@media not -moz-pref("uc.tweak.sidebery.top-navbar") {
|
||||
.top-horizontal-box {
|
||||
order: 100 !important;
|
||||
margin-bottom: var(--tabs-margin) !important;
|
||||
}
|
||||
|
||||
.NavigationBar.-top .hidden-panels-popup {
|
||||
position: absolute !important;
|
||||
margin-top: -1000px !important;
|
||||
top: auto !important;
|
||||
bottom: 36px !important;
|
||||
}
|
||||
|
||||
.NavigationBar.-top .hidden-panels-popup-layer::before {
|
||||
display: none !important;
|
||||
background-color: transparent !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media -moz-pref("uc.tweak.sidebery.top-navbar") {
|
||||
.top-horizontal-box {
|
||||
margin-top: var(--tabs-margin) !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media -moz-pref("uc.tweak.sidebery.big-pinned") {
|
||||
.PinnedTabsBar {
|
||||
display: grid !important;
|
||||
grid-gap: calc(3 * var(--tabs-margin)) !important;
|
||||
grid-template-rows: 3rem;
|
||||
grid-auto-rows: 3rem;
|
||||
grid-template-columns: repeat(auto-fit, minmax(min(100%, 3rem), 1fr));
|
||||
}
|
||||
|
||||
.Tab[data-pin="true"] {
|
||||
width: 100% !important;
|
||||
height: 100% !important;
|
||||
|
||||
&:not([data-active="true"]) .body {
|
||||
background-color: color-mix(in oklab,
|
||||
var(--tabs-activated-bg) 25%,
|
||||
transparent) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* tab audio indicator */
|
||||
.Tab .audio {
|
||||
top: 2px !important;
|
||||
left: 2px !important;
|
||||
height: 12px !important;
|
||||
width: 12px !important;
|
||||
}
|
||||
|
||||
.Tab .child-count {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.Tab[data-audible="true"] .t-box .title,
|
||||
.Tab[data-muted="true"] .t-box .title,
|
||||
.Tab[data-paused="true"] .t-box .title {
|
||||
transform: translateX(0px) !important;
|
||||
}
|
||||
|
||||
/* replace new tab panel and new tab button with plus */
|
||||
.NavigationBar #add_tp.nav-item .icon,
|
||||
.new-tab-btn>svg {
|
||||
fill: transparent;
|
||||
background-color: transparent;
|
||||
mask: url("chrome://global/skin/icons/plus.svg") !important;
|
||||
}
|
||||
|
||||
.nav-item .audio,
|
||||
.nav-item .bookmarks-badge-icon {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
/* new tab button */
|
||||
.TabsPanel .new-tab-btns {
|
||||
height: calc(var(--tabs-height) + var(--tabs-margin)) !important;
|
||||
width: calc(100% - var(--tabs-margin) * 2) !important;
|
||||
padding: 0px !important;
|
||||
padding-bottom: var(--tabs-margin) !important;
|
||||
margin: 0 var(--tabs-margin);
|
||||
border-radius: var(--tabs-border-radius);
|
||||
|
||||
position: relative !important;
|
||||
overflow: clip !important;
|
||||
|
||||
& .new-tab-btn {
|
||||
width: 100% !important;
|
||||
height: 100% !important;
|
||||
|
||||
justify-content: flex-start !important;
|
||||
flex-wrap: nowrap !important;
|
||||
overflow: clip !important;
|
||||
min-width: unset !important;
|
||||
position: relative !important;
|
||||
|
||||
&::after {
|
||||
content: "New Tab";
|
||||
position: relative;
|
||||
margin-left: calc(var(--tabs-inner-gap) + var(--tabs-inner-gap) + 2px + 16px) !important;
|
||||
width: calc(100% - (var(--tabs-inner-gap) + var(--tabs-inner-gap) + 2px + 16px)) !important;
|
||||
|
||||
font: var(--tabs-font);
|
||||
color: var(--tabs-normal-fg);
|
||||
white-space: nowrap;
|
||||
display: block !important;
|
||||
box-sizing: border-box;
|
||||
text-align: start;
|
||||
overflow: hidden;
|
||||
transition: transform var(--d-fast);
|
||||
mask: linear-gradient(-90deg, transparent, #000 8px, #000);
|
||||
margin-right: 2px !important;
|
||||
}
|
||||
}
|
||||
|
||||
& svg {
|
||||
margin: 0 var(--tabs-inner-gap) 0 calc(var(--tabs-inner-gap) + 2px);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,201 +0,0 @@
|
|||
/* SPDX-License-Identifier: MPL-2.0 */
|
||||
/* SPDX-FileCopyrightText: 2024 awwpotato */
|
||||
@-moz-document regexp("^moz-extension://.*?/sidebar/sidebar.html")
|
||||
{
|
||||
:root,
|
||||
.root,
|
||||
#root {
|
||||
--general-border-radius: var(--uc-button-radius) !important;
|
||||
--tabs-margin: 1.5px !important;
|
||||
--tabs-pinned-height: 30px !important;
|
||||
--tabs-pinned-width: 30px !important;
|
||||
--tabs-height: 30px !important;
|
||||
--nav-btn-width: 30px !important;
|
||||
--nav-btn-height: 28px !important;
|
||||
--active-el-bg: #4a5f768c !important;
|
||||
--tabs-border-radius: 8px !important;
|
||||
|
||||
@media -moz-pref( "browser.tabs.allow_transparent_browser") and (not (-moz-platform: windows)) {
|
||||
/* background-color: #4a5f768c !important;*/
|
||||
background-color: transparent !important;
|
||||
--frame-bg: transparent !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 40px) {
|
||||
.TabsPanel {
|
||||
--tabs-indent: 0px !important;
|
||||
}
|
||||
.bookmarks-tree {
|
||||
--bookmarks-indent: 0px !important;
|
||||
}
|
||||
.Tab:not([data-active="true"]) .close {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.NavigationBar
|
||||
.main-items
|
||||
.nav-item[data-index="-1"]:not([data-active="true"]),
|
||||
.NavigationBar:not(:has(.nav-item:not([data-index="-1"]))) .static-btns {
|
||||
display: none !important;
|
||||
}
|
||||
@media (max-width: 66px) {
|
||||
.NavigationBar .static-btns {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.NavigationBar .main-items .nav-item[data-index="-1"] {
|
||||
opacity: 1 !important;
|
||||
z-index: 1 !important;
|
||||
transform: scale(1, 1) !important;
|
||||
}
|
||||
|
||||
.central-box {
|
||||
margin-top: var(--tabs-margin) !important;
|
||||
}
|
||||
|
||||
.TabsPanel .new-tab-btns {
|
||||
padding: 0 var(--tabs-margin) !important;
|
||||
}
|
||||
|
||||
#new-tab-btn {
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
.NavigationBar {
|
||||
border-radius: 6px !important;
|
||||
margin: 0.3px !important;
|
||||
}
|
||||
|
||||
#nav_bar {
|
||||
background-color: transparent !important;
|
||||
padding: var(--tabs-margin) !important;
|
||||
}
|
||||
|
||||
@media not -moz-pref( "uc.tweak.sidebery.top-navbar") {
|
||||
.top-horizontal-box {
|
||||
order: 100 !important;
|
||||
margin-bottom: var(--tabs-margin) !important;
|
||||
}
|
||||
|
||||
.NavigationBar.-top .hidden-panels-popup {
|
||||
position: absolute !important;
|
||||
margin-top: -1000px !important;
|
||||
top: auto !important;
|
||||
bottom: 36px !important;
|
||||
}
|
||||
.NavigationBar.-top .hidden-panels-popup-layer::before {
|
||||
display: none !important;
|
||||
background-color: transparent !important;
|
||||
}
|
||||
} @media -moz-pref( "uc.tweak.sidebery.top-navbar") {
|
||||
.top-horizontal-box {
|
||||
margin-top: var(--tabs-margin) !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media -moz-pref( "uc.tweak.sidebery.big-pinned") {
|
||||
.PinnedTabsBar {
|
||||
display: grid !important;
|
||||
grid-gap: calc(3 * var(--tabs-margin)) !important;
|
||||
grid-template-rows: 3rem;
|
||||
grid-auto-rows: 3rem;
|
||||
grid-template-columns: repeat(auto-fit, minmax(min(100%, 3rem), 1fr));
|
||||
}
|
||||
|
||||
.Tab[data-pin="true"] {
|
||||
width: 100% !important;
|
||||
height: 100% !important;
|
||||
&:not([data-active="true"]) .body {
|
||||
background-color: color-mix(
|
||||
in oklab,
|
||||
var(--tabs-activated-bg) 25%,
|
||||
transparent
|
||||
) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* tab audio indicator */
|
||||
.Tab .audio {
|
||||
top: 2px !important;
|
||||
left: 2px !important;
|
||||
height: 12px !important;
|
||||
width: 12px !important;
|
||||
}
|
||||
.Tab .child-count {
|
||||
display: none !important;
|
||||
}
|
||||
.Tab[data-audible="true"] .t-box .title,
|
||||
.Tab[data-muted="true"] .t-box .title,
|
||||
.Tab[data-paused="true"] .t-box .title {
|
||||
transform: translateX(0px) !important;
|
||||
}
|
||||
|
||||
/* replace new tab panel and new tab button with plus */
|
||||
.NavigationBar #add_tp.nav-item .icon,
|
||||
.new-tab-btn > svg {
|
||||
fill: transparent;
|
||||
/* background-color: var(--nav-btn-fg);*/
|
||||
background-color: transparent;
|
||||
mask: url("chrome://global/skin/icons/plus.svg") !important;
|
||||
}
|
||||
|
||||
.nav-item .audio,
|
||||
.nav-item .bookmarks-badge-icon {
|
||||
/* background-color: var(--frame-bg) !important;*/
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
/* new tab button */
|
||||
.TabsPanel .new-tab-btns {
|
||||
height: calc(var(--tabs-height) + var(--tabs-margin)) !important;
|
||||
width: calc(100% - var(--tabs-margin) * 2) !important;
|
||||
padding: 0px !important;
|
||||
padding-bottom: var(--tabs-margin) !important;
|
||||
margin: 0 var(--tabs-margin);
|
||||
border-radius: var(--tabs-border-radius);
|
||||
|
||||
position: relative !important;
|
||||
overflow: clip !important;
|
||||
|
||||
& .new-tab-btn {
|
||||
width: 100% !important;
|
||||
height: 100% !important;
|
||||
|
||||
justify-content: flex-start !important;
|
||||
flex-wrap: nowrap !important;
|
||||
overflow: clip !important;
|
||||
min-width: unset !important;
|
||||
position: relative !important;
|
||||
|
||||
&::after {
|
||||
content: "New Tab";
|
||||
position: relative;
|
||||
margin-left: calc(
|
||||
var(--tabs-inner-gap) + var(--tabs-inner-gap) + 2px + 16px
|
||||
) !important;
|
||||
width: calc(
|
||||
100% - (var(--tabs-inner-gap) + var(--tabs-inner-gap) + 2px + 16px)
|
||||
) !important;
|
||||
|
||||
font: var(--tabs-font);
|
||||
color: var(--tabs-normal-fg);
|
||||
white-space: nowrap;
|
||||
display: block !important;
|
||||
box-sizing: border-box;
|
||||
text-align: start;
|
||||
overflow: hidden;
|
||||
transition: transform var(--d-fast);
|
||||
mask: linear-gradient(-90deg, transparent, #000 8px, #000);
|
||||
margin-right: 2px !important;
|
||||
}
|
||||
}
|
||||
|
||||
& svg {
|
||||
margin: 0 var(--tabs-inner-gap) 0 calc(var(--tabs-inner-gap) + 2px);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,4 +1,4 @@
|
|||
@import url("sidebery.css");
|
||||
/*@import url("sidebery.css");*/
|
||||
/*************************************************************************************************************************************************************************************************************************************************************
|
||||
|
||||
"userContent.css" is a custom CSS file that can be used to specify CSS style rules for Firefox's intenal site using "chrome" privileges.
|
||||
|
|
@ -20,90 +20,248 @@ NOTE: You can use the userContent.css file without change preferences (about:con
|
|||
************************************************************************************************************************************************************************************************************************************************************/
|
||||
|
||||
@charset "UTF-8";
|
||||
|
||||
/* Please write your custom CSS under this line*/
|
||||
:root {
|
||||
/* --pogmom-background-color: rgba({{{bg-red}}},{{{bg-green}}},{{{bg-blue}}},{{{bg-alpha}}});*/
|
||||
/* */
|
||||
--pogmom-background-color: transparent;
|
||||
/* --darkreader-background-ffffff: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--color-main-background-blur: var(--pogmom-background-color) !important;*/
|
||||
/* html,body {
|
||||
[class*="header"],[class*="wrap"] {
|
||||
background-color: var(--pogmom-background-color) !important;*/
|
||||
/* --background-color: var(--pogmom-background-color) !important;
|
||||
--image-background: none;
|
||||
--darkreader-bg--bgColor-default: var(--pogmom-background-color) !important;
|
||||
--darkreader-neutral-background: var(--pogmom-background-color) !important;
|
||||
--in-content-page-background: #00000000 !important;
|
||||
--in-content-box-background: #00000088 !important;
|
||||
--darkreader-bg--theme-bg-home: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--theme-bg-home-custom: var(--pogmom-background-color) !important;
|
||||
--color-background-plain: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--bgColor-canvas-default: var(--pogmom-background-color) !important;
|
||||
--darkreader-background-ffffff: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--main-bg-color: var(--pogmom-background-color) !important;*/
|
||||
/*background-color: transparent !important;*/
|
||||
/* }*/
|
||||
/* --background-color: var(--pogmom-background-color) !important;
|
||||
--image-background: none;
|
||||
--darkreader-bg--bgColor-default: var(--pogmom-background-color) !important;
|
||||
--darkreader-neutral-background: var(--pogmom-background-color) !important;
|
||||
--in-content-page-background: #00000000 !important;
|
||||
--in-content-box-background: #00000088 !important;
|
||||
--darkreader-bg--theme-bg-home: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--theme-bg-home-custom: var(--pogmom-background-color) !important;
|
||||
--color-background-plain: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--bgColor-canvas-default: var(--pogmom-background-color) !important;
|
||||
--darkreader-background-ffffff: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--main-bg-color: var(--pogmom-background-color) !important;*/
|
||||
/* background-color: transparent !important;*/
|
||||
}
|
||||
}
|
||||
|
||||
@-moz-document domain(cloud.pogmom.me) {
|
||||
|
||||
/* html,
|
||||
body {
|
||||
--darkreader-background-ffffff: var(--pogmom-background-color) !important;
|
||||
background-color: var(--pogmom-background-color) !important;
|
||||
}*/
|
||||
/* html,
|
||||
body {
|
||||
--image-background: none;
|
||||
--darkreader-bg--theme-bg-home-custom: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--theme-bg-home: var(--pogmom-background-color) !important;
|
||||
--color-background-plain: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--bgColor-default: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--bgColor-canvas-default: var(--pogmom-background-color) !important;
|
||||
--darkreader-background-ffffff: var(--pogmom-background-color) !important;
|
||||
--darkreader-bg--main-bg-color: var(--pogmom-background-color) !important;
|
||||
}*/
|
||||
@-moz-document domain(cloud.pogmom.me) {
|
||||
html,
|
||||
body {
|
||||
background-image: none !important;
|
||||
--image-background: none;
|
||||
background-color: var(--pogmom-background-color) !important;
|
||||
}
|
||||
}
|
||||
@-moz-document domain(pogmom.me) {
|
||||
}
|
||||
|
||||
@-moz-document domain(pogmom.me) {
|
||||
|
||||
html,
|
||||
body {
|
||||
background-image: none !important;
|
||||
--image-background: none;
|
||||
background-color: var(--pogmom-background-color) !important;
|
||||
}
|
||||
}
|
||||
@-moz-document url-prefix("about"){
|
||||
}
|
||||
|
||||
@-moz-document url-prefix("about") {
|
||||
* {
|
||||
background-color: var(--pogmom-background-color) !important;
|
||||
}
|
||||
}
|
||||
@-moz-document domain(*.*) {
|
||||
}
|
||||
|
||||
@-moz-document domain(*.*) {
|
||||
|
||||
html,
|
||||
body {
|
||||
background-image: none !important;
|
||||
background-color: var(--pogmom-background-color) !important;
|
||||
|
||||
* {
|
||||
background: var(--pogmom-background-color) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* SPDX-License-Identifier: MPL-2.0 */
|
||||
/* SPDX-FileCopyrightText: 2024 awwpotato */
|
||||
@-moz-document regexp("^moz-extension://.*?/sidebar/sidebar.html") {
|
||||
|
||||
:root,
|
||||
.root,
|
||||
#root {
|
||||
--general-border-radius: var(--uc-button-radius) !important;
|
||||
--tabs-margin: 1.5px !important;
|
||||
--tabs-pinned-height: 30px !important;
|
||||
--tabs-pinned-width: 30px !important;
|
||||
--tabs-height: 30px !important;
|
||||
--nav-btn-width: 30px !important;
|
||||
--nav-btn-height: 28px !important;
|
||||
--active-el-bg: #4a5f768c !important;
|
||||
--tabs-border-radius: 8px !important;
|
||||
|
||||
@media -moz-pref("browser.tabs.allow_transparent_browser") and (not (-moz-platform: windows)) {
|
||||
background-color: transparent !important;
|
||||
--frame-bg: transparent !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 40px) {
|
||||
.TabsPanel {
|
||||
--tabs-indent: 0px !important;
|
||||
}
|
||||
|
||||
.bookmarks-tree {
|
||||
--bookmarks-indent: 0px !important;
|
||||
}
|
||||
|
||||
.Tab:not([data-active="true"]) .close {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.NavigationBar .main-items .nav-item[data-index="-1"]:not([data-active="true"]),
|
||||
.NavigationBar:not(:has(.nav-item:not([data-index="-1"]))) .static-btns {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
@media (max-width: 66px) {
|
||||
.NavigationBar .static-btns {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.NavigationBar .main-items .nav-item[data-index="-1"] {
|
||||
opacity: 1 !important;
|
||||
z-index: 1 !important;
|
||||
transform: scale(1, 1) !important;
|
||||
}
|
||||
|
||||
.central-box {
|
||||
margin-top: var(--tabs-margin) !important;
|
||||
}
|
||||
|
||||
.TabsPanel .new-tab-btns {
|
||||
padding: 0 var(--tabs-margin) !important;
|
||||
}
|
||||
|
||||
#new-tab-btn {
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
.NavigationBar {
|
||||
border-radius: 6px !important;
|
||||
margin: 0.3px !important;
|
||||
}
|
||||
|
||||
#nav_bar {
|
||||
background-color: transparent !important;
|
||||
padding: var(--tabs-margin) !important;
|
||||
}
|
||||
|
||||
@media not -moz-pref("uc.tweak.sidebery.top-navbar") {
|
||||
.top-horizontal-box {
|
||||
order: 100 !important;
|
||||
margin-bottom: var(--tabs-margin) !important;
|
||||
}
|
||||
|
||||
.NavigationBar.-top .hidden-panels-popup {
|
||||
position: absolute !important;
|
||||
margin-top: -1000px !important;
|
||||
top: auto !important;
|
||||
bottom: 36px !important;
|
||||
}
|
||||
|
||||
.NavigationBar.-top .hidden-panels-popup-layer::before {
|
||||
display: none !important;
|
||||
background-color: transparent !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media -moz-pref("uc.tweak.sidebery.top-navbar") {
|
||||
.top-horizontal-box {
|
||||
margin-top: var(--tabs-margin) !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media -moz-pref("uc.tweak.sidebery.big-pinned") {
|
||||
.PinnedTabsBar {
|
||||
display: grid !important;
|
||||
grid-gap: calc(3 * var(--tabs-margin)) !important;
|
||||
grid-template-rows: 3rem;
|
||||
grid-auto-rows: 3rem;
|
||||
grid-template-columns: repeat(auto-fit, minmax(min(100%, 3rem), 1fr));
|
||||
}
|
||||
|
||||
.Tab[data-pin="true"] {
|
||||
width: 100% !important;
|
||||
height: 100% !important;
|
||||
|
||||
&:not([data-active="true"]) .body {
|
||||
background-color: color-mix(in oklab,
|
||||
var(--tabs-activated-bg) 25%,
|
||||
transparent) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* tab audio indicator */
|
||||
.Tab .audio {
|
||||
top: 2px !important;
|
||||
left: 2px !important;
|
||||
height: 12px !important;
|
||||
width: 12px !important;
|
||||
}
|
||||
|
||||
.Tab .child-count {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.Tab[data-audible="true"] .t-box .title,
|
||||
.Tab[data-muted="true"] .t-box .title,
|
||||
.Tab[data-paused="true"] .t-box .title {
|
||||
transform: translateX(0px) !important;
|
||||
}
|
||||
|
||||
/* replace new tab panel and new tab button with plus */
|
||||
.NavigationBar #add_tp.nav-item .icon,
|
||||
.new-tab-btn>svg {
|
||||
fill: transparent;
|
||||
background-color: transparent;
|
||||
mask: url("chrome://global/skin/icons/plus.svg") !important;
|
||||
}
|
||||
|
||||
.nav-item .audio,
|
||||
.nav-item .bookmarks-badge-icon {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
/* new tab button */
|
||||
.TabsPanel .new-tab-btns {
|
||||
height: calc(var(--tabs-height) + var(--tabs-margin)) !important;
|
||||
width: calc(100% - var(--tabs-margin) * 2) !important;
|
||||
padding: 0px !important;
|
||||
padding-bottom: var(--tabs-margin) !important;
|
||||
margin: 0 var(--tabs-margin);
|
||||
border-radius: var(--tabs-border-radius);
|
||||
|
||||
position: relative !important;
|
||||
overflow: clip !important;
|
||||
|
||||
& .new-tab-btn {
|
||||
width: 100% !important;
|
||||
height: 100% !important;
|
||||
|
||||
justify-content: flex-start !important;
|
||||
flex-wrap: nowrap !important;
|
||||
overflow: clip !important;
|
||||
min-width: unset !important;
|
||||
position: relative !important;
|
||||
|
||||
&::after {
|
||||
content: "New Tab";
|
||||
position: relative;
|
||||
margin-left: calc(var(--tabs-inner-gap) + var(--tabs-inner-gap) + 2px + 16px) !important;
|
||||
width: calc(100% - (var(--tabs-inner-gap) + var(--tabs-inner-gap) + 2px + 16px)) !important;
|
||||
|
||||
font: var(--tabs-font);
|
||||
color: var(--tabs-normal-fg);
|
||||
white-space: nowrap;
|
||||
display: block !important;
|
||||
box-sizing: border-box;
|
||||
text-align: start;
|
||||
overflow: hidden;
|
||||
transition: transform var(--d-fast);
|
||||
mask: linear-gradient(-90deg, transparent, #000 8px, #000);
|
||||
margin-right: 2px !important;
|
||||
}
|
||||
}
|
||||
|
||||
& svg {
|
||||
margin: 0 var(--tabs-inner-gap) 0 calc(var(--tabs-inner-gap) + 2px);
|
||||
}
|
||||
}
|
||||
}
|
||||
Loading…
Add table
Reference in a new issue