Responsive navbar for desktop

This commit is contained in:
xeovalyte 2024-07-23 20:50:37 +02:00
parent 0f0aff81f4
commit 334a893a85
Signed by: xeovalyte
SSH Key Fingerprint: SHA256:kSQDrQDmKzljJzfGYcd3m9RqHi4h8rSwkZ3sQ9kBURo
2 changed files with 26 additions and 19 deletions

View File

@ -2053,6 +2053,10 @@ html {
width: 100%; width: 100%;
} }
.max-w-lg {
max-width: 32rem;
}
.max-w-md { .max-w-md {
max-width: 28rem; max-width: 28rem;
} }

View File

@ -7,25 +7,28 @@ use crate::Route;
pub fn Navbar() -> Element { pub fn Navbar() -> Element {
rsx! { rsx! {
div { div {
class: "bg-base-200 min-h-16 flex items-center justify-around", class: "bg-base-200 min-h-16 flex justify-center",
Link { div {
to: Route::Home {}, class: "flex items-center justify-around max-w-lg w-full",
class: "btn btn-ghost flex-col flex-nowrap py-1 gap-1 font-normal h-max", Link {
icons::Home {}, to: Route::Home {},
"Home" class: "btn btn-ghost flex-col flex-nowrap py-1 gap-1 font-normal h-max",
}, icons::Home {},
Link { "Home"
to: Route::Home {}, },
class: "btn btn-ghost flex-col flex-nowrap py-1 gap-1 font-normal h-max", Link {
icons::Newspaper {}, to: Route::Home {},
div { class: "font-normal", "Nieuws" } class: "btn btn-ghost flex-col flex-nowrap py-1 gap-1 font-normal h-max",
}, icons::Newspaper {},
Link { div { class: "font-normal", "Nieuws" }
to: Route::Home {}, },
class: "btn btn-ghost flex-col flex-nowrap py-1 gap-1 font-normal h-max", Link {
icons::Calendar {}, to: Route::Home {},
span { class: "font-normal", "Agenda" } class: "btn btn-ghost flex-col flex-nowrap py-1 gap-1 font-normal h-max",
}, icons::Calendar {},
span { class: "font-normal", "Agenda" }
},
}
} }
} }
} }