-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
202 lines (173 loc) · 8.57 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
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to fit=no">
<title>Panda Bot</title>
<link rel="stylesheet" type="text/css" href="css/master.css">
<script src="https://kit.fontawesome.com/a076d05399.js"></script>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/waypoints/4.0.1/jquery.waypoints.min.js"></script> <!--waypoints-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/owl.carousel.min.js"></script> <!--OwlCarousel2-->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.carousel.min.css"/>
</head>
<body>
<div class="scroll-up-btn">
<i class="fas fa-angle-up"></i>
</div>
<nav class="navbar">
<div class="max-width">
<div class="logo"><i class="fas fa-camera-retro"></i><a href="#"><span>🐼 Panda Bot</span></a></div>
<ul class="menu">
<li><a href="login.html"><b>👻LOG IN</b></a></li>
<li><a href=#contact><b>CONTACT</b></a></li>
</ul>
<div class="menu-btn">
<i class="fas fa-bars"></i>
</div>
</div>
</nav>
<section class="home" id="home">
<div class="max-width">
<div class="home-content">
<div class="text-1"></div>
<div class="text-2"> <div class="waviy">
<span style="--i:1">Hi</span>
<span style="--i:2">I</span>
<span style="--i:3">am</span>
<span style="--i:4">PANDA!</span>
<span style="--i:5">🐼</span>
<span style="--i:6"></span>
<span style="--i:7"></span>
<span style="--i:8"></span></div></div>
<div class="text-3">Your <span><i>Gaming Partner!</i></span></div>
<div class="scroll-up-btn">
<i class="fas fa-angle-up"></i>
</div>
<ul class="menu">
<a href="#about">C'mon! Let's Explore!</a>
</ul>
</div>
</div>
</div>
</section>
<!--About Section-->
<section class="about" id="about">
<div class="max-width">
<h2 class="title">Hey Folks!</h2>
<div class="about-content">
<div class="column left">
<img src="https://images.unsplash.com/photo-1458419948946-19fb2cc296af?ixlib=rb-1.2.1&auto=format&fit=crop&w=1050&q=80" alt="Felipe Brunelli">
</div>
<div class="column right">
<div class="text">Wanna go beyond Earth? <span>or wanna build your own virtual world!?</span></div>
<p>Hello there! I am PANDA and I'm your virtual PA. Whether you want to travel to year 3030 or wanna come back to 2020, whether you want change the history or be the future! Whether you want to be a galaxy traveller or a galaxy warrior, I'm always by your side! Overall i'm your PA!
</p><p>Wait, keep holding your breath! As you will be able to talk with like minded people(sorry I mean bots!)<p>So, Introducing you to one of the finest web games !</p><h3>And once your in, there's no exit!</h3>
<a href="#services">Daring enough?</a>
</div>
</div>
</div>
</div>
</section>
<!--Services Section-->
<section class="services" id="services">
<div class="max-width">
<h2 class="title">Choose your Theme</h2>
<div class="serv-content">
<div class="card">
<div class="box">
<i class="far fa-images"></i>
<div class="text">Fake but Real!</div>
<p>Chat and debate with like minded people, I mean bots! and expand your empire of knowledge! </p>
</div>
</div>
<div class="card">
<a href="back.html">
<div class="box">
<i class="fas fa-hiking"></i>
<div class="text">3030! Earth not Found</div> </a>
<div class="text2">It's year 3030! All your friends, family members, and literally every person on planet earth have shipped to planet K2. You are the only person alive on earth and then you find this time machine which you could utilize only once! Would you go back to year 2020 and fix the planet up?</div>
</div>
</div>
<div class="card">
<div class="box">
<i class="fas fa-print"></i>
<div class="text">I'm Still Alive!</div>
<p>Ever felt how it'd feel coming from a different planet? Or ever dreamt of travelling inside the black hole?</p>
</div>
</div>
</div>
</div>
</section>
<!--Portfolio-->
<section class="portfolio" id="portfolio"> <!--teams-->
<div class="max-width">
<h2 class="title">Description</h2>
<p>The project is purely web based. In case if you love our project and would love to collab with us, and additionally have good flutter/unity/web development/backend skills(any one of them also fine), you are free to ping us through mail and we will let you know about our ongoing projects.</p>
<p>Thank You :)</p>
</div>
</section>
<!--Contact-->
<section class="contact" id="contact">
<div class="max-width">
<h2 class="title">Ping Us</h2>
<div class="contact-content">
<div class="column left">
<div class="text">Wanna contribute on a game/app development project?</div>
<p>Please feel free to ping me by filling your name, email, your skills and your github profile.</p>
<p>You can also leave us a friendly message ;)</p>
<p>See you soon! :)</p>
<div class="icons">
<div class="row">
<i class="fas fa-user"></i>
<div class="info">
<div class="head">Instagram</div>
<div class="sub-title">@rush._ah</div>
</div>
</div>
<div class="row">
<i class="fas fa-map-marker-alt"></i>
<div class="info">
<div class="head">Address</div>
<div class="sub-title">Hydro Street,Hogwarts,Planet Neptune</div>
</div>
</div>
<div class="row">
<i class="fas fa-envelope"></i>
<div class="info">
<div class="head">Email</div>
<div class="sub-title">[email protected]</div>
</div>
</div>
</div>
</div>
<div class="column right">
<div class="text">Message me</div>
<form action="#">
<div class="fields">
<div class="field name">
<input type="text" placeholder="Name" required>
</div>
<div class="field email">
<input type="email" placeholder="Email" required>
</div>
</div>
<div class="fields textarea">
<textarea cols="30" rows="10" placeholder="Your Message..." required></textarea>
</div>
<div class="button">
<button type="submit">Send message</button>
</div>
</form>
</div>
</div>
</div>
</section>
<!--Footer-->
<footer>
<span>Created By <a href="#">Live by Nature</a> | <span class="far fa-copyright"></span> 2020 All rights reserved</span>
</footer>
<script src="script.js"></script>
</body>
</html>