Responsive navbar for desktop
This commit is contained in:
parent
0f0aff81f4
commit
334a893a85
@ -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;
|
||||||
}
|
}
|
||||||
|
@ -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" }
|
||||||
|
},
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user