Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- #root[data-style="auto"],
- #root[data-style="dark"] {
- --notice-fg: #fff !important;
- --progress-fg: #fff !important;
- --tabs-loading-fg: #fff !important;
- --tabs-selected-bg: highlight !important;
- --tabs-update-badge-bg: #4df; !important;
- --nav-btn-opacity: 1 !important;
- --nav-btn-opacity-hover: 1 !important;
- --nav-btn-fg-focus: #f00 !important;
- --jav-btn-update-badge-bg: #f0f !important;
- }
- /**** BASE TAB STYLING ****/
- .Tab {
- background: rgba(255,255,255,0.1);
- border-bottom: 1px solid transparent;
- background-clip: content-box;
- --tabs-activated-shadow: inset 2px 0 highlight;
- }
- .Tab[data-active],
- .Tab[data-selected],
- .Tab[data-selected]:hover,
- .Tab[data-selected]:active {
- border-bottom: 1px solid transparent;
- }
- .Tab:hover:not([data-active]) {
- box-shadow: inset 2px 0 rgba(255,255,255,0.25);
- }
- .PinnedTab {
- background: rgba(255,255,255,0.075);
- --tabs-activated-shadow: inset 0 2px highlight;
- border-right: 1px solid transparent;
- background-clip: content-box;
- }
- .PinnedTab .audio-badge {
- pointer-events: none;
- }
- /**** PANEL BUTTONS ****/
- .NavigationBar .panel-btn > svg {
- opacity: .5;
- }
- .NavigationBar .panel-btn:hover:not([data-active]) > svg {
- opacity: .75;
- }
- .NavigationBar .panel-btn[data-active] > svg {
- opacity: 1;
- }
- /**** OPACITY RE-WORK ****/
- .Tab:hover .fav {
- opacity: 1;
- }
- .PinnedTab:hover .fav {
- opacity: 1;
- }
- .Tab[data-discarded] > .lvl-wrapper > .fav,
- .Tab[data-discarded] > .lvl-wrapper > .t-box {
- opacity: 1;
- }
- .Tab[data-discarded] {
- opacity: 0.5;
- }
- /**** FOLDING FAVICON BEHAVIOR ****/
- .Tab[data-parent] .fav:hover > img,
- .Tab[data-parent][data-folded] .fav > img {
- opacity: 1;
- }
- .Tab[data-parent] .fav,
- .Tab[data-parent][data-folded] .fav .exp {
- transition: margin-left var(--d-norm);
- }
- .Tab[data-parent][data-folded] .fav {
- margin-left: 16px;
- }
- .Tab[data-parent][data-folded] .fav .exp {
- margin-left: -16px;
- }
- .Tab .fav > .child-count {
- font-weight: bold;
- width: auto;
- padding: 0 3px;
- border-radius: 100px;
- bottom: -3px;
- right: 0;
- left: -22px;
- }
- /**** CLOSE BUTTON ****/
- .Tab .close {
- top: -1px;
- }
- .Tab .close > svg {
- fill: #fffa;
- }
- .Tab .close:hover > svg {
- fill: #fff;
- }
- /**** CORNER INDICATOR ****/
- .Tab .fav:after {
- left: -6px;
- bottom: -4px;
- border-width: 3px;
- }
- /**** AUDIO MORE VISIBLE ****/
- .Tab:not([data-active]) .lvl-wrapper .audio svg {
- /*
- background: var(--tabs-update-badge-bg);
- box-shadow: 0 0 0 2px var(--tabs-update-badge-bg), inset 0 0 0 20px var(--tabs-update-badge-bg);
- border-radius: 99px;
- fill: black;
- */
- fill: var(--tabs-update-badge-bg);
- }
- /**** MATCH WIDTH TO TREE LEVEL ****/
- /*.Tab:not([data-active]) {
- box-shadow: -1px 0 rgba(0,0,0,.5);
- }*/
- .Tab[data-lvl="1"] {
- padding-left: 0;
- margin-left: var(--tabs-indent);
- width: calc(100% - var(--tabs-indent));
- }
- .Tab[data-lvl="2"] {
- padding-left: 0;
- margin-left: calc(var(--tabs-indent) * 2);
- width: calc(100% - var(--tabs-indent) * 2);
- }
- .Tab[data-lvl="3"] {
- padding-left: 0;
- margin-left: calc(var(--tabs-indent) * 3);
- width: calc(100% - var(--tabs-indent) * 3);
- }
- .Tab[data-lvl="4"] {
- padding-left: 0;
- margin-left: calc(var(--tabs-indent) * 4);
- width: calc(100% - var(--tabs-indent) * 4);
- }
- .Tab[data-lvl="5"] {
- padding-left: 0;
- margin-left: calc(var(--tabs-indent) * 5);
- width: calc(100% - var(--tabs-indent) * 5);
- }
- .Tab[data-lvl="6"] {
- padding-left: 0;
- margin-left: calc(var(--tabs-indent) * 6);
- width: calc(100% - var(--tabs-indent) * 6);
- }
- .Tab[data-lvl="7"] {
- padding-left: 0;
- margin-left: calc(var(--tabs-indent) * 7);
- width: calc(100% - var(--tabs-indent) * 7);
- }
- .Tab[data-lvl="8"] {
- padding-left: 0;
- margin-left: calc(var(--tabs-indent) * 8);
- width: calc(100% - var(--tabs-indent) * 8);
- }
- .Tab[data-lvl="9"] {
- padding-left: 0;
- margin-left: calc(var(--tabs-indent) * 9);
- width: calc(100% - var(--tabs-indent) * 9);
- }
- .Tab[data-lvl="10"] {
- padding-left: 0;
- margin-left: calc(var(--tabs-indent) * 10);
- width: calc(100% - var(--tabs-indent) * 10);
- }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement