Website Rework & bugfixes

public/locales/common/en.json

@@ -99,8 +99,8 @@
   },
   "optimization": {
     "heading": {
-      "part1": "So How Do You Optimize",
-      "part2": "Your Business?"
+      "part1": "So How Do I Optimize",
+      "part2": "My Business?"
     },
     "cards": {
       "card1": {
@@ -120,7 +120,7 @@
   "results": {
     "heading": {
       "part1": "Ok... So What Makes",
-      "part2": "Us Different?"
+      "part2": "You Different?"
     },
     "subheading": "We have helped many businesses grow and expand their digital footprint.",
     "cards": {

public/locales/common/pt.json

@@ -14,7 +14,7 @@
       "part1": "Nós tratamos de toda a tua presença digital,",
       "part2": "para que te possas concentrar no que é importante!"
     },
-    "button": "Eu quero isto!"
+    "button": "Contacta-nos"
   },
   "services": {
     "heading": {
@@ -119,7 +119,7 @@
   },
   "results": {
     "heading": {
-      "part1": "Ok... Então O Que Nos Torna",
+      "part1": "Ok... Então O Que Vos Torna",
       "part2": "Diferentes?"
     },
     "subheading": "Ajudamos muitos negócios a crescer e expandir a sua presença digital.",

src/Components/Card.tsx

@@ -9,7 +9,7 @@ const Card = ({ title, description, image }: IProps) => {
   const imgClasses = image ? defaultImgClasses : `${defaultImgClasses} hidden`;
 
   return (
-    <div className="mt-5 xl:mt-0 flex flex-1 bg-gradient-to-b from-gold-light to-gold-dark p-0.5 shadow-lg">
+    <div className="mt-5 xl:mt-0 flex flex-1 bg-gradient-to-b from-gold-light to-gold-dark p-0.5 shadow-2xl">
       <div className="w-full font-medium flex-col md:px-4 py-1 bg-gradient-to-br from-custom-bglight to-custom-bgdark">
         <object type="image/svg+xml" data={image} className={imgClasses} aria-label={title}></object>
         <h1 className="mt-2 lg:mt-6 text-3xl xl:text-5xl">{title}</h1>

src/Components/Pages/Contact/ContactForm.css

@@ -3,4 +3,8 @@
     border: none;
     outline: none;
     width: 100%;
+}
+
+.PhoneInputCountrySelect {
+    background-color: #1C1C1C;
 }

src/Components/Pages/Contact/ContactForm.tsx

@@ -77,7 +77,7 @@ const ContactForm = () => {
   return (
     <div className="mt-10 mx-5 lg:mx-0 flex justify-center items-center">
       <form onSubmit={sendEmail} className="w-full md:w-auto">
-        <div className="flex flex-col md:flex-row md:gap-3">
+        <div className="flex flex-col md:flex-row md:gap-4">
           <input
             className="form-input flex-1"
             type="text"
@@ -91,7 +91,7 @@ const ContactForm = () => {
             placeholder={t("contact.form.email")}
           />
         </div>
-        <div className="flex flex-col md:flex-row md:gap-3">
+        <div className="flex flex-col md:flex-row md:gap-4 md:mt-4">
           <input
             className="form-input md:w-1/2"
             type="text"
@@ -112,7 +112,7 @@ const ContactForm = () => {
             />
           </div>
         </div>
-        <div className="flex flex-col">
+        <div className="flex flex-col md:mt-4">
           <input
             className="form-input"
             type="text"
@@ -120,12 +120,14 @@ const ContactForm = () => {
             placeholder={t("contact.form.question")}
           ></input>
 
+        <div className="md:mt-4">
           <input
-            className="form-input"
+            className="form-input w-full"
             name="user_reference"
             placeholder={t("contact.form.reference")}
           ></input>
         </div>
+        </div>
 
         <div className="flex mt-5 mb-10 lg:mt-12 mx-10 sm:mx-40 rounded-full bg-gradient-to-br from-gold-light to-gold-dark p-0.5 shadow-lg">
           <button

src/Components/Pages/Services/ServiceCard.tsx

@@ -8,7 +8,7 @@ interface IProps {
 const Card = ({ title, description, imgSrc, delay }: IProps) => {
   return (
     <div
-      className="flex flex-col mt-4 lg:mt-0 lg:mr-8 justify-end flex-1 h-full border-solid border shadow-lg bg-cover bg-center text-center"
+      className="flex flex-col mt-4 lg:mt-0 lg:mr-8 justify-end flex-1 h-full border-solid border bg-cover bg-center text-center shadow-2xl"
       style={{
         backgroundImage: `url(${imgSrc})`,
         filter: "saturate(50%)",

src/Components/Pages/Services/ServiceCardContainer.tsx

@@ -2,7 +2,7 @@ import CardGroup from "./CardGroup";
 
 const ServiceCardContainer = () => {
   return (
-    <div className="h-full xl:h-[65vh] 1920:h-[60vh] rounded-xl mx-4 lg:mx-20 xl:mx-40 2xl:mx-60 1920:margin-calc mt-10 p-0.5 shadow-lg ">
+    <div className="h-full xl:h-[65vh] 1920:h-[60vh] rounded-xl mx-4 lg:mx-20 xl:mx-40 2xl:mx-60 1920:margin-calc mt-10 p-0.5">
       <CardGroup />
     </div>  
   );