cainamilech/desafio-react-e-typescript-caina
1
0
Fork 0
forked from M3-Academy/desafio-react-e-typescript
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: Adiciona main 4k

Browse Source
This commit is contained in:
Cainã Milech 2023-01-08 22:38:40 -03:00
parent 1031b3051d
commit 56be670c8c
5 changed files with 87 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
react-project/src/components/MainInstitucional/Contato.tsx
View File

@ -64,8 +64,6 @@ const phoneNumberMask = [
/\d/,
];
const insta = ["@"];
const Contato = () => {
return (
<div className={contato["forms"]}>
@ -136,7 +134,7 @@ const Contato = () => {
/>
</div>
<div className={contato["forms__form-col"]}>
<label htmlFor="date">Data de Nascimento</label>
<label htmlFor="date">Data de Nascimento:</label>
<Field
name="date"
render={({ field }: any) => (
@ -158,7 +156,7 @@ const Contato = () => {
/>
</div>
<div className={contato["forms__form-col"]}>
<label htmlFor="telefone">Telefone</label>
<label htmlFor="telefone">Telefone:</label>
<Field
name="telefone"
render={({ field }: any) => (

2
react-project/src/components/MainInstitucional/Navigation.tsx
View File

@ -3,8 +3,6 @@ import { NavLink } from "react-router-dom";
import navigation from "./assets/modules/Navigation.module.scss";
const Navigation = () => {
/*let activeClassName = "ativo";*/
return (
<ul className={navigation["items"]}>
<li>

59
react-project/src/components/MainInstitucional/assets/modules/Contato.module.scss
View File

@ -8,6 +8,11 @@
line-height: 28px;
color: var(--black);
margin-bottom: 12px;
@media screen and (min-width: 2500px) {
font-size: 48px;
line-height: 56px;
}
}
&__form-col {
@ -22,6 +27,11 @@
font-size: 14px;
line-height: 16px;
color: var(--black-300);
@media screen and (min-width: 2500px) {
font-size: 28px;
line-height: 33px;
}
}
input {
@ -35,11 +45,21 @@
color: var(--gray-400);
padding: 15px 20px;
@media screen and (min-width: 2500px) {
font-size: 28px;
line-height: 33px;
}
&::placeholder {
font-weight: 400;
font-size: 14px;
line-height: 16px;
color: var(--gray-400);
@media screen and (min-width: 2500px) {
font-size: 28px;
line-height: 33px;
}
}
}
}
@ -53,6 +73,13 @@
span {
color: var(--red-100);
margin-right: 2px;
font-weight: 400;
font-size: 14px;
line-height: 16px;
@media screen and (min-width: 2500px) {
font-size: 28px;
line-height: 33px;
}
}
label {
@ -62,6 +89,10 @@
margin-right: 4.28px;
position: relative;
text-decoration: underline;
@media screen and (min-width: 2500px) {
font-size: 28px;
line-height: 33px;
}
label {
position: absolute;
@ -70,6 +101,12 @@
border: 1px solid #000000;
border-radius: 3px;
right: -26px;
@media screen and (min-width: 2500px) {
width: 36.4px;
height: 35.15px;
right: -50px;
}
}
}
input {
@ -79,6 +116,12 @@
margin-left: 1px;
margin-top: 1.5px;
@media screen and (min-width: 2500px) {
width: 30px;
height: 28.5px;
margin-left: 8px;
}
&:checked {
opacity: 1;
}
@ -93,6 +136,11 @@
font-size: 12px;
line-height: 14px;
color: var(--red-100);
@media screen and (min-width: 2500px) {
font-size: 24px;
line-height: 28px;
}
}
button {
@ -106,6 +154,12 @@
letter-spacing: 0.05em;
color: var(--white);
cursor: pointer;
@media screen and (min-width: 2500px) {
font-size: 32px;
line-height: 38px;
height: 71px;
}
}
&__success {
@ -117,5 +171,10 @@
font-size: 12px;
line-height: 14px;
color: var(--green-100);
@media screen and (min-width: 2500px) {
font-size: 24px;
line-height: 28px;
}
}
}

15
react-project/src/components/MainInstitucional/assets/modules/Main.module.scss
View File

@ -13,6 +13,11 @@
letter-spacing: 0.1em;
text-align: center;
margin-bottom: 80px;
@media screen and (min-width: 2500px) {
font-size: 48px;
line-height: 56px;
}
}
&__wrapperNav {
@ -27,6 +32,11 @@
font-size: 24px;
line-height: 28px;
margin-bottom: 12px;
@media screen and (min-width: 2500px) {
font-size: 48px;
line-height: 56px;
}
}
p {
@ -35,6 +45,11 @@
font-size: 13px;
line-height: 15px;
margin-bottom: 13px;
@media screen and (min-width: 2500px) {
font-size: 26px;
line-height: 30px;
}
}
}
}

11
react-project/src/components/MainInstitucional/assets/modules/Navigation.module.scss
View File

@ -5,6 +5,11 @@
height: 285px;
margin-right: 30px;
@media screen and (min-width: 2500px) {
width: 590px;
height: 465px;
}
li {
width: inherit;
@ -17,7 +22,13 @@
font-size: 16px;
line-height: 19px;
@media screen and (min-width: 2500px) {
font-size: 32px;
line-height: 38px;
}
&.ativo {
font-weight: 700;
color: var(--white);
background-color: var(--black);
}