feat: implement professional Sidenav layout and mobile Sheet menu
Some checks failed
Build MIPS Binary / build (push) Failing after 1m29s
Some checks failed
Build MIPS Binary / build (push) Failing after 1m29s
This commit is contained in:
@@ -1,23 +1,37 @@
|
||||
use leptos::prelude::*;
|
||||
use icons::PanelLeft;
|
||||
use crate::components::torrent::add_torrent::AddTorrentDialog;
|
||||
use crate::components::ui::button::{Button};
|
||||
use crate::components::ui::button::{Button, ButtonVariant, ButtonSize};
|
||||
use crate::components::ui::sheet::{Sheet, SheetContent, SheetTrigger, SheetDirection};
|
||||
use crate::components::layout::sidebar::Sidebar;
|
||||
|
||||
#[component]
|
||||
pub fn Toolbar() -> impl IntoView {
|
||||
let show_add_modal = signal(false);
|
||||
let is_mobile_menu_open = use_context::<RwSignal<bool>>().expect("mobile menu state not provided");
|
||||
|
||||
view! {
|
||||
<div class="flex min-h-14 h-auto items-center border-b border-border bg-background px-4" style="padding-top: env(safe-area-inset-top);">
|
||||
// Sol kısım: Menü butonu + Add Torrent
|
||||
// Sol kısım: Menü butonu (Mobil) + Add Torrent
|
||||
<div class="flex items-center gap-3">
|
||||
// Mobile Menu Trigger
|
||||
<button
|
||||
class="inline-flex items-center justify-center size-9 rounded-md hover:bg-accent hover:text-accent-foreground lg:hidden"
|
||||
on:click=move |_| is_mobile_menu_open.update(|v| *v = !*v)
|
||||
>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" class="w-5 h-5 stroke-current"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path></svg>
|
||||
</button>
|
||||
|
||||
// --- MOBILE SHEET (SIDEBAR) ---
|
||||
<div class="lg:hidden">
|
||||
<Sheet>
|
||||
<SheetTrigger variant=ButtonVariant::Ghost size=ButtonSize::Icon class="size-9">
|
||||
<PanelLeft class="size-5" />
|
||||
<span class="hidden">"Menüyü Aç"</span>
|
||||
</SheetTrigger>
|
||||
<SheetContent
|
||||
direction=SheetDirection::Left
|
||||
class="p-0 w-[18rem] bg-card border-r border-border"
|
||||
hide_close_button=true
|
||||
>
|
||||
<div class="flex flex-col h-full overflow-hidden">
|
||||
<Sidebar />
|
||||
</div>
|
||||
</SheetContent>
|
||||
</Sheet>
|
||||
</div>
|
||||
|
||||
<Button
|
||||
on:click=move |_| show_add_modal.1.set(true)
|
||||
@@ -31,7 +45,7 @@ pub fn Toolbar() -> impl IntoView {
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
// Sağ kısım boşaltıldı (arama kutusu kaldırıldı)
|
||||
// Sağ kısım boş
|
||||
<div class="flex flex-1 items-center justify-end gap-2">
|
||||
</div>
|
||||
|
||||
@@ -40,4 +54,4 @@ pub fn Toolbar() -> impl IntoView {
|
||||
</Show>
|
||||
</div>
|
||||
}
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user