initial
This commit is contained in:
fwastring
commit
0e36ef638a
1 changed files with 712 additions and 0 deletions
712
index.css
Normal file
712
index.css
Normal file
|
|
@ -0,0 +1,712 @@
|
||||||
|
/* Catppuccin Mocha palette and theme tokens */
|
||||||
|
:root {
|
||||||
|
--ctp-mocha-base: #1e1e2e;
|
||||||
|
--ctp-mocha-mantle: #181825;
|
||||||
|
--ctp-mocha-crust: #11111b;
|
||||||
|
--ctp-mocha-surface0: #313244;
|
||||||
|
--ctp-mocha-surface1: #45475a;
|
||||||
|
--ctp-mocha-surface2: #585b70;
|
||||||
|
--ctp-mocha-overlay0: #6c7086;
|
||||||
|
--ctp-mocha-text: #cdd6f4;
|
||||||
|
--ctp-mocha-accent: #fab387;
|
||||||
|
|
||||||
|
--theme-colors-background: var(--ctp-mocha-base);
|
||||||
|
--theme-colors-background-alternate: var(--ctp-mocha-surface0);
|
||||||
|
--theme-colors-surface: var(--ctp-mocha-surface1);
|
||||||
|
--theme-colors-foreground: var(--ctp-mocha-text);
|
||||||
|
--theme-colors-border: var(--ctp-mocha-overlay0);
|
||||||
|
--theme-colors-primary-filled: var(--ctp-mocha-accent);
|
||||||
|
--theme-colors-primary-contrast: var(--ctp-mocha-base);
|
||||||
|
}
|
||||||
|
|
||||||
|
.fs-window-bar-module-windows-container {
|
||||||
|
height:2rem;
|
||||||
|
}
|
||||||
|
body > div:not(#root) {
|
||||||
|
height:100%;
|
||||||
|
}
|
||||||
|
body, html {
|
||||||
|
background-color:initial;
|
||||||
|
background-clip:initial;
|
||||||
|
background-origin:initial;
|
||||||
|
background-attachment:initial;
|
||||||
|
background-repeat:initial;
|
||||||
|
background-size:initial;
|
||||||
|
background-position-y:initial;
|
||||||
|
background-position-x:initial;
|
||||||
|
background-image:none;
|
||||||
|
}
|
||||||
|
#sidebar-queue .fs-virtual-grid-wrapper-module-virtual-grid-container .fs-virtual-grid-wrapper-module-virtual-grid-auto-sizer-container .fs-virtual-table-module-table-wrapper .ag-root-wrapper .ag-root-wrapper-body .ag-body-viewport {
|
||||||
|
padding-bottom:100px;
|
||||||
|
}
|
||||||
|
.fs-feature-carousel-module-carousel .fs-badge-module-root:hover {
|
||||||
|
cursor:pointer;
|
||||||
|
}
|
||||||
|
.fs-context-menu-module-context-menu-button:not(:hover) {
|
||||||
|
background-image:unset !important;
|
||||||
|
background-position-x:unset !important;
|
||||||
|
background-position-y:unset !important;
|
||||||
|
background-size:unset !important;
|
||||||
|
background-repeat:unset !important;
|
||||||
|
background-attachment:unset !important;
|
||||||
|
background-origin:unset !important;
|
||||||
|
background-clip:unset !important;
|
||||||
|
background-color:unset !important;
|
||||||
|
}
|
||||||
|
.fs-button-module-root {
|
||||||
|
background-color:transparent;
|
||||||
|
}
|
||||||
|
.fs-playerbar-module-container .fs-left-controls-module-image-wrapper .fs-left-controls-module-image .fs-image-module-unloader, .fs-poster-card-module-image-container, .fs-image-module-image {
|
||||||
|
border-top-left-radius:10px;
|
||||||
|
border-top-right-radius:10px;
|
||||||
|
border-bottom-right-radius:10px;
|
||||||
|
border-bottom-left-radius:10px;
|
||||||
|
}
|
||||||
|
.fs-text-input-module-root .mantine-Input-wrapper .fs-text-input-module-input, .fs-action-icon-module-root, .fs-select-module-input, .fs-number-input-module-input, .fs-color-input-module-input, .mantine-Popover-dropdown, .fs-multi-select-module-input, .fs-button-module-root {
|
||||||
|
border-top-left-radius:15px;
|
||||||
|
border-top-right-radius:15px;
|
||||||
|
border-bottom-right-radius:15px;
|
||||||
|
border-bottom-left-radius:15px;
|
||||||
|
}
|
||||||
|
.fs-badge-module-root {
|
||||||
|
border-top-left-radius:100px;
|
||||||
|
border-top-right-radius:100px;
|
||||||
|
border-bottom-right-radius:100px;
|
||||||
|
border-bottom-left-radius:100px;
|
||||||
|
padding-top:0.2rem;
|
||||||
|
padding-right:0.5rem;
|
||||||
|
padding-bottom:0.2rem;
|
||||||
|
padding-left:0.5rem;
|
||||||
|
font-size:0.8rem;
|
||||||
|
font-weight:500;
|
||||||
|
line-height:1.2rem;
|
||||||
|
background-color:var(--theme-colors-primary-filled);
|
||||||
|
color:var(--theme-colors-primary-contrast);
|
||||||
|
}
|
||||||
|
#drawer-queue, #sidebar-queue, #player-bar, .fs-main-content-module-sidebar-collapsed #sidebar, .fs-main-content-module-sidebar-expanded #left-sidebar, .fs-context-menu-module-container, .fs-animated-page-module-animated-page, .fs-popover-module-dropdown, .fs-dropdown-menu-module-menu-dropdown, main:has(div > .fs-feature-carousel-module-wrapper) .fs-page-header-module-header, main:has(div > .fs-library-header-module-library-header) .fs-page-header-module-header, main:has(div > .fs-album-detail-content-module-content-container) .fs-page-header-module-header, main:has(div > .fs-album-detail-content-module-content-container) .ag-header.ag-header-window-bar, .fs-context-menu-module-context-menu-button:hover, .fs-dropdown-menu-module-menu-item:hover {
|
||||||
|
background-color:color-mix(in srgb, var(--theme-colors-background-alternate) 47%, transparent) !important;
|
||||||
|
background-image:initial;
|
||||||
|
background-position-x:initial;
|
||||||
|
background-position-y:initial;
|
||||||
|
background-size:initial;
|
||||||
|
background-repeat:initial;
|
||||||
|
background-attachment:initial;
|
||||||
|
background-origin:initial;
|
||||||
|
background-clip:initial;
|
||||||
|
backdrop-filter:blur(8.1px);
|
||||||
|
box-shadow:rgba(0, 0, 0, 0.1) 0px 4px 30px;
|
||||||
|
border-bottom-left-radius:16px;
|
||||||
|
border-bottom-right-radius:16px;
|
||||||
|
border-top-right-radius:16px;
|
||||||
|
border-top-left-radius:16px;
|
||||||
|
}
|
||||||
|
.ag-header.ag-header-window-bar {
|
||||||
|
margin-top:-1rem;
|
||||||
|
}
|
||||||
|
main:has(div > .fs-album-detail-content-module-content-container):has(.ag-header.ag-header-window-bar) .fs-page-header-module-header {
|
||||||
|
border-bottom-left-radius:0px;
|
||||||
|
border-bottom-right-radius:0px;
|
||||||
|
}
|
||||||
|
.fs-album-detail-content-module-content-container .fs-library-background-overlay-module-root {
|
||||||
|
left:0px;
|
||||||
|
top:0px;
|
||||||
|
position:absolute;
|
||||||
|
}
|
||||||
|
.fs-album-detail-content-module-content-container .ag-header {
|
||||||
|
background-color:unset;
|
||||||
|
}
|
||||||
|
.fs-album-detail-content-module-content-container * {
|
||||||
|
--ag-odd-row-background-color: none !important;
|
||||||
|
--ag-background-color: none !important;
|
||||||
|
}
|
||||||
|
.fs-album-detail-content-module-detail-container {
|
||||||
|
padding-left:0px;
|
||||||
|
padding-bottom:0px;
|
||||||
|
padding-right:0px;
|
||||||
|
padding-top:0px;
|
||||||
|
}
|
||||||
|
div:has(.fs-album-detail-content-module-content-container) > div > .fs-library-header-module-library-header {
|
||||||
|
max-height:unset;
|
||||||
|
min-height:unset;
|
||||||
|
height:20rem;
|
||||||
|
padding-left:1rem;
|
||||||
|
padding-bottom:2rem;
|
||||||
|
padding-right:1rem;
|
||||||
|
padding-top:1rem;
|
||||||
|
}
|
||||||
|
.fs-album-detail-content-module-content-container {
|
||||||
|
border-top-right-radius:0px;
|
||||||
|
border-top-left-radius:0px;
|
||||||
|
padding-left:1rem;
|
||||||
|
padding-bottom:1rem;
|
||||||
|
padding-right:1rem;
|
||||||
|
padding-top:1rem;
|
||||||
|
}
|
||||||
|
main > .fs-native-scroll-area-module-scroll-area {
|
||||||
|
height:calc(-6rem + 100vh);
|
||||||
|
}
|
||||||
|
.fs-album-artist-detail-content-module-detail-container {
|
||||||
|
border-top-left-radius:0px;
|
||||||
|
border-top-right-radius:0px;
|
||||||
|
padding-left:1rem;
|
||||||
|
padding-bottom:1rem;
|
||||||
|
padding-right:1rem;
|
||||||
|
padding-top:1rem;
|
||||||
|
}
|
||||||
|
.fs-album-artist-detail-content-module-detail-container * {
|
||||||
|
--ag-odd-row-background-color: none !important;
|
||||||
|
--ag-background-color: none !important;
|
||||||
|
}
|
||||||
|
div:has(.fs-album-artist-detail-content-module-content-container) > div > .fs-library-header-module-library-header {
|
||||||
|
max-height:unset;
|
||||||
|
min-height:unset;
|
||||||
|
height:20rem;
|
||||||
|
padding-left:1rem;
|
||||||
|
padding-bottom:2rem;
|
||||||
|
padding-right:1rem;
|
||||||
|
padding-top:1rem;
|
||||||
|
}
|
||||||
|
main > div > div:has(.fs-tabs-module-root) .fs-tabs-module-panel {
|
||||||
|
overflow-y:scroll;
|
||||||
|
}
|
||||||
|
main > div > div:has(.fs-tabs-module-root) {
|
||||||
|
border-top-right-radius:0px;
|
||||||
|
border-top-left-radius:0px;
|
||||||
|
overflow-y:hidden;
|
||||||
|
overflow-x:hidden;
|
||||||
|
padding-left:1rem;
|
||||||
|
padding-bottom:1rem;
|
||||||
|
padding-right:1rem;
|
||||||
|
padding-top:1rem;
|
||||||
|
}
|
||||||
|
main:has(.fs-tabs-module-root) .fs-page-header-module-header {
|
||||||
|
box-shadow:unset !important;
|
||||||
|
border-bottom-right-radius:0px !important;
|
||||||
|
border-bottom-left-radius:0px !important;
|
||||||
|
}
|
||||||
|
main .fs-feature-carousel-module-wrapper .fs-feature-carousel-module-info-column > .mantine-Stack-root > div:has(button) > div {
|
||||||
|
right:1rem;
|
||||||
|
bottom:1rem;
|
||||||
|
position:absolute;
|
||||||
|
}
|
||||||
|
main > div > div > div:has(.fs-feature-carousel-module-wrapper) > .grid-carousel:first-of-type {
|
||||||
|
margin-top:16rem;
|
||||||
|
}
|
||||||
|
main > div > div > div:has(.fs-feature-carousel-module-wrapper) {
|
||||||
|
margin-bottom:unset !important;
|
||||||
|
padding-inline-end:unset !important;
|
||||||
|
padding-inline-start:unset !important;
|
||||||
|
padding-left:1rem !important;
|
||||||
|
padding-bottom:1rem !important;
|
||||||
|
padding-right:1rem !important;
|
||||||
|
padding-top:1rem !important;
|
||||||
|
}
|
||||||
|
main .fs-feature-carousel-module-wrapper .fs-feature-carousel-module-background-image {
|
||||||
|
filter:blur(12px);
|
||||||
|
height:100%;
|
||||||
|
width:100%;
|
||||||
|
}
|
||||||
|
main .fs-feature-carousel-module-wrapper > div > * {
|
||||||
|
align-items:center;
|
||||||
|
}
|
||||||
|
main .fs-feature-carousel-module-carousel {
|
||||||
|
max-height:unset;
|
||||||
|
min-height:unset;
|
||||||
|
height:16rem;
|
||||||
|
}
|
||||||
|
main .fs-feature-carousel-module-wrapper {
|
||||||
|
max-height:unset;
|
||||||
|
height:16rem;
|
||||||
|
left:0px;
|
||||||
|
top:0px;
|
||||||
|
position:absolute;
|
||||||
|
}
|
||||||
|
main:has(.fs-virtual-grid-wrapper-module-virtual-grid-auto-sizer-container:last-child) > div:nth-child(2):not(:last-child) > div {
|
||||||
|
width:unset !important;
|
||||||
|
padding-left:1rem !important;
|
||||||
|
padding-bottom:1rem !important;
|
||||||
|
padding-right:1rem !important;
|
||||||
|
padding-top:1rem !important;
|
||||||
|
box-shadow:unset;
|
||||||
|
border-bottom-left-radius:unset;
|
||||||
|
border-bottom-right-radius:unset;
|
||||||
|
border-top-right-radius:unset;
|
||||||
|
border-top-left-radius:unset;
|
||||||
|
margin-left:0px;
|
||||||
|
margin-bottom:0px;
|
||||||
|
margin-right:0px;
|
||||||
|
margin-top:0px;
|
||||||
|
}
|
||||||
|
#default-layout:not(:has(.fs-window-bar-module-windows-container)) {
|
||||||
|
grid-template-rows:0px calc(-9rem + 100vh) 6rem;
|
||||||
|
}
|
||||||
|
#default-layout:has(.fs-window-bar-module-windows-container) {
|
||||||
|
grid-template-rows:2rem calc(-11rem + 100vh) 6rem;
|
||||||
|
}
|
||||||
|
#default-layout {
|
||||||
|
column-gap:1rem;
|
||||||
|
row-gap:1rem;
|
||||||
|
background-color:var(--theme-colors-background);
|
||||||
|
}
|
||||||
|
#main-content {
|
||||||
|
column-gap:1rem;
|
||||||
|
row-gap:1rem;
|
||||||
|
height:100%;
|
||||||
|
background-color:unset;
|
||||||
|
background-clip:unset;
|
||||||
|
background-origin:unset;
|
||||||
|
background-attachment:unset;
|
||||||
|
background-repeat:unset;
|
||||||
|
background-size:unset;
|
||||||
|
background-position-y:unset;
|
||||||
|
background-position-x:unset;
|
||||||
|
background-image:unset;
|
||||||
|
}
|
||||||
|
.fs-main-content-module-right-expanded main {
|
||||||
|
width:calc(100% - 1rem);
|
||||||
|
}
|
||||||
|
main > div > .fs-filter-bar-module-filter-bar {
|
||||||
|
box-shadow:unset;
|
||||||
|
border-bottom-left-radius:unset;
|
||||||
|
border-bottom-right-radius:unset;
|
||||||
|
border-top-right-radius:unset;
|
||||||
|
border-top-left-radius:unset;
|
||||||
|
}
|
||||||
|
.ag-header {
|
||||||
|
background-color:unset;
|
||||||
|
background-clip:unset;
|
||||||
|
background-origin:unset;
|
||||||
|
background-attachment:unset;
|
||||||
|
background-repeat:unset;
|
||||||
|
background-size:unset;
|
||||||
|
background-position-y:unset;
|
||||||
|
background-position-x:unset;
|
||||||
|
background-image:unset;
|
||||||
|
}
|
||||||
|
main > .fs-virtual-grid-wrapper-module-virtual-grid-auto-sizer-container * {
|
||||||
|
--ag-odd-row-background-color: unset !important;
|
||||||
|
--ag-background-color: unset !important;
|
||||||
|
--ag-header-background-color: unset !important;
|
||||||
|
}
|
||||||
|
main.fs-animated-page-module-animated-page > .fs-virtual-grid-wrapper-module-virtual-grid-auto-sizer-container > div > div {
|
||||||
|
padding-left:1rem;
|
||||||
|
padding-bottom:1rem;
|
||||||
|
padding-right:1rem;
|
||||||
|
padding-top:1rem;
|
||||||
|
}
|
||||||
|
main > .fs-virtual-grid-wrapper-module-virtual-grid-auto-sizer-container {
|
||||||
|
border-top-right-radius:unset;
|
||||||
|
border-top-left-radius:unset;
|
||||||
|
max-height:calc(-16rem + 100vh);
|
||||||
|
}
|
||||||
|
.fs-page-header-module-header:has(.fs-library-header-bar-module-play-button-container) {
|
||||||
|
margin-left:0px;
|
||||||
|
margin-bottom:0px;
|
||||||
|
margin-right:0px;
|
||||||
|
margin-top:0px;
|
||||||
|
}
|
||||||
|
.fs-library-header-bar-module-header-container:has(.fs-library-header-bar-module-play-button-container) {
|
||||||
|
padding-left:0px;
|
||||||
|
padding-bottom:0px;
|
||||||
|
padding-right:0px;
|
||||||
|
padding-top:0px;
|
||||||
|
}
|
||||||
|
#main-content main .fs-page-header-module-title-wrapper .mantine-Group-root > .fs-text-input-module-root {
|
||||||
|
width:unset !important;
|
||||||
|
}
|
||||||
|
#main-content main .fs-page-header-module-title-wrapper .mantine-Group-root:has(.fs-text-input-module-root) {
|
||||||
|
margin-right:1rem;
|
||||||
|
}
|
||||||
|
.fs-library-header-bar-module-header-container {
|
||||||
|
padding-left:1rem;
|
||||||
|
padding-bottom:0px;
|
||||||
|
padding-right:0px;
|
||||||
|
padding-top:0px;
|
||||||
|
}
|
||||||
|
#main-content main .fs-page-header-module-background-image, #main-content main .fs-page-header-module-background-image-overlay {
|
||||||
|
opacity:0;
|
||||||
|
}
|
||||||
|
.fs-animated-page-module-animated-page:has(.fs-virtual-grid-wrapper-module-virtual-grid-auto-sizer-container) .fs-page-header-module-header {
|
||||||
|
box-shadow:unset !important;
|
||||||
|
border-bottom-right-radius:0px !important;
|
||||||
|
border-bottom-left-radius:0px !important;
|
||||||
|
}
|
||||||
|
.fs-page-header-module-container {
|
||||||
|
padding-left:0px !important;
|
||||||
|
padding-bottom:0px !important;
|
||||||
|
padding-right:0px !important;
|
||||||
|
padding-top:0px !important;
|
||||||
|
height:5rem;
|
||||||
|
}
|
||||||
|
.fs-library-header-bar-module-play-button-container {
|
||||||
|
margin-left:1rem;
|
||||||
|
}
|
||||||
|
#main-content main .fs-page-header-module-header {
|
||||||
|
min-height:4rem;
|
||||||
|
margin-right:0rem;
|
||||||
|
}
|
||||||
|
#sidebar-queue * {
|
||||||
|
--ag-odd-row-background-color: unset !important;
|
||||||
|
--ag-background-color: unset !important;
|
||||||
|
--ag-header-background-color: unset !important;
|
||||||
|
background-color:unset;
|
||||||
|
}
|
||||||
|
#default-layout:not(:has(.fs-window-bar-module-windows-container)) #sidebar-queue {
|
||||||
|
max-height:calc(-9rem + 100vh);
|
||||||
|
}
|
||||||
|
#default-layout:has(.fs-window-bar-module-windows-container) #sidebar-queue {
|
||||||
|
max-height:calc(-11rem + 100vh);
|
||||||
|
}
|
||||||
|
#sidebar-queue {
|
||||||
|
margin-left:-1rem;
|
||||||
|
}
|
||||||
|
#default-layout .fs-collapsed-sidebar-module-sidebar-container > div > div:first-child {
|
||||||
|
justify-content:center;
|
||||||
|
}
|
||||||
|
#sidebar .fs-resize-handle-module-handle-right, #sidebar .fs-resize-handle-module-handle-right::before {
|
||||||
|
max-height:calc(-10rem + 100vh);
|
||||||
|
}
|
||||||
|
#left-sidebar {
|
||||||
|
max-height:calc(-9rem + 100vh);
|
||||||
|
}
|
||||||
|
#default-layout:not(:has(.fs-window-bar-module-windows-container)) #sidebar {
|
||||||
|
max-height:calc(-9rem + 100vh);
|
||||||
|
}
|
||||||
|
#default-layout:has(.fs-window-bar-module-windows-container) #sidebar {
|
||||||
|
max-height:calc(-11rem + 100vh);
|
||||||
|
}
|
||||||
|
#sidebar {
|
||||||
|
margin-left:1rem;
|
||||||
|
}
|
||||||
|
#left-sidebar .fs-sidebar-module-accordion-content, #left-sidebar .fs-accordion-module-panel, .fs-main-content-module-sidebar-expanded #sidebar {
|
||||||
|
background-color:initial;
|
||||||
|
background-clip:initial;
|
||||||
|
background-origin:initial;
|
||||||
|
background-attachment:initial;
|
||||||
|
background-repeat:initial;
|
||||||
|
background-size:initial;
|
||||||
|
background-position-y:initial;
|
||||||
|
background-position-x:initial;
|
||||||
|
background-image:none;
|
||||||
|
}
|
||||||
|
#drawer-queue > div > div {
|
||||||
|
background-color:unset !important;
|
||||||
|
border-top-left-radius:unset;
|
||||||
|
border-top-right-radius:unset;
|
||||||
|
border-bottom-right-radius:unset;
|
||||||
|
border-bottom-left-radius:unset;
|
||||||
|
background-image:unset;
|
||||||
|
background-position-x:unset;
|
||||||
|
background-position-y:unset;
|
||||||
|
background-size:unset;
|
||||||
|
background-repeat:unset;
|
||||||
|
background-attachment:unset;
|
||||||
|
background-origin:unset;
|
||||||
|
background-clip:unset;
|
||||||
|
}
|
||||||
|
#drawer-queue *, .fs-context-menu-module-container *, .fs-popover-module-dropdown *, .fs-dropdown-menu-module-menu-dropdown * {
|
||||||
|
--ag-background-color: unset !important;
|
||||||
|
--ag-odd-row-background-color: unset !important;
|
||||||
|
--ag-header-background-color: unset !important;
|
||||||
|
}
|
||||||
|
#default-layout:not(:has(.fs-window-bar-module-windows-container)) #drawer-queue {
|
||||||
|
height:calc(-9rem + 100vh) !important;
|
||||||
|
}
|
||||||
|
#default-layout:has(.fs-window-bar-module-windows-container) #drawer-queue {
|
||||||
|
height:calc(-11rem + 100vh) !important;
|
||||||
|
}
|
||||||
|
#drawer-queue {
|
||||||
|
right:1rem !important;
|
||||||
|
top:0px !important;
|
||||||
|
z-index:201 !important;
|
||||||
|
}
|
||||||
|
#player-bar > .fs-playerbar-module-container {
|
||||||
|
width:100%;
|
||||||
|
}
|
||||||
|
#player-bar {
|
||||||
|
margin-right:1rem;
|
||||||
|
margin-left:1rem;
|
||||||
|
}
|
||||||
|
#player-bar ._image_ly86j_1 button, #player-bar .fs-left-controls-module-image-wrapper button {
|
||||||
|
display:none;
|
||||||
|
}
|
||||||
|
#default-layout .fs-full-screen-player-module-container {
|
||||||
|
height:100vh !important;
|
||||||
|
padding-top:1rem !important;
|
||||||
|
padding-right:1rem !important;
|
||||||
|
padding-bottom:9rem !important;
|
||||||
|
padding-left:1rem !important;
|
||||||
|
}
|
||||||
|
#default-layout .fs-full-screen-player-module-responsive-container {
|
||||||
|
margin-top:2rem;
|
||||||
|
}
|
||||||
|
.fs-full-screen-player-module-responsive-container {
|
||||||
|
display:flex;
|
||||||
|
flex-direction:row;
|
||||||
|
}
|
||||||
|
.fs-full-screen-player-module-container .full-screen-player-queue-container {
|
||||||
|
position:absolute;
|
||||||
|
top:calc(50% - 25px);
|
||||||
|
right:2rem;
|
||||||
|
width:70px;
|
||||||
|
height:70px;
|
||||||
|
margin-top:auto;
|
||||||
|
margin-bottom:auto;
|
||||||
|
transition-behavior:normal;
|
||||||
|
transition-duration:2s;
|
||||||
|
transition-timing-function:ease;
|
||||||
|
transition-delay:0s;
|
||||||
|
transition-property:width;
|
||||||
|
}
|
||||||
|
.fs-full-screen-player-queue-module-grid-container:not(:hover)::before {
|
||||||
|
opacity:1 !important;
|
||||||
|
padding-top:17px;
|
||||||
|
text-align:center;
|
||||||
|
background-color:var(--theme-colors-surface);
|
||||||
|
color:var(--theme-colors-foreground);
|
||||||
|
font-size:3rem;
|
||||||
|
content: "<" !important;
|
||||||
|
transition-property:opacity;
|
||||||
|
transition-delay:0s;
|
||||||
|
transition-timing-function:ease;
|
||||||
|
transition-duration:0.3s;
|
||||||
|
transition-behavior:normal;
|
||||||
|
height:50px;
|
||||||
|
width:50px;
|
||||||
|
z-index:201;
|
||||||
|
border-bottom-left-radius:20px;
|
||||||
|
border-bottom-right-radius:20px;
|
||||||
|
border-top-right-radius:20px;
|
||||||
|
border-top-left-radius:20px;
|
||||||
|
}
|
||||||
|
.fs-full-screen-player-queue-module-grid-container:not(:hover) * {
|
||||||
|
display:none;
|
||||||
|
}
|
||||||
|
.fs-full-screen-player-queue-module-grid-container:hover::before {
|
||||||
|
margin-right:initial;
|
||||||
|
border-top-width:initial;
|
||||||
|
border-top-style:initial;
|
||||||
|
border-top-color:initial;
|
||||||
|
border-bottom-width:initial;
|
||||||
|
border-bottom-style:initial;
|
||||||
|
border-bottom-color:initial;
|
||||||
|
border-right-width:initial;
|
||||||
|
border-right-style:initial;
|
||||||
|
border-right-color:initial;
|
||||||
|
z-index:unset;
|
||||||
|
width:100%;
|
||||||
|
height:100%;
|
||||||
|
opacity:var(--opacity, 1);
|
||||||
|
border-bottom-left-radius:20px;
|
||||||
|
border-bottom-right-radius:20px;
|
||||||
|
border-top-right-radius:20px;
|
||||||
|
border-top-left-radius:20px;
|
||||||
|
}
|
||||||
|
.full-screen-player-image-container {
|
||||||
|
flex-grow:1;
|
||||||
|
}
|
||||||
|
.fs-full-screen-player-module-container .full-screen-player-queue-container:hover {
|
||||||
|
width:initial;
|
||||||
|
height:initial;
|
||||||
|
margin-top:initial;
|
||||||
|
margin-bottom:initial;
|
||||||
|
position:relative;
|
||||||
|
top:initial;
|
||||||
|
right:initial;
|
||||||
|
flex-grow:1;
|
||||||
|
}
|
||||||
|
#default-layout:not(:has(.fs-window-bar-module-windows-container)) .fs-full-screen-player-module-background-image-overlay {
|
||||||
|
top:0px;
|
||||||
|
}
|
||||||
|
#default-layout:has(.fs-window-bar-module-windows-container) .fs-full-screen-player-module-background-image-overlay {
|
||||||
|
top:2rem;
|
||||||
|
}
|
||||||
|
.fs-full-screen-player-module-background-image-overlay {
|
||||||
|
position:fixed;
|
||||||
|
}
|
||||||
|
.full-screen-player-image {
|
||||||
|
border-top-left-radius:17px;
|
||||||
|
border-top-right-radius:17px;
|
||||||
|
border-bottom-right-radius:17px;
|
||||||
|
border-bottom-left-radius:17px;
|
||||||
|
}
|
||||||
|
@media screen and (width >= 950px) and (width < 1100px){
|
||||||
|
.fs-playerbar-module-right-grid-item .fs-playerbar-slider-module-root {
|
||||||
|
width:calc(7rem * var(--mantine-scale)) !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media screen and (width >= 1000px) and (width < 1800px){
|
||||||
|
.fs-playerbar-module-right-grid-item .fs-playerbar-slider-module-root {
|
||||||
|
width:calc(8rem * var(--mantine-scale)) !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media screen and (width >= 1800px){
|
||||||
|
.fs-playerbar-module-right-grid-item .fs-playerbar-slider-module-root {
|
||||||
|
width:calc(10rem * var(--mantine-scale)) !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.ag-header-viewport {
|
||||||
|
background-color:var(--ctp-mocha-surface1);
|
||||||
|
background-clip:initial;
|
||||||
|
background-origin:initial;
|
||||||
|
background-attachment:initial;
|
||||||
|
background-repeat:initial;
|
||||||
|
background-size:initial;
|
||||||
|
background-position-y:initial;
|
||||||
|
background-position-x:initial;
|
||||||
|
background-image:initial;
|
||||||
|
}
|
||||||
|
.fs-right-sidebar-module-right-sidebar-container {
|
||||||
|
background-color:var(--ctp-mocha-surface1);
|
||||||
|
background-clip:initial;
|
||||||
|
background-origin:initial;
|
||||||
|
background-attachment:initial;
|
||||||
|
background-repeat:initial;
|
||||||
|
background-size:initial;
|
||||||
|
background-position-y:initial;
|
||||||
|
background-position-x:initial;
|
||||||
|
background-image:initial;
|
||||||
|
}
|
||||||
|
.fs-feature-carousel-module-carousel .fs-poster-card-module-image-container {
|
||||||
|
border-bottom-left-radius:22px !important;
|
||||||
|
border-bottom-right-radius:22px !important;
|
||||||
|
border-top-right-radius:22px !important;
|
||||||
|
border-top-left-radius:22px !important;
|
||||||
|
overflow-y:hidden;
|
||||||
|
overflow-x:hidden;
|
||||||
|
}
|
||||||
|
.fs-feature-carousel-module-carousel {
|
||||||
|
border-bottom-left-radius:22px;
|
||||||
|
border-bottom-right-radius:22px;
|
||||||
|
border-top-right-radius:22px;
|
||||||
|
border-top-left-radius:22px;
|
||||||
|
height:0px;
|
||||||
|
}
|
||||||
|
.fs-sidebar-item-module-inner svg {
|
||||||
|
stroke-width:1.8px;
|
||||||
|
}
|
||||||
|
.mantine-Modal-content {
|
||||||
|
border-bottom-left-radius:22px !important;
|
||||||
|
border-bottom-right-radius:22px !important;
|
||||||
|
border-top-right-radius:22px !important;
|
||||||
|
border-top-left-radius:22px !important;
|
||||||
|
}
|
||||||
|
.mantine-Popover-dropdown {
|
||||||
|
border-bottom-left-radius:16px;
|
||||||
|
border-bottom-right-radius:16px;
|
||||||
|
border-top-right-radius:16px;
|
||||||
|
border-top-left-radius:16px;
|
||||||
|
}
|
||||||
|
.mantine-Input-input {
|
||||||
|
border-top-left-radius:16px !important;
|
||||||
|
border-top-right-radius:16px !important;
|
||||||
|
border-bottom-right-radius:16px !important;
|
||||||
|
border-bottom-left-radius:16px !important;
|
||||||
|
}
|
||||||
|
.mantine-Button-root {
|
||||||
|
border-top-left-radius:16px;
|
||||||
|
border-top-right-radius:16px;
|
||||||
|
border-bottom-right-radius:16px;
|
||||||
|
border-bottom-left-radius:16px;
|
||||||
|
padding-left:18px;
|
||||||
|
padding-right:18px;
|
||||||
|
}
|
||||||
|
.fs-poster-card-module-image-container {
|
||||||
|
border-top-left-radius:16px;
|
||||||
|
border-top-right-radius:16px;
|
||||||
|
border-bottom-right-radius:16px;
|
||||||
|
border-bottom-left-radius:16px;
|
||||||
|
}
|
||||||
|
.fs-feature-carousel-module-carousel .fs-image-module-image-container {
|
||||||
|
border-top-left-radius:16px;
|
||||||
|
border-top-right-radius:16px;
|
||||||
|
border-bottom-right-radius:16px;
|
||||||
|
border-bottom-left-radius:16px;
|
||||||
|
overflow-x:hidden;
|
||||||
|
overflow-y:hidden;
|
||||||
|
}
|
||||||
|
.fs-dropdown-menu-module-menu-dropdown {
|
||||||
|
border-top-left-radius:22px;
|
||||||
|
border-top-right-radius:22px;
|
||||||
|
border-bottom-right-radius:22px;
|
||||||
|
border-bottom-left-radius:22px;
|
||||||
|
}
|
||||||
|
.ag-row-odd {
|
||||||
|
background-color:var(--ctp-mocha-surface0);
|
||||||
|
}
|
||||||
|
:root .ag-theme-alpine-dark {
|
||||||
|
--ag-background-color: var(--ctp-mocha-surface0) !important;
|
||||||
|
--ag-header-foreground-color: var(--theme-colors-foreground) !important;
|
||||||
|
--ag-header-background-color: var(--ctp-mocha-surface0) !important;
|
||||||
|
--ag-border-color: var(--theme-colors-border) !important;
|
||||||
|
--ag-borders: none !important;
|
||||||
|
--ag-font-family: var(--theme-content-font-family) !important;
|
||||||
|
}
|
||||||
|
.fs-page-header-module-background-image-overlay.fs-page-header-module-dark {
|
||||||
|
background-image:initial;
|
||||||
|
background-position-x:initial;
|
||||||
|
background-position-y:initial;
|
||||||
|
background-size:initial;
|
||||||
|
background-repeat:initial;
|
||||||
|
background-attachment:initial;
|
||||||
|
background-origin:initial;
|
||||||
|
background-clip:initial;
|
||||||
|
background-color:var(--ctp-mocha-surface0);
|
||||||
|
}
|
||||||
|
.fs-player-bar-module-container {
|
||||||
|
background-color:var(--ctp-mocha-surface1);
|
||||||
|
}
|
||||||
|
.fs-main-content-module-main-content-container {
|
||||||
|
background-color:var(--ctp-mocha-surface0);
|
||||||
|
}
|
||||||
|
.fs-sidebar-module-container {
|
||||||
|
background-color:var(--ctp-mocha-surface1);
|
||||||
|
}
|
||||||
|
.fs-sidebar-module-accordion-content {
|
||||||
|
background-color:var(--ctp-mocha-surface1);
|
||||||
|
}
|
||||||
|
.fs-window-bar-module-macos-container {
|
||||||
|
background-color:var(--ctp-mocha-surface1);
|
||||||
|
}
|
||||||
|
.fs-button-module-root[data-variant="default"] {
|
||||||
|
background-color:var(--ctp-mocha-surface1);
|
||||||
|
}
|
||||||
|
.fs-text-input-module-input[data-variant="default"] {
|
||||||
|
background-image:initial;
|
||||||
|
background-position-x:initial;
|
||||||
|
background-position-y:initial;
|
||||||
|
background-size:initial;
|
||||||
|
background-repeat:initial;
|
||||||
|
background-attachment:initial;
|
||||||
|
background-origin:initial;
|
||||||
|
background-clip:initial;
|
||||||
|
background-color:var(--ctp-mocha-surface1);
|
||||||
|
}
|
||||||
|
body {
|
||||||
|
color:var(--ctp-mocha-text);
|
||||||
|
}
|
||||||
|
.fs-player-button-module-main {
|
||||||
|
background-image:initial !important;
|
||||||
|
background-position-x:initial !important;
|
||||||
|
background-position-y:initial !important;
|
||||||
|
background-size:initial !important;
|
||||||
|
background-repeat:initial !important;
|
||||||
|
background-attachment:initial !important;
|
||||||
|
background-origin:initial !important;
|
||||||
|
background-clip:initial !important;
|
||||||
|
background-color:var(--ctp-mocha-accent) !important;
|
||||||
|
border-top-left-radius:50%;
|
||||||
|
border-top-right-radius:50%;
|
||||||
|
border-bottom-right-radius:50%;
|
||||||
|
border-bottom-left-radius:50%;
|
||||||
|
}
|
||||||
|
.ag-row-odd {
|
||||||
|
background-color:var(--ctp-mocha-surface1) !important;
|
||||||
|
}
|
||||||
|
.ag-row {
|
||||||
|
background-color:var(--ctp-mocha-surface1);
|
||||||
|
}
|
||||||
|
.ag-body-horizontal-scroll-viewport {
|
||||||
|
background-color:var(--ctp-mocha-surface1);
|
||||||
|
}
|
||||||
Loading…
Add table
Add a link
Reference in a new issue