Fixed flex-boxes in CV section

Signed-off-by: Tuan-Dat Tran <tuan-dat.tran@tudattr.dev>

src/cv.rs

@@ -7,16 +7,21 @@ use crate::components::{H4, HR};
 pub fn CV() -> Element {
     rsx! {
         div {
-            class: "flex flex-col ",
+            class: "flex flex-col",
             div {
-                class: "flex justify-between",
+                class: "flex flex-col sm:flex-row justify-center items-center sm:space-x-8 space-y-8 sm:space-y-0",
+                img {
+                    class: "rounded-full w-24 h-24",
+                    alt: "headshot",
+                    src: "/pictures/headshot.webp"
+                }
                 Introduction {},
                 Socials {}
             },
 
             HR {}
             div {
-                class: "flex justify-between",
+                class: "flex flex-col justify-between sm:flex-row",
                 WorkExperience {},
                 Miscellaneous {},
             },
@@ -31,11 +36,6 @@ fn Introduction() -> Element {
     rsx! {
         div {
             class: "flex",
-
-            img {
-                class: "rounded-full w-16 h-16 mx-16",
-                src: "/pictures/headshot.webp"
-            }
             P { { translate!(i18, "cv.introduction_0") } },
             P { { translate!(i18, "cv.introduction_1") } }
         },
@@ -195,7 +195,7 @@ fn CVEntry(props: CVEntryProps) -> Element {
             time { class:"mb-1 text-sm font-normal leading-none text-gray-400 dark:text-gray-500", "{props.time}"},
             h6 { class: "text-lg font-semibold text-gray-900 dark:text-white", "{props.title}"}
             ul {
-                class: "flex",
+                class: "flex flex-wrap gap-2",
                 for (index, value) in props.technologies.iter().enumerate() {
                     li { key: "{index}", RandomBadge { text: "{value}"} }
                 }