fix: sidebar should follow same overall opcity
This commit is contained in:
parent
3c1567930f
commit
31786ad8d9
2 changed files with 35 additions and 8 deletions
|
|
@ -33,6 +33,22 @@
|
|||
}
|
||||
|
||||
@layer components {
|
||||
.shell-surface {
|
||||
background:
|
||||
radial-gradient(circle at top left, rgb(99 102 241 / 0.1), transparent 28%),
|
||||
radial-gradient(circle at top right, rgb(245 158 11 / 0.08), transparent 22%),
|
||||
linear-gradient(180deg, rgb(255 255 255 / 0.84), rgb(248 250 252 / 0.9));
|
||||
backdrop-filter: blur(16px);
|
||||
}
|
||||
|
||||
.dark .shell-surface {
|
||||
background:
|
||||
radial-gradient(circle at top left, rgb(99 102 241 / 0.12), transparent 26%),
|
||||
radial-gradient(circle at top right, rgb(245 158 11 / 0.07), transparent 20%),
|
||||
linear-gradient(180deg, rgb(9 12 18 / 0.84), rgb(17 24 39 / 0.9));
|
||||
backdrop-filter: blur(16px);
|
||||
}
|
||||
|
||||
.play-overlay {
|
||||
position: relative;
|
||||
display: block;
|
||||
|
|
|
|||
|
|
@ -39,7 +39,7 @@
|
|||
<Simple @show_settings="show_settings = true" />
|
||||
</div>
|
||||
|
||||
<div v-else key="regular" class="shell-stage flex flex-col">
|
||||
<div v-else key="regular" class="shell-stage shell-surface flex flex-col">
|
||||
<Shutdown v-if="app_shutdown" />
|
||||
|
||||
<div id="main_container" class="shell-root flex flex-col" v-else>
|
||||
|
|
@ -183,13 +183,14 @@
|
|||
color="neutral"
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
icon="i-lucide-refresh-cw"
|
||||
@click="$router.go(0)"
|
||||
>
|
||||
<span class="hidden xl:inline">Reload</span>
|
||||
</UButton>
|
||||
icon="i-lucide-search"
|
||||
aria-label="Search routes and actions"
|
||||
title="Search routes and actions"
|
||||
class="shrink-0 lg:hidden"
|
||||
@click="showRouteSearch = true"
|
||||
/>
|
||||
|
||||
<UDashboardSearchButton class="shrink-0" />
|
||||
<UDashboardSearchButton class="hidden shrink-0 lg:inline-flex" />
|
||||
|
||||
<UButton
|
||||
color="neutral"
|
||||
|
|
@ -203,6 +204,16 @@
|
|||
<span class="hidden xl:inline">{{ colorModeButtonTitle }}</span>
|
||||
</UButton>
|
||||
|
||||
<UButton
|
||||
color="neutral"
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
icon="i-lucide-refresh-cw"
|
||||
@click="$router.go(0)"
|
||||
>
|
||||
<span class="hidden xl:inline">Reload</span>
|
||||
</UButton>
|
||||
|
||||
<UButton
|
||||
color="neutral"
|
||||
variant="ghost"
|
||||
|
|
@ -706,7 +717,7 @@ const handleSwipeCancel = (): void => {
|
|||
};
|
||||
|
||||
const dashboardSidebarUi = {
|
||||
root: 'border-r border-default bg-default/95 backdrop-blur-sm',
|
||||
root: 'shell-surface border-r border-default bg-default/95 backdrop-blur-sm',
|
||||
header: 'border-b border-default px-2.5 py-3',
|
||||
body: 'gap-3 px-2.5 py-3',
|
||||
footer: 'border-t border-default px-2.5 py-3',
|
||||
|
|
|
|||
Loading…
Reference in a new issue