Skip to content

Commit 4e720b2

Browse files
author
justhenrique
committed
Minute visual style update
1 parent ecbd47b commit 4e720b2

File tree

18 files changed

+163
-106
lines changed

18 files changed

+163
-106
lines changed

‎public/app_logo.svg‎

Lines changed: 4 additions & 2 deletions
Loading

‎src/components/BoxInformation/styles.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ const StyledBoxInformation = styled.div`
2727
justify-content: flex-end;
2828
2929
color: #fff;
30-
font-size: 1.5rem;
30+
font-size: 1rem;
3131
font-weight: 900;
3232
margin: 0;
3333

‎src/components/Button/styles.ts‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -14,13 +14,13 @@ const StyledButton = styled.button<StyledButtonProps>`
1414
width: ${props => props.size || '17.313rem'};
1515
height: 4.063rem;
1616
border-radius: 1.25rem;
17-
border: none;
18-
outline: none;
17+
border: 0.063rem;
18+
outline: 0.063rem;
1919
2020
font-family: Roboto;
2121
font-style: normal;
2222
font-weight: bold;
23-
font-size: 1.5rem;
23+
font-size: 2rem;
2424
2525
color: ${props => props.colorText || '#fff'};
2626
background: ${props => props.color || '#F60846'};

‎src/components/Input/styles.ts‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -16,9 +16,9 @@ export const StyledInput = styled.div<Props>`
1616
margin: 0;
1717
1818
h3 {
19-
font-weight: bold;
19+
font-weight: 500;
2020
font-size: ${props => props.Size || '1.5rem'};
21-
color: ${props => props.Color || 'var(--black)'};
21+
color: ${props => props.Color || 'var(--gray)'};
2222
2323
margin-bottom: 5px;
2424
}
@@ -33,7 +33,7 @@ export const StyledInput = styled.div<Props>`
3333
font-family: Roboto;
3434
font-size: 1.3rem;
3535
font-style: normal;
36-
font-weight: bold;
36+
font-weight: 400;
3737
3838
outline: none;
3939
border: 0;

‎src/components/ScrollBox/styles.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,11 +11,11 @@ const StyledScrollBox = styled.div`
1111
::-webkit-scrollbar {
1212
width: 12px;
1313
border-radius: 20px;
14-
background: var(--red-pink);
14+
background: #ffe7ed;
1515
}
1616
1717
::-webkit-scrollbar-thumb {
18-
border: 3px solid var(--red-pink);
18+
border: 3px solid #ffe7ed;
1919
border-radius: 20px;
2020
background: white;
2121
}

‎src/pages/Minute/components/Distributions/styles.ts‎

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,15 @@ import styled from 'styled-components';
33
const StyledDistributions = styled.div`
44
display: flex;
55
justify-content: center;
6-
padding-top: 1.875rem;
6+
align-items: center;
7+
8+
width: 100%;
9+
max-width: 102.125rem;
10+
11+
background-color: #ffffff;
12+
border-radius: 20px;
13+
14+
padding: 3rem;
715
816
.Distributions {
917
display: flex;

‎src/pages/Minute/components/Initial/Initial.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -26,22 +26,22 @@ const Initial = () => {
2626
<form action="">
2727
<Input
2828
title="Local"
29-
color="var(--black)"
29+
color="var(--gray)"
3030
styleWidth="49.375rem"
3131
onChange={(e: any) => setLocal(e.target.value)}
3232
/>
3333

3434
<Input
3535
title="Data de Inicio"
36-
color="var(--black)"
36+
color="var(--gray)"
3737
styleWidth="23.75rem"
3838
type="date"
3939
onChange={(e: any) => setStartDate(e.target.value)}
4040
/>
4141

4242
<Input
4343
title="Horário de Inicio"
44-
color="var(--black)"
44+
color="var(--gray)"
4545
styleWidth="23.75rem"
4646
type="time"
4747
onChange={(e: any) => setStartHour(e.target.value)}

‎src/pages/Minute/components/Initial/styles.ts‎

Lines changed: 11 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,9 @@ import styled from 'styled-components';
33
export const StyledInitial = styled.div`
44
display: flex;
55
justify-content: center;
6+
align-items: center;
7+
8+
width: 100%;
69
710
.Initial {
811
display: flex;
@@ -13,12 +16,10 @@ export const StyledInitial = styled.div`
1316
max-width: 102.125rem;
1417
width: 100%;
1518
16-
padding-top: 4rem;
17-
padding-bottom: 4rem;
18-
border-bottom: 2px solid var(--red-pink);
19+
padding-top: 3.75rem;
1920
2021
h1 {
21-
color: var(--red-pink);
22+
color: #f9537e;
2223
font-size: 3.125rem;
2324
font-weight: bold;
2425
}
@@ -27,6 +28,12 @@ export const StyledInitial = styled.div`
2728
display: flex;
2829
width: 100%;
2930
31+
background-color: #ffffff;
32+
border-radius: 20px;
33+
34+
padding: 3rem;
35+
gap: 3rem;
36+
3037
align-items: center;
3138
justify-content: space-between;
3239

‎src/pages/Minute/components/OptionButtons/styles.ts‎

Lines changed: 4 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -6,17 +6,14 @@ export const Container = styled.div`
66
77
.buttons {
88
display: flex;
9-
flex-wrap: wrap;
109
justify-content: flex-end;
1110
align-items: center;
1211
13-
width: 100%;
14-
max-width: 102.125rem;
12+
gap: 2rem;
1513
16-
margin: 200px 0;
14+
width: 100vw;
15+
max-width: 102.125rem;
1716
18-
button {
19-
margin: 10px;
20-
}
17+
margin-bottom: 5rem;
2118
}
2219
`;

‎src/pages/Minute/components/ProjectInformation/ProjectInformation.tsx‎

Lines changed: 12 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -70,9 +70,7 @@ const ProjectInformation = () => {
7070
};
7171

7272
const deleteMember = (member: string) => {
73-
setMembers(members.filter(
74-
user => user.name !== member,
75-
));
73+
setMembers(members.filter(user => user.name !== member));
7674
};
7775

7876
useEffect(() => {
@@ -86,26 +84,28 @@ const ProjectInformation = () => {
8684

8785
<Input
8886
title="Nome do Projeto"
89-
Size="2rem"
90-
color="var(--red-pink)"
87+
Size="2.375rem"
88+
color="var(--gray)"
9189
styleWidth="102.1rem"
9290
onChange={(e: any) => setProjectName(e.target.value)}
9391
/>
9492

9593
<div className="AddUsers">
9694
<div className="DataUser">
97-
<h1>Adicionar Participantes</h1>
95+
<h1>Lista de Participantes</h1>
9896

9997
<div className="NameTitle">
10098
<Input
10199
title="Nome completo do Participante"
100+
color="var(--gray)"
102101
styleWidth="49.375rem"
103102
value={name}
104103
onChange={(e: any) => setName(e.target.value)}
105104
/>
106105

107106
<Input
108107
title="Título / Cargo"
108+
color="var(--gray)"
109109
styleWidth="23.75rem"
110110
value={role}
111111
onChange={(e: any) => setRole(e.target.value)}
@@ -115,12 +115,14 @@ const ProjectInformation = () => {
115115
<div className="CompanyPhoneEmail">
116116
<Input
117117
title="Empresa"
118+
color="var(--gray)"
118119
styleWidth="23.75rem"
119120
value={enterprise}
120121
onChange={(e: any) => setEnterprise(e.target.value)}
121122
/>
122123

123124
<Input
125+
color="var(--gray)"
124126
title="Telefone"
125127
styleWidth="23.75rem"
126128
value={phone}
@@ -129,6 +131,7 @@ const ProjectInformation = () => {
129131

130132
<Input
131133
title="E-mail"
134+
color="var(--gray)"
132135
styleWidth="23.75rem"
133136
value={email}
134137
onChange={(e: any) => setEmail(e.target.value)}
@@ -151,7 +154,9 @@ const ProjectInformation = () => {
151154

152155
<ScrollBox>
153156
{members.map(member => (
154-
<BoxInformation deleteComponent={() => deleteMember(member.name)}>
157+
<BoxInformation
158+
deleteComponent={() => deleteMember(member.name)}
159+
>
155160
<h4>{member.name}</h4>
156161
</BoxInformation>
157162
))}

0 commit comments

Comments
 (0)