mirror of
https://github.com/jeffvli/feishin.git
synced 2026-05-09 20:29:36 +02:00
move server selector inline with other collapsed sidebar items
This commit is contained in:
@@ -12,27 +12,9 @@
|
|||||||
max-height: calc(100vh - 149px);
|
max-height: calc(100vh - 149px);
|
||||||
}
|
}
|
||||||
|
|
||||||
.server-selector-container {
|
|
||||||
position: absolute;
|
|
||||||
right: 0;
|
|
||||||
bottom: 0;
|
|
||||||
left: 0;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
padding: var(--theme-spacing-md);
|
|
||||||
cursor: pointer;
|
|
||||||
background: var(--theme-colors-sidebar-background);
|
|
||||||
border-top: 1px solid var(--theme-colors-sidebar-border);
|
|
||||||
}
|
|
||||||
|
|
||||||
.server-icon {
|
.server-icon {
|
||||||
width: 2rem;
|
width: 2rem;
|
||||||
height: 2rem;
|
height: 2rem;
|
||||||
object-fit: cover;
|
object-fit: cover;
|
||||||
border-radius: var(--theme-radius-md);
|
border-radius: var(--theme-radius-md);
|
||||||
}
|
}
|
||||||
|
|
||||||
.scroll-area-with-server {
|
|
||||||
padding-bottom: calc(2rem + 2 * var(--theme-spacing-md));
|
|
||||||
}
|
|
||||||
|
|||||||
@@ -80,7 +80,7 @@ export const CollapsedSidebar = () => {
|
|||||||
[styles.web]: windowBarStyle === Platform.WEB,
|
[styles.web]: windowBarStyle === Platform.WEB,
|
||||||
})}
|
})}
|
||||||
>
|
>
|
||||||
<ScrollArea className={currentServer ? styles.scrollAreaWithServer : undefined}>
|
<ScrollArea>
|
||||||
{sidebarCollapsedNavigation && (
|
{sidebarCollapsedNavigation && (
|
||||||
<Group gap={0} grow>
|
<Group gap={0} grow>
|
||||||
<CollapsedSidebarButton onClick={() => navigate(-1)}>
|
<CollapsedSidebarButton onClick={() => navigate(-1)}>
|
||||||
@@ -119,28 +119,37 @@ export const CollapsedSidebar = () => {
|
|||||||
to={item.route}
|
to={item.route}
|
||||||
/>
|
/>
|
||||||
))}
|
))}
|
||||||
</ScrollArea>
|
{currentServer && (
|
||||||
{currentServer && (
|
<DropdownMenu offset={0} position="right-end" width={240}>
|
||||||
<DropdownMenu offset={0} position="right-end" width={240}>
|
<DropdownMenu.Target>
|
||||||
<DropdownMenu.Target>
|
<CollapsedSidebarItem
|
||||||
<div className={styles.serverSelectorContainer}>
|
activeIcon={null}
|
||||||
<img
|
component={Flex}
|
||||||
className={styles.serverIcon}
|
icon={
|
||||||
src={
|
<img
|
||||||
currentServer.type === ServerType.NAVIDROME
|
className={styles.serverIcon}
|
||||||
? NavidromeLogo
|
src={
|
||||||
: currentServer.type === ServerType.JELLYFIN
|
currentServer.type === ServerType.NAVIDROME
|
||||||
? JellyfinLogo
|
? NavidromeLogo
|
||||||
: OpenSubsonicLogo
|
: currentServer.type === ServerType.JELLYFIN
|
||||||
|
? JellyfinLogo
|
||||||
|
: OpenSubsonicLogo
|
||||||
|
}
|
||||||
|
/>
|
||||||
}
|
}
|
||||||
|
label={''}
|
||||||
|
py="md"
|
||||||
|
style={{
|
||||||
|
cursor: 'pointer',
|
||||||
|
}}
|
||||||
/>
|
/>
|
||||||
</div>
|
</DropdownMenu.Target>
|
||||||
</DropdownMenu.Target>
|
<DropdownMenu.Dropdown>
|
||||||
<DropdownMenu.Dropdown>
|
<ServerSelectorItems />
|
||||||
<ServerSelectorItems />
|
</DropdownMenu.Dropdown>
|
||||||
</DropdownMenu.Dropdown>
|
</DropdownMenu>
|
||||||
</DropdownMenu>
|
)}
|
||||||
)}
|
</ScrollArea>
|
||||||
</motion.div>
|
</motion.div>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
Reference in New Issue
Block a user