Typext · MatheusCampos-450 · Mar 29, 2021 · Mar 29, 2021
diff --git a/src/components/Button/styles.ts b/src/components/Button/styles.ts
@@ -19,7 +19,7 @@ const StyledButton = styled.button<StyledButtonProps>`
 
   font-family: Roboto;
   font-style: normal;
-  font-weight: 900;
+  font-weight: bold;
   font-size: 1.5rem;
 
   color: ${props => props.colorText || '#fff'};

diff --git a/src/components/Header/styles.ts b/src/components/Header/styles.ts
@@ -15,19 +15,18 @@ export const StyledHeader = styled.header`
   h1 {
     font-family: Roboto;
     font-style: normal;
-    font-weight: 900;
+    font-weight: bold;
     font-size: 1.875rem;
-    line-height: 2.188rem;
 
     color: #cecfd0;
 
-    margin-right: 20px;
+    margin: 0 1.25rem 0 0;
   }
 
   img {
-    height: 3.125rem;
-    width: 3.125rem;
-    padding: 0 10px;
+    height: 3.5rem;
+    width: 3.5rem;
+    padding: 0 0.625rem;
 
     &.logo {
       height: 2.5rem;

diff --git a/src/components/Input/Input.tsx b/src/components/Input/Input.tsx
@@ -19,9 +19,9 @@ const Input: React.FC<InputProps> = ({
 }: InputProps) => {
   return (
     <StyledInput
-      InputWidth={styleWidth || 'medium'}
-      Color={color || 'black'}
-      Size={Size || 'medium'}
+      InputWidth={styleWidth || '23.75rem'}
+      Color={color || 'var(--black)'}
+      Size={Size || '1.5rem'}
     >
       <h3>{title}</h3>
 
@@ -33,7 +33,7 @@ const Input: React.FC<InputProps> = ({
 Input.defaultProps = {
   Type: '',
   Size: '',
-  styleWidth: '',
+  styleWidth: '23.75rem',
   color: '',
 };
 

diff --git a/src/components/Input/styles.ts b/src/components/Input/styles.ts
@@ -1,4 +1,4 @@
-import styled, { css } from 'styled-components';
+import styled from 'styled-components';
 
 interface Props {
   InputWidth: string;
@@ -10,38 +10,16 @@ export const StyledInput = styled.div<Props>`
   display: flex;
   flex-direction: column;
 
-  margin: 0;
+  width: ${props => props.InputWidth || '23.75rem'};
 
-  ${props =>
-    props.InputWidth === 'large'
-      ? css`
-          width: 49.375rem;
-        `
-      : css`
-          width: 23.75rem;
-        `}
+  margin: 0;
 
   h3 {
-    font-weight: 900;
-    margin-bottom: 5px;
+    font-weight: bold;
+    font-size: ${props => props.Size || '1.5rem'};
+    color: ${props => props.Color || 'var(--black)'};
 
-    ${props =>
-      props.Color === 'black'
-        ? css`
-            color: var(--black);
-          `
-        : css`
-            color: var(--red-pink);
-          `}
-
-    ${props =>
-      props.Size === 'large'
-        ? css`
-            font-size: 2rem;
-          `
-        : css`
-            font-size: 1.5rem;
-          `}
+    margin-bottom: 5px;
   }
 
   input {
@@ -51,17 +29,15 @@ export const StyledInput = styled.div<Props>`
     height: 4.063rem;
     background-color: var(--soft-gray);
 
+    font-family: Roboto;
+    font-size: 1.3rem;
+    font-style: normal;
+    font-weight: bold;
+
     outline: none;
     border: 0;
     border-radius: 1.25rem;
 
-    ${props =>
-      props.InputWidth === 'large'
-        ? css`
-            width: 49.375rem;
-          `
-        : css`
-            width: 23.75rem;
-          `}
+    width: ${props => props.InputWidth || '23.75rem'}
   }
 `;
diff --git a/src/pages/Main/components/Distributions/Distributions.tsx b/src/pages/Main/components/Distributions/Distributions.tsx
@@ -47,9 +47,7 @@ const Distributions = ({ setDistributions, distributions } : DistributionsProps)
           <div className="DataDepartments">
             <Input
               title="Área"
-              Size="large"
-              color="black"
-              styleWidth="large"
+              styleWidth="49.375rem"
               value={distribution}
               onChange={(e: any) => setDistribution(e.target.value)}
             />

diff --git a/src/pages/Main/components/Distributions/styles.ts b/src/pages/Main/components/Distributions/styles.ts
@@ -15,8 +15,9 @@ const StyledDistributions = styled.div`
     width: 100%;
 
     h1 {
-      color: var(--red-pink);
+      color: var(--gray);
       font-size: 2.25rem;
+      font-weight: bold;
 
       margin-bottom: 4rem;
     }

diff --git a/src/pages/Main/components/Initial/Initial.tsx b/src/pages/Main/components/Initial/Initial.tsx
@@ -21,30 +21,27 @@ const Initial = ({ setAddressAndHour }: IInitialProps) => {
   return (
     <StyledInitial>
       <div className="Initial">
-        <h1>ATA de Reunião</h1>
+        <h1>ATA DE REUNIÃO</h1>
         <form action="">
           <Input
             title="Local"
-            color="black"
-            Size="large"
-            styleWidth="large"
+            color="var(--black)"
+            styleWidth="49.375rem"
             onChange={(e: any) => setLocal(e.target.value)}
           />
 
           <Input
             title="Data de Inicio"
-            color="black"
-            Size="large"
-            styleWidth="medium"
+            color="var(--black)"
+            styleWidth="23.75rem"
             type="date"
             onChange={(e: any) => setStartDate(e.target.value)}
           />
 
           <Input
             title="Horário de Inicio"
-            color="black"
-            Size="large"
-            styleWidth="medium"
+            color="var(--black)"
+            styleWidth="23.75rem"
             type="time"
             onChange={(e: any) => setStartHour(e.target.value)}
           />

diff --git a/src/pages/Main/components/Initial/styles.ts b/src/pages/Main/components/Initial/styles.ts
@@ -20,6 +20,7 @@ export const StyledInitial = styled.div`
     h1 {
       color: var(--red-pink);
       font-size: 3.125rem;
+      font-weight: bold;
     }
 
     form {

diff --git a/src/pages/Main/components/ProjectInformation/ProjectInformation.tsx b/src/pages/Main/components/ProjectInformation/ProjectInformation.tsx
@@ -82,13 +82,13 @@ const ProjectInformation = ({ setProjectInfo }: ProjectProps) => {
   return (
     <StyledProjectInformation>
       <div className="ProjectInformation">
-        <h1>INFORMAÇÕES DO PROJETO</h1>
+        <h1>Informações do Projeto</h1>
 
         <Input
           title="Nome do Projeto"
-          Size="large"
-          color="red-pink"
-          styleWidth="large"
+          Size="2rem"
+          color="var(--red-pink)"
+          styleWidth="102.1rem"
           onChange={(e: any) => setProjectName(e.target.value)}
         />
 
@@ -99,16 +99,14 @@ const ProjectInformation = ({ setProjectInfo }: ProjectProps) => {
             <div className="NameTitle">
               <Input
                 title="Nome completo do Participante"
-                color="black"
-                styleWidth="large"
+                styleWidth="49.375rem"
                 value={name}
                 onChange={(e: any) => setName(e.target.value)}
               />
 
               <Input
                 title="Título / Cargo"
-                color="black"
-                styleWidth="medium"
+                styleWidth="23.75rem"
                 value={role}
                 onChange={(e: any) => setRole(e.target.value)}
               />
@@ -117,24 +115,21 @@ const ProjectInformation = ({ setProjectInfo }: ProjectProps) => {
             <div className="CompanyPhoneEmail">
               <Input
                 title="Empresa"
-                color="black"
-                styleWidth="medium"
+                styleWidth="23.75rem"
                 value={enterprise}
                 onChange={(e: any) => setEnterprise(e.target.value)}
               />
 
               <Input
                 title="Telefone"
-                color="black"
-                styleWidth="medium"
+                styleWidth="23.75rem"
                 value={phone}
                 onChange={(e: any) => setPhone(e.target.value)}
               />
 
               <Input
                 title="E-mail"
-                color="black"
-                styleWidth="medium"
+                styleWidth="23.75rem"
                 value={email}
                 onChange={(e: any) => setEmail(e.target.value)}
               />

diff --git a/src/pages/Main/components/ProjectInformation/styles.ts b/src/pages/Main/components/ProjectInformation/styles.ts
@@ -3,7 +3,7 @@ import styled from 'styled-components';
 const StyledProjectInformation = styled.div`
   display: flex;
   justify-content: center;
-  padding-top: 1.875rem;
+  padding-top: 3rem;
 
   .ProjectInformation {
     display: flex;
@@ -18,8 +18,9 @@ const StyledProjectInformation = styled.div`
     border-bottom: 2px solid var(--red-pink);
 
     h1 {
-      color: var(--red-pink);
+      color: var(--gray);
       font-size: 2.25rem;
+      font-weight: bold;
 
       margin-bottom: 6.25rem;
     }
@@ -53,7 +54,7 @@ const StyledProjectInformation = styled.div`
           display: flex;
           justify-content: space-between;
 
-          margin-top: 12px;
+          margin-top: 0.75rem;
         }
 
         Button {
@@ -70,8 +71,9 @@ const StyledProjectInformation = styled.div`
         h2 {
           color: var(--black);
           font-size: 1.5ren;
+          font-weight: bold;
 
-          margin-bottom: 14px;
+          margin-bottom: 0.875rem;
         }
       }
     }

diff --git a/src/pages/Main/components/Subjects/components/SubjectModal/styles.ts b/src/pages/Main/components/Subjects/components/SubjectModal/styles.ts
@@ -16,31 +16,37 @@ export const Container = styled.div`
     width: 90rem;
     height: 55rem;
     background: #ffffff;
-    border-radius: 20px;
+    border-radius: 1.25rem;
 
     display: flex;
     flex-direction: column;
     align-items: center;
 
-    padding: 30px 20px;
+    padding: 1.875rem 1.25rem;
 
     textarea {
-      padding: 20px;
+      padding: 1.25rem;
     }
 
     .textArea,
     textarea {
       width: 100%;
       height: 100%;
+
+      font-family: Roboto;
+      font-size: 1.3rem;
+      font-style: normal;
+      font-weight: bold;
+
     }
 
     .inputs {
       display: flex;
       width: 100%;
-      margin: 30px 0;
+      margin: 1.875rem 0;
 
       div {
-        margin-right: 30px;
+        margin-right: 1.875rem;
       }
     }
-Original file line number
+Diff line change
@@ Expand Up / @@ -20,6 +20,7 @@ export const StyledInitial = styled.div` @@
         h1 {
           color: var(--red-pink);
           font-size: 3.125rem;
+          font-weight: bold;
         }
         form {
@@ Expand Down @@