Add blog page css

src/app/mod.rs

@@ -13,15 +13,15 @@ pub fn App() -> impl IntoView {
     view! {
         <Stylesheet id="leptos" href="/pkg/portfolio.css"/>
         <Link rel="shortcut icon" type_="image/ico" href="/favicon.ico"/>
+        <Link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/github-dark-dimmed.min.css"/>
+        <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/highlight.min.js"></script>
         <Router>
             <Routes>
                 <Route path="" view=pages::Home/>
                 <Route path="posts" view=pages::PostList/>
                 <Route path="posts/:slug" view=|| view! {
-                        <Link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/github.min.css"/>
-                        <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/highlight.min.js"></script>
-                        <script>hljs.highlightAll();</script>
-                        <pages::PostElement/>
+                    <script>hljs.highlightAll();</script>
+                    <pages::PostElement/>
                 }/>
             </Routes>
         </Router>

src/app/pages/posts.rs

@@ -1,7 +1,6 @@
 use leptos::*;
 use leptos_router::*;
 use crate::app::models::Post;
-use crate::app::components::Link;
 
 #[server]
 pub async fn get_posts() -> Result<Vec<Post>, ServerFnError> {
@@ -32,7 +31,7 @@ pub fn PostList() -> impl IntoView {
         posts.and_then(|posts| {
             posts.iter()
                 .map(|post| view! {
-                                <div>
+                                <a href=format!("posts/{}", post.slug.clone())>
                                     <img src={post.metadata.image_path.clone()} alt=format!("Image {}", post.metadata.title)/>
 
                                     <div>
@@ -40,7 +39,7 @@ pub fn PostList() -> impl IntoView {
                                         <p>{post.metadata.description.clone()}</p>
                                         <span>{post.metadata.date.clone()}</span>
                                     </div>
-                                </div>
+                                </a>
                             })
                 .collect_view()
         })
@@ -75,7 +74,7 @@ pub fn PostElement() -> impl IntoView {
     view! {
         <main class="post">
             <Suspense fallback=move || view! { <p>"Chargement des posts..."</p> }>
-                {post_view}
+                <div>{post_view}</div>
             </Suspense>
         </main>
     }