-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
41 lines (41 loc) · 2.55 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
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.12.1/css/all.css" crossorigin="anonymous">
<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.css">
<title>Rotating Navigation</title>
</head>
<div>
<div class="container">
<div class="circle-container">
<div class="circle">
<button id="close">
<i class="fas fa-times"></i>
</button>
<button id="open">
<i class="fas fa-bars"></i>
</button>
</div>
</div>
<div class="content">
<h1>Amazing Article</h1>
<small>Harsh Dasila</small>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Sed ullam fuga voluptas minima, alias quibusdam expedita sit iste deserunt quas vero molestias sint aliquid sunt illum laudantium adipisci tempora dignissimos ut. Magni, exercitationem! Cum repellat corrupti ducimus tenetur non repudiandae modi laboriosam labore, exercitationem optio! Voluptatum nemo beatae nobis libero cumque, et in quibusdam sapiente aut, dicta unde? Aspernatur corporis labore impedit corrupti, sapiente temporibus vel eius, nobis illum cupiditate sed hic voluptatibus provident recusandae laboriosam incidunt ipsa placeat cum soluta quibusdam dicta culpa minus quidem suscipit. Laboriosam voluptatibus ut minima, libero dolorem cum rem minus ex ipsa maiores dolor?</p>
<h3>My Dog</h3>
<img src="./images/dog.jpg" alt="Doggy">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sequi cumque quia debitis consequatur corrupti beatae adipisci sapiente doloremque amet! Veritatis sit nemo quos cumque, magnam incidunt eveniet? Officiis, enim laboriosam. Deserunt excepturi asperiores cupiditate repellendus magnam dolores id hic perferendis assumenda animi, nihil aliquam ipsam. Necessitatibus, temporibus similique? Voluptates ipsa nulla, quidem aspernatur est ab rerum pariatur similique adipisci dolor. Aliquam atque, delectus, quia enim quasi, excepturi possimus harum sint tempore consequatur similique officia fugit.</p>
</div>
</div>
<nav>
<ul>
<li><i class="fas fa-home"></i>Home</li>
<li><i class="fas fa-address-card"></i>About</li>
<li><i class="fas fa-envelope"></i>Contact</li>
</ul>
</nav>
<script src="script.js"></script>
</body>
</html>