-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
81 lines (76 loc) · 12 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 charset="utf-8">
<title>planet</title>
<link rel="stylesheet" href="style.scss">
</head>
<body class="noscroll">
<div class="loading">
<svg class="star" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 20 20"><g fill="none"><path d="M10 18a8 8 0 1 0 0-16a8 8 0 0 0 0 16zm0-15c.657 0 1.407.59 2.022 1.908c.217.466.406 1.002.559 1.592H7.419c.153-.59.342-1.126.56-1.592C8.592 3.59 9.342 3 10 3zM7.072 4.485A10.502 10.502 0 0 0 6.389 6.5H3.936a7.022 7.022 0 0 1 3.778-3.118c-.241.33-.456.704-.642 1.103zM6.192 7.5A15.97 15.97 0 0 0 6 10c0 .87.067 1.712.193 2.5H3.46A6.984 6.984 0 0 1 3 10c0-.88.163-1.724.46-2.5h2.733zm.197 6c.176.743.407 1.422.683 2.015c.186.399.401.773.642 1.103A7.022 7.022 0 0 1 3.936 13.5H6.39zm1.03 0h5.162a9.248 9.248 0 0 1-.56 1.592C11.408 16.41 10.658 17 10 17c-.657 0-1.407-.59-2.022-1.908A9.254 9.254 0 0 1 7.42 13.5zm5.375-1H7.206A14.87 14.87 0 0 1 7 10c0-.883.073-1.725.206-2.5h5.588c.133.775.206 1.617.206 2.5s-.073 1.725-.206 2.5zm.817 1h2.453a7.022 7.022 0 0 1-3.778 3.118c.241-.33.456-.704.642-1.103c.276-.593.507-1.272.683-2.015zm2.93-1h-2.734c.126-.788.193-1.63.193-2.5c0-.87-.067-1.712-.193-2.5h2.733c.297.776.46 1.62.46 2.5c0 .88-.163 1.724-.46 2.5zm-4.255-9.118A7.021 7.021 0 0 1 16.064 6.5H13.61a10.504 10.504 0 0 0-.683-2.015a6.635 6.635 0 0 0-.642-1.103z" fill="currentColor"></path></g></svg>
</div>
<div id="container"></div>
<nav class="menu">
<a class="link" href="#intro">about</a>
<a class="link" href="#part1">projects</a>
<a class="link" href="#part2">contact</a>
</nav>
<nav class="color">
<button class="green"></button>
<button class="pink"></button>
<button class="gold"></button>
</nav>
<div class="intro" id="intro">
<h1 class="title">planet</h1>
<div class="date">
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Explicabo doloribus consequatur nisi adipisci dolor accusamus veniam laborum odit quo aliquam!</p>
<p>Ⓒ 2024</p>
</div>
</div>
<div class="select">
</div>
<div class="content">
<div class="text part1" id="part1">
<h2>Lorem, ipsum dolor.</h2>
<p>um velit deleniti praesentium corporis libero nobis delectus reprehenderit perspiciatis veniam ratione cum pariatur voluptatem saepe explicabo earum! Voluptate facere beatae aliquam ducimus error sed sequi odio similique qui cumque, fugiat pariatur quam quas soluta doloremque nam delectus dolore fuga reprehenderit eos vero adipisci? Doloremque.</p>
<p>um velit deleniti praesentium corporis libero nobis delectus reprehenderit perspiciatis veniam ratione cum pariatur voluptatem saepe explicabo earum! Voluptate facere beatae aliquam ducimus error sed sequi odio similique qui cumque, fugiat pariatur quam quas soluta doloremque nam delectus dolore fuga reprehenderit eos vero adipisci? Doloremque.</p>
<p>um velit deleniti praesentium corporis libero nobis delectus reprehenderit perspiciatis veniam ratione cum pariatur voluptatem saepe explicabo earum! Voluptate facere beatae aliquam ducimus error sed sequi odio similique qui cumque, fugiat pariatur quam quas soluta doloremque nam delectus dolore fuga reprehenderit eos vero adipisci? Doloremque.</p>
<h2>Lorem, ipsum dolor.</h2>
<p>um velit deleniti praesentium corporis libero nobis delectus reprehenderit perspiciatis veniam ratione cum pariatur voluptatem saepe explicabo earum! Voluptate facere beatae aliquam ducimus error sed sequi odio similique qui cumque, fugiat pariatur quam quas soluta doloremque nam delectus dolore fuga reprehenderit eos vero adipisci? Doloremque.</p>
<p>um velit deleniti praesentium corporis libero nobis delectus reprehenderit perspiciatis veniam ratione cum pariatur voluptatem saepe explicabo earum! Voluptate facere beatae aliquam ducimus error sed sequi odio similique qui cumque, fugiat pariatur quam quas soluta doloremque nam delectus dolore fuga reprehenderit eos vero adipisci? Doloremque.</p>
<p>um velit deleniti praesentium corporis libero nobis delectus reprehenderit perspiciatis veniam ratione cum pariatur voluptatem saepe explicabo earum! Voluptate facere beatae aliquam ducimus error sed sequi odio similique qui cumque, fugiat pariatur quam quas soluta doloremque nam delectus dolore fuga reprehenderit eos vero adipisci? Doloremque.</p>
<h2>Lorem, ipsum dolor.</h2>
<p>um velit deleniti praesentium corporis libero nobis delectus reprehenderit perspiciatis veniam ratione cum pariatur voluptatem saepe explicabo earum! Voluptate facere beatae aliquam ducimus error sed sequi odio similique qui cumque, fugiat pariatur quam quas soluta doloremque nam delectus dolore fuga reprehenderit eos vero adipisci? Doloremque.</p>
<p>um velit deleniti praesentium corporis libero nobis delectus reprehenderit perspiciatis veniam ratione cum pariatur voluptatem saepe explicabo earum! Voluptate facere beatae aliquam ducimus error sed sequi odio similique qui cumque, fugiat pariatur quam quas soluta doloremque nam delectus dolore fuga reprehenderit eos vero adipisci? Doloremque.</p>
<p>um velit deleniti praesentium corporis libero nobis delectus reprehenderit perspiciatis veniam ratione cum pariatur voluptatem saepe explicabo earum! Voluptate facere beatae aliquam ducimus error sed sequi odio similique qui cumque, fugiat pariatur quam quas soluta doloremque nam delectus dolore fuga reprehenderit eos vero adipisci? Doloremque.</p>
<h2>Lorem, ipsum dolor.</h2>
<p>um velit deleniti praesentium corporis libero nobis delectus reprehenderit perspiciatis veniam ratione cum pariatur voluptatem saepe explicabo earum! Voluptate facere beatae aliquam ducimus error sed sequi odio similique qui cumque, fugiat pariatur quam quas soluta doloremque nam delectus dolore fuga reprehenderit eos vero adipisci? Doloremque.</p>
<p>um velit deleniti praesentium corporis libero nobis delectus reprehenderit perspiciatis veniam ratione cum pariatur voluptatem saepe explicabo earum! Voluptate facere beatae aliquam ducimus error sed sequi odio similique qui cumque, fugiat pariatur quam quas soluta doloremque nam delectus dolore fuga reprehenderit eos vero adipisci? Doloremque.</p>
<p>um velit deleniti praesentium corporis libero nobis delectus reprehenderit perspiciatis veniam ratione cum pariatur voluptatem saepe explicabo earum! Voluptate facere beatae aliquam ducimus error sed sequi odio similique qui cumque, fugiat pariatur quam quas soluta doloremque nam delectus dolore fuga reprehenderit eos vero adipisci? Doloremque.</p>
<h2>Lorem, ipsum dolor.</h2>
<p>um velit deleniti praesentium corporis libero nobis delectus reprehenderit perspiciatis veniam ratione cum pariatur voluptatem saepe explicabo earum! Voluptate facere beatae aliquam ducimus error sed sequi odio similique qui cumque, fugiat pariatur quam quas soluta doloremque nam delectus dolore fuga reprehenderit eos vero adipisci? Doloremque.</p>
</div>
<div class="test part2" id="part2">
<h2>Lorem, ipsum dolor.</h2>
<p>um velit deleniti praesentium corporis libero nobis delectus reprehenderit perspiciatis veniam ratione cum pariatur voluptatem saepe explicabo earum! Voluptate facere beatae aliquam ducimus error sed sequi odio similique qui cumque, fugiat pariatur quam quas soluta doloremque nam delectus dolore fuga reprehenderit eos vero adipisci? Doloremque.</p>
<p>um velit deleniti praesentium corporis libero nobis delectus reprehenderit perspiciatis veniam ratione cum pariatur voluptatem saepe explicabo earum! Voluptate facere beatae aliquam ducimus error sed sequi odio similique qui cumque, fugiat pariatur quam quas soluta doloremque nam delectus dolore fuga reprehenderit eos vero adipisci? Doloremque.</p>
<p>um velit deleniti praesentium corporis libero nobis delectus reprehenderit perspiciatis veniam ratione cum pariatur voluptatem saepe explicabo earum! Voluptate facere beatae aliquam ducimus error sed sequi odio similique qui cumque, fugiat pariatur quam quas soluta doloremque nam delectus dolore fuga reprehenderit eos vero adipisci? Doloremque.</p>
<h2>Lorem, ipsum dolor.</h2>
<p>um velit deleniti praesentium corporis libero nobis delectus reprehenderit perspiciatis veniam ratione cum pariatur voluptatem saepe explicabo earum! Voluptate facere beatae aliquam ducimus error sed sequi odio similique qui cumque, fugiat pariatur quam quas soluta doloremque nam delectus dolore fuga reprehenderit eos vero adipisci? Doloremque.</p>
<p>um velit deleniti praesentium corporis libero nobis delectus reprehenderit perspiciatis veniam ratione cum pariatur voluptatem saepe explicabo earum! Voluptate facere beatae aliquam ducimus error sed sequi odio similique qui cumque, fugiat pariatur quam quas soluta doloremque nam delectus dolore fuga reprehenderit eos vero adipisci? Doloremque.</p>
<p>um velit deleniti praesentium corporis libero nobis delectus reprehenderit perspiciatis veniam ratione cum pariatur voluptatem saepe explicabo earum! Voluptate facere beatae aliquam ducimus error sed sequi odio similique qui cumque, fugiat pariatur quam quas soluta doloremque nam delectus dolore fuga reprehenderit eos vero adipisci? Doloremque.</p>
<h2>Lorem, ipsum dolor.</h2>
<p>um velit deleniti praesentium corporis libero nobis delectus reprehenderit perspiciatis veniam ratione cum pariatur voluptatem saepe explicabo earum! Voluptate facere beatae aliquam ducimus error sed sequi odio similique qui cumque, fugiat pariatur quam quas soluta doloremque nam delectus dolore fuga reprehenderit eos vero adipisci? Doloremque.</p>
<p>um velit deleniti praesentium corporis libero nobis delectus reprehenderit perspiciatis veniam ratione cum pariatur voluptatem saepe explicabo earum! Voluptate facere beatae aliquam ducimus error sed sequi odio similique qui cumque, fugiat pariatur quam quas soluta doloremque nam delectus dolore fuga reprehenderit eos vero adipisci? Doloremque.</p>
<p>um velit deleniti praesentium corporis libero nobis delectus reprehenderit perspiciatis veniam ratione cum pariatur voluptatem saepe explicabo earum! Voluptate facere beatae aliquam ducimus error sed sequi odio similique qui cumque, fugiat pariatur quam quas soluta doloremque nam delectus dolore fuga reprehenderit eos vero adipisci? Doloremque.</p>
<h2>Lorem, ipsum dolor.</h2>
<p>um velit deleniti praesentium corporis libero nobis delectus reprehenderit perspiciatis veniam ratione cum pariatur voluptatem saepe explicabo earum! Voluptate facere beatae aliquam ducimus error sed sequi odio similique qui cumque, fugiat pariatur quam quas soluta doloremque nam delectus dolore fuga reprehenderit eos vero adipisci? Doloremque.</p>
<p>um velit deleniti praesentium corporis libero nobis delectus reprehenderit perspiciatis veniam ratione cum pariatur voluptatem saepe explicabo earum! Voluptate facere beatae aliquam ducimus error sed sequi odio similique qui cumque, fugiat pariatur quam quas soluta doloremque nam delectus dolore fuga reprehenderit eos vero adipisci? Doloremque.</p>
<p>um velit deleniti praesentium corporis libero nobis delectus reprehenderit perspiciatis veniam ratione cum pariatur voluptatem saepe explicabo earum! Voluptate facere beatae aliquam ducimus error sed sequi odio similique qui cumque, fugiat pariatur quam quas soluta doloremque nam delectus dolore fuga reprehenderit eos vero adipisci? Doloremque.</p>
<h2>Lorem, ipsum dolor.</h2>
<p>um velit deleniti praesentium corporis libero nobis delectus reprehenderit perspiciatis veniam ratione cum pariatur voluptatem saepe explicabo earum! Voluptate facere beatae aliquam ducimus error sed sequi odio similique qui cumque, fugiat pariatur quam quas soluta doloremque nam delectus dolore fuga reprehenderit eos vero adipisci? Doloremque.</p>
</div>
</div>
<script type="module" src="/main.js"></script>
</body>
</html>