-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
119 lines (115 loc) · 6.57 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Busca Cep</title>
</head>
<body>
<header>
<svg class="logo" width="154" height="38" viewBox="0 0 154 38" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M30.8405 10.8694L25.3704 13.0416C25.188 11.9442 24.8516 10.972 24.3612 10.125C23.8709 9.26617 23.2608 8.53852 22.531 7.94208C21.8012 7.34565 20.9688 6.89832 20.0338 6.6001C19.1101 6.28996 18.1123 6.13488 17.0405 6.13488C15.1361 6.13488 13.4485 6.63589 11.9775 7.6379C10.5065 8.62799 9.35477 10.0833 8.52235 12.0038C7.68992 13.9124 7.27371 16.2445 7.27371 19C7.27371 21.8033 7.68992 24.1652 8.52235 26.0857C9.36617 27.9943 10.5179 29.4376 11.9775 30.4158C13.4485 31.382 15.1304 31.8651 17.0234 31.8651C18.0724 31.8651 19.0531 31.722 19.9653 31.4357C20.889 31.1375 21.7157 30.7021 22.4455 30.1295C23.1867 29.5569 23.8082 28.8531 24.3099 28.0181C24.8231 27.1831 25.1766 26.2288 25.3704 25.1552L30.8405 27.2452C30.601 28.9868 31.0092 28.5669 30.211 30.0937C29.4242 31.6206 28.3922 32.9686 27.1151 34.1376C25.8379 35.2947 24.3441 36.2012 22.6337 36.8573C20.9232 37.5015 19.0246 37.8235 16.9378 37.8235C13.859 37.8235 11.1108 37.078 8.69339 35.5869C6.27594 34.0958 4.37162 31.9427 2.98044 29.1275C1.58927 26.3123 0.893677 22.9365 0.893677 19C0.893677 15.0516 1.59497 11.6758 2.99755 8.87253C4.40013 6.05735 6.31015 3.90421 8.7276 2.41312C11.1451 0.922028 13.8818 0.176483 16.9378 0.176483C18.8878 0.176483 20.7008 0.462772 22.3771 1.03535C24.0534 1.60793 25.5472 2.44891 26.8585 3.55828C28.1699 4.65572 29.2475 6.00367 30.0913 7.60212C30.9465 9.18864 30.5782 8.8296 30.8405 10.8694Z"
fill="url(#paint0_linear_20_3)" />
<path
d="M37.5788 37.3225V0.67749H60.3622L59.182 6.13488L43.9247 6.24224V16.1908H59.182V21.7555H43.9247V31.7578L59.182 31.8651L60.4991 37.3225H37.5788Z"
fill="url(#paint1_linear_20_3)" />
<path
d="M66.8363 37.3225L66.9655 0.792019L79.9727 0.67749C82.6638 0.67749 84.9216 1.20235 86.7461 2.25208C88.582 3.30181 89.9675 4.74519 90.9026 6.58221C91.849 8.4073 92.3222 10.4829 92.3222 12.809C92.3222 15.159 91.849 17.2465 90.9026 19.0716C89.9561 20.8967 88.5592 22.3341 86.7119 23.3838C84.8646 24.4216 82.5897 24.9405 79.8872 24.9405H71.1809V19.4831H79.0319C80.6056 19.4831 81.8941 19.1968 82.8976 18.6243C83.9011 18.0517 84.6423 17.2644 85.1212 16.2624C85.6115 15.2604 85.8567 14.1092 85.8567 12.809C85.8567 11.5088 85.6115 10.3636 85.1212 9.37353C84.6423 8.38345 83.8954 7.61404 82.8805 7.06532C81.877 6.50467 80.5828 6.22435 78.9977 6.22435H73.1822L71.7821 34.8032L66.8363 37.3225Z"
fill="url(#paint2_linear_20_3)" />
<path d="M125.011 4.88235H120.184L130.266 18.9999L120.184 33.1176H125.011L135.092 18.9999L125.011 4.88235Z"
fill="#FFD626" />
<path d="M116.285 4.88235H111.458L121.54 18.9999L111.458 33.1176H116.285L126.366 18.9999L116.285 4.88235Z"
fill="#FFD626" />
<path d="M143.736 4.88235H128.95L139.032 18.9999L128.95 33.1176H143.736L153.818 18.9999L143.736 4.88235Z"
fill="#FFD626" />
<defs>
<linearGradient id="paint0_linear_20_3" x1="46.608" y1="0.176483" x2="46.608" y2="37.8235"
gradientUnits="userSpaceOnUse">
<stop stop-color="white" />
<stop offset="1" stop-color="white" />
</linearGradient>
<linearGradient id="paint1_linear_20_3" x1="46.608" y1="0.176483" x2="46.608" y2="37.8235"
gradientUnits="userSpaceOnUse">
<stop stop-color="white" />
<stop offset="1" stop-color="white" />
</linearGradient>
<linearGradient id="paint2_linear_20_3" x1="46.608" y1="0.176483" x2="46.608" y2="37.8235"
gradientUnits="userSpaceOnUse">
<stop stop-color="white" />
<stop offset="1" stop-color="white" />
</linearGradient>
</defs>
</svg>
<ul class="redes">
<li>
<a id="linkedin" target="_blank" href="https://www.linkedin.com/in/wallace-bezerra/">
<img src="/public/redes/icon-linkedin.svg" alt="Icone linkedin" />
</a>
</li>
<li>
<a id="github" target="_blank" href="https://github.com/Wallace-Bezerra">
<img src="/public/redes/github.svg" alt="Icone github"/></a>
</li>
</ul>
</header>
<main>
<section class="bg-main container">
<div class="title">
<h1>Busque o CEP de todo o Brasil.</h1>
<p>Digite o cep e faça uma busca!</p>
</div>
<form>
<input class="input-cep" inputmode="numeric" placeholder="00000-000" type="text">
<a href="#" class="search">
<img src="./search.svg" alt="">
</a>
</form>
</section>
<section class="bg-loader container">
<div class="card">
<div class="top">
<p>CEP: 04218000</p>
<svg width="200" height="26" viewBox="0 0 51 26" fill="none" xmlns="http://www.w3.org/2000/svg">
<path class="seta1"
d="M22.1156 1.52588e-05H17.3121L27.3452 12.6958L17.3121 25.3918H22.1156L32.1482 12.6958L22.1156 1.52588e-05Z"
fill="#FFD626" />
<path class="seta2"
d="M13.4323 1.52588e-05H8.62878L18.6618 12.6958L8.62878 25.3918H13.4323L23.4642 12.6958L13.4323 1.52588e-05Z"
fill="#FFD626" />
<path class="seta3"
d="M40.7504 1.52588e-05H26.0356L36.0687 12.6958L26.0356 25.3918H40.7504L50.7835 12.6958L40.7504 1.52588e-05Z"
fill="#FFD626" />
<path class="seta4" d="M4.80301 0H0L10.0326 12.6958L0 25.3918H4.80301L14.8354 12.6958L4.80301 0Z"
fill="#FFD626" />
</svg>
<p>São Paulo</p>
</div>
<div class="bottom">
<form class="form-cep">
<div class="input-get">
<label for="logradouro">Logradouro</label>
<input type="text" disabled name="logradouro" id="logradouro">
</div>
<div class="input-get">
<label for="bairro">Bairro</label>
<input type="text" disabled name="bairro" id="bairro">
</div>
<div class="input-get">
<label for="uf">Estado</label>
<input type="text" disabled name="uf" id="uf">
</div>
</form>
<div class="mapa">
<a target="_blank" href="">
<img src="./public/maps-gps.svg" alt=""><span> ABRIR MAPA</span>
</a>
</div>
</div>
</div>
</section>
</main>
<script type="module" src="/main.js"></script>
</body>
</html>