1 files changed, 22 insertions, 30 deletions
diff --git a/src/components/container.rs b/src/components/container.rs
index d6d2f03..3b56713 100644
--- a/src/components/container.rs
+++ b/src/components/container.rs
@@ -1,46 +1,38 @@
 use leptos::{
     IntoView, component,
-    prelude::{Children, ClassAttribute, ElementChild, OnAttribute},
+    prelude::{Children, ClassAttribute, ElementChild},
     view,
 };
-use leptos_router::{NavigateOptions, hooks::use_navigate};
+use leptos_router::components::A;
 
 #[component]
 pub fn Container(
-    header: impl IntoView,
-    buttons: Vec<(impl IntoView, &'static str)>,
+    header: impl IntoView + 'static,
+    buttons: Vec<(impl IntoView + 'static, &'static str)>,
     children: Children,
 ) -> impl IntoView {
     assert!(!buttons.is_empty());
 
-    let first_button_path = buttons.first().expect("Should have at least on button").1;
+    // TODO: Add the direct link to the first button back. <2026-02-15>
+    // let first_button_path = buttons.first().expect("Should have at least on button").1;
 
     view! {
-        <button
-            type="button"
-            on:click=|_| {
-                use_navigate()(first_button_path, NavigateOptions::default());
-            }
-        >
-            <div class="p-4 mt-4 mr-4 ml-4 md-2 text-justify rounded-lg border-gray-600 border">
-                <p class="text-lg text-bold">{header}</p>
-                {children()}
+        <div class="p-4 mt-4 mr-4 ml-4 md-2 text-justify rounded-lg border-gray-600 border">
+            <h2 class="text-lg text-bold">{header}</h2>
+            {children()}
 
-                <ul class="flex flex-row gap-1 pt-2 overflow-x-auto">
-                    {buttons
-                        .into_iter()
-                        .map(|(name, path)| {
-                            view! {
-                                <li class="bg-green-400/40 p-2 text-nowrap first:rounded-l-full last:rounded-r-full">
-                                    <button on:click=move |_| {
-                                        use_navigate()(path, NavigateOptions::default());
-                                    }>{name}</button>
-                                </li>
-                            }
-                        })
-                        .collect::<Vec<_>>()}
-                </ul>
-            </div>
-        </button>
+            <ul class="flex flex-row gap-1 pt-2 overflow-x-auto">
+                {buttons
+                    .into_iter()
+                    .map(|(name, path)| {
+                        view! {
+                            <li class="bg-green-400/40 p-2 text-nowrap first:rounded-l-full last:rounded-r-full">
+                                <A href=move || path.to_owned()>{name}</A>
+                            </li>
+                        }
+                    })
+                    .collect::<Vec<_>>()}
+            </ul>
+        </div>
     }
 }