Merge pull request 'Fix: Melhorando validação do instagram e tamanho dos width das div do FooterTop' (#10) from feature/development into main

Reviewed-on: #10

src/components/Footer/FooterTop/FooterTop.tsx

@@ -86,7 +86,7 @@ export default function FooterTop() {
 
   return (
     <div className={styles.containerFooterTop}>
-      <div>
+      <div className={styles.wrapperFooterTop}>
         <h4 ref={titleMenuFooter.institucional} onClick={footerLinkToggle}>
           Institucional
         </h4>
@@ -110,7 +110,7 @@ export default function FooterTop() {
           </li>
         </ul>
       </div>
-      <div>
+      <div className={styles.wrapperFooterTop}>
         <h4 ref={titleMenuFooter.duvidas} onClick={footerLinkToggle}>
           Dúvidas
         </h4>

src/components/Footer/FooterTop/footerTop.module.scss

@@ -4,6 +4,10 @@
 
   padding: 50px 100px;
 
+  .wrapperFooterTop {
+    width: 14.3518%;
+  }
+
   div h4 {
     font-weight: 500;
     font-size: 14px;
@@ -20,7 +24,6 @@
     font-weight: 400;
     font-size: 12px;
     line-height: 14px;
-    text-transform: capitalize;
     margin-top: 12px;
 
     color: var(--black-100);
@@ -31,6 +34,7 @@
   }
 
   .containerSupportClient {
+    width: 14.3518%;
     .supportClient {
       display: flex;
       flex-direction: column;
@@ -112,6 +116,11 @@
     flex-direction: column;
     gap: 12px;
 
+    .wrapperFooterTop,
+    .containerSupportClient {
+      width: 100%;
+    }
+
     div h4 {
       display: flex;
       align-items: center;

src/schema/FormSchema.ts

@@ -48,6 +48,6 @@ export default Yup.object().shape({
     .required("*Campo obrigatório")
     .test("phone", "*Telefone Inválido", (phone) => convertPhone(phone!)),
   instagram: Yup.string()
-    .matches(/@/, "@ é obrigatório")
-    .min(3, "Nome de usuario muito curto"),
+    .matches(/^@/, "@ no início é obrigatória")
+    .min(4, "Nome de usuario muito curto"),
 });