Added project 'Cricchetto24', fixed minor layout issue on ContactMe a…

…nd ProjectCard

src/components/ProjectCard.tsx

@@ -37,7 +37,7 @@ export default function ProjectCard( { project_info }: IProps)
 
     return <>
         <div className="w-full shadow-xl flex items-center flex-col md:flex-row rounded-lg bg-red  hover:scale-[1.02] transition bg-[--bg-color]">
-            <div className="h-full w-full flex justify-center items-center bg-white py-3 md:py-0 rounded-l-lg"> { /* Image container */}
+            <div className="w-full md:w-auto md:min-w-2xl h-full flex justify-center items-center bg-white py-3 md:py-0 rounded-l-lg"> { /* Image container */}
                 <img className="max-w-64 lg:max-w-96 rounded-lg px-2" src={import.meta.env.BASE_URL + "imgs/projects/" + img_id + ".png"} alt="" />
             </div>
             <div className="p-5  h-full flex flex-col justify-between">
@@ -46,7 +46,7 @@ export default function ProjectCard( { project_info }: IProps)
                     <h4 className="text-xl"><span className="accent-clr">{project_info?.company} @ {project_info?.location}</span> <span className="text-gray-600">- from {start_month} {start_year} {end_year ? <>{"to " + end_month + " " + end_year}</> : <>&#8212; ongoing</>}</span></h4>
                     <p className="mt-3 text-pretty">{project_info?.description}</p>
                 </div>
-                <div className="flex flex-row gap-5">
+                <div className="flex flex-row gap-5 flex-wrap">
                     {
                         project_info?.technologies.map<ReactNode>((tec: string) => {
                             let tooltip_tec_id: string = tec + img_id

src/pages/ContactMe.tsx

@@ -13,7 +13,7 @@ function ContactMe()
 {
     return <>
         <section id="contact-me" className="pt-20 flex flex-wrap flex-col content-center">
-            <h1 className="text-5xl font-bold uppercase text-center">Let's keep in touch!</h1>
+            <h1 className="text-center text-5xl font-bold uppercase ">Let's keep in touch!</h1>
             <form className="mt-10 p-10 flex flex-col gap-5 shadow-2xl rounded-lg bg-[--nav-bg]">
                 <div className="flex flex-col sm:flex-row justify-between">
                     <div>
@@ -27,11 +27,11 @@ function ContactMe()
                 </div>
                 <div>
                     <label htmlFor="first_name">Email</label>
-                    <input className="bg-[--nav-bg] w-full border-slate-300 rounded" id="first_name" type="email"></input>
+                    <input className="bg-[--nav-bg] w-full border-slate-300 rounded" id="email" type="email"></input>
                 </div>
                 <div>
                     <label htmlFor="first_name">Message</label>
-                    <input className="bg-[--nav-bg] w-full min-h-64 border-slate-300 rounded" id="first_name" type="text"></input>
+                    <textarea className="bg-[--nav-bg] w-full min-h-64 border-slate-300 rounded resize-none" id="message"></textarea>
                 </div>
                 <div className="text-center">
                     <div data-tooltip-target="tooltip-contact-me" data-tooltip-placement="bottom">

src/pages/Projects.tsx

@@ -33,7 +33,7 @@ function Projects()
             name: "Project Ercole",
             company: "Arakne S.R.L",
             location: "Rome, IT",
-            description: "The main goal was to create a software that, given a fragments of ancient pots dataset, resembles the original pictures. Two different approaches have been tested: trying to look up online for a ready-to-use solution and, in parallel, developing a procedural Python software.",
+            description: "The main goal was to create a software that, given a dataset containing pictures of fragments of ancient pots, resembles the original pictures. Two different approaches have been tested: trying to look up online for a ready-to-use solution and, in parallel, developing a procedural Python software. We eventually discovered 'JigsawNet' by Le Canyu and Li Xin - on GitHub, a CNN capable of resembling pieces of an image without knowing how the original picture would have looked like.",
             start_date: "10/2023",
             end_date: "11/2023",
             is_source_available: false,
@@ -42,7 +42,7 @@ function Projects()
             ]
         },
         {
-            name: "Project Script_Manager",
+            name: "Project Script Manager",
             company: "NEAT S.R.L",
             location: "Rome, IT",
             description: "The project aimed to develop a working IDE that could store files in a server, organize them in directories and did have to support multiple programming languages. I worked in the front-end side, integrating Monaco Editor in Vue.js and providing all the features a VS Code-like editor has.",
@@ -52,6 +52,18 @@ function Projects()
             technologies: [
                 "VueJS", "TypeScript", "NodeJS", "Bootstrap"
             ]
+        },
+        {
+            name: "Cricchetto24",
+            company: "Gruppo Maggioli",
+            location: "Sant'Arcangelo di Romagna, IT",
+            description: "During my internship period (in the 4th year of High School) I worked in Gruppo Maggioli, where our tutor required us to develop a clone of 'AutoScout24' - an online platform where you can buy or sell cars. The classroom was split in 2 teams: Front-End and Back-End. I ended up leading the Front-End team and we built all the necessary and essential pages: Home, Search (and Detailed Search), Results Page and Private Dashboard.",
+            start_date: "05/2022",
+            end_date: "06/2022",
+            is_source_available: false,
+            technologies: [
+                "Angular", "TypeScript", "JavaScript", "Bootstrap", "HTML", "CSS"
+            ]
         }
     ]