-
Notifications
You must be signed in to change notification settings - Fork 2
/
index.html
111 lines (107 loc) · 4.3 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="./style/style.css" />
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
href="https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500&display=swap"
rel="stylesheet"
/>
<title>Mapi</title>
</head>
<body>
<header class="header">
<div class="content_header">
<div class="logo">
<span>mapi</span>
</div>
<!-- container search -->
<div class="search">
<div class="input_search">
<input type="text" class="value_search" placeholder="Search mapi" />
</div>
<div class="submit_search">
<svg
version="1.1"
id="Capa_1"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
x="0px"
y="0px"
viewBox="0 0 512.005 512.005"
style="enable-background: new 0 0 512.005 512.005"
xml:space="preserve"
>
<g>
<g>
<path
d="M505.749,475.587l-145.6-145.6c28.203-34.837,45.184-79.104,45.184-127.317c0-111.744-90.923-202.667-202.667-202.667 S0,90.925,0,202.669s90.923,202.667,202.667,202.667c48.213,0,92.48-16.981,127.317-45.184l145.6,145.6 c4.16,4.16,9.621,6.251,15.083,6.251s10.923-2.091,15.083-6.251C514.091,497.411,514.091,483.928,505.749,475.587z M202.667,362.669c-88.235,0-160-71.765-160-160s71.765-160,160-160s160,71.765,160,160S290.901,362.669,202.667,362.669z"
/>
</g>
</g>
<g></g>
<g></g>
<g></g>
<g></g>
<g></g>
<g></g>
<g></g>
<g></g>
<g></g>
<g></g>
<g></g>
<g></g>
<g></g>
<g></g>
<g></g>
</svg>
</div>
</div>
<div class="menu_lust">
<svg id="Layer_1" enable-background="new 0 0 512 512" height="512" viewBox="0 0 512 512" width="512" xmlns="http://www.w3.org/2000/svg"><path d="m464.883 64.267h-417.766c-25.98 0-47.117 21.136-47.117 47.149 0 25.98 21.137 47.117 47.117 47.117h417.766c25.98 0 47.117-21.137 47.117-47.117 0-26.013-21.137-47.149-47.117-47.149z"/><path d="m464.883 208.867h-417.766c-25.98 0-47.117 21.136-47.117 47.149 0 25.98 21.137 47.117 47.117 47.117h417.766c25.98 0 47.117-21.137 47.117-47.117 0-26.013-21.137-47.149-47.117-47.149z"/><path d="m464.883 353.467h-417.766c-25.98 0-47.117 21.137-47.117 47.149 0 25.98 21.137 47.117 47.117 47.117h417.766c25.98 0 47.117-21.137 47.117-47.117 0-26.012-21.137-47.149-47.117-47.149z"/></svg>
</div>
</div>
<!-- information about the location and the weather. -->
<section class="info_area">
<div class="content_info_area">
<div class="img_search">
<img src="" class="main_img_top" alt="" />
</div>
<div class="line_info">
<h1 class="info_area-state"></h1>
</div>
<div class="line_info info_area_weather-temperture">
<h2 class="info_area_weather-temperture-title">Tempreture:</h2>
<p class="info_area_weather-temperture-data"></p>
</div>
<div class="line_info info_area_weather-description">
<h2 class="info_area_weather-description-title">Main Weather:</h2>
<p class="info_area_weather-description-data"></p>
<div class="line_info info_area_weather-icon">
<img
class="info_area_weather-icon-image"
src="http://openweathermap.org/img/wn/[email protected]"
alt=""
/>
</div>
</div>
<div class="photo-text"></div>
<div class="container_imgs"></div>
</div>
</section>
</header>
<main class="main">
<!-- Middle: the map. -->
<section class="map">
<iframe class="iframe" src="#"></iframe>
</section>
</main>
<script src="./js/logic.js"></script>
<script src="./js/dom.js"></script>
<script src="./js/index.js"></script>
</body>
</html>