-
Notifications
You must be signed in to change notification settings - Fork 54
/
index.html
423 lines (378 loc) · 26.1 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
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
<!DOCTYPE html>
<html lang="en">
<!-- Watch more on youtube @codecrypto TG @hirejoey -->
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>BABY TRUMP</title>
<!-- Add your CSS framework, e.g., CDN link for Tailwind CSS -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/tailwind.min.css" rel="stylesheet">
<link rel="stylesheet" href="dist/output.css" />
<link rel="stylesheet" href="index.css" />
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link
href="https://fonts.googleapis.com/css2?family=Archivo+Black&family=Montserrat:wght@500&family=Poppins&family=Roboto:wght@500&family=Rubik+Bubbles&family=Rubik+Doodle+Shadow&family=Tomorrow:ital,wght@0,300;0,400;0,500;0,600;0,700;1,200;1,300;1,400;1,500;1,600;1,700&display=swap"
rel="stylesheet">
<script src="https://unpkg.com/[email protected]/dist/scrollreveal.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.8/clipboard.min.js"></script>
<link rel="icon" type="image/x-icon" href="images/logo.png">
</head>
<body class="font-Montserrat bg-black">
<!-- Header Section -->
<nav class="nav-main ">
<div class="max-w-screen-xl flex flex-wrap items-center justify-between mx-auto p-4">
<a href="" class="flex items-center space-x-3 rtl:space-x-reverse">
<img src="images/logo.png" class="h-12 rounded-full md:h-14" alt="etf" />
<span class=" md:hidden lg:block text-lg md:text-3xl font-extrabold whitespace-nowrap text-blue-500"
style="background-image: linear-gradient(to right, rgb(150, 24, 182), violet);
color: transparent;
-webkit-background-clip: text; /* For Safari and older versions of Chrome */
background-clip: text;">BABY TRUMP</span>
</a>
<button data-collapse-toggle="navbar-default" type="button" style="color: cyan;"
class="inline-flex items-center p-2 w-10 h-10 justify-center text-sm text-white rounded-sm md:hidden hover:bg-cyan-500 "
aria-controls="navbar-default" aria-expanded="false" onclick="toggleMenu()">
<span class="sr-only">Open main menu</span>
<span id="menuIcon" class="menu-icon">
<svg class="w-5 h-5" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none"
viewBox="0 0 17 14">
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M1 1h15M1 7h15M1 13h15" />
</svg>
</span>
</button>
<div class="w-full md:block md:w-auto hidden" id="navbar-default">
<ul
class="font-medium flex flex-col p-4 md:p-0 mt-4 border rounded-sm md:flex-row md:space-x-8 rtl:space-x-reverse md:mt-0 md:border-0">
<li>
<a href="#"
class="violet block py-2 px-3 text-white text-lg lg:text-xl rounded hover:text-pink-500 md:hover:bg-transparent md:border-0 md:hover:text-pink-500 md:p-0"
aria-current="page"><i class="bx bx-coin"></i> HOME</a>
</li>
<li>
<a href="#about"
class="violet block py-2 px-3 text-white text-lg lg:text-xl rounded hover:text-pink-500 md:hover:bg-transparent md:border-0 md:hover:text-pink-500 md:p-0"
aria-current="page"><i class="bx bx-coin"></i> ABOUT</a>
</li>
<li>
<a href="#tokenomics"
class="violet block py-2 px-3 text-white text-lg lg:text-xl rounded hover:text-pink-500 md:hover:bg-transparent md:border-0 md:hover:text-pink-500 md:p-0"
aria-current="page"><i class="bx bx-coin"></i> TOKENOMICS</a>
</li>
<li>
<a href="#partners"
class="violet block py-2 px-3 text-white text-lg lg:text-xl rounded hover:text-pink-500 md:hover:bg-transparent md:border-0 md:hover:text-pink-500 md:p-0 ">
<i class="bx bx-map-alt"></i> PARTNERS</a>
</li>
<li>
<a href="#social"
class="violet block py-2 px-3 text-white text-lg lg:text-xl rounded hover:text-pink-500 md:hover:bg-transparent md:border-0 md:hover:text-pink-500 md:p-0 ">
<i class="bx bx-message-dots"></i> SOCIALS</a>
</li>
</ul>
</div>
<div class="my-2 md:block md:w-auto hidden" id="navbar-default-btn">
<a href="https://t.me/BabyTrumpGlobal" class="">
<button type="button"
class="text-white bg-black hover:bg-white hover:text-black border border-white focus:outline-none focus:ring-4 focus:ring-white font-medium rounded-full text-sm px-5 py-2.5 me-2 mb-2 ">
Join the community
</button>
</a>
</div>
</div>
</nav>
<!-- Hero Section -->
<section
class="flex flex-wrap justify-center items-center relative text-white text-center py-10 bg-cover bg-center">
<div
class="container min-w-fit hero relative z-10 lg:h-screen flex justify-center flex-col-reverse md:flex-row lg:flex-row items-center mx-5 lg:mx-10 ">
<div
class="main-head text-white w-full m-0 md:m-10 lg:m-0 md:w-1/3 lg:w-1/2 flex flex-col justify-center items-center gap-10">
<h1 class="text-3xl text-center lg:text-5xl font-extrabold break-words lg:px-4 mt-6 lg:mt-0">Welcome to
<br>
<span class="text-center text-4xl lg:text-7xl text-cyan-500 glow-text" style="background-image: linear-gradient(to right, cyan, violet);
color: transparent;
-webkit-background-clip: text;
background-clip: text;">BABY TRUMP</span>
</h1>
<a href="https://pancakeswap.finance/swap?outputCurrency=0xbEF1a4b285274B64876f61dB5cCF07E439312D43"
class="w-full md:w-1/2 lg:w-1/2">
<button type="button"
class="text-white flex justify-center gap-x-2 items-center w-full bg-black hover:bg-white hover:text-black border border-white focus:outline-none focus:ring-4 focus:ring-white font-medium rounded-full text-lg px-5 py-2.5 me-2 mb-2 ">
BUY
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="25" viewBox="0 0 24 25" fill="none"
class="svgg">
<path
d="M6.25 5.44702C5.56 5.44702 5 6.00702 5 6.69702V18.197C5 18.887 5.56 19.447 6.25 19.447H17.75C18.44 19.447 19 18.887 19 18.197V14.447C19 14.1818 19.1054 13.9275 19.2929 13.7399C19.4804 13.5524 19.7348 13.447 20 13.447C20.2652 13.447 20.5196 13.5524 20.7071 13.7399C20.8946 13.9275 21 14.1818 21 14.447V18.197C21 19.059 20.6576 19.8856 20.0481 20.4951C19.4386 21.1046 18.612 21.447 17.75 21.447H6.25C5.38805 21.447 4.5614 21.1046 3.9519 20.4951C3.34241 19.8856 3 19.059 3 18.197V6.69702C3 5.83507 3.34241 5.00842 3.9519 4.39892C4.5614 3.78943 5.38805 3.44702 6.25 3.44702H10C10.2652 3.44702 10.5196 3.55238 10.7071 3.73991C10.8946 3.92745 11 4.18181 11 4.44702C11 4.71224 10.8946 4.96659 10.7071 5.15413C10.5196 5.34166 10.2652 5.44702 10 5.44702H6.25ZM14 5.44702C13.7348 5.44702 13.4804 5.34166 13.2929 5.15413C13.1054 4.96659 13 4.71224 13 4.44702C13 4.18181 13.1054 3.92745 13.2929 3.73991C13.4804 3.55238 13.7348 3.44702 14 3.44702H20C20.2652 3.44702 20.5196 3.55238 20.7071 3.73991C20.8946 3.92745 21 4.18181 21 4.44702V10.447C21 10.7122 20.8946 10.9666 20.7071 11.1541C20.5196 11.3417 20.2652 11.447 20 11.447C19.7348 11.447 19.4804 11.3417 19.2929 11.1541C19.1054 10.9666 19 10.7122 19 10.447V6.86102L14.707 11.154C14.5184 11.3362 14.2658 11.437 14.0036 11.4347C13.7414 11.4324 13.4906 11.3272 13.3052 11.1418C13.1198 10.9564 13.0146 10.7056 13.0123 10.4434C13.01 10.1812 13.1108 9.92862 13.293 9.74002L17.586 5.44702H14Z"
fill="#ffffff"></path>
</svg>
</button>
</a>
<div class="flex justify-center items-center gap-x-3 mx-auto w-full">
<p class="text-white">CA: </p>
<div id="hs-clipboard-basic" class=" text-white border border-blue-500 rounded-lg w-1/2 md:w-1/2">
<input id="hs-clipboard-input" type="text"
class="py-3 px-4 block rounded-lg text-sm w-full md:w-full placeholder:text-white focus:border-blue-500 focus:ring-blue-500 bg-gray-900 border-gray-700"
value="0xbEF1a4b285274B64876f61dB5cCF07E439312D43">
</div>
<button type="button"
class="js-clipboard p-3 inline-flex items-center gap-x-2 text-sm font-medium rounded-lg border border-blue-500 bg-gray-500 text-white shadow-sm hover:bg-blue-600 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-700 dark:text-white dark:hover:bg-gray-800 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600"
data-clipboard-target="#hs-clipboard-basic" data-clipboard-action="copy"
data-clipboard-success-text="Copied" onclick="changeCopyText(this)">
<svg class="js-clipboard-default w-4 h-4 group-hover:rotate-6 transition"
xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<rect width="8" height="4" x="8" y="2" rx="1" ry="1" />
<path d="M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2" />
</svg>
<svg class="js-clipboard-success hidden w-4 h-4 text-blue-600"
xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<polyline points="20 6 9 17 4 12" />
</svg>
<span class="copy-text">copy</span>
</button>
</div>
<a href="https://app.analytixaudit.com/baby-trump">
<p class="text-xl lg:text-2xl text-white underline">AUDIT</p>
</a>
</div>
<div class="main-logo w-80 md:96 lg:w-1/2 ">
<img class="imglogo" src="images/logo1.png" alt="Animated etf logo">
</div>
</div>
<!-- <div class="chart z-10 w-full flex flex-col justify-center items-center ">
<div class="flex justify-center items-center gap-x-3 w-full md:w-1/2 mx-10 px-5">
<p class="text-white">CA: </p>
<div id="hs-clipboard-basic" class=" text-white border border-blue-500 rounded-lg w-full ">
<input id="hs-clipboard-input" type="text"
class="py-3 px-4 block rounded-lg text-sm w-full md:w-full placeholder:text-white focus:border-blue-500 focus:ring-blue-500 bg-gray-900 border-gray-700"
value="AD9tBNeJKxEDVNUBtKp3dTPjbYjt68XiDEZtM7WCpxGz">
</div>
<button type="button"
class="js-clipboard p-3 inline-flex items-center gap-x-2 text-sm font-medium rounded-lg border border-blue-500 bg-gray-500 text-white shadow-sm hover:bg-blue-600 disabled:opacity-50 disabled:pointer-events-none dark:bg-slate-900 dark:border-gray-700 dark:text-white dark:hover:bg-gray-800 dark:focus:outline-none dark:focus:ring-1 dark:focus:ring-gray-600"
data-clipboard-target="#hs-clipboard-basic" data-clipboard-action="copy"
data-clipboard-success-text="Copied" onclick="changeCopyText(this)">
<svg class="js-clipboard-default w-4 h-4 group-hover:rotate-6 transition"
xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<rect width="8" height="4" x="8" y="2" rx="1" ry="1" />
<path d="M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2" />
</svg>
<svg class="js-clipboard-success hidden w-4 h-4 text-blue-600" xmlns="http://www.w3.org/2000/svg"
width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
stroke-linecap="round" stroke-linejoin="round">
<polyline points="20 6 9 17 4 12" />
</svg>
<span class="copy-text">copy</span>
</button>
</div>
<div class="w-full flex justify-center mt-5">
<button type="button"
class="btn-buy flex flex-wrap justify-center h-16 w-64 md:w-96 items-center transform rounded-full hover:scale-x-110 hover:scale-y-110 transition duration-300 ease-out">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"
style="fill: rgba(255, 255, 255, 1)">
<path d="M3 3v17a1 1 0 0 0 1 1h17v-2H5V3H3z"></path>
<path
d="M15.293 14.707a.999.999 0 0 0 1.414 0l5-5-1.414-1.414L16 12.586l-2.293-2.293a.999.999 0 0 0-1.414 0l-5 5 1.414 1.414L13 12.414l2.293 2.293z">
</path>
</svg>
<a href="https://dexscreener.com/solana/btzr6j7nvywnadvrktaf5yc5xohezxwpm9ldfsesfhhn"
class="text-white text-xl font-extrabold mx-5 ">
CHART</a>
</button>
</div>
</div> -->
</section>
<!-- about section -->
<section id="about" class="shadow-2xl py-16">
<div class="flex flex-col items-center justify-center mx-5 lg:mx-20 gap-5">
<p class="text-4xl lg:text-5xl font-extrabold text-center text-white ">Introducing
BABY TRUMP ($BABYTRUMP)</p>
<div class="hero lg:h-screen flex flex-col-reverse justify-between lg:flex-row items-center mx-5 lg:mx-10">
<div class="main-logo about-logo w-fill lg:w-1/3 rounded-full mt-8">
<img src="images/logo.png" alt="Animated" />
</div>
<div class="main-head text-white w-full lg:w-1/2 flex flex-col ">
<div class="flex flex-col lg:flex-row items-center justify-center ">
<p
class="about-context about-text text-gray-300 mx-2 md:mx-12 text-left md:text-left md:text-xl lg:text-2xl mt-5 flex flex-col">
<span>
Baby Trump is a community made and owned Crypto currency project. We are aspiring to
become the new high quality standard within the Crypto Space. A group of like minded
individuals have come together to create the new golden standard of what a community
should have to offer. We have a 5% tax on both buy and sell orders.
We are in no way affiliated with Trump or the Trump family. However, we will be donating
5% of our marketing budget to the Trump campaign.
</span>
</p>
</div>
</div>
</div>
</div>
</section>
<!-- Tokenomics Section -->
<section id="tokenomics" class=" text-white py-16">
<div class="container mx-auto text-center">
<div class="token1 flex flex-col-reverse md:flex-row md:items-center justify-start mx-4 md:mx-6 lg:mx-8">
<h1 class="token text-5xl lg:text-7xl font-extrabold mb-8 text-white ">Tokenomics</h1>
<img class="w-32 md:w-42 lg:w-64 px-5" src="images/tok.svg" alt="">
</div>
<div class="grid grid-cols-1 md:grid-cols-1 lg:grid-cols-3 gap-8 m-10 align-middle ">
<!-- Total Supply -->
<div class="token1 p-6 border-4 border-white rounded-lg shadow-2xl">
<h1 class="text-3xl font-bold mb-4 text-white">Total Supply</h1>
<p class="tok pt-5">5555555555555555 Baby Trump </p>
</div>
<!-- Initial Liquidity -->
<div class="token2 p-6 border-4 border-white rounded-lg shadow-md">
<h1 class="text-3xl font-bold mb-4 text-white">Tax</h1>
<p class="tok pt-5">5/5</p>
</div>
<!-- addd -->
<div class="token3 p-6 border-4 border-white rounded-lg shadow-md">
<h1 class="text-3xl font-bold mb-4 text-white">CA</h1>
<div class="flex justify-center items-center w-full gap-x-3">
<div id="hs-clipboard-basic" class=" text-white border rounded-lg w-full ">
<input id="hs-clipboard-input" type="text"
class="py-3 px-4 block rounded-lg text-sm w-full md:w-full placeholder:text-white bg-black"
value="0xbEF1a4b285274B64876f61dB5cCF07E439312D43">
</div>
<button type="button"
class="js-clipboard p-3 inline-flex items-center gap-x-2 text-sm font-medium rounded-lg border text-white shadow-sm disabled:opacity-50 disabled:pointer-events-none "
data-clipboard-target="#hs-clipboard-basic" data-clipboard-action="copy"
data-clipboard-success-text="Copied" onclick="changeCopyText(this)">
<svg class="js-clipboard-default w-4 h-4 group-hover:rotate-6 transition"
xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"
fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round">
<rect width="8" height="4" x="8" y="2" rx="1" ry="1" />
<path d="M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2" />
</svg>
<svg class="js-clipboard-success hidden w-4 h-4 text-blue-600"
xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"
fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round">
<polyline points="20 6 9 17 4 12" />
</svg>
</button>
</div>
</div>
</div>
</div>
</section>
<!-- partners section -->
<section id="partners">
<div class="container mx-auto text-center p-5 lg:pb-20">
<div
class="token1 flex flex-col-reverse md:flex-row items-center justify-center lg:justify-start mx-4 md:mx-6 lg:mx-8">
<h1 class="token text-5xl lg:text-7xl font-extrabold mb-8 text-white ">Partners</h1>
<img class="w-32 md:w-42 lg:w-64 px-5" src="images/partner.png" alt="">
</div>
<div
class="flex flex-col lg:flex-row justify-center items-center align-middle mb-5 md:mb-10 lg:mb-20 mt-5 lg:mt-20 ">
<a href="https://www.pinksale.finance/">
<div class="token1 w-64 h-64 flex items-center lg:w-1/3 mx-4 md:mx-6 lg:mx-8 mb-8">
<div
class="flex flex-col justify-center items-center border-4 rounded-lg m-4 lg:m-10 p-10 transform hover:scale-110 transition duration-200">
<div class="flex justify-center items-center">
<img class="w-32 lg:w-64 " src="images/partners/pink.png" alt="">
</div>
<div class="flex justify-center items-center">
<p class="text-3xl lg:text-7xl text-white">PinkSale</p>
</div>
</div>
</div>
</a>
<a href="https://www.dexview.com/">
<div
class="token1 w-64 h-64 flex items-center lg:w-1/3 mx-4 md:mx-6 lg:mx-8 mb-8 transform hover:scale-110 transition duration-200">
<div
class="flex flex-col justify-center items-center border-4 rounded-lg m-4 lg:m-10 p-10 transform hover:scale-110 transition duration-200">
<div class="flex justify-center items-center">
<img class="w-32 lg:w-64 " src="images/partners/dex.png" alt="">
</div>
<div class="flex justify-center items-center">
<p class="text-3xl lg:text-7xl text-white">DEXView</p>
</div>
</div>
</div>
</a>
</div>
</div>
</section>
<!-- social section -->
<section id="social">
<div class="flex flex-col-reverse items-center md:flex-row justify-between gap-5 ">
<div class="social w-full md:w-1/2 mx-4 px-4 flex justify-center items-center">
<img class="w-80 md:96 lg:w-[1000px] mx-8" src="images/logo1.png" alt="">
</div>
<div class="social w-full md:w-1/2 mx-4 px-4">
<h1 class="text-center md:text-left text-3xl lg:text-5xl font-extrabold mb-8 text-white ">Follow
BABY TRUMP on social media</h1>
<div class="flex items-center justify-center md:justify-start gap-4 ">
<a href="https://t.me/BabyTrumpGlobal">
<img class="w-24 transform hover:scale-110 transition duration-200" src="images/social_tg.png"
alt="">
</a>
<a href="https://twitter.com/BabyTrumpBSC_">
<img class="w-24 transform hover:scale-110 transition duration-200" src="images/social_x.png"
alt="">
</a>
<a href="">
<img class="w-24 transform hover:scale-110 transition duration-200"
src="images/social_discord.png" alt="">
</a>
</div>
</div>
</div>
</section>
<!-- Footer -->
<footer class="bg-gray-900 text-white py-4 text-center mt-10">
<div class="container mx-auto">
<!-- Disclaimer, social media icons, copyright here -->
<p class="text-sm text-white">Copyright Baby Trump © 2024. All rights reserved</p>
</div>
</footer>
</body>
<script>
ScrollReveal().reveal(".social", { delay: 100, reset: true, origin: 'right', distance: '20px', duration: 300 });
ScrollReveal().reveal(".token3", { delay: 100, reset: true, origin: 'right', distance: '500px', duration: 500 });
ScrollReveal().reveal(".token2", { delay: 100, reset: true, origin: 'right', distance: '500px', duration: 500 });
ScrollReveal().reveal(".token1", { delay: 100, reset: true, origin: 'right', distance: '500px', duration: 500 });
ScrollReveal().reveal(".chart", { delay: 100, reset: true, origin: 'bottom', distance: '500px', duration: 300 });
ScrollReveal().reveal(".main-head", { delay: 100, reset: true, origin: 'left', distance: '500px', duration: 300 });
ScrollReveal().reveal(".main-logo", { delay: 100, reset: true, origin: 'right', distance: '500px', duration: 300 });
ScrollReveal().reveal(".nav-main", { delay: 100, reset: true, origin: 'top', distance: '20px', duration: 300 });
// button menu nav
function toggleMenu() {
var icon = document.getElementById("menuIcon");
var navbar = document.getElementById("navbar-default");
if (navbar.style.display === 'none' || navbar.style.display === '') {
icon.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" style="fill: cyan;"><path d="M4 6h16v2H4zm4 5h12v2H8zm5 5h7v2h-7z"></path></svg>';
navbar.style.display = 'block';
} else {
icon.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" style="fill: cyan;"><path d="M4 6h16v2H4zm0 5h16v2H4zm0 5h16v2H4z"></path></svg>';
navbar.style.display = 'none';
}
}
function changeCopyText(button) {
var copyTextElement = button.querySelector('.copy-text');
if (copyTextElement) {
copyTextElement.textContent = 'copied';
}
}
document.addEventListener('DOMContentLoaded', function () {
var clipboard = new ClipboardJS('.js-clipboard');
});
const menuIcon = document.querySelector('#menu-icon');
const navbar = document.querySelector('.navbar');
const navbg = document.querySelector('.nav-bg');
menuIcon.addEventListener('click', () => {
menuIcon.classList.toggle('bx-x');
navbar.classList.toggle('active');
navbg.classList.toggle('active');
});
</script>
</html>