ProjectGenesis commited on
Commit
fa2eeae
·
verified ·
1 Parent(s): f0a13e6

add this to the left side <!-- Side Navigation --> <div class="fixed left-0 top-14 bottom-20 w-16 flex flex-col items-center py-4 z-40"> <div class="flex flex-col space-y-4 mt-4"> <a href="#" class="w-12 h-12 flex items-center justify-center glass-panel rounded-xl text-niogold hover:bg-opacity-100 transition-all group"> <i class="fas fa-home text-xl group-hover:animate-[iconBounce_0.5s_ease-in-out]"></i> <span class="absolute left-16 bg-black text-white text-xs px-2 py-1 rounded opacity-0 group-hover:opacity-100 transition-opacity">Home</span> </a> <a href="#" class="w-12 h-12 flex items-center justify-center glass-panel rounded-xl text-niogold hover:bg-opacity-100 transition-all group"> <i class="fas fa-dice text-xl group-hover:animate-[iconBounce_0.5s_ease-in-out]"></i> <span class="absolute left-16 bg-black text-white text-xs px-2 py-1 rounded opacity-0 group-hover:opacity-100 transition-opacity">Slots</span> </a> <a href="#" class="w-12 h-12 flex items-center justify-center glass-panel rounded-xl text-niogold hover:bg-opacity-100 transition-all group"> <i class="fas fa-chess-queen text-xl group-hover:animate-[iconBounce_0.5s_ease-in-out]"></i> <span class="absolute left-16 bg-black text-white text-xs px-2 py-1 rounded opacity-0 group-hover:opacity-100 transition-opacity">Table Games</span> </a> <a href="#" class="w-12 h-12 flex items-center justify-center glass-panel rounded-xl text-niogold hover:bg-opacity-100 transition-all group"> <i class="fas fa-video text-xl group-hover:animate-[iconBounce_0.5s_ease-in-out]"></i> <span class="absolute left-16 bg-black text-white text-xs px-2 py-1 rounded opacity-0 group-hover:opacity-100 transition-opacity">Live Casino</span> </a> <a href="#" class="w-12 h-12 flex items-center justify-center glass-panel rounded-xl text-niogold hover:bg-opacity-100 transition-all group"> <i class="fas fa-trophy text-xl group-hover:animate-[iconBounce_0.5s_ease-in-out]"></i> <span class="absolute left-16 bg-black text-white text-xs px-2 py-1 rounded opacity-0 group-hover:opacity-100 transition-opacity">Tournaments</span> </a> <a href="#" class="w-12 h-12 flex items-center justify-center glass-panel rounded-xl text-niogold hover:bg-opacity-100 transition-all group"> <i class="fas fa-crown text-xl group-hover:animate-[iconBounce_0.5s_ease-in-out]"></i> <span class="absolute left-16 bg-black text-white text-xs px-2 py-1 rounded opacity-0 group-hover:opacity-100 transition-opacity">VIP</span> </a> <a href="#" class="w-12 h-12 flex items-center justify-center glass-panel rounded-xl text-niogold hover:bg-opacity-100 transition-all group"> <i class="fas fa-wallet text-xl group-hover:animate-[iconBounce_0.5s_ease-in-out]"></i> <span class="absolute left-16 bg-black text-white text-xs px-2 py-1 rounded opacity-0 group-hover:opacity-100 transition-opacity">Wallet</span> </a> <a href="#" class="w-12 h-12 flex items-center justify-center glass-panel rounded-xl text-niogold hover:bg-opacity-100 transition-all group"> <i class="fas fa-question-circle text-xl group-hover:animate-[iconBounce_0.5s_ease-in-out]"></i> <span class="absolute left-16 bg-black text-white text-xs px-2 py-1 rounded opacity-0 group-hover:opacity-100 transition-opacity">FAQ</span> </a> <a href="#" class="w-12 h-12 flex items-center justify-center glass-panel rounded-xl text-niogold hover:bg-opacity-100 transition-all group"> <i class="fas fa-headset text-xl group-hover:animate-[iconBounce_0.5s_ease-in-out]"></i> <span class="absolute left-16 bg-black text-white text-xs px-2 py-1 rounded opacity-0 group-hover:opacity-100 transition-opacity">Support</span> </a> </div> </div> - Follow Up Deployment

Browse files
Files changed (1) hide show
  1. index.html +43 -1
index.html CHANGED
@@ -281,8 +281,50 @@
281
  </div>
282
  </header>
283
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
284
  <!-- Main Container -->
285
- <div class="min-h-screen w-full max-w-7xl mx-auto px-4 pt-24 pb-8">
286
 
287
  <!-- Current Tournament Banner -->
288
  <section class="glass-panel glow-border mb-8 relative overflow-hidden">
 
281
  </div>
282
  </header>
283
 
284
+ <!-- Side Navigation -->
285
+ <div class="fixed left-0 top-14 bottom-20 w-16 flex flex-col items-center py-4 z-40">
286
+ <div class="flex flex-col space-y-4 mt-4">
287
+ <a href="#" class="w-12 h-12 flex items-center justify-center glass-panel rounded-xl text-niogold hover:bg-opacity-100 transition-all group">
288
+ <i class="fas fa-home text-xl group-hover:animate-[iconBounce_0.5s_ease-in-out]"></i>
289
+ <span class="absolute left-16 bg-black text-white text-xs px-2 py-1 rounded opacity-0 group-hover:opacity-100 transition-opacity">Home</span>
290
+ </a>
291
+ <a href="#" class="w-12 h-12 flex items-center justify-center glass-panel rounded-xl text-niogold hover:bg-opacity-100 transition-all group">
292
+ <i class="fas fa-dice text-xl group-hover:animate-[iconBounce_0.5s_ease-in-out]"></i>
293
+ <span class="absolute left-16 bg-black text-white text-xs px-2 py-1 rounded opacity-0 group-hover:opacity-100 transition-opacity">Slots</span>
294
+ </a>
295
+ <a href="#" class="w-12 h-12 flex items-center justify-center glass-panel rounded-xl text-niogold hover:bg-opacity-100 transition-all group">
296
+ <i class="fas fa-chess-queen text-xl group-hover:animate-[iconBounce_0.5s_ease-in-out]"></i>
297
+ <span class="absolute left-16 bg-black text-white text-xs px-2 py-1 rounded opacity-0 group-hover:opacity-100 transition-opacity">Table Games</span>
298
+ </a>
299
+ <a href="#" class="w-12 h-12 flex items-center justify-center glass-panel rounded-xl text-niogold hover:bg-opacity-100 transition-all group">
300
+ <i class="fas fa-video text-xl group-hover:animate-[iconBounce_0.5s_ease-in-out]"></i>
301
+ <span class="absolute left-16 bg-black text-white text-xs px-2 py-1 rounded opacity-0 group-hover:opacity-100 transition-opacity">Live Casino</span>
302
+ </a>
303
+ <a href="#" class="w-12 h-12 flex items-center justify-center glass-panel rounded-xl text-niogold hover:bg-opacity-100 transition-all group">
304
+ <i class="fas fa-trophy text-xl group-hover:animate-[iconBounce_0.5s_ease-in-out]"></i>
305
+ <span class="absolute left-16 bg-black text-white text-xs px-2 py-1 rounded opacity-0 group-hover:opacity-100 transition-opacity">Tournaments</span>
306
+ </a>
307
+ <a href="#" class="w-12 h-12 flex items-center justify-center glass-panel rounded-xl text-niogold hover:bg-opacity-100 transition-all group">
308
+ <i class="fas fa-crown text-xl group-hover:animate-[iconBounce_0.5s_ease-in-out]"></i>
309
+ <span class="absolute left-16 bg-black text-white text-xs px-2 py-1 rounded opacity-0 group-hover:opacity-100 transition-opacity">VIP</span>
310
+ </a>
311
+ <a href="#" class="w-12 h-12 flex items-center justify-center glass-panel rounded-xl text-niogold hover:bg-opacity-100 transition-all group">
312
+ <i class="fas fa-wallet text-xl group-hover:animate-[iconBounce_0.5s_ease-in-out]"></i>
313
+ <span class="absolute left-16 bg-black text-white text-xs px-2 py-1 rounded opacity-0 group-hover:opacity-100 transition-opacity">Wallet</span>
314
+ </a>
315
+ <a href="#" class="w-12 h-12 flex items-center justify-center glass-panel rounded-xl text-niogold hover:bg-opacity-100 transition-all group">
316
+ <i class="fas fa-question-circle text-xl group-hover:animate-[iconBounce_0.5s_ease-in-out]"></i>
317
+ <span class="absolute left-16 bg-black text-white text-xs px-2 py-1 rounded opacity-0 group-hover:opacity-100 transition-opacity">FAQ</span>
318
+ </a>
319
+ <a href="#" class="w-12 h-12 flex items-center justify-center glass-panel rounded-xl text-niogold hover:bg-opacity-100 transition-all group">
320
+ <i class="fas fa-headset text-xl group-hover:animate-[iconBounce_0.5s_ease-in-out]"></i>
321
+ <span class="absolute left-16 bg-black text-white text-xs px-2 py-1 rounded opacity-0 group-hover:opacity-100 transition-opacity">Support</span>
322
+ </a>
323
+ </div>
324
+ </div>
325
+
326
  <!-- Main Container -->
327
+ <div class="min-h-screen w-full max-w-7xl mx-auto px-4 pt-24 pb-8 ml-16">
328
 
329
  <!-- Current Tournament Banner -->
330
  <section class="glass-panel glow-border mb-8 relative overflow-hidden">