Adding account popover

This commit is contained in:
Ronan Berder
2025-04-22 18:00:52 +08:00
parent 0f6b117e06
commit cc04460478
2 changed files with 37 additions and 10 deletions
+4 -9
View File
@@ -346,6 +346,10 @@
width: calc(var(--spacing) * 4);
height: calc(var(--spacing) * 4);
}
.size-6 {
width: calc(var(--spacing) * 6);
height: calc(var(--spacing) * 6);
}
.size-8 {
width: calc(var(--spacing) * 8);
height: calc(var(--spacing) * 8);
@@ -380,18 +384,9 @@
.h-svh {
height: 100svh;
}
.max-h-24 {
max-height: calc(var(--spacing) * 24);
}
.max-h-64 {
max-height: calc(var(--spacing) * 64);
}
.max-h-96 {
max-height: calc(var(--spacing) * 96);
}
.max-h-\[200px\] {
max-height: 200px;
}
.max-h-\[612px\] {
max-height: 612px;
}
+33 -1
View File
@@ -15,7 +15,39 @@
trigger_attrs={"class": "btn-ghost p-2 h-12 w-full justify-start"},
content_attrs={"data-side": "right"}
) %}
Something
<nav role="menu">
<div role="group" aria-labelledby="teams-label">
<span id="teams-label" role="heading" class="text-xs text-muted-foreground">Teams</span>
<button type="button" role="menuitem" class="p-2">
<div class="flex size-6 items-center justify-center rounded-md border">
{% lucide "gallery-vertical-end", { "class": "size-3.5 shrink-0" } %}
</div>
Acme Inc
<span class="text-muted-foreground ml-auto text-xs tracking-widest">⌘1</span>
</button>
<button type="button" role="menuitem" class="p-2">
<div class="flex size-6 items-center justify-center rounded-md border">
{% lucide "audio-waveform", { "class": "size-3.5 shrink-0" } %}
</div>
Acme Corp
<span class="text-muted-foreground ml-auto text-xs tracking-widest">⌘2</span>
</button>
<button type="button" role="menuitem" class="p-2">
<div class="flex size-6 items-center justify-center rounded-md border">
{% lucide "command", { "class": "size-3.5 shrink-0" } %}
</div>
Evil Corp
<span class="text-muted-foreground ml-auto text-xs tracking-widest">⌘3</span>
</button>
</div>
<hr role="separator">
<button type="button" role="menuitem" class="p-2">
<div class="flex size-6 items-center justify-center rounded-md border">
{% lucide "plus", { "class": "size-3.5 shrink-0" } %}
</div>
<span class="text-muted-foreground font-medium">Add team</span>
</button>
</nav>
{% endcall %}
<div class="flex flex-col gap-2 px-2 text-sm">