Skip to content

Commit

Permalink
Merge pull request #94 from FedeIlLeone/main
Browse files Browse the repository at this point in the history 
Complete and fix overlay theming, class name adjustments and minor enhancements
  • Loading branch information
@LuckFire
LuckFire authored Jul 25, 2024
2 parents 7f5d23a + 6d64961 commit 45c2c45
Show file tree
Hide file tree
Showing 20 changed files with 309 additions and 191 deletions.
115 changes: 72 additions & 43 deletions clients/amoled-cord.theme.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -92,7 +92,7 @@ html.theme-dark .theme-light .root_f9a4c9,
--background-secondary: var(--primary-830) !important;
--background-secondary-alt: var(--primary-800) !important;
--background-tertiary: var(--primary-860) !important;
--bg-mod-faint: hsl(var(--black-hsl)) !important;
--bg-mod-faint: var(--black) !important;
--bg-surface-overlay: var(--primary-830) !important;
--bg-surface-raised: var(--primary-700) !important;
--button-outline-primary-background: var(--primary-700) !important;
Expand Down Expand Up @@ -259,8 +259,8 @@ html.theme-dark .theme-light .root_f9a4c9,
) !important;
--bg-mod-faint: color-mix(
in oklab,
hsl(var(--black-hsl)) 100%,
hsl(var(--theme-base-color-hsl, 0 0% 0%) / 0.08) var(--theme-base-color-amount, 0%)
var(--black) 100%,
var(--theme-base-color, black) var(--theme-base-color-amount, 0%)
) !important;
--bg-surface-overlay: color-mix(
in oklab,
Expand Down Expand Up @@ -413,11 +413,11 @@ html.theme-dark .theme-light .root_f9a4c9,
background-color: var(--background-primary);
}

:is(.theme-dark, .theme-midnight) #app-mount .container_e44302 [class*=searchBar] {
:is(.theme-dark, .theme-midnight) #app-mount .container_fc4f04 [class*=searchBar] {
background-color: var(--background-secondary);
}
:is(.theme-dark, .theme-midnight) #app-mount .container_e44302 [class*=searchBar] .searchAnswer_b0fa94,
:is(.theme-dark, .theme-midnight) #app-mount .container_e44302 [class*=searchBar] .searchFilter_b0fa94 {
:is(.theme-dark, .theme-midnight) #app-mount .container_fc4f04 [class*=searchBar] .searchAnswer_b0fa94,
:is(.theme-dark, .theme-midnight) #app-mount .container_fc4f04 [class*=searchBar] .searchFilter_b0fa94 {
background-color: var(--background-primary);
}

Expand Down Expand Up @@ -469,7 +469,7 @@ html.theme-dark .theme-light .root_f9a4c9,
:is(.theme-dark, .theme-midnight) #app-mount .tile_ab47a1 .invalidPoop_ff31dd {
background-color: var(--background-secondary-alt);
}
:is(.theme-dark, .theme-midnight) #app-mount .invite_cdcad9 {
:is(.theme-dark, .theme-midnight) #app-mount .invite_f61cb8 {
border-color: var(--background-secondary-alt);
background-color: var(--background-secondary);
}
Expand Down Expand Up @@ -560,6 +560,10 @@ html.theme-dark .theme-light .root_f9a4c9,
background-color: var(--modal-footer-background);
}

:is(.theme-dark, .theme-midnight) #app-mount .root_f9a4c9 .textArea_a42405 {
background-color: var(--input-background);
}

:is(.theme-dark, .theme-midnight) #app-mount .container_f24a96 {
background-color: var(--modal-background);
}
Expand Down Expand Up @@ -646,41 +650,67 @@ html.theme-dark .theme-light .root_f9a4c9,
background-color: var(--background-primary);
}

:is(.theme-dark, .platform-overlay) .overlayActive_e17343 {
background-color: hsl(var(--primary-900-hsl)/0.75);
:is(.theme-dark, .platform-overlay) .overlayActive_e17343, :is(.theme-dark, .platform-overlay) .invalidContainer_e17343 {
background-color: hsl(var(--primary-900-hsl)/0.8);
}
:is(.theme-dark, .platform-overlay) .layoutUnlocked_e17343 .widget_eb6bd1.default_eb6bd1 {
:is(.theme-dark, .platform-overlay) .inactiveContainer_e17343 {
background-color: var(--background-primary);
}
:is(.theme-dark, .platform-overlay) .previewingInGameHeader_e17343 {
background-color: hsl(var(--primary-900-hsl)/0.9);
}

:is(.theme-dark, .platform-overlay) :is(.contained_ac9afa, .wrapper_c199cc:not(:has(.locked_ac9afa))) .headerContainer_c6d3b6,
:is(.theme-dark, .platform-overlay) :is(.contained_ac9afa, .wrapper_c199cc:not(:has(.locked_ac9afa))) .footer_ac9afa {
background-color: var(--background-primary) !important;
:is(.theme-dark, .platform-overlay) .widget_eb6bd1.default_eb6bd1 {
background-color: var(--background-primary);
}
:is(.theme-dark, .platform-overlay) .widget_eb6bd1.unpinned_eb6bd1 {
background-color: var(--background-tertiary);
}
:is(.theme-dark, .platform-overlay) .bar_eb6bd1 {
background-color: hsl(var(--primary-900-hsl)/0.85);
}
:is(.theme-dark, .platform-overlay) .bar_eb6bd1.default_eb6bd1, :is(.theme-dark, .platform-overlay) .bar_eb6bd1.unpinned_eb6bd1 {
background-color: var(--background-primary);
}
:is(.theme-dark, .platform-overlay) .body_eb6bd1.default_eb6bd1, :is(.theme-dark, .platform-overlay) .body_eb6bd1.unpinned_eb6bd1 {
background-color: var(--background-primary);
}
:is(.theme-dark, .platform-overlay) .body_eb6bd1.pinned_eb6bd1 {
background-color: hsl(var(--primary-900-hsl)/0.75);
}
:is(.theme-dark, .platform-overlay) :is(.contained_ac9afa, .wrapper_c199cc:not(:has(.locked_ac9afa))) .messagesContainer_ac9afa {

:is(.theme-dark, .platform-overlay) .contained_ac9afa {
background-color: var(--background-primary);
}
:is(.theme-dark, .platform-overlay) :is(.contained_ac9afa, .pinned_ac9afa:not(:has(.locked_ac9afa))) .headerDefault_ac9afa[style*="rgb(54, 57, 63)"], :is(.theme-dark, .platform-overlay) :is(.contained_ac9afa, .pinned_ac9afa:not(:has(.locked_ac9afa))) .messagesContainer_ac9afa[style*="rgb(54, 57, 63)"], :is(.theme-dark, .platform-overlay) :is(.contained_ac9afa, .pinned_ac9afa:not(:has(.locked_ac9afa))) .footerContent_ac9afa[style*="rgb(54, 57, 63)"] {
background-color: var(--background-primary) !important;
}
:is(.theme-dark, .platform-overlay) :is(.contained_ac9afa, .pinned_ac9afa:not(:has(.locked_ac9afa))) .headerDefault_ac9afa[style*="rgb(54, 57, 63, 0.75)"], :is(.theme-dark, .platform-overlay) :is(.contained_ac9afa, .pinned_ac9afa:not(:has(.locked_ac9afa))) .messagesContainer_ac9afa[style*="rgb(54, 57, 63, 0.75)"], :is(.theme-dark, .platform-overlay) :is(.contained_ac9afa, .pinned_ac9afa:not(:has(.locked_ac9afa))) .footerContent_ac9afa[style*="rgb(54, 57, 63, 0.75)"] {
background-color: hsl(var(--black-hsl)/0.75) !important;
}
:is(.theme-dark, .platform-overlay) :is(.contained_ac9afa, .pinned_ac9afa:not(:has(.locked_ac9afa))) .headerDefault_ac9afa[style*="rgb(54, 57, 63, 0.25)"], :is(.theme-dark, .platform-overlay) :is(.contained_ac9afa, .pinned_ac9afa:not(:has(.locked_ac9afa))) .messagesContainer_ac9afa[style*="rgb(54, 57, 63, 0.25)"], :is(.theme-dark, .platform-overlay) :is(.contained_ac9afa, .pinned_ac9afa:not(:has(.locked_ac9afa))) .footerContent_ac9afa[style*="rgb(54, 57, 63, 0.25)"] {
background-color: var(var(--black-hsl)/0.25) !important;
}
:is(.theme-dark, .platform-overlay) .opacityHeader_c6d3b6 {
background-color: var(--background-primary);
}
:is(.theme-dark, .platform-overlay) .wrapper_c199cc:has(.default_eb6bd1) .footer_ac9afa,
:is(.theme-dark, .platform-overlay) .wrapper_c199cc:has(.default_eb6bd1) .headerContainer_c6d3b6 {
border-radius: 0px;
}
:is(.theme-dark, .platform-overlay) .background-opacity-high .scrollableContainer_d0696b {
background-color: var(--channeltextarea-background);
}

:is(.theme-dark, .platform-overlay) .themePrimary_b97933.container_b97933 {
background-color: var(--background-primary);
:is(.theme-dark, .platform-overlay) .themePrimary_f6b647.container_f6b647 {
background-color: hsl(var(--primary-900-hsl)/0.95);
}
:is(.theme-dark, .platform-overlay) .themePrimary_b97933.container_b97933:hover {
:is(.theme-dark, .platform-overlay) .themePrimary_f6b647.container_f6b647.clickable_f6b647:hover {
background-color: var(--background-secondary);
}
:is(.theme-dark, .platform-overlay) .themePrimary_b97933 .dismissButton_b97933 {
box-shadow: none;
:is(.theme-dark, .platform-overlay) .themePrimary_f6b647 .divider_f6b647 {
background-color: var(--background-secondary-alt);
}
:is(.theme-dark, .platform-overlay) .themePrimary_f6b647 .dismissButton_f6b647 {
box-shadow: none;
background-color: var(--background-secondary);
}

:is(.theme-dark, .platform-overlay) .option_d2da9c:not(.selected_d2da9c, :hover) {
background-color: var(--primary-600);
Expand All @@ -689,25 +719,25 @@ html.theme-dark .theme-light .root_f9a4c9,
color: var(--primary-600);
}

:is(.theme-dark, .platform-overlay) .sidebar_d86933 {
:is(.theme-dark, .platform-overlay) .sidebar_d86933,
:is(.theme-dark, .platform-overlay) .scroller_c47fa9 {
background-color: var(--background-primary);
}
:is(.theme-dark, .platform-overlay) .sidebar_d86933 .header_d86933,
:is(.theme-dark, .platform-overlay) .sidebar_d86933 .scroller_c47fa9 {
background-color: transparent !important;
:is(.theme-dark, .platform-overlay) .header_d86933,
:is(.theme-dark, .platform-overlay) .base_aabd07 {
background-color: var(--background-primary) !important;
}
:is(.theme-dark, .platform-overlay) .sidebar_d86933 .searchBar_ec7a6d {
box-shadow: none !important;
:is(.theme-dark, .platform-overlay) .searchBar_ec7a6d {
box-shadow: none;
}
:is(.theme-dark, .platform-overlay) .sidebar_d86933 .panels_c0cc4b, :is(.theme-dark, .platform-overlay) .sidebar_d86933 .panels_c0cc4b > div,
:is(.theme-dark, .platform-overlay) .sidebar_d86933 .panels_ec7a6d, :is(.theme-dark, .platform-overlay) .sidebar_d86933 .panels_ec7a6d > div {
:is(.theme-dark, .platform-overlay) .panels_c0cc4b, :is(.theme-dark, .platform-overlay) .panels_c0cc4b > div,
:is(.theme-dark, .platform-overlay) .panels_ec7a6d, :is(.theme-dark, .platform-overlay) .panels_ec7a6d > div {
background-color: var(--background-primary) !important;
}

:is(.theme-dark, .platform-overlay) .widget_eb6bd1.pinned_eb6bd1 .draggableStartArea_cfed93,
:is(.theme-dark, .platform-overlay) .widget_eb6bd1.pinned_eb6bd1 .body_eb6bd1,
:is(.theme-dark, .platform-overlay) .widget_eb6bd1.pinned_eb6bd1 .controls_c5dd04 {
background-color: var(--background-primary);
:is(.theme-dark, .platform-overlay) .controls_c5dd04,
:is(.theme-dark, .platform-overlay) .streamerControls_cfed93 {
background-color: hsl(var(--primary-900-hsl)/0.85);
}

:is(.theme-dark, .theme-midnight) #app-mount .nowPlayingColumn_c2739c .separator_cd82a7 {
Expand Down Expand Up @@ -910,13 +940,6 @@ body .contentWrapper-3RqEiS .accordionContainer-vSTU_l {
background-color: var(--background-primary);
}

:is(.theme-dark, .theme-midnight) #app-mount .container_bcd8cb .header_bcd8cb, :is(.theme-dark, .theme-midnight) #app-mount .container_bcd8cb .autocompleteArrow_bcd8cb {
background-color: var(--background-tertiary);
}
:is(.theme-dark, .theme-midnight) #app-mount .container_bcd8cb .sectionTag_bcd8cb {
background-color: var(--background-secondary);
}

:is(.theme-dark, .theme-midnight) #app-mount .customColorPicker_b91d66 {
border: none;
box-shadow: var(--dark-elevation-border), var(--dark-elevation-high);
Expand Down Expand Up @@ -1011,7 +1034,10 @@ body .contentWrapper-3RqEiS .accordionContainer-vSTU_l {
:is(.theme-dark, .theme-midnight) #app-mount .layers_d4b6c5 .tierHeaderContent_da77bd {
background-color: var(--background-secondary);
}
:is(.theme-dark, .theme-midnight) #app-mount .layers_d4b6c5 .prefixInput_c29b00 {
:is(.theme-dark, .theme-midnight) #app-mount .layers_d4b6c5 .background_a4fd01 {
color: var(--background-secondary-alt);
}
:is(.theme-dark, .theme-midnight) #app-mount .layers_d4b6c5 .prefixInput_a6236d {
background-color: var(--input-background);
}
:is(.theme-dark, .theme-midnight) #app-mount .layers_d4b6c5 .backgroundContainer_ceff93 {
Expand Down Expand Up @@ -1132,6 +1158,9 @@ body .contentWrapper-3RqEiS .accordionContainer-vSTU_l {
:is(.theme-dark, .theme-midnight) #app-mount .sidebar_a4d4d9 .container_fd6364:not(.hasBanner_fd6364) .header_fd6364:hover {
background-color: var(--background-secondary);
}
:is(.theme-dark, .theme-midnight) #app-mount .sidebar_a4d4d9 .bannerImage_fd6364:before {
background: linear-gradient(to bottom, var(--primary-900), transparent 100%);
}
:is(.theme-dark, .theme-midnight) #app-mount .sidebar_a4d4d9 .hasBanner_fd6364 [class*=scroller-] {
background-color: transparent;
}
Expand Down
Loading

0 comments on commit 45c2c45

Please sign in to comment.