This commit is contained in:
Cynthia Foxwell 2024-08-30 17:11:29 -06:00
parent 92d285a3b2
commit 58287b2bd3
3 changed files with 103 additions and 96 deletions

View file

@ -59,11 +59,13 @@
padding-right: 0 !important; padding-right: 0 !important;
& > [class^="buttonContainer_"] { & > [class^="buttonContainer_"] {
top: 16px; top: 16px;
margin-right: 0;
} }
} }
& > [class^="buttonContainer_"] { & > [class^="buttonContainer_"] {
top: 0; top: 0;
margin-right: 52px;
& > [class^="buttons_"] { & > [class^="buttons_"] {
padding: 0; padding: 0;
@ -72,11 +74,26 @@
& > [class^="buttonsInner_"] { & > [class^="buttonsInner_"] {
height: 13px; height: 13px;
border-radius: 0; border-radius: 0;
box-shadow: none;
border: none;
background: transparent;
transition: none;
padding: 0;
& > [class^="button_"] { & > [class*="button_"] {
padding: 0; padding: 0;
height: 13px; height: 13px;
min-width: 13px; min-width: 13px;
.emoji {
width: 13px;
height: 13px;
}
}
& > [class^="separator_"] {
height: 13px;
margin: 0 2px;
} }
} }
} }

View file

@ -1,7 +1,7 @@
.overlay [class^="widget_"] > [class^="base_"] > nav[class^="wrapper_"], .overlay [class^="widget_"] > [class^="base_"] > nav[class^="wrapper_"],
[class*="guilds_"] { [class*="guilds_"] {
background-color: var(--Window) !important; background-color: var(--Window) !important;
/*box-shadow: var(--RebarBorder);*/ box-shadow: var(--RebarBorder);
width: 48px; width: 48px;
padding: 2px; padding: 2px;
@ -455,14 +455,14 @@
} }
&:hover::after { &:hover::after {
/*box-shadow: inset 0 1px var(--ThreeDShadow), inset -1px -1px 0 0 var(--ThreeDShadow), box-shadow: inset 0 1px var(--ThreeDShadow), inset -1px -1px 0 0 var(--ThreeDShadow),
inset 1px 2px 0 0 var(--ThreeDHighlight);*/ inset 1px 2px 0 0 var(--ThreeDHighlight);
box-shadow: inset 0 1px #282828, inset -1px -1px 0 0 #282828, inset 1px 2px 0 0 #282828; /*box-shadow: inset 0 1px #282828, inset -1px -1px 0 0 #282828, inset 1px 2px 0 0 #282828;*/
} }
&:has([class^="folder_"][aria-expanded="true"])::after { &:has([class^="folder_"][aria-expanded="true"])::after {
/*box-shadow: inset 0 1px var(--ThreeDShadow), inset -1px -1px 0 0 var(--ThreeDHighlight), box-shadow: inset 0 1px var(--ThreeDShadow), inset -1px -1px 0 0 var(--ThreeDHighlight),
inset 1px 2px 0 0 var(--ThreeDShadow);*/ inset 1px 2px 0 0 var(--ThreeDShadow);
box-shadow: inset 0 1px #3a3a3a, inset -1px -1px 0 0 #3a3a3a, inset 1px 2px 0 0 #3a3a3a; /*box-shadow: inset 0 1px #3a3a3a, inset -1px -1px 0 0 #3a3a3a, inset 1px 2px 0 0 #3a3a3a;*/
} }
} }
} }

View file

@ -6,7 +6,7 @@
@use "w9x/toolbar" as w9xtoolbar; @use "w9x/toolbar" as w9xtoolbar;
/*@use "w9x/channel_list" as w9xchannels;*/ /*@use "w9x/channel_list" as w9xchannels;*/
/*.theme-dark { .theme-dark {
--ThreeDLightShadow: #1a1a1a; --ThreeDLightShadow: #1a1a1a;
--ThreeDHighlight: #383838; --ThreeDHighlight: #383838;
--ThreeDFace: #1a1a1a; --ThreeDFace: #1a1a1a;
@ -43,7 +43,7 @@
--TitlebarOffset: 3px; --TitlebarOffset: 3px;
/* Toolbar offsets, these need to be hardcoded as theres no way to get another element's width in CSS */ /* Toolbar offsets, these need to be hardcoded as theres no way to get another element's width in CSS */
/* Padding included */ /* /* Padding included */
--ToolbarAccountWidth: 51px; --ToolbarAccountWidth: 51px;
--ToolbarSettingsWidth: 51px; --ToolbarSettingsWidth: 51px;
--ToolbarHelpWidth: 33px; --ToolbarHelpWidth: 33px;
@ -51,9 +51,9 @@
--ToolbarAccountTextOffset: 1px; --ToolbarAccountTextOffset: 1px;
--ToolbarHelpTextOffset: -8px; --ToolbarHelpTextOffset: -8px;
--ToolbarUpdateTextOffset: -8px; --ToolbarUpdateTextOffset: -8px;
}*/ }
.theme-dark { /*.theme-dark {
--ThreeDLightShadow: #1a1a1a; --ThreeDLightShadow: #1a1a1a;
--ThreeDHighlight: #3e3e3e; --ThreeDHighlight: #3e3e3e;
--ThreeDFace: #202020; --ThreeDFace: #202020;
@ -73,7 +73,7 @@
--Tooltip: #1a1a1a; --Tooltip: #1a1a1a;
--TooltipText: #dedbeb; --TooltipText: #dedbeb;
--Scrollbar: #383838; --Scrollbar: #383838;
/*--WindowFrame: inset -1px -1px 0 0 #121212, inset 1px 1px 0 0 #121212;*/ /*--WindowFrame: inset -1px -1px 0 0 #121212, inset 1px 1px 0 0 #121212;*/ /*
--WindowFrame: inset -1px -1px 0 0 var(--ThreeDDarkShadow), inset 1px 1px 0 0 var(--ThreeDLightShadow), --WindowFrame: inset -1px -1px 0 0 var(--ThreeDDarkShadow), inset 1px 1px 0 0 var(--ThreeDLightShadow),
inset -2px -2px 0 0 var(--ThreeDShadow), inset 2px 2px 0 0 var(--ThreeDHighlight); inset -2px -2px 0 0 var(--ThreeDShadow), inset 2px 2px 0 0 var(--ThreeDHighlight);
--OuterEdge: inset -1px -1px 0 0 var(--ThreeDDarkShadow), inset 1px 1px 0 0 var(--ThreeDHighlight), --OuterEdge: inset -1px -1px 0 0 var(--ThreeDDarkShadow), inset 1px 1px 0 0 var(--ThreeDHighlight),
@ -92,7 +92,7 @@
--interactive-normal: #979797 !important; --interactive-normal: #979797 !important;
/* Toolbar offsets, these need to be hardcoded as theres no way to get another element's width in CSS */ /* Toolbar offsets, these need to be hardcoded as theres no way to get another element's width in CSS */
/* Padding included */ /* Padding included */ /*
--ToolbarAccountWidth: 51px; --ToolbarAccountWidth: 51px;
--ToolbarSettingsWidth: 51px; --ToolbarSettingsWidth: 51px;
--ToolbarHelpWidth: 33px; --ToolbarHelpWidth: 33px;
@ -100,7 +100,7 @@
--ToolbarAccountTextOffset: 1px; --ToolbarAccountTextOffset: 1px;
--ToolbarHelpTextOffset: -8px; --ToolbarHelpTextOffset: -8px;
--ToolbarUpdateTextOffset: -8px; --ToolbarUpdateTextOffset: -8px;
} }*/
.theme-light { .theme-light {
--ImageScrollbarUp: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAlSURBVDhPYxgFQwD8h9JkAZBmGCYZIGsm2RBsmmF4FAxCwMAAAOXFD/HsWbUtAAAAAElFTkSuQmCCAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA=="); --ImageScrollbarUp: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAlSURBVDhPYxgFQwD8h9JkAZBmGCYZIGsm2RBsmmF4FAxCwMAAAOXFD/HsWbUtAAAAAElFTkSuQmCCAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA==");
@ -125,14 +125,14 @@
[class^="chat_"] > [class^="content_"] [class^="membersWrap_"] { [class^="chat_"] > [class^="content_"] [class^="membersWrap_"] {
padding: 2px; padding: 2px;
/*box-shadow: var(--InnerEdge);*/ box-shadow: var(--InnerEdge);
height: calc(100% - 4px); height: calc(100% - 4px);
max-height: calc(100% - 4px); max-height: calc(100% - 4px);
background-color: var(--Window); background-color: var(--Window);
} }
[class^="messagesWrapper_"] { [class^="messagesWrapper_"] {
padding: 2px; padding: 2px;
/*box-shadow: var(--InnerEdge);*/ box-shadow: var(--InnerEdge);
background-color: var(--Window); background-color: var(--Window);
[class^="scroller_"] { [class^="scroller_"] {
@ -172,7 +172,7 @@
} }
[class^="chatContent_"] > form { [class^="chatContent_"] > form {
background-color: var(--Window) !important; background-color: var(--Window) !important;
padding-bottom: 4px !important; /*padding-bottom: 4px !important;*/
} }
[class^="standardSidebarView_"] > [class^="sidebarRegion_"] > [class^="sidebarRegionScroller_"], [class^="standardSidebarView_"] > [class^="sidebarRegion_"] > [class^="sidebarRegionScroller_"],
@ -289,7 +289,7 @@ div[class^="sidebar_"]:not(:has(> [class^="side_"]))
margin: -4px; margin: -4px;
} }
*:not([class*="menu_"]):not([class*="inGame_"]) > [class^="scroller_"]:not([class*="none_"]), /**:not([class*="menu_"]):not([class*="inGame_"]) > [class^="scroller_"]:not([class*="none_"]),
*:not([class*="menu_"]):not([class*="inGame_"]) > [class*="scrollerBase_"]:not([class*="none_"]) { *:not([class*="menu_"]):not([class*="inGame_"]) > [class*="scrollerBase_"]:not([class*="none_"]) {
&::-webkit-scrollbar { &::-webkit-scrollbar {
min-width: 16px; min-width: 16px;
@ -315,63 +315,53 @@ div[class^="sidebar_"]:not(:has(> [class^="side_"]))
background: #979797 !important; background: #979797 !important;
} }
} }
} }*/
/**:not([class*="menu_"]):not([class*="inGame_"]) > [class^="scroller_"]:not([class*="none_"])::-webkit-scrollbar, *:not([class*="menu_"]):not([class*="inGame_"]) > [class^="scroller_"]:not([class*="none_"]),
*:not([class*="menu_"]):not([class*="inGame_"]) > [class*="scrollerBase_"]:not([class*="none_"])::-webkit-scrollbar { *:not([class*="menu_"]):not([class*="inGame_"]) > [class*="scrollerBase_"]:not([class*="none_"]) {
&::-webkit-scrollbar {
min-width: 16px; min-width: 16px;
width: 16px; width: 16px;
visibility: visible !important; visibility: visible !important;
} }
*:not([class*="menu_"]):not([class*="inGame_"]) > [class^="scroller_"]::-webkit-scrollbar-track, &::-webkit-scrollbar-track {
*:not([class*="menu_"]):not([class*="inGame_"]) > [class*="scrollerBase_"]::-webkit-scrollbar-track {
background-color: #{colors.$c8}; background-color: #{colors.$c8};
border: none; border: none;
border-radius: 0; border-radius: 0;
margin: 0; margin: 0;
visibility: visible !important; visibility: visible !important;
} }
*:not([class*="menu_"]):not([class*="inGame_"]) > [class^="scroller_"]::-webkit-scrollbar-thumb,
*:not([class*="menu_"]):not([class*="inGame_"]) > [class*="scrollerBase_"]::-webkit-scrollbar-thumb, &::-webkit-scrollbar-thumb,
*:not([class*="menu_"]):not([class*="inGame_"]) > [class^="scroller_"]::-webkit-scrollbar-button:single-button, &::-webkit-scrollbar-button:single-button {
*:not([class*="menu_"]):not([class*="inGame_"]) > [class*="scrollerBase_"]::-webkit-scrollbar-button:single-button {
border-radius: 0 !important; border-radius: 0 !important;
background: #{colors.$primary} !important; background: #{colors.$primary} !important;
box-shadow: var(--WindowFrame); box-shadow: var(--WindowFrame);
border: none !important; border: none !important;
visibility: visible !important; visibility: visible !important;
} }
*:not([class*="menu_"]):not([class*="inGame_"]) > [class^="scroller_"]::-webkit-scrollbar-button:single-button:active, &::-webkit-scrollbar-button:single-button:active {
*:not([class*="menu_"]):not([class*="inGame_"])
> [class*="scrollerBase_"]::-webkit-scrollbar-button:single-button:active {
box-shadow: inset 1px 1px #{colors.$secondary}, inset -1px -1px #{colors.$secondary}; box-shadow: inset 1px 1px #{colors.$secondary}, inset -1px -1px #{colors.$secondary};
} }
*:not([class*="menu_"]):not([class*="inGame_"])
> [class^="scroller_"]::-webkit-scrollbar-button:single-button:vertical:decrement, &::-webkit-scrollbar-button:single-button:vertical:decrement {
*:not([class*="menu_"]):not([class*="inGame_"])
> [class*="scrollerBase_"]::-webkit-scrollbar-button:single-button:vertical:decrement {
background-repeat: no-repeat !important; background-repeat: no-repeat !important;
background-image: var(--ImageScrollbarUp) !important; background-image: var(--ImageScrollbarUp) !important;
background-position: center center !important; background-position: center center !important;
} }
*:not([class*="menu_"]):not([class*="inGame_"]) &::-webkit-scrollbar-button:single-button:vertical:increment {
> [class^="scroller_"]::-webkit-scrollbar-button:single-button:vertical:increment,
*:not([class*="menu_"]):not([class*="inGame_"])
> [class*="scrollerBase_"]::-webkit-scrollbar-button:single-button:vertical:increment {
background-repeat: no-repeat !important; background-repeat: no-repeat !important;
background-image: var(--ImageScrollbarDown) !important; background-image: var(--ImageScrollbarDown) !important;
background-position: center center !important; background-position: center center !important;
} }
*:not([class*="menu_"]):not([class*="inGame_"]) &::-webkit-scrollbar-button:single-button:vertical:decrement {
> [class^="scroller_"]::-webkit-scrollbar-button:single-button:vertical:decrement,
*:not([class*="menu_"]):not([class*="inGame_"])
> [class*="scrollerBase_"]::-webkit-scrollbar-button:single-button:vertical:decrement {
border-width: 0 8px 8px 8px; border-width: 0 8px 8px 8px;
border-color: transparent transparent var(--text) transparent; border-color: transparent transparent var(--text) transparent;
}*/ }
}
.postnet-expanded-category, .postnet-expanded-category,
.postnet-repo-wrapper, .postnet-repo-wrapper,
@ -553,12 +543,12 @@ div[class^="sidebar_"]:not(:has(> [class^="side_"]))
section[class^="panels_"] { section[class^="panels_"] {
background-color: var(--Window) !important; background-color: var(--Window) !important;
padding-top: 2px; padding-top: 2px;
/*box-shadow: var(--RebarTop);*/ box-shadow: var(--RebarTop);
& > [class^="wrapper_"] > [class^="container_"] { & > [class^="wrapper_"] > [class^="container_"] {
background-color: var(--Window) !important; background-color: var(--Window) !important;
border-bottom: none; border-bottom: none;
/*box-shadow: var(--RebarBottom);*/ box-shadow: var(--RebarBottom);
} }
& > [class^="panel_"]:has(> [class^="body_"] > [class^="gameWrapper_"]) { & > [class^="panel_"]:has(> [class^="body_"] > [class^="gameWrapper_"]) {
@ -570,7 +560,7 @@ section[class^="panels_"] {
& > [class^="panel_"]:has(> [class^="body_"] > [class^="gameWrapper_"]) > [class^="body_"] { & > [class^="panel_"]:has(> [class^="body_"] > [class^="gameWrapper_"]) > [class^="body_"] {
background-color: var(--Window) !important; background-color: var(--Window) !important;
border-bottom: none; border-bottom: none;
/*box-shadow: var(--RebarBottom);*/ box-shadow: var(--RebarBottom);
padding: 2px 4px; padding: 2px 4px;
[class^="gameWrapper_"] { [class^="gameWrapper_"] {
@ -623,7 +613,7 @@ section[class^="panels_"] {
padding: 4px; padding: 4px;
padding-bottom: 6px; padding-bottom: 6px;
margin: 0 !important; margin: 0 !important;
/*box-shadow: var(--RebarBottom);*/ box-shadow: var(--RebarBottom);
background-color: var(--Window); background-color: var(--Window);
} }
} }
@ -664,7 +654,7 @@ section[class^="panels_"] {
border-radius: 0 !important; border-radius: 0 !important;
border-left: 4px solid var(--Window); border-left: 4px solid var(--Window);
padding: 2px; padding: 2px;
/*box-shadow: var(--RebarBorder);*/ box-shadow: var(--RebarBorder);
& > [class^="container_"] { & > [class^="container_"] {
background: var(--Window) !important; background: var(--Window) !important;
@ -736,16 +726,16 @@ section[class^="panels_"] {
padding: 0; padding: 0;
margin: 3px 2px; margin: 3px 2px;
/*&::after { &::after {
left: 0; left: 0;
height: 1px; height: 1px;
border-bottom: solid 1px var(--ThreeDHighlight); border-bottom: solid 1px var(--ThreeDHighlight);
background-color: var(--ThreeDShadow); background-color: var(--ThreeDShadow);
width: 100%; width: 100%;
}*/
&::after {
display: none;
} }
/*&::after {
display: none;
}*/
& > [class^="textArea_"] { & > [class^="textArea_"] {
margin: 0 2px; margin: 0 2px;
@ -768,39 +758,39 @@ section[class^="panels_"] {
margin: 0; margin: 0;
margin-bottom: 3px; margin-bottom: 3px;
border-radius: 0; border-radius: 0;
/*border: 1px solid transparent; border: 1px solid transparent;
border-top-color: var(--ThreeDShadow); border-top-color: var(--ThreeDShadow);
border-left-color: var(--ThreeDShadow); border-left-color: var(--ThreeDShadow);
border-bottom-color: var(--ThreeDHighlight); border-bottom-color: var(--ThreeDHighlight);
border-right-color: var(--ThreeDHighlight); border-right-color: var(--ThreeDHighlight);
background-color: var(--ThreeDFace); background-color: var(--ThreeDFace);
height: 14px; height: 14px;
width: calc(100% - 2px);*/ width: calc(100% - 2px);
height: 8px; /*height: 8px;
width: 100%; width: 100%;*/
background-color: #3c3c3c; /*background-color: #3c3c3c;
background-image: none; background-image: none;
mask: var(--ProgressBar); mask: var(--ProgressBar);
mask-repeat: repeat-x; mask-repeat: repeat-x;*/
/*& > [class^="progressBar_"] { & > [class^="progressBar_"] {
height: 100%; height: 100%;
border-radius: 0; border-radius: 0;
background-color: var(--Selection); background-color: var(--Selection);
background-image: none; background-image: none;
mask: var(--ProgressBar); mask: var(--ProgressBar);
mask-repeat: repeat-x; mask-repeat: repeat-x;
}*/ }
& > [class^="progressBar_"] { /*& > [class^="progressBar_"] {
height: 100%; height: 100%;
border-radius: 0; border-radius: 0;
background-color: #f7f7f7; background-color: #f7f7f7;
background-image: none; background-image: none;
mask: var(--ProgressBar); mask: var(--ProgressBar);
mask-repeat: repeat-x; mask-repeat: repeat-x;
} }*/
& > [class^="tadaIcon_"] { & > [class^="tadaIcon_"] {
display: none; display: none;
@ -864,7 +854,7 @@ section[class^="panels_"] {
} }
} }
[class^="base_"] > [class^="content_"] > [class^="sidebar_"] > [class^="container_"], /*[class^="base_"] > [class^="content_"] > [class^="sidebar_"] > [class^="container_"],
.overlay [class^="widget_"] > [class^="base_"] > [class^="sidebar_"] > [class^="children_"] > [class^="channelList_"] { .overlay [class^="widget_"] > [class^="base_"] > [class^="sidebar_"] > [class^="children_"] > [class^="channelList_"] {
& > [class^="scroller_"] > [class^="content_"] { & > [class^="scroller_"] > [class^="content_"] {
[class^="containerDefault_"] [class^="iconVisibility_"] { [class^="containerDefault_"] [class^="iconVisibility_"] {
@ -889,7 +879,7 @@ section[class^="panels_"] {
} }
} }
} }
} }*/
[class^="members_"] { [class^="members_"] {
overflow: hidden auto !important; overflow: hidden auto !important;