cv personlisable now

src/routes/cv/+page.svelte

@@ -50,21 +50,27 @@
 
     const params = new URLSearchParams(window.location.search);
     debug = params.has("debug");
+
+    loadMotivation();
   });
 
-  let moticationInput: HTMLInputElement;
+  let motivationInput: HTMLTextAreaElement;
+  let motivation: string | null = "";
   function loadMotivation() {
-    const motivation = localStorage.getItem("motivation");
-    if (!motivation) return;
-
-    moticationInput.value = motivation;
+    const content = localStorage.getItem("motivation");
+    if (content && motivationInput) {
+      motivationInput.value = content;
+      motivation = content;
     }
+  }
+
   function submitMotivation() {
-    console.log(moticationInput.value);
-    if (!moticationInput.value) {
+    if (!motivationInput) return;
+    const content = motivationInput.value;
+    if (!content.trim()) {
       localStorage.removeItem("motivation");
     } else {
-      localStorage.setItem("motivation", moticationInput.value);
+      localStorage.setItem("motivation", content);
     }
     window.location.reload();
   }
@@ -81,7 +87,8 @@
 
 <div>
   <title
-    >{$re?.name ?? "Alex"}'s {getLocale().toUpperCase()} CV {getFormattedDate()}</title
+    >{motivation ? "CUSTOM" : ""}
+    {$re?.name ?? "Alex"}'s {getLocale().toUpperCase()} CV {getFormattedDate()}</title
   >
   <meta content="{$re?.name ?? 'Alex'}'s CV" property="og:title" />
   <meta
@@ -91,7 +98,7 @@
   <meta content={preveiwImage} property="og:image" />
   <meta content="#bdd6ee" data-react-helmet="true" name="theme-color" />
 
-  <div class="cv-info-container flex flex-col w-full h-full hide-on-print">
+  <div class="cv-info-container h-[4cm] flex flex-col w-full hide-on-print">
     <div class="flex w-full h-full items-center justify-center gap-8">
       <div class=" flex flex-col">
         <div>
@@ -125,12 +132,11 @@
           }}
           class="join"
         >
-          <input
-            bind:this={moticationInput}
-            class="join-item input input-outline input-xs"
-            type="text"
+          <textarea
+            bind:this={motivationInput}
+            class="join-item input-xs h-[3cm] w-[12cm] textarea textarea-outline resize-x"
             placeholder="Type something..."
-          />
+          ></textarea>
           <button type="submit" class="btn btn-xs join-item">
             <SendHorizontal />
           </button>
@@ -297,7 +303,6 @@
   }
 
   .cv-info-container {
-    height: 15mm;
     background-color: #2b2a2a;
     display: flex;
     justify-content: center;