gah I forgot to stage all my new files
This commit is contained in:
Chris Cochrun
parent
bd5a4b0c0e
commit
9f4c905c03
319 changed files with 12157 additions and 14 deletions
455
.config/firefox/chrome/ShyFox/shy-sidebar.css
Normal file
455
.config/firefox/chrome/ShyFox/shy-sidebar.css
Normal file
|
|
@ -0,0 +1,455 @@
|
|||
/*== ShyFox Sidebar =================================================================================================================================
|
||||
|
||||
Styles for sidebar
|
||||
|
||||
|
||||
--- JUST IMPORTANT THINGS ---------------------------------------------------------------------------------------------------------------------------
|
||||
|
||||
*/
|
||||
|
||||
/* reserve space for bookmarks toolbar */
|
||||
:root{
|
||||
--little-gap: calc(var(--margin) / 1.5);
|
||||
--bookmarks-hgt: var(--toolbar-item-hgt);
|
||||
}
|
||||
|
||||
/* remove space reserved for bookmarks toolbar if it hidden */
|
||||
#main-window:has(#PersonalToolbar[collapsed="true"]) {
|
||||
--little-gap: 0px;
|
||||
--bookmarks-hgt: 0px;
|
||||
}
|
||||
|
||||
/* if sidebar is not hidden or clean mode not enabled, this window is not floating popup and not in fullscreen video */
|
||||
#main-window:not(:is([titlepreface*=""], [titlepreface*=""]))[chromehidden=""]:not([inDOMFullscreen="true"]){
|
||||
/* set left margin to sidebar width */
|
||||
--left-margin: var(--sdbr-wdt) !important;
|
||||
}
|
||||
|
||||
/* hide sidebar splitter */
|
||||
#sidebar-splitter {display: none}
|
||||
|
||||
/*
|
||||
|
||||
--- SIDEBAR SHOWN -----------------------------------------------------------------------------------------------------------------------------------
|
||||
|
||||
*/
|
||||
|
||||
/* styles for both sidebar and bookmarks toolbar */
|
||||
#sidebar-box,
|
||||
#PersonalToolbar
|
||||
{
|
||||
position: fixed;
|
||||
overflow: visible;
|
||||
z-index: 2 !important;
|
||||
|
||||
min-width: 0px !important;
|
||||
max-width: 100vw !important;
|
||||
|
||||
left: 0px;
|
||||
|
||||
transition: var(--transition) !important;
|
||||
background-color: transparent !important;
|
||||
|
||||
padding-top: 0 !important;
|
||||
|
||||
& > * {
|
||||
opacity: var(--dyn-opct);
|
||||
transition: var(--transition) !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* styles for sidebar */
|
||||
#sidebar-box{
|
||||
|
||||
top: calc(
|
||||
var(--margin) / 2
|
||||
+ var(--bookmarks-hgt)
|
||||
);
|
||||
|
||||
height: calc(
|
||||
100vh
|
||||
- var(--margin) * 2
|
||||
+ var(--margin) / 2
|
||||
- var(--bookmarks-hgt)
|
||||
)!important;
|
||||
|
||||
width: var(--sdbr-wdt) !important;
|
||||
}
|
||||
|
||||
/* drag window by empty space in bookmarks toolbar */
|
||||
#PersonalToolbar > *, #PlacesToolbarItems .bookmark-item[style="visibility: hidden;"]{
|
||||
-moz-window-dragging: drag !important;
|
||||
background-color: var(--debug-col-2) !important;
|
||||
}
|
||||
|
||||
/* styles for bookmarks toolbar */
|
||||
#PersonalToolbar{
|
||||
visibility: visible !important;
|
||||
height: var(--toolbar-item-hgt) !important;
|
||||
top: 0px;
|
||||
border-radius: var(--rounding);
|
||||
margin-left: var(--buttonbox-left-wdt);
|
||||
|
||||
width: calc(
|
||||
var(--sdbr-wdt)
|
||||
- var(--buttonbox-left-wdt)
|
||||
) !important;
|
||||
|
||||
padding-top: 2px !important;
|
||||
padding-bottom: 2px !important;
|
||||
|
||||
&[collapsed="true"] {display: none}
|
||||
}
|
||||
|
||||
/* padding for screenshot control buttons */
|
||||
#main-window:not([titlepreface*=""]):has(#screenshotsPagePanel:not([hidden])){
|
||||
#sidebar-box{
|
||||
padding-bottom: calc(
|
||||
var(--screenshot-tool-hgt)
|
||||
- var(--margin)
|
||||
+ var(--bottom-margin)
|
||||
) !important;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
|
||||
--- SIDEBAR HIDDEN ----------------------------------------------------------------------------------------------------------------------------------
|
||||
|
||||
*/
|
||||
|
||||
/* activate style when sidebar hidden or clean mode enabled (and not in customizing page) */
|
||||
#main-window:is([titlepreface*=""], [titlepreface*=""]):not([customizing]){
|
||||
|
||||
/* styles for both sidebar and bookmaarks toolbar */
|
||||
#sidebar-box,
|
||||
#PersonalToolbar
|
||||
{
|
||||
z-index: 2 !important;
|
||||
width: var(--sdbr-wdt) !important;
|
||||
|
||||
left: calc(
|
||||
var(--left-margin)
|
||||
+ var(--panel-hide-ldg)
|
||||
- var(--sdbr-wdt)
|
||||
) !important;
|
||||
|
||||
border-radius: var(--big-rounding) !important;
|
||||
|
||||
/* hover target (invisible box between window edge and panel) */
|
||||
&::before{
|
||||
content: "";
|
||||
position: absolute;
|
||||
z-index: -999;
|
||||
background-color: var(--debug-col);
|
||||
|
||||
width: 150%;
|
||||
height: 100%;
|
||||
right: 0px;
|
||||
top: 0px;
|
||||
}
|
||||
|
||||
/* make all panel content invisible (it will visible when hover) */
|
||||
& > * {
|
||||
transition: var(--transition) !important;
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
/* styles for sidebar */
|
||||
#sidebar-box{
|
||||
height: calc(
|
||||
100vh
|
||||
- var(--bookmarks-hgt)
|
||||
- var(--little-gap)
|
||||
- var(--top-margin)
|
||||
- var(--bottom-margin)
|
||||
- var(--margin) * 2
|
||||
) !important;
|
||||
|
||||
top: calc(
|
||||
var(--top-margin)
|
||||
+ var(--margin)
|
||||
+ var(--bookmarks-hgt) + var(--little-gap)
|
||||
);
|
||||
|
||||
/* indication bar (line on window edge) */
|
||||
&::after{
|
||||
content: "";
|
||||
position: absolute;
|
||||
transition: var(--transition);
|
||||
|
||||
left: calc(
|
||||
100%
|
||||
- var(--panel-hide-ldg)
|
||||
- var(--margin)
|
||||
+ var(--hide-bar-padding)
|
||||
);
|
||||
|
||||
width: calc(var(--margin) - var(--hide-bar-padding) * 2 );
|
||||
height: calc(
|
||||
100%
|
||||
- var(--hide-bar-wdt-pad)
|
||||
+ var(--bookmarks-hgt)
|
||||
+ var(--little-gap)
|
||||
);
|
||||
|
||||
bottom: calc(var(--hide-bar-wdt-pad) / 2);
|
||||
border-radius: var(--rounding);
|
||||
background-color: var(--bt-col);
|
||||
opacity: var(--hide-bar-opct);
|
||||
}
|
||||
}
|
||||
|
||||
/* add rounded corners to sidebar content */
|
||||
#sidebar {border-radius: var(--big-rounding) !important;}
|
||||
|
||||
/* styles for bookmarks */
|
||||
#PersonalToolbar{
|
||||
top: calc(var(--top-margin) + var(--margin));
|
||||
margin-left: 0px !important;
|
||||
overflow: visible !important;
|
||||
|
||||
padding-inline: 2px !important;
|
||||
|
||||
/* hover target between sidebar and bookmarks toolbar */
|
||||
&::after{
|
||||
content: "";
|
||||
z-index: 1;
|
||||
position: absolute;
|
||||
|
||||
background-color: var(--debug-col);
|
||||
opacity: 1 !important;
|
||||
|
||||
height: calc(var(--little-gap) + 4px);
|
||||
bottom: calc(-2px - var(--little-gap));
|
||||
|
||||
width: 150%;
|
||||
|
||||
right: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
/* show sidebar on hover or focus (if not in clean mode) */
|
||||
&:not([titlepreface*=""]):has(
|
||||
#sidebar-box:hover,
|
||||
#sidebar-box:focus-within,
|
||||
#PersonalToolbar:hover,
|
||||
#PersonalToolbar *:not(#firefox-view-button)[open],
|
||||
#sidebar-switcher-target[aria-expanded="true"]
|
||||
) {
|
||||
#sidebar-box,
|
||||
#PersonalToolbar
|
||||
{
|
||||
opacity: 1 !important;
|
||||
left: calc(var(--left-margin) + var(--margin)) !important;
|
||||
|
||||
background-color: var(--bg-col) !important;
|
||||
|
||||
border: var(--outline) !important;
|
||||
outline: var(--shadow) !important;
|
||||
|
||||
&::after{opacity: 0}
|
||||
|
||||
& > * {opacity: var(--dyn-opct);}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
|
||||
--- CUSTOMIZING PAGE --------------------------------------------------------------------------------------------------------------------------------
|
||||
|
||||
*/
|
||||
|
||||
#main-window[customizing]{
|
||||
#PersonalToolbar{
|
||||
top: 65px !important;
|
||||
left: 20px !important;
|
||||
margin-left: 0px !important;
|
||||
|
||||
border-radius: var(--big-rounding) !important;
|
||||
|
||||
background-color: var(--bg-col) !important;
|
||||
}
|
||||
|
||||
/* remove text from bookmarks toolbar elements placeholder */
|
||||
#bookmarks-toolbar-placeholder .toolbarbutton-text {display: none !important;}
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
|
||||
--- NOT SIDEBERY -----------------------------------------------------------------------------------------------------------------------------------
|
||||
|
||||
Styles when Sidebery is not opened
|
||||
|
||||
*/
|
||||
|
||||
/* hide sidebar header when Sidebery opened */
|
||||
#main-window:not([customizing]):has(
|
||||
#sidebar-box:not([hidden])[sidebarcommand*="_3c078156-979c-498b-8990-85f7987dd929_-sidebar-action"]
|
||||
) {
|
||||
#sidebar-header {display: none}
|
||||
}
|
||||
|
||||
/* hide sidebar button on toolbar when sidebar opened */
|
||||
#main-window:not([customizing]):has(
|
||||
#sidebar-box:not([hidden])
|
||||
) {
|
||||
#sidebar-button {display: none}
|
||||
}
|
||||
|
||||
/* color the sidebar button red */
|
||||
#sidebar-button .toolbarbutton-icon {
|
||||
background-color: red !important;
|
||||
fill: white !important;
|
||||
}
|
||||
|
||||
/* notification when sidebar is not opened */
|
||||
#main-window[chromehidden=""]:has(
|
||||
#sidebar-box[hidden="true"]
|
||||
) {
|
||||
--shyfox-string-open-sidebar: "Open sidebar!";
|
||||
&[lang="ru"]{--shyfox-string-open-sidebar: "Откройте боковую панель!";}
|
||||
|
||||
&::before{
|
||||
content: var(--shyfox-string-open-sidebar);
|
||||
position: fixed;
|
||||
z-index: 9999;
|
||||
|
||||
font-weight: bold;
|
||||
|
||||
top: calc(var(--margin) + var(--toolbar-item-hgt));
|
||||
left: calc(var(--margin) * 2);
|
||||
|
||||
background-color: var(--tb-col);
|
||||
color: var(--bt-col);
|
||||
outline: 3px solid red;
|
||||
|
||||
border-radius: var(--big-rounding);
|
||||
padding: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
/* styles when Sidebery is not opened but sidebar is */
|
||||
#main-window[chromehidden=""]:has(
|
||||
#sidebar-box:not([hidden]):not([sidebarcommand*="_3c078156-979c-498b-8990-85f7987dd929_-sidebar-action"])
|
||||
) {
|
||||
|
||||
--shyfox-string-to-manage-tabs-open-sidebery: "To manage tabs, open Sidebery in this menu";
|
||||
&[lang="ru"]{--shyfox-string-to-manage-tabs-open-sidebery: "Для работы с вкладками откройте Sidebery";}
|
||||
|
||||
#sidebar {
|
||||
border: var(--outline) !important;
|
||||
margin: 0 calc(var(--margin) / 1.5) !important;
|
||||
}
|
||||
|
||||
&[titlepreface*=""] {#sidebar {margin-bottom: calc(var(--margin) / 1.5) !important;}}
|
||||
|
||||
#sidebar-header{
|
||||
#sidebar-close {display: none}
|
||||
|
||||
padding-bottom: 30px !important;
|
||||
border: none !important;
|
||||
|
||||
/* info text */
|
||||
&::before{
|
||||
content: "";
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
position: absolute;
|
||||
|
||||
mask-image: url("chrome://global/skin/icons/info-filled.svg");
|
||||
background-color: var(--shy-color);
|
||||
mask-repeat: no-repeat;
|
||||
|
||||
top: 44px;
|
||||
left: 10px;
|
||||
}
|
||||
|
||||
&::after{
|
||||
content: var(--shyfox-string-to-manage-tabs-open-sidebery);
|
||||
position: absolute;
|
||||
top: 45px;
|
||||
font-size: 11.8px;
|
||||
|
||||
padding-left: 22px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* assign the button to move the sidebar left and right to enable and disable native tabs for emergencies */
|
||||
|
||||
/* if Sidebery is not opened but sidebar is */
|
||||
#main-window:has(
|
||||
#sidebar-box:not([hidden]):not([sidebarcommand*="_3c078156-979c-498b-8990-85f7987dd929_-sidebar-action"])
|
||||
) {
|
||||
|
||||
--shyfox-string-enable-native-tabs: "Enable native tabs";
|
||||
&[lang="ru"]{--shyfox-string-enable-native-tabs: "Включить нативные вкладки";}
|
||||
|
||||
#sidebarMenu-popup #sidebar-reverse-position{
|
||||
/* remove original text from this button */
|
||||
.menu-text {display: none !important;}
|
||||
|
||||
&::after{
|
||||
content: var(--shyfox-string-enable-native-tabs) !important;
|
||||
padding-inline: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
/* add rounded corners to sidebar content */
|
||||
#sidebar {border-radius: var(--big-rounding) !important;}
|
||||
|
||||
/* sidebar on left (native tabs disabled, default) */
|
||||
&:has(#sidebar-box[style*="order: 2"]){
|
||||
/* there is no styles */
|
||||
}
|
||||
|
||||
/* sidebar on right (native tabs enabled) */
|
||||
&:has(#sidebar-box[style*="order: 4"]){
|
||||
|
||||
/* add checkmark to button to indicate state */
|
||||
#sidebarMenu-popup #sidebar-reverse-position {background-image: url("../icons/menu-check.svg") !important;}
|
||||
|
||||
/* native tabs styling */
|
||||
#tabbrowser-tabs{
|
||||
--tabsbar-wdt: calc(
|
||||
(
|
||||
100vw
|
||||
- var(--margin) * 2
|
||||
- var(--left-margin)
|
||||
- var(--right-margin)
|
||||
) / 1.5
|
||||
);
|
||||
|
||||
display: flex !important;
|
||||
position: fixed !important;
|
||||
|
||||
width: var(--tabsbar-wdt) !important;
|
||||
height: 45px !important;
|
||||
padding: 0 !important;
|
||||
|
||||
left: calc(var(--left-margin) + var(--margin)) !important;
|
||||
top: calc(var(--top-margin) + var(--margin)) !important;
|
||||
|
||||
background-color: var(--tb-col) !important;
|
||||
border-radius: var(--big-rounding) !important;
|
||||
border: var(--outline) !important;
|
||||
outline: var(--shadow) !important;
|
||||
transition: var(--transition) !important;
|
||||
|
||||
.tabbrowser-tab:not([pinned]){
|
||||
min-width: 150px !important;
|
||||
.tab-close-button{display: flex !important;}
|
||||
}
|
||||
|
||||
/* pinned tabs */
|
||||
.tabbrowser-tab[pinned]{
|
||||
position: initial !important;
|
||||
margin-inline: 0px !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue