From 11ee4198b2054367564c938166d635b0d387bde2 Mon Sep 17 00:00:00 2001
From: Gabriel Cavalcante <gabriel.lcifba@gmail.com>
Date: Sun, 12 May 2024 15:34:53 -0300
Subject: [PATCH] =?UTF-8?q?feat:=20fix:=20adicionada=20p=C3=A1gina=20de=20?=
 =?UTF-8?q?formul=C3=A1rio=20submetido=20e=20feito=20pequenos=20ajustes=20?=
 =?UTF-8?q?gerais?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 dist/css/style.css                     | 12 ++++-----
 dist/css/style.css.map                 |  2 +-
 index.html                             |  8 +++---
 src/scss/module/app/app-container.scss |  5 ++--
 src/scss/module/app/app-input.scss     |  3 +--
 src/scss/module/app/app-textarea.scss  |  4 ++-
 submit.html                            | 35 ++++++++++++++++++++++++++
 7 files changed, 52 insertions(+), 17 deletions(-)
 create mode 100644 submit.html

diff --git a/dist/css/style.css b/dist/css/style.css
index 1b698fa..a7f32b6 100644
--- a/dist/css/style.css
+++ b/dist/css/style.css
@@ -46,9 +46,8 @@ html body button:hover {
 }
 
 .app__container {
-  max-width: 640px;
-  min-width: 320px;
-  padding: 1em 1.2em;
+  width: clamp(320px, 100%, 640px);
+  padding: 1em;
   margin-inline: auto;
   gap: 1em;
   min-height: 100svh;
@@ -99,10 +98,9 @@ html body button:hover {
 .app__input {
   border: none;
   border-bottom: 1px solid rgba(0, 0, 0, 0.2);
-  padding-bottom: 0.4em;
+  padding-bottom: 0.3em;
   outline: none;
   font-family: "Roboto", sans-serif;
-  font-size: 1rem;
   color: #202124;
   width: 100%;
 }
@@ -123,11 +121,13 @@ html body button:hover {
 }
 
 .app__textarea {
-  font-size: 1rem;
+  border-radius: 5px;
   padding: 0.5em;
   outline: none;
+  height: 100px;
   color: #202124;
   border: 1px solid rgba(0, 0, 0, 0.2);
+  resize: none;
 }
 .app__textarea:focus {
   border-width: 2px;
diff --git a/dist/css/style.css.map b/dist/css/style.css.map
index 60c2402..f518c58 100644
--- a/dist/css/style.css.map
+++ b/dist/css/style.css.map
@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../src/scss/style.scss","../../src/scss/base/base.scss","../../src/scss/base/variables.scss","../../src/scss/base/generics.scss","../../src/scss/module/app/app-container.scss","../../src/scss/module/app/app-header.scss","../../src/scss/module/app/app-formContainer.scss","../../src/scss/module/app/app-title.scss","../../src/scss/module/app/app-requiredQuestion.scss","../../src/scss/module/app/app-decoration.scss","../../src/scss/module/app/app-requiredSymbol.scss","../../src/scss/module/app/app-input.scss","../../src/scss/module/app/app-radioWrapper.scss","../../src/scss/module/app/app-radio.scss","../../src/scss/module/app/app-textarea.scss","../../src/scss/module/app/app-button.scss"],"names":[],"mappings":"AAAQ;ACER;EACE;EACA;EACA;;;AAGF;EACE;;AAEA;EACE,kBCVO;EDWP,OCTS;EDUT,aCdU;EDeV;EACA;EACA;EACA;EACA;;AAEA;AAAA;AAAA;AAAA;EAIE;;AAGF;EACE;;AAGF;EACE;EACA;;AAGF;EACE;;AAGF;EACE;;AAEA;EACE;;;AE7CR;EACE;;;ACDF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;ACPF;EACE;EACA;EACA,eHCc;;;AIJhB;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YJCW;;;AKXb;EACE;;;ACCF;EACE,ONEmB;;;AOHrB;EACE;EACA,kBPDW;EOEX;EACA;EACA;EACA;EACA;;;ACPF;EACE,OREmB;;;ASHrB;EACE;EACA;EACA;EACA;EACA,aTPY;ESQZ;EACA,OTLW;ESMX;;AAEA;EACE;EACA,qBTXS;;;AUHb;EACE;EACA;EACA;;;ACDF;EACE;EACA;;;ACFF;EACE;EACA;EACA;EACA,OZFW;EYGX;;AAEA;EACE;EACA,cZRS;;;AaDb;EACE;EACA;EACA,ObJkB;EaKlB;EACA;EACA;;AAEA;EACE","file":"style.css"}
\ No newline at end of file
+{"version":3,"sourceRoot":"","sources":["../../src/scss/style.scss","../../src/scss/base/base.scss","../../src/scss/base/variables.scss","../../src/scss/base/generics.scss","../../src/scss/module/app/app-container.scss","../../src/scss/module/app/app-header.scss","../../src/scss/module/app/app-formContainer.scss","../../src/scss/module/app/app-title.scss","../../src/scss/module/app/app-requiredQuestion.scss","../../src/scss/module/app/app-decoration.scss","../../src/scss/module/app/app-requiredSymbol.scss","../../src/scss/module/app/app-input.scss","../../src/scss/module/app/app-radioWrapper.scss","../../src/scss/module/app/app-radio.scss","../../src/scss/module/app/app-textarea.scss","../../src/scss/module/app/app-button.scss"],"names":[],"mappings":"AAAQ;ACER;EACE;EACA;EACA;;;AAGF;EACE;;AAEA;EACE,kBCVO;EDWP,OCTS;EDUT,aCdU;EDeV;EACA;EACA;EACA;EACA;;AAEA;AAAA;AAAA;AAAA;EAIE;;AAGF;EACE;;AAGF;EACE;EACA;;AAGF;EACE;;AAGF;EACE;;AAEA;EACE;;;AE7CR;EACE;;;ACDF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;ACNF;EACE;EACA;EACA,eHCc;;;AIJhB;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YJCW;;;AKXb;EACE;;;ACCF;EACE,ONEmB;;;AOHrB;EACE;EACA,kBPDW;EOEX;EACA;EACA;EACA;EACA;;;ACPF;EACE,OREmB;;;ASHrB;EACE;EACA;EACA;EACA;EACA,aTPY;ESQZ,OTJW;ESKX;;AAEA;EACE;EACA,qBTVS;;;AUHb;EACE;EACA;EACA;;;ACDF;EACE;EACA;;;ACFF;EACE;EACA;EACA;EACA;EACA,OZHW;EYIX;EACA;;AAEA;EACE;EACA,cZVS;;;AaDb;EACE;EACA;EACA,ObJkB;EaKlB;EACA;EACA;;AAEA;EACE","file":"style.css"}
\ No newline at end of file
diff --git a/index.html b/index.html
index 0af482d..5114fcd 100644
--- a/index.html
+++ b/index.html
@@ -201,7 +201,7 @@ <h1 class="app__title">Formulário de Cadastro de Magos</h1>
           <textarea
             class="app__textarea"
             placeholder="Sua resposta"
-            maxlength="100"
+            maxlength="200"
           ></textarea>
         </div>
         <div class="app__form-container">
@@ -226,7 +226,7 @@ <h1 class="app__title">Formulário de Cadastro de Magos</h1>
           <textarea
             class="app__textarea"
             placeholder="Sua resposta"
-            maxlength="100"
+            maxlength="200"
           ></textarea>
         </div>
         <div class="app__form-container">
@@ -251,7 +251,7 @@ <h1 class="app__title">Formulário de Cadastro de Magos</h1>
           <textarea
             class="app__textarea"
             placeholder="Sua resposta"
-            maxlength="100"
+            maxlength="200"
           ></textarea>
         </div>
         <div class="app__form-container">
@@ -262,7 +262,7 @@ <h1 class="app__title">Formulário de Cadastro de Magos</h1>
           <textarea
             class="app__textarea"
             placeholder="Sua resposta"
-            maxlength="100"
+            maxlength="200"
           ></textarea>
         </div>
         <button type="submit" class="app__button">Enviar</button>
diff --git a/src/scss/module/app/app-container.scss b/src/scss/module/app/app-container.scss
index bce01cc..4f24960 100644
--- a/src/scss/module/app/app-container.scss
+++ b/src/scss/module/app/app-container.scss
@@ -1,7 +1,6 @@
 .app__container {
-  max-width: 640px;
-  min-width: 320px;
-  padding: 1em 1.2em;
+  width: clamp(320px, 100%, 640px);
+  padding: 1em;
   margin-inline: auto;
   gap: 1em;
   min-height: 100svh;
diff --git a/src/scss/module/app/app-input.scss b/src/scss/module/app/app-input.scss
index 1410b8e..3a31620 100644
--- a/src/scss/module/app/app-input.scss
+++ b/src/scss/module/app/app-input.scss
@@ -3,10 +3,9 @@
 .app__input {
   border: none;
   border-bottom: 1px solid $border-color;
-  padding-bottom: 0.4em;
+  padding-bottom: 0.3em;
   outline: none;
   font-family: $roboto-font;
-  font-size: 1rem;
   color: $text-color;
   width: 100%;
 
diff --git a/src/scss/module/app/app-textarea.scss b/src/scss/module/app/app-textarea.scss
index c312a75..c1788e5 100644
--- a/src/scss/module/app/app-textarea.scss
+++ b/src/scss/module/app/app-textarea.scss
@@ -1,11 +1,13 @@
 @import "../../base/variables.scss";
 
 .app__textarea {
-  font-size: 1rem;
+  border-radius: 5px;
   padding: 0.5em;
   outline: none;
+  height: 100px;
   color: $text-color;
   border: 1px solid $border-color;
+  resize: none;
 
   &:focus {
     border-width: 2px;
diff --git a/submit.html b/submit.html
new file mode 100644
index 0000000..029f8cf
--- /dev/null
+++ b/submit.html
@@ -0,0 +1,35 @@
+<!DOCTYPE html>
+<html lang="pt-br">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta
+      name="description"
+      content="Formulário de cadastro de magos da região."
+    />
+    <title>Cadastro de Magos</title>
+    <link rel="shortcut icon" href="dist/img/favicon.ico" type="image/x-icon" />
+    <link rel="stylesheet" href="dist/css/style.css" />
+    <script defer src="dist/js/main.js"></script>
+  </head>
+  <body>
+    <main>
+      <div class="app__container">
+        <img
+          src="dist/img/header.png"
+          alt="imagem interiamente de cor roxa, de uma flor roxa"
+          title="flor roxa"
+          class="app__header"
+        />
+        <div class="app__form-container p-relative">
+          <h1 class="app__title">Formulário de Cadastro de Magos</h1>
+          <p class="app__description">
+            Obrigado por compartilhar seus segredos mágicos conosco! Que as
+            energias arcanas continuem fluindo em seu caminho!
+          </p>
+          <div class="app__decoration"></div>
+        </div>
+      </div>
+    </main>
+  </body>
+</html>