-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
81 lines (69 loc) · 2.88 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
<!DOCTYPE html>
<html lang="en">
<head>
<!-- ================ meta tags ================ -->
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- ================ remix Icons Library ================ -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]/fonts/remixicon.css" rel="stylesheet">
<!-- ================ css ================ -->
<link rel="stylesheet" href="./style.css">
<!-- ================ title ================ -->
<title>Home | Countries</title>
</head>
<body>
<!-- ================ header ================ -->
<header class="header" id="header">
<nav class="nav">
<a href="#" class="nav-logo"><span>UC</span>Maps</a>
<div class="nav-menu" id="nav-menu">
<ul class="nav-list">
<li class="nav-item"><a href="#home" class="nav-link active-link">Home</a></li>
<li class="nav-item"><a href="#" class="nav-link">Contact</a></li>
</ul>
</div>
<div class="right-side">
<!-- search -->
<form class="search-box">
<input type="text" class="search-text" id="searchBar" placeholder="Enter Country">
<a href="#" class="search-btn">
<i class="ri-search-line"></i>
</a>
</form>
<!-- toggle -->
<div class="nav-toggle" id="nav-toggle">
<i class="ri-menu-3-line"></i>
</div>
</div>
</nav>
</header>
<!-- ================ main ================ -->
<main class="main" id="main">
<section class="home" id="home">
<div class="home-container">
<div class="home-data">
<h1 class="home-title">UC Maps Countries in The World</h1>
<h2 class="home-subtitle">Search for The Country to Show You All <br>Tts Universities.</h2>
<a href="#" class="button">READ MORE</a>
</div>
<img src="./img/home-img.avif" class="home-img" alt="University">
</div>
</section>
<section class="countries">
<span class="section-subtitle">Countries</span>
<h2 class="section-title">Random of Countries</h2>
<div class="card-countries">
</div>
</section>
</main>
<!-- ================ footer ================ -->
<footer class="footer section" id="footer">
<p class="footer-copy">© 2022 | All right reserved</p>
</footer>
<!-- js -->
<script src="./js/fetch.js"></script>
<script src="./js/logic.js"></script>
<script src="./js/dom.js"></script>
</body>
</html>