From e7a45dc46c93c94b8dd2a52a656ff0cb3d5539d2 Mon Sep 17 00:00:00 2001
From: Romulus21 <romain@delanoe.pro>
Date: Wed, 18 Jun 2025 22:50:40 +0200
Subject: [PATCH] change links size

---
 README.md          |  2 +-
 src/app.rs         | 12 +++++++++++-
 src/routes/link.rs | 11 ++++++-----
 3 files changed, 18 insertions(+), 7 deletions(-)

diff --git a/README.md b/README.md
index 2e8ca33..644d56d 100644
--- a/README.md
+++ b/README.md
@@ -33,7 +33,7 @@ WantedBy=multi-user.target
 [ ] value gestion des erreurs
 [x] deploy
 [x] hydratation
-[ ] liens icones
+[x] liens icones
 [ ] liens position
 [ ] liens edition
 
diff --git a/src/app.rs b/src/app.rs
index 117e883..e09a42d 100644
--- a/src/app.rs
+++ b/src/app.rs
@@ -26,7 +26,17 @@ pub fn App() -> impl IntoView {
                         //<Route path="/*any" view=move || view! { <NotFound/> }/>
                     </Routes>
                 </main>
-                <footer>Footer</footer>
+                <footer>
+                //<span>Footer</span>
+                //<ul>
+                //    <li class="xs:block sm:hidden md:hidden lg:hidden xl:hidden">xs</li>
+                //    <li class="sm:block xs:hidden md:hidden lg:hidden xl:hidden">sm</li>
+                //    <li class="md:block xs:hidden sm:hidden lg:hidden xl:hidden">md</li>
+                //    <li class="lg:block xs:hidden sm:hidden md:hidden xl:hidden">lg</li>
+                //    <li class="xl:block xs:hidden sm:hidden mg:hidden lg:hidden">xl</li>
+                //    <li class="md:hidden lg:hidden xl:hidden">sm</li>
+                //</ul>
+                </footer>
             </Router>
         </div>
     }
diff --git a/src/routes/link.rs b/src/routes/link.rs
index 09c2bb3..bd20148 100644
--- a/src/routes/link.rs
+++ b/src/routes/link.rs
@@ -80,7 +80,7 @@ pub fn Links() -> impl IntoView {
 
     view! {
         <Title text="Liens"/>
-        <ul class="flex flex-wrap gap-5 m-5 justify-center">
+        <ul class="flex gap-5 m-5 flex-wrap justify-center">
             <Suspense fallback=move || view! {<p>"Loading Comments from the article"</p> }>
                 <ErrorBoundary fallback=|_| {
                     view! { <p class="error-messages text-xs-center">"Something went wrong."</p>}
@@ -131,13 +131,14 @@ fn Link<T: 'static + Clone, S: 'static>(
     links: Resource<T, S>,
 ) -> impl IntoView {
     view! {
-        <li>
-            <a class="bg-prim-light hover:bg-prim-lightest border-b hover:border-third border-transparent text-xl rounded-lg text-center hover:text-third transition-colors px-5 py-4 min-w-60 inline-block"
+        <li class="mx-auto w-44 lg:w-60">
+            <a class="bg-prim-light w-full hover:bg-prim-lightest border-b hover:border-third border-transparent text-xl rounded-lg text-center hover:text-third transition-colors px-5 py-4 inline-block"
                 target="_blank"
                 href={move || link.with(|x| x.link.to_string())}>
-                <div class="size-54 min-w-54 mb-2">
+                <div class="flex justify-center mb-2">
                     <img src={move || link.with(|x| x.icon.to_string())}
-                         alt={move || link.with(|x| x.name.to_string())} class="size-54 object-cover" />
+                         alt={move || link.with(|x| x.name.to_string())}
+                         class="block size-32 lg:size-54 object-cover overflow-hidden" />
                 </div>
 
                 <span>{move || link.with(|x| x.name.to_string())}</span>