From 0d7f1da5c8377db443f83ee581ee96145a75079c Mon Sep 17 00:00:00 2001
From: ManuelaLuanaSchumackerTavares <manuelaluana.dev@gmail.com>
Date: Thu, 19 Jan 2023 19:46:06 -0300
Subject: [PATCH] =?UTF-8?q?feat(form):=20Torna=20os=20avisos=20de=20campo?=
 =?UTF-8?q?=20obrigat=C3=B3rio=20responsivos=20para=20telas=20maiores=20de?=
 =?UTF-8?q?=202500px?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../main/components/main-form.module.scss     | 63 ++++++++++++++++++-
 src/components/newsletter.module.scss         | 10 +++
 src/variables.module.scss                     |  1 +
 3 files changed, 72 insertions(+), 2 deletions(-)

diff --git a/src/components/main/components/main-form.module.scss b/src/components/main/components/main-form.module.scss
index cb725d8..e573d98 100644
--- a/src/components/main/components/main-form.module.scss
+++ b/src/components/main/components/main-form.module.scss
@@ -4,6 +4,10 @@
   width: 100%;
   height: 650px;
 
+  @media screen and (min-width: 2500px) {
+    height: 900px;
+  }
+
   .main-form {
     width: 100%;
     height: 600px;
@@ -23,6 +27,11 @@
 
         margin-left: 15px;
         margin-bottom: 12px;
+
+        @media screen and (min-width: 2500px) {
+          font-size: 28px;
+          line-height: 33px;
+        }
       }
 
       input {
@@ -31,6 +40,23 @@
         border-radius: 25px;
 
         margin-bottom: 12px;
+
+        @media screen and (min-width: 2500px) {
+          font-size: 28px;
+          line-height: 33px;
+        }
+      }
+
+      input::placeholder {
+        font-weight: 400;
+        font-size: 14px;
+        line-height: 16px;
+        color: variables.$color-grey6;
+
+        @media screen and (min-width: 2500px) {
+          font-size: 28px;
+          line-height: 33px;
+        }
       }
 
       .form-feedback {
@@ -41,6 +67,13 @@
         font-size: 12px;
         line-height: 14px;
         color: variables.$color-red;
+
+        @media screen and (min-width: 2500px) {
+          font-size: 24px;
+          line-height: 28px;
+
+          bottom: 80px;
+        }
       }
     }
 
@@ -49,9 +82,19 @@
       align-items: center;
       justify-content: center;
       margin-bottom: 12px;
+      margin-top: 12px;
+
+      label {
+        display: flex;
+      }
 
       input {
         margin-left: 4.28px;
+
+        @media screen and (min-width: 2500px) {
+          width: 35.15px;
+          height: 35.15px;
+        }
       }
 
       .main-form-dot,
@@ -59,6 +102,11 @@
         font-weight: 400;
         font-size: 14px;
         line-height: 16px;
+
+        @media screen and (min-width: 2500px) {
+          font-size: 28px;
+          line-height: 33px;
+        }
       }
 
       .main-form-dot {
@@ -72,13 +120,18 @@
 
       .form-feedback {
         position: absolute;
-        // right: 100px;
-        // bottom: 0px;
         font-weight: 400;
         font-size: 12px;
         line-height: 14px;
         color: variables.$color-red;
 
+        @media screen and (min-width: 2500px) {
+          font-size: 24px;
+          line-height: 28px;
+
+          right: 15%;
+        }
+
         @media screen and (max-width: 360px) {
           display: flex;
         }
@@ -86,6 +139,7 @@
     }
 
     .main-form-button {
+      font-style: normal;
       font-weight: 400;
       font-size: 16px;
       line-height: 19px;
@@ -99,6 +153,11 @@
       background: variables.$color-black;
       border-radius: 25px;
 
+      @media screen and (min-width: 2500px) {
+        font-size: 32px;
+        line-height: 38px;
+      }
+
       @media screen and (max-width: 360px) {
         margin-top: 4px;
       }
diff --git a/src/components/newsletter.module.scss b/src/components/newsletter.module.scss
index 54368c2..2fbb439 100644
--- a/src/components/newsletter.module.scss
+++ b/src/components/newsletter.module.scss
@@ -79,6 +79,9 @@
 
           @media screen and (min-width: 2500px) {
             min-width: 668px;
+
+            font-size: 28px;
+            line-height: 33px;
           }
 
           @media screen and (max-width: 1024px) {
@@ -106,6 +109,13 @@
           font-size: 12px;
           line-height: 14px;
           color: variables.$color-red;
+
+          @media screen and (min-width: 2500px) {
+            font-size: 24px;
+            line-height: 28px;
+
+            right: -95px;
+          }
         }
       }
 
diff --git a/src/variables.module.scss b/src/variables.module.scss
index b5018c4..4b5354a 100644
--- a/src/variables.module.scss
+++ b/src/variables.module.scss
@@ -18,6 +18,7 @@ $color-grey2: #e5e5e5;
 $color-grey3: #7d7d7d;
 $color-grey4: #f2f2f2;
 $color-grey5: #c6c6c6;
+$color-grey6: #b9b7b7;
 
 $color-red: #ff0000;