styles

nadinestrella · Jul 25, 2024 · 9a56c38 · 9a56c38
1 parent b220da3
commit 9a56c38
Show file tree

Hide file tree

Showing 8 changed files with 17 additions and 14 deletions.
diff --git a/next.config.mjs b/next.config.mjs
@@ -1,7 +1,6 @@
 /** @type {import('next').NextConfig} */
 const nextConfig = {
   images: {
-    domains: ['www.toysrus.es'],
     remotePatterns: [
       {
         protocol: 'https',

diff --git a/public/categories/funko.png b/public/categories/funko.png
diff --git a/src/app/components/FinalList.tsx b/src/app/components/FinalList.tsx
@@ -15,7 +15,7 @@ export const FinalList: React.FC<FinalListProps> = ({
   toysSelected,
 }) => {
   return (
-    <div className="flex flex-col justify-center items-center content-center gap-4">
+    <div className="flex flex-col justify-center items-center content-center gap-4 p-4">
       <p className="p-1">
         {parentName}, these are the {kidName} selection acording to their age:
         {kidAge}.
@@ -26,10 +26,10 @@ export const FinalList: React.FC<FinalListProps> = ({
         {toysSelected.map((toy, index) => {
           return (
             <li key={index} className="text-blue-700">
-              <a href={toy?.link} target="_blank">
-                {toy?.model.length > 25
-                  ? toy?.model.slice(0, 50) + '...'
-                  : toy?.model}
+              <a href={toy.link} target="_blank">
+                {toy.model.length > 25
+                  ? toy.model.slice(0, 50) + '...'
+                  : toy.model}
               </a>
             </li>
           );
@@ -41,7 +41,9 @@ export const FinalList: React.FC<FinalListProps> = ({
         <p>email</p>
         <p>sms</p>
       </div>
-      <div>Thank you for using The Gift List {''}❤️</div>
+      <div className="text-background3 font-semibold">
+        Thank you for using The Gift List {''}❤️
+      </div>
     </div>
   );
 };
diff --git a/src/app/components/KidsWelcome.tsx b/src/app/components/KidsWelcome.tsx
@@ -22,7 +22,7 @@ export const KidsWelcome: React.FC<KidsWelcomeProps> = ({
   return (
     <>
       <div className="flex flex-col justify-center items-center content-center gap-4">
-        <span>Hello!! {kidName}</span>
+        <span className="font-semibold">Hello!! {kidName}</span>
         <form className="flex flex-col justify-center items-center content-center gap-4">
           <InputForm
             title="How old are you?"

diff --git a/src/app/components/ListToy.tsx b/src/app/components/ListToy.tsx
@@ -41,11 +41,11 @@ export const ListToy: React.FC<ListToyProps> = ({
   useEffect(() => {
     generateNewToysList();
   }, [generateNewToysList]);
-  console.log(toysSelected);
+
   return (
     <div className="flex flex-col justify-center items-center content-center gap-4 p-5">
       <div>
-        <p>{kidName},</p>
+        <p className="font-semibold pb-2">{kidName},</p>
         <p>These are what we found for you!!</p>
         <p>Select the toys you like the most. </p>
       </div>

diff --git a/src/app/components/Login.tsx b/src/app/components/Login.tsx
@@ -5,7 +5,7 @@ interface LoginProps {
   kidName: string;
   handleKidName: (value: string) => void;
   handleParentName: (value: string) => void;
-  parentEmail: string;
+  parentName: string;
   handleParentEmail: (value: string) => void;
 }
 
@@ -18,7 +18,9 @@ export const Login: React.FC<LoginProps> = ({
 }) => {
   return (
     <div className="flex flex-col justify-center items-center content-center gap-4">
-      <h3 className="text-lg pt-3">Welcome to My Gift List</h3>
+      <h3 className="text-lg pt-3 text-background3 font-semibold">
+        Welcome to My Gift List
+      </h3>
       <form className="flex flex-col justify-center items-center content-center gap-4">
         <InputForm
           title="What is your name?"

diff --git a/src/app/components/SelectedToys.tsx b/src/app/components/SelectedToys.tsx
@@ -14,7 +14,7 @@ export const SelectedToys: React.FC<SelectedToysProps> = ({
   return (
     <div className="flex flex-col  items-center content-center gap-4">
       <div>
-        <p>Congratulations {kidName}!! </p>
+        <p className="font-semibold pb-2">Congratulations {kidName}!! </p>
         <p> You have choosen these {toysSelected.length} toys!!</p>
       </div>
       <ul className="grid grid-col md:grid-cols-3 justify-center items-center content-center gap-4">

diff --git a/src/app/components/ui/InputForm.tsx b/src/app/components/ui/InputForm.tsx
@@ -25,7 +25,7 @@ export const InputForm = ({
         value={inputValue}
         onChange={onChange}
         type="text"
-        className="rounded-full border-2 border-background3"
+        className="rounded-full border-2 border-background3 p-1 pl-2"
         required={required}
         maxLength={maxLength}
       ></input>