Skip to content

Commit c4f9cb4

Browse files
gustavoquinalhagustavoquinalha
committed
-q
1 parent 82cb823 commit c4f9cb4

File tree

2 files changed

+414
-346
lines changed

2 files changed

+414
-346
lines changed

‎css/index.css

+165-155
Original file line numberDiff line numberDiff line change
@@ -3,223 +3,233 @@
33
margin: 0;
44
padding: 0;
55
}
6-
76
html,
87
body {
98
width: 100%;
109
height: 100%;
1110
font-family: 'PT Sans', sans-serif;
1211
}
1312
a {
14-
text-decoration: none;
15-
color: #FF5F6D;
16-
font-weight: bold;
17-
opacity: 0.5
13+
text-decoration: none;
14+
color: #5f72bd;
15+
font-weight: bold;
16+
opacity: 0.7
1817
}
1918
a:hover {
20-
opacity: 1
19+
opacity: 1
2120
}
2221
form {
23-
padding-bottom: 20px
22+
padding-bottom: 20px
2423
}
2524
.cc {
26-
text-align: right;
27-
padding-bottom: 20px;
28-
}
29-
pre {
30-
color:#55cc66;
31-
background:#001800!important;
32-
width: 99%;
33-
overflow: auto;
34-
overflow-y: hidden;
35-
text-align: left;
36-
padding: 10px;
37-
border-radius: 3px;
38-
margin: 0 auto;
39-
}
40-
pre::-webkit-scrollbar {
25+
text-align: right;
26+
padding-bottom: 20px;
27+
}
28+
pre {
29+
color: #55cc66;
30+
background: #001800!important;
31+
width: 99%;
32+
overflow: auto;
33+
overflow-y: hidden;
34+
text-align: left;
35+
padding: 10px;
36+
border-radius: 3px;
37+
margin: 0 auto;
38+
}
39+
pre::-webkit-scrollbar {
4140
width: 1em;
4241
height: 5px
4342
}
44-
4543
pre::-webkit-scrollbar-track {
4644
-webkit-box-shadow: none;
4745
}
48-
4946
pre::-webkit-scrollbar-thumb {
50-
background-color: darkgrey;
51-
52-
}
53-
.resul {
54-
color: #cc5555
55-
}
56-
.ff {
57-
color: #865700
58-
}
59-
.comment {
60-
color: rgba(255, 255, 255, 0.5);
61-
font-style: italic;
62-
}
63-
.formulario {
64-
background: #f4f4f4;
65-
padding-bottom: 50px;
66-
padding-top: 10px;
67-
overflow: hidden;
68-
}
47+
background-color: darkgrey;
48+
}
49+
.resul {
50+
color: #cc5555
51+
}
52+
.ff {
53+
color: #865700
54+
}
55+
.comment {
56+
color: rgba(255, 255, 255, 0.5);
57+
font-style: italic;
58+
}
59+
.formulario {
60+
background: #f4f4f4;
61+
padding-bottom: 50px;
62+
padding-top: 10px;
63+
overflow: hidden;
64+
}
6965
.tamanho {
70-
width: 1100px;
71-
max-width: 90%
66+
width: 1100px;
67+
max-width: 90%
7268
}
7369
.margin {
74-
margin: 0 auto
70+
margin: 0 auto
7571
}
7672
.intro {
77-
height: 100%;
78-
color: #fff;
79-
text-align: center;
80-
background: #FF906F;
81-
background: -webkit-linear-gradient(left, #FF5F6D, #FFC371);
82-
background: linear-gradient(to right, #FF5F6D, #FFC371);
83-
}
84-
73+
height: 100%;
74+
color: #fff;
75+
text-align: center;
76+
background: #5f72bd;
77+
background: -webkit-linear-gradient(left, #5f72bd, #9b23ea);
78+
background: linear-gradient(to right, #5f72bd, #9b23ea);
79+
}
8580
.flex {
86-
display: -webkit-box;
87-
display: -ms-flexbox;
88-
display: flex;
89-
height: 100%;
90-
-webkit-box-align: center;
91-
-ms-flex-align: center;
92-
align-items: center;
93-
-webkit-box-pack: center;
94-
-ms-flex-pack: center;
95-
justify-content: center
96-
}
97-
.box{
98-
width: 500px;
99-
max-width: 90%
81+
display: -webkit-box;
82+
display: -ms-flexbox;
83+
display: flex;
84+
height: 100%;
85+
-webkit-box-align: center;
86+
-ms-flex-align: center;
87+
align-items: center;
88+
-webkit-box-pack: center;
89+
-ms-flex-pack: center;
90+
justify-content: center
91+
}
92+
.box {
93+
width: 500px;
94+
max-width: 90%
10095
}
10196
.ex {
102-
padding-top: 20px;
97+
padding-top: 20px;
10398
}
10499
footer {
105-
padding-top: 50px;
106-
padding-bottom: 30px
100+
padding-top: 50px;
101+
padding-bottom: 30px
107102
}
108103
.bg {
109-
background: #fff;
110-
border: 1px solid rgba(0, 0, 0, 0.1);
111-
margin-bottom: 20px;
112-
border-left: 5px solid #FF5F6D;
113-
box-shadow: 0px 0px 20px 1px rgba(0, 0, 0, 0.1);
114-
border-radius: 4px
104+
background: #fff;
105+
border: 1px solid rgba(0, 0, 0, 0.1);
106+
margin-bottom: 20px;
107+
border-left: 5px solid #5f72bd;
108+
box-shadow: 0px 0px 20px 1px rgba(0, 0, 0, 0.1);
109+
border-radius: 4px
115110
}
116111
.bg h2 {
117-
margin-left: 10px;
118-
color: #FF5F6D;
119-
padding-top: 10px
112+
margin-left: 10px;
113+
color: #5f72bd;
114+
padding-top: 10px
120115
}
121116
.container-form {
122-
margin-top: 10px;
123-
margin-bottom: 20px;
124-
display: -webkit-box;
125-
display: -ms-flexbox;
126-
display: flex;
127-
-webkit-box-pack: center;
128-
-ms-flex-pack: center;
129-
justify-content: center;
130-
-webkit-box-align: center;
131-
-ms-flex-align: center;
132-
align-items: center;
133-
-ms-flex-wrap: wrap;
134-
flex-wrap: wrap;
117+
margin-top: 10px;
118+
margin-bottom: 20px;
119+
display: -webkit-box;
120+
display: -ms-flexbox;
121+
display: flex;
122+
-webkit-box-pack: center;
123+
-ms-flex-pack: center;
124+
justify-content: center;
125+
-webkit-box-align: center;
126+
-ms-flex-align: center;
127+
align-items: center;
128+
-ms-flex-wrap: wrap;
129+
flex-wrap: wrap;
135130
}
136131
.box-form {
137-
-webkit-box-flex: 1;
138-
-ms-flex-positive: 1;
139-
flex-grow: 1;
140-
-ms-flex-preferred-size: 350px;
141-
flex-basis: 350px;
142-
margin: 10px;
143-
margin-top: 0;
144-
padding-bottom: 10px;
132+
-webkit-box-flex: 1;
133+
-ms-flex-positive: 1;
134+
flex-grow: 1;
135+
-ms-flex-preferred-size: 350px;
136+
flex-basis: 350px;
137+
margin: 10px;
138+
margin-top: 0;
139+
padding-bottom: 10px;
145140
}
146141
.box-form input {
147-
width: 100%;
148-
height: 30px;
149-
font-size: 14px;
150-
outline: none;
151-
border: none;
152-
transition: 2s;
153-
color: rgba(0, 0, 0, 0.5);;
154-
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
142+
width: 100%;
143+
height: 30px;
144+
font-size: 14px;
145+
outline: none;
146+
border: none;
147+
-webkit-transition: 2s;
148+
transition: 2s;
149+
color: rgba(0, 0, 0, 0.5);
150+
;
151+
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
155152
}
156153
.box-form input:focus {
157-
border-bottom: 1px solid #FF5F6D;
154+
border-bottom: 1px solid #5f72bd;
158155
}
159156
.box-form label {
160-
font-weight: 700;
161-
color: rgba(0, 0, 0, 0.5);
162-
font-size: 20px
157+
font-weight: 700;
158+
color: rgba(0, 0, 0, 0.5);
159+
font-size: 20px
163160
}
164161
.box-form span {
165-
color: #FFC371
162+
color: #5f72bd
166163
}
167164
.box-form-button {
168-
background: #55cc66;
169-
color: #fff;
170-
width: 100%;
171-
border: none;
172-
height: 50px;
173-
font-size: 20px;
174-
font-weight: 900;
175-
border-radius: 3px;
176-
-webkit-transition: 1s;
177-
transition: 1s;
178-
cursor: pointer;
165+
background: -webkit-linear-gradient(left, #5f72bd, #9b23ea);
166+
background: linear-gradient(to right, #5f72bd, #9b23ea);
167+
color: #fff;
168+
width: 100%;
169+
border: none;
170+
height: 50px;
171+
font-size: 20px;
172+
font-weight: 900;
173+
border-radius: 3px;
174+
-webkit-transition: 1s;
175+
transition: 1s;
176+
cursor: pointer;
177+
}
178+
.counter {
179+
font-size: 14px;
180+
opacity: 0.8
179181
}
180182
.box-form-button[disabled] {
181-
opacity: 0.6;
182-
cursor: not-allowed;
183+
opacity: 0.6;
184+
cursor: not-allowed;
183185
}
184186
.btn {
185-
background: #FF906F;
186-
color: #fff;
187-
margin-top: 10px;
188-
padding-left: 20px;
189-
padding-right: 20px;
190-
border: none;
191-
height: 30px;
192-
font-size: 14px;
193-
font-weight: 900;
194-
border-radius: 3px;
195-
-webkit-transition: 1s;
196-
transition: 1s;
197-
cursor: pointer;
187+
background: #5f72bd;
188+
color: #fff;
189+
margin-top: 10px;
190+
padding-left: 20px;
191+
padding-right: 20px;
192+
border: none;
193+
height: 30px;
194+
font-size: 14px;
195+
font-weight: 900;
196+
border-radius: 3px;
197+
-webkit-transition: 1s;
198+
transition: 1s;
199+
cursor: pointer;
200+
}
201+
.btn-remover {
202+
background: #cc5555
203+
}
204+
.btn-remover:hover {
205+
background: #ad4848
206+
}
207+
.logo {
208+
width: 300px;
209+
;
198210
}
199211
.t h2 {
200-
color:#FF5F6D;
201-
font-size: 18px;
212+
color: #5f72bd;
213+
font-size: 18px;
202214
}
203-
204215
.btn:hover {
205-
background: #FF5F6D;
216+
background: #9b23ea;
206217
}
207218
.texto-intro {
208-
text-align: center;
209-
width: 300px;
210-
max-width: 90%;
211-
padding-bottom: 30px;
212-
padding-top: 20px;
213-
line-height: 25px;
214-
color: rgba(0, 0, 0, 0.6);
215-
font-size: 14px
216-
}
217-
219+
text-align: center;
220+
width: 300px;
221+
max-width: 90%;
222+
padding-bottom: 30px;
223+
padding-top: 20px;
224+
line-height: 25px;
225+
color: rgba(0, 0, 0, 0.6);
226+
font-size: 14px
227+
}
218228
@media only screen and (max-width: 400px) {
219229
.some {
220230
display: none
221231
}
222232
pre {
223-
width: 80%
233+
width: 80%
224234
}
225235
}

0 commit comments

Comments
 (0)