-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
119 lines (115 loc) · 4.2 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="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Smooth Travels</title>
<link rel="icon" type="image/x-icon" href="favicon.ico" />
<link
rel="stylesheet"
type="text/css"
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.1/css/all.min.css"
integrity="sha512-MV7K8+y+gLIBoVD59lQIYicR65iaqukzvf/nwasF0nqhPay5w/9lJmVM2hMDcnK1OnMGCdVK+iQrJ7lzPJQd1w=="
crossorigin="anonymous"
referrerpolicy="no-referrer"
/>
<link rel="stylesheet" href="styles.css" />
<script src="app.js" defer></script>
</head>
<body>
<!-- Header -->
<header id="home">
<!-- Navbar -->
<nav id="nav">
<!-- Navbar Header -->
<div class="nav-center">
<div class="nav-header">
<svg
class="logo"
viewBox="0 0 500 500"
xmlns="http://www.w3.org/2000/svg"
>
<path
class="logo"
d="M 11.768 118.438 C 3.104 109.773 3.104 95.703 11.768 87.039 C 20.432 78.374 34.503 78.374 43.167 87.039 L 176.25 220.121 C 184.914 228.786 184.914 242.856 176.25 251.52 L 43.167 384.603 C 34.503 393.267 20.432 393.267 11.768 384.603 C 3.104 375.939 3.104 361.868 11.768 353.204 L 129.117 235.855 L 11.768 118.438 Z M 221.283 346.758 L 470.827 346.758 C 483.095 346.758 493.008 356.67 493.008 368.938 C 493.008 381.207 483.095 391.119 470.827 391.119 L 221.283 391.119 C 209.014 391.119 192.102 381.207 192.102 368.938 C 192.102 356.67 209.014 346.758 221.283 346.758 Z"
/>
<path
class="logo"
d="M 299.883 320.421 L 299.883 247.071 L 265.868 247.071 L 265.868 320.421 L 219.953 320.421 L 219.953 130.462 C 236.673 120.626 260.209 115.577 282.883 115.577 C 305.574 115.577 328.806 120.642 345.534 130.462 L 345.534 320.421 L 299.883 320.421 Z M 299.883 150.701 C 295.063 148.456 289.101 147.33 282.866 147.33 C 276.625 147.33 270.671 148.456 265.843 150.701 L 265.843 215.038 L 299.859 215.038 L 299.859 150.701 L 299.883 150.701 Z"
/>
<path
class="logo"
d=" M 428.094 247.071 L 415.898 247.071 L 415.898 320.421 L 369.687 320.421 L 369.687 118.118 L 428.094 118.118
C 455.883 118.118 476.863 123.727 493.302 135.24 L 493.302 229.949 C 477.143 241.191 455.866 247.071 428.094
247.071 Z M 447.379 152.946 C 443.136 149.863 437.445 148.456 427.807 148.456 L 415.323 148.456 L 415.323
216.733 L 427.807 216.733 C 437.157 216.733 442.823 215.326 447.379 212.53 L 447.379 152.946 Z"
/>
</svg>
<button class="nav-toggle" type="button">
<i class="fas fa-bars"></i>
</button>
</div>
<!-- Links -->
<div class="links-container">
<ul class="links">
<li>
<a href="#home" class="scroll-link">home</a>
</li>
<li>
<a href="#about" class="scroll-link">about</a>
</li>
<li>
<a href="#services" class="scroll-link"
>services</a
>
</li>
<li>
<a href="#tours" class="scroll-link">tours</a>
</li>
</ul>
</div>
</div>
</nav>
<!-- Banner -->
<div class="banner">
<div class="container">
<h1>Smooth Travels</h1>
<p>
Lorem ipsum dolor sit amet consectetur, adipisicing
elit. Provident ea suscipit ullam voluptatem ipsa,
temporibus quia ut similique nobis voluptates?
</p>
<a class="scroll-link btn btn-white" href="#tours"
>Explore Tours</a
>
</div>
</div>
</header>
<!-- Sections -->
<section class="section" id="about">
<div class="title">
<h2>About <span>US</span></h2>
</div>
</section>
<section class="section" id="services">
<div class="title">
<h2>Our <span>Services</span></h2>
</div>
</section>
<section class="section" id="tours">
<div class="title">
<h2>Featured <span>Tours</span></h2>
</div>
</section>
<footer class="section">
<p>
copyright© Smooth Travels Company
<span id="copyright-date"></span>. All rights reserved
</p>
</footer>
<!-- To Top Button -->
<a class="scroll-link top-link" href="#home"
><i class="fas fa-arrow-up"></i
></a>
</body>
</html>