feat(i18n): centralize more UI texts in messages

Move hardcoded labels/strings in About, Projects, Contact form, Footer and Consent banner into next-intl message files (en/de) so content is maintained in one place.

Co-authored-by: dennis <dennis@konkol.net>

app/components/Contact.tsx

@@ -12,6 +12,8 @@ const Contact = () => {
   const { showEmailSent, showEmailError } = useToast();
   const locale = useLocale();
   const t = useTranslations("home.contact");
+  const tForm = useTranslations("home.contact.form");
+  const tInfo = useTranslations("home.contact.info");
   const [cmsDoc, setCmsDoc] = useState<JSONContent | null>(null);
 
   useEffect(() => {
@@ -49,27 +51,27 @@ const Contact = () => {
     const newErrors: Record<string, string> = {};
 
     if (!formData.name.trim()) {
-      newErrors.name = "Name is required";
+      newErrors.name = tForm("errors.nameRequired");
     } else if (formData.name.trim().length < 2) {
-      newErrors.name = "Name must be at least 2 characters";
+      newErrors.name = tForm("errors.nameMin");
     }
 
     if (!formData.email.trim()) {
-      newErrors.email = "Email is required";
+      newErrors.email = tForm("errors.emailRequired");
     } else if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(formData.email)) {
-      newErrors.email = "Please enter a valid email address";
+      newErrors.email = tForm("errors.emailInvalid");
     }
 
     if (!formData.subject.trim()) {
-      newErrors.subject = "Subject is required";
+      newErrors.subject = tForm("errors.subjectRequired");
     } else if (formData.subject.trim().length < 3) {
-      newErrors.subject = "Subject must be at least 3 characters";
+      newErrors.subject = tForm("errors.subjectMin");
     }
 
     if (!formData.message.trim()) {
-      newErrors.message = "Message is required";
+      newErrors.message = tForm("errors.messageRequired");
     } else if (formData.message.trim().length < 10) {
-      newErrors.message = "Message must be at least 10 characters";
+      newErrors.message = tForm("errors.messageMin");
     }
 
     setErrors(newErrors);
@@ -153,14 +155,14 @@ const Contact = () => {
   const contactInfo = [
     {
       icon: Mail,
-      title: "Email",
+      title: tInfo("email"),
       value: "contact@dk0.dev",
       href: "mailto:contact@dk0.dev",
     },
     {
       icon: MapPin,
-      title: "Location",
-      value: "Osnabrück, Germany",
+      title: tInfo("location"),
+      value: tInfo("locationValue"),
     },
   ];
 
@@ -251,7 +253,7 @@ const Contact = () => {
             className="glass-card p-8 rounded-3xl bg-white/50 border border-white/70"
           >
             <h3 className="text-2xl font-bold text-gray-800 mb-6">
-              Send Message
+              {tForm("title")}
             </h3>
 
             <form onSubmit={handleSubmit} className="space-y-6">
@@ -276,7 +278,7 @@ const Contact = () => {
                         ? "border-red-400 focus:ring-red-400"
                         : "border-white/60 focus:ring-liquid-blue focus:border-transparent"
                     }`}
-                    placeholder="Your name"
+                    placeholder={tForm("placeholders.name")}
                     aria-invalid={
                       errors.name && touched.name ? "true" : "false"
                     }
@@ -311,7 +313,7 @@ const Contact = () => {
                         ? "border-red-400 focus:ring-red-400"
                         : "border-white/60 focus:ring-liquid-blue focus:border-transparent"
                     }`}
-                    placeholder="your@email.com"
+                    placeholder={tForm("placeholders.email")}
                     aria-invalid={
                       errors.email && touched.email ? "true" : "false"
                     }
@@ -347,7 +349,7 @@ const Contact = () => {
                       ? "border-red-400 focus:ring-red-400"
                       : "border-white/60 focus:ring-liquid-blue focus:border-transparent"
                   }`}
-                  placeholder="What's this about?"
+                  placeholder={tForm("placeholders.subject")}
                   aria-invalid={
                     errors.subject && touched.subject ? "true" : "false"
                   }
@@ -384,7 +386,7 @@ const Contact = () => {
                       ? "border-red-400 focus:ring-red-400"
                       : "border-white/60 focus:ring-liquid-blue focus:border-transparent"
                   }`}
-                  placeholder="Tell me more about your project or question..."
+                  placeholder={tForm("placeholders.message")}
                   aria-invalid={
                     errors.message && touched.message ? "true" : "false"
                   }
@@ -403,7 +405,7 @@ const Contact = () => {
                     <span></span>
                   )}
                   <span className="text-xs text-stone-400">
-                    {formData.message.length} characters
+                    {tForm("characters", { count: formData.message.length })}
                   </span>
                 </div>
               </div>
@@ -419,12 +421,12 @@ const Contact = () => {
                 {isSubmitting ? (
                   <>
                     <div className="w-5 h-5 border-2 border-white/30 border-t-white rounded-full animate-spin"></div>
-                    <span>Sending Message...</span>
+                    <span>{tForm("sending")}</span>
                   </>
                 ) : (
                   <>
                     <Send size={20} />
-                    <span className="text-cream">Send Message</span>
+                    <span className="text-cream">{tForm("send")}</span>
                   </>
                 )}
               </motion.button>