-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
377 lines (310 loc) · 15.3 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
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>boredapeyachtclub-clone</title>
<!-- <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous"> -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl" crossorigin="anonymous">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.1/css/all.css"
integrity="sha384-vp86vTRFVJgpjF9jiIGPEEqYqlDwgyBgEF109VFjmqGmIY/Y4HV4d3Gp2irVfcrp" crossorigin="anonymous">
<link rel="stylesheet" href="styles.css">
</head>
<body>
<div class="container">
<nav id="header">
<!-- brand logo img -->
<img src="/images/bayc-logo-z.png" class="logo-img" alt="">
<a href="" class="link">BUY AN APE</a>
<a href="" class="link">ROAD MAP</a>
<a href="" class="link">ROAD FEST</a>
<a href="" class="link">GALLERY</a>
<a href="" class="link">PROVENANCE</a>
<!-- dropdown link -->
<a href="" class="link">MEMBERS</a>
<!-- socials -->
<span class="socials">
<a href="" class="link"><i class="fab fa-youtube"></i></a>
<a href="" class="link"><i class="fab fa-instagram"></i></a>
<a href="" class="link"><i class="fab fa-discord"></i></a>
<a href="" class="link"><i class="fab fa-twitter"></i></a>
</span>
</nav>
<!-- header image -->
<header>
<img src="/images/bayc-mutant-hero.jpg" class="header-img" alt="">
</header>
<!-- welcome -->
<section class="welcome-section">
<div class="row">
<div class="col-sm-8 box1">
<div class="top-text">
<h1>WELCOME TO THE<br>BORED APE YACHT CLUB</h1>
<p>BAYC is a collection of 10,000 Bored Ape NFTs—unique digital collectibles<br>
living on the Ethereum blockchain. Your Bored Ape doubles as your Yacht<br>
Club membership card, and grants access to members-only benefits, the first<br>
of which is access to THE BATHROOM, a collaborative graffiti board. Future<br>
areas and perks can be unlocked by the community through roadmap<br>
activation.</p>
</div>
<div class="bottom-text">
<h3>FAIR DISTRIBUTION</h3>
<h6>(BONDING CURVES ARE A PONZI)</h6>
<p>There are no bonding curves here. Buying a Bored Ape costs 0.08 ETH. There<br>
are no price tiers; BAYC membership costs the same for everyone.</p>
</div>
</div>
<!-- image col -->
<div class="col-sm-4 box2">
<div class="row">
<div class="col-sm-6">
<img src="/images/ape1.png" alt="" class="ape-img">
<img src="/images/ape3.png" alt="" class="ape-img">
</div>
<div class="col-sm-6">
<img src="/images/ape2.png" alt="" class="ape-img">
<img src="/images/ape4.png" alt="" class="ape-img">
</div>
</div>
<div class="bottom-text">
<p class="bottom-text2">Note: Thirty apes are being withheld from the sale. These will be used
for giveaways, puzzle
rewards—and for the creators' BAYC memberships.</p>
</div>
</div>
</div>
</section>
<section class="buy-an-ape">
<div class="row buy-ape-box">
<div class="col-sm-4">
<h3>BUY AN APE</h3>
</div>
<div class="col-sm-4">
<p>The initial sale has sold out. To get your Bored Ape, check out the collection on OpenSea.</p>
</div>
<div class="col-sm-4">
<button type="button" class="btn btn-dark btn-lg">BUY AN APE ON OPENSEA</button>
</div>
</div>
</section>
<hr>
<section class="specs-div">
<div class="row">
<div class="col-sm-8 box3">
<h2>THE SPECS</h2>
<p class="spec-p1">Each Bored Ape is unique and programmatically generated from over 170 possible
traits,
including expression, headwear, clothing, and more. All apes are dope, but some are rarer than
others.</p>
<p class="spec-p2">The apes are stored as ERC-721 tokens on the Ethereum blockchain and hosted on
IPFS.
(<a href="">See Record and Proof.</a>) Purchasing an ape costs 0.08 ETH.</p>
<p class="spec-p3">To access members-only areas such as <a href="">THE BATHROOM</a>, Apeholders will
need to be
signed into their Metamask Wallet.</p>
</div>
<div class="col-sm-4">
<img src="/images/mystery-ape.gif" alt="" class="spec-img">
</div>
</div>
</section>
<hr>
<!-- welcometo the club -->
<section class="club-welcome">
<h2>WELCOME TO THE CLUB</h2>
<p>When you buy a Bored Ape, you’re not simply buying an avatar or a provably-rare piece of art. You are<br>
gaining membership access to a club whose benefits and offerings will increase over time. Your<br> Bored
Ape can serve as your digital identity, and open digital doors for you.</p>
<div class="club-welcome-list">
<ul>
<li>
<img src="images/icon1.png" alt="">
<p>10,000 Provably-rare Bored Ape tokens</p>
</li>
<li>
<img src="/images/icon2.png" alt="">
<p>Fair Launch, fair distribution: All apes cost 0.08 ETH</p>
</li>
<li>
<img src="/images/icon3.png" alt="">
<p>Ownership and commercial usage rights given to the consumer over their NFT</p>
</li>
<li>
<img src="/images/icon4.png" alt="">
<p>The Bathroom: A member's-only graffiti board</p>
</li>
<li>
<img src="/images/icon5.png" alt="">
<p>Gain additional benefits through roadmap activations</p>
</li>
</ul>
</div>
</section>
<hr>
<!-- Bathroom -->
<section class="bathroom-col">
<div class="row">
<div class="col-sm-9">
<h3>THE BATHROOM</h3>
<p>The BAYC Bathroom will become operational once the presale period is over. It contains a
canvas
accessible only to wallets containing at least one ape. Like any good dive bar bathroom,
this is
the place to draw, scrawl, or write expletives.</p>
<p>Each ape-holder will be able to paint a pixel on the bathroom wall every fifteen minutes.
Think
of it as a collaborative art experiment for the cryptosphere. A members-only canvas for the
discerning minds of crypto twitter.</p>
<p>We're pretty sure it's going to be full of dicks.</p>
</div>
<div class="col-sm-3">
<img src="/images/toilet.png" alt="">
</div>
</div>
</section>
<hr>
<!-- roadmap activities -->
<section class="roadmap-col">
<h3>ROADMAP ACTIVATIONS</h3>
<p>We’re in this for the long haul.</p>
<p>We’ve set up some goalposts for ourselves. Once we hit a target sell through percentage, we will<br>
begin to work on realizing the stated goal.</p>
<div class="tshirt-div">
<div class="row">
<div class="col-sm-2">
<ul>
<li> <p>10%</p></li>
<li><p>20%</p></li>
<li><p>40%</p></li>
<li><p>60%</p></li>
<li> <p>80%</p></li>
<li><p>90%</p></li>
<li><p>100%</p></li>
</ul>
</div>
<div class="col-sm-6 tshirt-text">
<li>
<p>We pay back our moms.</p>
</li>
<li>
<p>We release the Caged Apes. 5 Caged Apes (tokens held back from the sale) are airdropped
to random Apeholders.</p>
</li>
<li>
<p>BAYC gets its own YouTube channel, BAYC LoFi Radio - Beats to Ape into Shitcoins To.</p>
</li>
<li>
<p>Member-Exclusive BAYC Merch Store gets unlocked, featuring Limited Edition tees, hoodies,
and other goodies.</p>
</li>
<li>
<p>The clubhouse image becomes interactive and the Mysterious Note becomes legible,
beginning a treasure hunt. The first to solve the mystery will be rewarded 5 ETH and a
Bored Ape.</p>
</li>
<li>
<p>The Bored Ape liquidity pool is initiated.</p>
</li>
<li>
<p>The Mutant Ape (NFT Breeding) Arcade Machine gets fixed. And we cook up new ways to ape with
our friends.</p>
</li>
</div>
<div class="col-sm-4 tshirt-img">
<img src="/images/shirt.png" alt="">
</div>
</div>
</div>
</section>
<hr>
<!-- community-div -->
<section class="community-div">
<div class="row">
<div class="col-sm-8">
<h3>COMMUNITY TOOLS</h3>
<p>Here are some helpful tools created by the Bored Ape Yacht Club community. Please note that
these
are unofficial in nature. Every assignment of an ape's overall value or rarity is inherently
subjective.</p>
</div>
<div class="col-sm-4">
<ul>
<li>
<button type="button" class="btn btn-dark btn-lg button-1">NFTEXP.IO</button>
</li>
<li>
<button type="button" class="btn btn-dark btn-lg button-2">RARITY.TOOLS</button>
</li>
</ul>
</div>
</div>
</section>
<hr>
<section class="the-team-div">
<div class="row">
<div class="col-sm-8">
<h3>THE TEAM</h3>
<p>BAYC was created by four friends who set out to make some dope apes, test <br>
our skills, and try to build something (ridiculous).</p>
<h6><span>GARGAMEL.</span>STARCRAFT OBSESSED. EATS SMURFS.</h6>
<h6><span>GORDON GONER.</span>REFORMED LEVERAGE ADDICT.</h6>
<h6><span>EMPEROR TOMATO KETCHUP.</span>SPENT ALL THEIR MONEY ON FIRST PRESSES <br> AND PET-NAT.
</h6>
<h6><span>NO SASS.</span>HERE FOR THE APES. NOT FOR THE SASS.</h6>
</div>
<div class="col-sm-4">
<div class="row">
<div class="col-sm-6">
<img src="/images/garga.png" alt="" class="ape-img">
<img src="/images/gordy.png" alt="" class="ape-img">
</div>
<div class="col-sm-6">
<img src="/images/sass.png" alt="" class="ape-img">
<img src="/images/tomato.png" alt="" class="ape-img">
</div>
</div>
</div>
</div>
<h5 class="team-link">VERIFIED SMART CONTRACT ADDRESS:<a
href="">0xBC4CA0EdA7647A8aB7C2061c2E118A18a936f13D</a></h5>
</section>
<hr>
<footer>
<div class="row">
<div class="col-sm-4">
</div>
<div class="col-sm-4">
<img src="/images/bayc-footer.png" class="footer-img" alt="">
</div>
<div class="col-sm-4 footer-socials">
<span class="socials ">
<a href="" class="link"><i class="fab fa-youtube"></i></a>
<a href="" class="link"><i class="fab fa-instagram"></i></a>
<a href="" class="link"><i class="fab fa-discord"></i></a>
<a href="" class="link"><i class="fab fa-twitter"></i></a>
</span>
<ul>
<li>© 2021 Yuga Labs LLC</li>
<li>
<a href="" class="footer-terms">BYAC terms & conditions</a>
</li>
<li>
<a href="" class="footer-terms">MYAC terms & conditions</a>
</li>
</ul>
</div>
</div>
</footer>
</div>
<div class="footer-end">
</div>
<script src="https://code.jquery.com/jquery-3.5.1.js"
integrity="sha256-QWo7LDvxbWT2tbbQ97B53yJnYU3WhH/C8ycbRAkjPDc=" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
integrity="sha384-b5kHyXgcpbZJO/tY9Ul7kGkf1S0CWuKcCD38l8YkeH8z8QjE0GmW1gYU5S9FOnJ0"
crossorigin="anonymous"></script>
</body>
</html>