feat: add ContactForm to page

src/app/(public)/about/page.tsx

@@ -2,6 +2,7 @@ import * as React from 'react';
 
 import { shuffleArray } from '@/lib/helper';
 
+import Heading from '@/components/atoms/headings/Heading';
 import { QuizData, QuizOption } from '@/components/molecules/RandomFacts/Quiz';
 import Books from '@/components/organisms/about-free-time/Books';
 import Music from '@/components/organisms/about-free-time/Music';
@@ -109,7 +110,7 @@ const AboutFreeTimePage = async () => {
     <main className='min-h-main'>
       <section className='dark:bg-dark bg-white'>
         <div className='layout relative flex flex-col py-12'>
-          <h1 className='mb-5'>About me</h1>
+          <Heading title='about.title' />
 
           <div className='mb-5'>
             <p>

src/app/(public)/contacts/page.tsx

@@ -1,5 +1,8 @@
 import * as React from 'react';
 
+import Heading from '@/components/atoms/headings/Heading';
+import ContactForm from '@/components/molecules/ContactForm/ContactForm';
+
 export const metadata = {
   title: 'Contacts | MartaCodes.it',
   description: 'Contacts page',
@@ -10,7 +13,11 @@ const ContactsPage = async () => {
     <main className='min-h-main'>
       <section>
         <div className='layout relative flex flex-col py-12'>
-          <h1 className='mb-5'>Contacts</h1>
+          <Heading title='contacts.title' />
+
+          <div className='bg-slate-200 dark:bg-slate-800 rounded-md p-4 md:px-8 lg:px-10 w-full lg:w-4/5'>
+            <ContactForm />
+          </div>
         </div>
       </section>
     </main>

src/app/(public)/cv/page.tsx

@@ -54,7 +54,7 @@ const AboutPage = async () => {
     <main className='min-h-main'>
       <section className='dark:bg-dark bg-white'>
         <div className='layout relative flex flex-col py-12'>
-          <Heading title='aboutWork.title' />
+          <Heading title='cv.title' />
 
           <Intro intro={intro} />
 

src/app/(public)/projects/page.tsx

@@ -1,5 +1,6 @@
 import * as React from 'react';
 
+import Heading from '@/components/atoms/headings/Heading';
 import ProjectCard from '@/components/organisms/projects/ProjectCard';
 
 import { queryProjects } from '@/queries/projects';
@@ -24,7 +25,7 @@ const ProjectsPage = async () => {
     <main className='min-h-main'>
       <section>
         <div className='layout relative flex flex-col py-12'>
-          <h1 className='mb-5'>Projects</h1>
+          <Heading title='projects.title' />
 
           <div className='grid gap-4 sm:grid-cols-2 xl:grid-cols-3'>
             {projects.map((project) => (

src/app/(public)/uses/page.tsx

@@ -1,5 +1,7 @@
 import * as React from 'react';
 
+import Heading from '@/components/atoms/headings/Heading';
+
 export const metadata = {
   title: 'Uses | MartaCodes.it',
   description: 'Uses page',
@@ -10,7 +12,7 @@ const UsesPage = async () => {
     <main className='min-h-main'>
       <section>
         <div className='layout relative flex flex-col py-12'>
-          <h1 className='mb-5'>Uses</h1>
+          <Heading title='uses.title' />
         </div>
       </section>
     </main>

src/components/organisms/about-work/Education.tsx

@@ -15,7 +15,7 @@ export interface EducationProps {
 const Education = ({ schools }: EducationProps) => {
   return (
     <div className='my-4'>
-      <SectionHeading titlePrefix='aboutWork.education' />
+      <SectionHeading titlePrefix='cv.education' />
 
       <div>
         {schools.map((school) => (

src/components/organisms/about-work/Intro.tsx

@@ -16,7 +16,7 @@ const Intro = ({ intro }: IntroProps) => {
 
   return (
     <div>
-      <SectionHeading titlePrefix='aboutWork.softwareDevelopment' />
+      <SectionHeading titlePrefix='cv.softwareDevelopment' />
 
       <div className='mb-5'>
         <ReactMarkdown className='text-justify'>

src/components/organisms/about-work/Languages.tsx

@@ -14,7 +14,7 @@ export interface LanguageProps {
 const Languages = ({ languages }: LanguageProps) => {
   return (
     <div className='mb-6 mt-4'>
-      <SectionHeading titlePrefix='aboutWork.languages' />
+      <SectionHeading titlePrefix='cv.languages' />
 
       <div className='mt-4 grid grid-cols-1 gap-3 md:grid-cols-2 lg:grid-cols-4 lg:gap-6 justify-items-center'>
         {languages.map((language) => (

src/components/organisms/about-work/Publications.tsx

@@ -15,7 +15,7 @@ export interface PublicationProps {
 const Publications = ({ publications }: PublicationProps) => {
   return (
     <div className='mb-6 mt-4'>
-      <SectionHeading titlePrefix='aboutWork.publications' />
+      <SectionHeading titlePrefix='cv.publications' />
 
       <div className='mt-4 grid grid-cols-1 md:grid-cols-2 gap-3 lg:grid-cols-3 lg:gap-8'>
         {publications.map((publication) => (

src/components/organisms/about-work/WorkExperience.tsx

@@ -18,7 +18,7 @@ const WorkExperience = ({ jobs }: WorkExperienceProps) => {
 
   return (
     <div className='my-4'>
-      <SectionHeading titlePrefix='aboutWork.workExperience' />
+      <SectionHeading titlePrefix='cv.workExperience' />
 
       <div>
         {jobs.map((job) => (

src/data/locales/en.json

@@ -20,8 +20,16 @@
     "guestbook": "Guestbook",
     "feedback": "Feedback"
   },
-  "aboutWork": {
+  "about": {
+    "title": "About me"
+  },
+  "projects": {
+    "title": "Projects",
+    "readMore": "Read More"
+  },
+  "cv": {
     "title": "My CV",
+    "download": "Download PDF",
     "softwareDevelopment": {
       "title": "Software Development",
       "icon": "https://res.cloudinary.com/dwrurydlt/image/upload/v1692734473/laptop_4a3ba3b30c.svg"
@@ -43,13 +51,10 @@
       "icon": "https://res.cloudinary.com/dwrurydlt/image/upload/v1692894192/newspaper_e15ec94d21.svg"
     }
   },
-  "about": {
-    "title": "Su di me"
+  "contacts": {
+    "title": "Contact me"
   },
-  "projects": {
-    "readMore": "Read More"
-  },
-  "cv": {
-    "download": "Download PDF"
+  "uses": {
+    "title": "Uses"
   }
 }

src/data/locales/it.json

@@ -19,8 +19,16 @@
     "guestbook": "Libro degli Ospiti",
     "feedback": "Feedback"
   },
-  "aboutWork": {
-    "title": "CV",
+  "about": {
+    "title": "Su di me"
+  },
+  "projects": {
+    "title": "Progetti",
+    "readMore": "Leggi di più"
+  },
+  "cv": {
+    "title": "Il mio CV",
+    "download": "Scarica PDF",
     "softwareDevelopment": {
       "title": "Sviluppo Software",
       "icon": "https://res.cloudinary.com/dwrurydlt/image/upload/v1692734473/laptop_4a3ba3b30c.svg"
@@ -42,13 +50,10 @@
       "icon": "https://res.cloudinary.com/dwrurydlt/image/upload/v1692894192/newspaper_e15ec94d21.svg"
     }
   },
-  "about": {
-    "title": "About me"
+  "contacts": {
+    "title": "Contattami"
   },
-  "projects": {
-    "readMore": "Leggi di più"
-  },
-  "cv": {
-    "download": "Scarica PDF"
+  "uses": {
+    "title": "Cose che uso"
   }
 }