From 445a420f3d4f73a5688612651111a03dfd360144 Mon Sep 17 00:00:00 2001 From: Tanvir Date: Thu, 18 Jul 2024 17:58:19 +0600 Subject: [PATCH] sync --- addons/sidebery/sidebery-settings-data.json | 2 +- addons/sidebery/sidebery-styles.css | 26 +++++++++++++++++++++ 2 files changed, 27 insertions(+), 1 deletion(-) diff --git a/addons/sidebery/sidebery-settings-data.json b/addons/sidebery/sidebery-settings-data.json index d227d70..f607229 100644 --- a/addons/sidebery/sidebery-settings-data.json +++ b/addons/sidebery/sidebery-settings-data.json @@ -501,7 +501,7 @@ } } }, - "sidebarCSS": "#root.root {\n --general-border-radius: 5px;\n}\n#root.root {\n --accent: #c38f8f;\n}\n#root.root {\n --nav-btn-fg: #faf8f7;\n}\n#root.root {\n --toolbar-fg: #faf8f7;\n}\n#root.root {\n --toolbar-el-overlay-active-bg: rgba(255, 255, 255, 0.141);\n}\n#root.root {\n --general-margin: 2px;\n}\n#root.root {\n --border: #202020;\n}\n#root.root {\n --status-ok: #64df64;\n}\n#root.root {\n --status-err: #df6464;\n}\n#root.root {\n --status-active: #47cfff;\n}\n#root.root {\n --status-notice: #00e9fb;\n}\n#root.root {\n --scroll-progress-bg: #c38f8f;\n}\n#root.root {\n --notification-fg: #faf8f7;\n}\n#root.root {\n --notification-bg: #202020;\n}\n#root.root {\n --nav-btn-active-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.071),\n 0 1px 3px 0 rgba(0, 0, 0, 0.212);\n}\n#root.root {\n --nav-btn-accent: #c38f8f;\n}\n#root.root {\n --frame-el-overlay-selected-border: #c38f8f;\n}\n#root.root {\n --frame-scrollbar-color: #8db8cd;\n}\n#root.root {\n --toolbar-scrollbar-color: #8db8cd;\n}\n\n#root.root {\n --frame-fg: #faf8f7;\n}\n#root.root {\n --frame-bg: #202020;\n}\n#root.root {\n --toolbar-bg: #202020;\n}\n\n/* Add animation to icon shown when playing audio in a tab */\n.Tab .-loud {\n animation: audio-animation 1.2s infinite ease-in-out;\n}\n\n@keyframes audio-animation {\n 0% {\n transform: scale(0.9);\n }\n 25% {\n transform: scale(1.1);\n }\n 50% {\n transform: scale(1.2);\n }\n 75% {\n transform: scale(1.1);\n }\n 100% {\n transform: scale(0.9);\n }\n}\n\n/* Based on: */\n#root {\n --tabs-height: 34px;\n --tabs-pinned-height: var(--tabs-height);\n /* Dark Theme base settings */\n --bg: #1c1b22 !important;\n --tabs-fg: #d4d4d4 !important;\n --tabs-bg-hover: #3b3948 !important;\n --tabs-activated-bg: #5b5b66 !important;\n --nav-btn-activated-bg: #1f222f !important;\n}\n\n#root .Tab {\n --tabs-indent: 10px;\n}\n\n/* TABS */\n.Tab .lvl-wrapper:after {\n display: none;\n}\n\n.Tab {\n margin: auto;\n width: 95%;\n border-radius: 5px;\n}\n\n.Tab .close > svg:hover {\n /* Tab close button */\n border-radius: 5px;\n background: #df6464 !important;\n opacity: 100%;\n}\n\n.Tab .title {\n overflow: hidden !important;\n}\n\n/* PINNED TABS */\n.PinnedDock {\n background-color: var(--bg) !important;\n}\n\n.PinnedTab {\n margin: 5px 0px 4px 6px;\n border-radius: 5px;\n}\n\n/* NAV BAR */\n.NavigationBar {\n height: 40px !important;\n padding: 4.5px 0px 0px 4.5px !important;\n background-color: #2b2a33 !important;\n margin-bottom: 5px;\n}\n\n.NavigationBar .panel-btn:hover {\n border-radius: 5px !important;\n background-color: var(--tabs-bg-hover) !important;\n}\n\n.NavigationBar .panel-btn[data-active=\"true\"] {\n border-radius: 5px !important;\n background-color: var(--bg) !important;\n}\n\n.NavigationBar .panel-btn[data-active=\"true\"]:hover {\n border-radius: 5px !important;\n background-color: var(--tabs-bg-hover) !important;\n}\n\n.NavigationBar .panel-btn > svg,\n.NavigationBar .panel-btn > img {\n fill: #f2f2f2 !important;\n}\n\n/* SIDEBAR HACK PATCHES */\n@media (max-width: 50px) {\n /* Fix to tab tree identation when minimised */\n #root:not(:hover) .Tab {\n --tabs-indent: 0px;\n }\n\n .Tab[data-lvl] > div.lvl-wrapper {\n right: -2px;\n }\n\n .Tab {\n max-width: 34px;\n }\n\n .Tab .fav {\n z-index: 1;\n }\n\n .Tab .audio {\n margin-left: -2px;\n top: -1px !important;\n left: 22px !important;\n }\n\n .Tab .title {\n display: none;\n }\n\n .PinnedTab {\n margin-left: 5px;\n }\n\n .NavigationBar .settings-btn {\n display: none;\n }\n}\n\n/* Disable these two snippets below to make pinned tabs wrap when minimised */\n.PinnedDock {\n flex-wrap: nowrap !important;\n}\n\n.PinnedTab {\n overflow: hidden !important;\n min-width: var(--tabs-pinned-width) !important;\n}\n\n/* Better tab notifications on pinned tabs */\n.PinnedTab[data-audible] .fav > img,\n.PinnedTab[data-muted] .fav > img,\n.PinnedTab[data-loading] .fav > img {\n mask: none;\n}\n\n.PinnedTab .fav > img {\n mask: none;\n}\n\n.PinnedTab[data-updated=\"true\"] .fav > img {\n mask: radial-gradient(\n circle at calc(100% - 2px) calc(100% - 2px),\n rgba(0, 0, 0, 0.141),\n rgba(0, 0, 0, 0.141) 4px,\n #000 5px,\n #000\n );\n}\n\n.PinnedTab .audio-badge {\n top: 5px;\n}\n\n.PinnedTab .update-badge {\n opacity: 0;\n}\n\n.PinnedTab[data-updated=\"true\"] .update-badge {\n opacity: 100;\n}\n\n/* Scrolling Tab text title animation */\n/*\n.Tab .title {\n display: inline-block;\n transition: transform 5s ease;\n}\n\n.Tab:hover .title {\n animation: moveTitle 5s infinite;\n}\n\n@keyframes moveTitle {\n 0% { transform: translateX(0); }\n 50% { transform: translateX(-10rem); }\n 100% { transform: translateX(0); }\n}\n*/\n", + "sidebarCSS": "#root.root {\n --general-border-radius: 5px;\n}\n#root.root {\n --accent: #c38f8f;\n}\n#root.root {\n --nav-btn-fg: #faf8f7;\n}\n#root.root {\n --toolbar-fg: #faf8f7;\n}\n#root.root {\n --toolbar-el-overlay-active-bg: rgba(255, 255, 255, 0.141);\n}\n#root.root {\n --general-margin: 2px;\n}\n#root.root {\n --border: #202020;\n}\n#root.root {\n --status-ok: #64df64;\n}\n#root.root {\n --status-err: #df6464;\n}\n#root.root {\n --status-active: #47cfff;\n}\n#root.root {\n --status-notice: #00e9fb;\n}\n#root.root {\n --scroll-progress-bg: #c38f8f;\n}\n#root.root {\n --notification-fg: #faf8f7;\n}\n#root.root {\n --notification-bg: #202020;\n}\n#root.root {\n --nav-btn-active-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.071),\n 0 1px 3px 0 rgba(0, 0, 0, 0.212);\n}\n#root.root {\n --nav-btn-accent: #c38f8f;\n}\n#root.root {\n --frame-el-overlay-selected-border: #c38f8f;\n}\n#root.root {\n --frame-scrollbar-color: #8db8cd;\n}\n#root.root {\n --toolbar-scrollbar-color: #8db8cd;\n}\n\n#root.root {\n --frame-fg: #faf8f7;\n}\n#root.root {\n --frame-bg: #202020;\n}\n#root.root {\n --toolbar-bg: #202020;\n}\n\n/* Add animation to icon shown when playing audio in a tab */\n.Tab .-loud {\n animation: audio-animation 1.2s infinite ease-in-out;\n}\n\n@keyframes audio-animation {\n 0% {\n transform: scale(0.9);\n }\n 25% {\n transform: scale(1.1);\n }\n 50% {\n transform: scale(1.2);\n }\n 75% {\n transform: scale(1.1);\n }\n 100% {\n transform: scale(0.9);\n }\n}\n\n/* Based on: */\n#root {\n --tabs-height: 34px;\n --tabs-pinned-height: var(--tabs-height);\n /* Dark Theme base settings */\n --bg: #1c1b22 !important;\n --tabs-fg: #d4d4d4 !important;\n --tabs-bg-hover: #3b3948 !important;\n --tabs-activated-bg: #5b5b66 !important;\n --nav-btn-activated-bg: #1f222f !important;\n}\n\n#root .Tab {\n --tabs-indent: 10px;\n}\n\n/* TABS */\n.Tab .lvl-wrapper:after {\n display: none;\n}\n\n.Tab {\n margin: auto;\n width: 95%;\n border-radius: 5px;\n}\n\n.Tab .close > svg:hover {\n /* Tab close button */\n border-radius: 5px;\n background: #df6464 !important;\n opacity: 100%;\n}\n\n.Tab .title {\n overflow: hidden !important;\n}\n\n/* PINNED TABS */\n.PinnedDock {\n background-color: var(--bg) !important;\n}\n\n.PinnedTab {\n margin: 5px 0px 4px 6px;\n border-radius: 5px;\n}\n\n/* NAV BAR */\n.NavigationBar {\n height: 40px !important;\n padding: 4.5px 0px 0px 4.5px !important;\n background-color: #2b2a33 !important;\n margin-bottom: 5px;\n}\n\n.NavigationBar .panel-btn:hover {\n border-radius: 5px !important;\n background-color: var(--tabs-bg-hover) !important;\n}\n\n.NavigationBar .panel-btn[data-active=\"true\"] {\n border-radius: 5px !important;\n background-color: var(--bg) !important;\n}\n\n.NavigationBar .panel-btn[data-active=\"true\"]:hover {\n border-radius: 5px !important;\n background-color: var(--tabs-bg-hover) !important;\n}\n\n.NavigationBar .panel-btn > svg,\n.NavigationBar .panel-btn > img {\n fill: #f2f2f2 !important;\n}\n\n/* SIDEBAR HACK PATCHES */\n@media (max-width: 50px) {\n /* Fix to tab tree identation when minimised */\n #root:not(:hover) .Tab {\n --tabs-indent: 0px;\n }\n\n .Tab[data-lvl] > div.lvl-wrapper {\n right: -2px;\n }\n\n .Tab {\n max-width: 34px;\n }\n\n .Tab .fav {\n z-index: 1;\n }\n\n .Tab .audio {\n margin-left: -2px;\n top: -1px !important;\n left: 22px !important;\n }\n\n .Tab .title {\n display: none;\n }\n\n .PinnedTab {\n margin-left: 5px;\n }\n\n .NavigationBar .settings-btn {\n display: none;\n }\n}\n\n/* Disable these two snippets below to make pinned tabs wrap when minimised */\n.PinnedDock {\n flex-wrap: nowrap !important;\n}\n\n.PinnedTab {\n overflow: hidden !important;\n min-width: var(--tabs-pinned-width) !important;\n}\n\n/* Better tab notifications on pinned tabs */\n.PinnedTab[data-audible] .fav > img,\n.PinnedTab[data-muted] .fav > img,\n.PinnedTab[data-loading] .fav > img {\n mask: none;\n}\n\n.PinnedTab .fav > img {\n mask: none;\n}\n\n.PinnedTab[data-updated=\"true\"] .fav > img {\n mask: radial-gradient(\n circle at calc(100% - 2px) calc(100% - 2px),\n rgba(0, 0, 0, 0.141),\n rgba(0, 0, 0, 0.141) 4px,\n #000 5px,\n #000\n );\n}\n\n.PinnedTab .audio-badge {\n top: 5px;\n}\n\n.PinnedTab .update-badge {\n opacity: 0;\n}\n\n.PinnedTab[data-updated=\"true\"] .update-badge {\n opacity: 100;\n}\n\n/* Multiline Tab Titles */\n/* TODO: Fine-tune */\n/* TODO: Multiline Tab Titles in Hovercard Title */\n/*\n#root {\n --tabs-height: 36px !important;\n --tabs-title-padding: 6px;\n --tabs-font-size: 0.9rem;\n --tabs-title-lines: 2;\n}\n\n.Tab .t-box {\n align-items: center;\n max-height: calc(var(--tabs-height) - var(--tabs-title-padding));\n overflow: hidden;\n}\n\n.Tab .title {\n font-size: var(--tabs-font-size);\n white-space: pre-wrap;\n line-height: calc(\n (var(--tabs-height) - var(--tabs-title-padding)) / var(--tabs-title-lines)\n );\n}\n*/\n\n/* Scrolling Tab text title animation */\n/*\n.Tab .title {\n display: inline-block;\n transition: transform 5s ease;\n}\n\n.Tab:hover .title {\n animation: moveTitle 5s infinite;\n}\n\n@keyframes moveTitle {\n 0% { transform: translateX(0); }\n 50% { transform: translateX(-10rem); }\n 100% { transform: translateX(0); }\n}\n*/\n", "groupCSS": "#root.root {--accent: #C38F8F;}\n#root.root {--border: #202020;}\n#root.root {--status-ok: #64df64;}\n#root.root {--status-err: #df6464;}\n#root.root {--status-active: #47cfff;}\n#root.root {--status-notice: #00e9fb;}\n#root.root {--popup-fg: #faf8f7;}\n#root.root {--popup-bg: #202020;}\n#root.root {--frame-bg: #202020;}\n#root.root {--frame-fg: #faf8f7;}\n", "ver": "5.2.0", "keybindings": { diff --git a/addons/sidebery/sidebery-styles.css b/addons/sidebery/sidebery-styles.css index 8e092cb..ab4bb95 100644 --- a/addons/sidebery/sidebery-styles.css +++ b/addons/sidebery/sidebery-styles.css @@ -247,6 +247,32 @@ opacity: 100; } +/* Multiline Tab Titles */ +/* TODO: Fine-tune */ +/* TODO: Multiline Tab Titles in Hovercard Title */ +/* +#root { + --tabs-height: 36px !important; + --tabs-title-padding: 6px; + --tabs-font-size: 0.9rem; + --tabs-title-lines: 2; +} + +.Tab .t-box { + align-items: center; + max-height: calc(var(--tabs-height) - var(--tabs-title-padding)); + overflow: hidden; +} + +.Tab .title { + font-size: var(--tabs-font-size); + white-space: pre-wrap; + line-height: calc( + (var(--tabs-height) - var(--tabs-title-padding)) / var(--tabs-title-lines) + ); +} +*/ + /* Scrolling Tab text title animation */ /* .Tab .title {