Spaces:
Running
Running
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>VELNEXOR - Web3 Solutions & Blockchain Academy</title> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> | |
| <script> | |
| tailwind.config = { | |
| theme: { | |
| extend: { | |
| colors: { | |
| vlnxPrimary: '#6d28d9', | |
| vlnxSecondary: '#8b5cf6', | |
| vlnxDark: '#1e1b4b', | |
| vlnxLight: '#e9d5ff', | |
| }, | |
| fontFamily: { | |
| sans: ['Inter', 'sans-serif'], | |
| }, | |
| } | |
| } | |
| } | |
| </script> | |
| <style> | |
| @import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap'); | |
| body { | |
| font-family: 'Inter', sans-serif; | |
| background-color: #f8fafc; | |
| } | |
| .gradient-bg { | |
| background: linear-gradient(135deg, #6d28d9 0%, #8b5cf6 100%); | |
| } | |
| .token-card { | |
| perspective: 1000px; | |
| } | |
| .token-card-inner { | |
| transition: transform 0.6s; | |
| transform-style: preserve-3d; | |
| } | |
| .token-card:hover .token-card-inner { | |
| transform: rotateY(180deg); | |
| } | |
| .token-card-front, .token-card-back { | |
| backface-visibility: hidden; | |
| } | |
| .token-card-back { | |
| transform: rotateY(180deg); | |
| } | |
| .service-card:hover { | |
| transform: translateY(-10px); | |
| box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); | |
| } | |
| .animated-wave { | |
| animation: wave 8s ease-in-out infinite; | |
| } | |
| @keyframes wave { | |
| 0%, 100% { | |
| transform: rotate(0deg); | |
| } | |
| 25% { | |
| transform: rotate(5deg); | |
| } | |
| 75% { | |
| transform: rotate(-5deg); | |
| } | |
| } | |
| .typing-demo { | |
| width: 22ch; | |
| animation: typing 2s steps(22), blink .5s step-end infinite alternate; | |
| white-space: nowrap; | |
| overflow: hidden; | |
| border-right: 3px solid; | |
| font-family: monospace; | |
| } | |
| @keyframes typing { | |
| from { | |
| width: 0 | |
| } | |
| } | |
| @keyframes blink { | |
| 50% { | |
| border-color: transparent | |
| } | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <!-- Navigation --> | |
| <nav class="bg-white shadow-lg sticky top-0 z-50"> | |
| <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> | |
| <div class="flex justify-between h-16"> | |
| <div class="flex items-center"> | |
| <div class="flex-shrink-0 flex items-center"> | |
| <i class="fas fa-cube text-vlnxPrimary text-2xl mr-2"></i> | |
| <span class="text-xl font-bold text-vlnxDark">VELNEXOR</span> | |
| </div> | |
| </div> | |
| <div class="hidden md:ml-6 md:flex md:items-center md:space-x-8"> | |
| <a href="#services" class="text-gray-700 hover:text-vlnxPrimary px-3 py-2 text-sm font-medium">Services</a> | |
| <a href="#token" class="text-gray-700 hover:text-vlnxPrimary px-3 py-2 text-sm font-medium">VLNX Token</a> | |
| <a href="#blockchain" class="text-gray-700 hover:text-vlnxPrimary px-3 py-2 text-sm font-medium">Blockchain</a> | |
| <a href="#academy" class="text-gray-700 hover:text-vlnxPrimary px-3 py-2 text-sm font-medium">Academy</a> | |
| <a href="#about" class="text-gray-700 hover:text-vlnxPrimary px-3 py-2 text-sm font-medium">About</a> | |
| </div> | |
| <div class="flex items-center"> | |
| <button class="bg-vlnxPrimary text-white px-4 py-2 rounded-md text-sm font-medium hover:bg-vlnxSecondary transition duration-300"> | |
| Connect Wallet | |
| </button> | |
| <button class="md:hidden ml-4 inline-flex items-center justify-center p-2 rounded-md text-gray-700"> | |
| <i class="fas fa-bars"></i> | |
| </button> | |
| </div> | |
| </div> | |
| </div> | |
| </nav> | |
| <!-- Hero Section --> | |
| <section class="gradient-bg text-white"> | |
| <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-20 md:py-32"> | |
| <div class="md:flex items-center"> | |
| <div class="md:w-1/2 mb-10 md:mb-0"> | |
| <h1 class="text-4xl md:text-6xl font-bold mb-6 leading-tight"> | |
| The Future of <span class="typing-demo">Web3 Solutions</span> | |
| </h1> | |
| <p class="text-xl mb-8 opacity-90"> | |
| VELNEXOR provides comprehensive Web3 services, blockchain solutions, and education to power the decentralized future. | |
| </p> | |
| <div class="flex space-x-4"> | |
| <button class="bg-white text-vlnxPrimary px-6 py-3 rounded-md text-lg font-semibold hover:bg-opacity-90 transition duration-300"> | |
| Explore Services | |
| </button> | |
| <button class="border-2 border-white text-white px-6 py-3 rounded-md text-lg font-semibold hover:bg-white hover:bg-opacity-10 transition duration-300"> | |
| Learn More | |
| </button> | |
| </div> | |
| </div> | |
| <div class="md:w-1/2 flex justify-center animated-wave"> | |
| <img src="https://images.unsplash.com/photo-1639762681057-408e52192e55?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2232&q=80" alt="Blockchain Technology" class="rounded-xl shadow-2xl w-full max-w-lg"> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Services Section --> | |
| <section id="services" class="py-20 bg-white"> | |
| <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> | |
| <div class="text-center mb-16"> | |
| <h2 class="text-3xl font-bold text-vlnxDark mb-4">Our Web3 Services</h2> | |
| <p class="text-gray-600 max-w-2xl mx-auto"> | |
| Comprehensive solutions to build, grow, and secure your Web3 projects | |
| </p> | |
| </div> | |
| <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8"> | |
| <!-- Service 1 --> | |
| <div class="service-card bg-white rounded-xl shadow-lg p-8 transition duration-300"> | |
| <div class="text-vlnxPrimary mb-4"> | |
| <i class="fas fa-code text-4xl"></i> | |
| </div> | |
| <h3 class="text-xl font-bold text-vlnxDark mb-3">Smart Contract Development</h3> | |
| <p class="text-gray-600"> | |
| Secure, audited smart contracts for DeFi, NFTs, DAOs, and more. We build on Ethereum, Solana, Polygon, and other leading blockchains. | |
| </p> | |
| </div> | |
| <!-- Service 2 --> | |
| <div class="service-card bg-white rounded-xl shadow-lg p-8 transition duration-300"> | |
| <div class="text-vlnxPrimary mb-4"> | |
| <i class="fas fa-wallet text-4xl"></i> | |
| </div> | |
| <h3 class="text-xl font-bold text-vlnxDark mb-3">DeFi Solutions</h3> | |
| <p class="text-gray-600"> | |
| Custom decentralized finance applications including DEXs, lending protocols, yield farming strategies, and asset management tools. | |
| </p> | |
| </div> | |
| <!-- Service 3 --> | |
| <div class="service-card bg-white rounded-xl shadow-lg p-8 transition duration-300"> | |
| <div class="text-vlnxPrimary mb-4"> | |
| <i class="fas fa-image text-4xl"></i> | |
| </div> | |
| <h3 class="text-xl font-bold text-vlnxDark mb-3">NFT Ecosystem</h3> | |
| <p class="text-gray-600"> | |
| End-to-end NFT solutions from minting platforms to marketplaces, with integrated royalty systems and community features. | |
| </p> | |
| </div> | |
| <!-- Service 4 --> | |
| <div class="service-card bg-white rounded-xl shadow-lg p-8 transition duration-300"> | |
| <div class="text-vlnxPrimary mb-4"> | |
| <i class="fas fa-users text-4xl"></i> | |
| </div> | |
| <h3 class="text-xl font-bold text-vlnxDark mb-3">DAO Framework</h3> | |
| <p class="text-gray-600"> | |
| Complete DAO infrastructure including governance systems, treasury management, voting mechanisms, and member coordination tools. | |
| </p> | |
| </div> | |
| <!-- Service 5 --> | |
| <div class="service-card bg-white rounded-xl shadow-lg p-8 transition duration-300"> | |
| <div class="text-vlnxPrimary mb-4"> | |
| <i class="fas fa-shield-alt text-4xl"></i> | |
| </div> | |
| <h3 class="text-xl font-bold text-vlnxDark mb-3">Security & Auditing</h3> | |
| <p class="text-gray-600"> | |
| Comprehensive smart contract audits, penetration testing, and security best practices to protect your Web3 applications. | |
| </p> | |
| </div> | |
| <!-- Service 6 --> | |
| <div class="service-card bg-white rounded-xl shadow-lg p-8 transition duration-300"> | |
| <div class="text-vlnxPrimary mb-4"> | |
| <i class="fas fa-chart-line text-4xl"></i> | |
| </div> | |
| <h3 class="text-xl font-bold text-vlnxDark mb-3">Tokenomics Design</h3> | |
| <p class="text-gray-600"> | |
| Strategic token design including utility, distribution models, vesting schedules, and economic sustainability planning. | |
| </p> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Token Section --> | |
| <section id="token" class="py-20 bg-vlnxLight"> | |
| <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> | |
| <div class="md:flex items-center"> | |
| <div class="md:w-1/2 mb-10 md:mb-0"> | |
| <h2 class="text-3xl font-bold text-vlnxDark mb-6">The VLNX Token</h2> | |
| <p class="text-gray-700 mb-6"> | |
| The VLNX token powers the VELNEXOR ecosystem, providing access to services, governance rights, and staking rewards. | |
| </p> | |
| <ul class="space-y-3 mb-8"> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check-circle text-vlnxPrimary mt-1 mr-2"></i> | |
| <span>Access premium VELNEXOR services at discounted rates</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check-circle text-vlnxPrimary mt-1 mr-2"></i> | |
| <span>Participate in platform governance and decision making</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check-circle text-vlnxPrimary mt-1 mr-2"></i> | |
| <span>Earn staking rewards and yield farming opportunities</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check-circle text-vlnxPrimary mt-1 mr-2"></i> | |
| <span>Exclusive access to academy courses and resources</span> | |
| </li> | |
| </ul> | |
| <button class="bg-vlnxPrimary text-white px-6 py-3 rounded-md text-lg font-semibold hover:bg-vlnxSecondary transition duration-300"> | |
| Tokenomics Details | |
| </button> | |
| </div> | |
| <div class="md:w-1/2 flex justify-center"> | |
| <div class="token-card w-64 h-96"> | |
| <div class="token-card-inner relative w-full h-full"> | |
| <div class="token-card-front absolute w-full h-full bg-gradient-to-br from-vlnxPrimary to-vlnxSecondary rounded-xl shadow-2xl flex flex-col items-center justify-center p-6 text-white"> | |
| <i class="fas fa-coins text-6xl mb-4"></i> | |
| <h3 class="text-2xl font-bold mb-2">VLNX Token</h3> | |
| <p class="text-center">Powering the VELNEXOR Ecosystem</p> | |
| </div> | |
| <div class="token-card-back absolute w-full h-full bg-white rounded-xl shadow-2xl flex flex-col items-center justify-center p-6 text-vlnxDark"> | |
| <h3 class="text-xl font-bold mb-4">Token Details</h3> | |
| <div class="text-left w-full space-y-2"> | |
| <p><span class="font-semibold">Symbol:</span> VLNX</p> | |
| <p><span class="font-semibold">Chain:</span> Multichain</p> | |
| <p><span class="font-semibold">Supply:</span> 1 Billion</p> | |
| <p><span class="font-semibold">Type:</span> Utility & Governance</p> | |
| </div> | |
| <button class="mt-6 bg-vlnxPrimary text-white px-4 py-2 rounded-md text-sm font-medium hover:bg-vlnxSecondary transition duration-300"> | |
| Buy Now | |
| </button> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Blockchain Section --> | |
| <section id="blockchain" class="py-20 bg-white"> | |
| <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> | |
| <div class="text-center mb-16"> | |
| <h2 class="text-3xl font-bold text-vlnxDark mb-4">Blockchain Solutions</h2> | |
| <p class="text-gray-600 max-w-2xl mx-auto"> | |
| Custom blockchain development and enterprise solutions tailored to your needs | |
| </p> | |
| </div> | |
| <div class="grid grid-cols-1 md:grid-cols-2 gap-8 mb-12"> | |
| <div class="bg-vlnxDark text-white rounded-xl p-8"> | |
| <h3 class="text-xl font-bold mb-4">Private Blockchain Networks</h3> | |
| <p class="mb-6"> | |
| Secure, scalable private blockchain solutions for enterprises with custom consensus mechanisms and permissioned access. | |
| </p> | |
| <ul class="space-y-3"> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check text-vlnxSecondary mt-1 mr-2"></i> | |
| <span>Custom consensus algorithms</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check text-vlnxSecondary mt-1 mr-2"></i> | |
| <span>Enterprise-grade security</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check text-vlnxSecondary mt-1 mr-2"></i> | |
| <span>Interoperability features</span> | |
| </li> | |
| </ul> | |
| </div> | |
| <div class="bg-vlnxLight text-vlnxDark rounded-xl p-8"> | |
| <h3 class="text-xl font-bold mb-4">Public Blockchain Integration</h3> | |
| <p class="mb-6"> | |
| Seamless integration with major public blockchains including Ethereum, Polygon, Solana, and more. | |
| </p> | |
| <ul class="space-y-3"> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check text-vlnxPrimary mt-1 mr-2"></i> | |
| <span>Cross-chain bridges</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check text-vlnxPrimary mt-1 mr-2"></i> | |
| <span>Layer 2 solutions</span> | |
| </li> | |
| <li class="flex items-start"> | |
| <i class="fas fa-check text-vlnxPrimary mt-1 mr-2"></i> | |
| <span>Oracle integration</span> | |
| </li> | |
| </ul> | |
| </div> | |
| </div> | |
| <div class="bg-gradient-to-r from-vlnxPrimary to-vlnxSecondary text-white rounded-xl p-8"> | |
| <div class="md:flex items-center"> | |
| <div class="md:w-2/3 mb-6 md:mb-0"> | |
| <h3 class="text-xl font-bold mb-3">Need a Custom Blockchain Solution?</h3> | |
| <p> | |
| Our team of blockchain architects can design and implement a solution tailored to your specific business requirements. | |
| </p> | |
| </div> | |
| <div class="md:w-1/3 flex justify-end"> | |
| <button class="bg-white text-vlnxPrimary px-6 py-3 rounded-md text-lg font-semibold hover:bg-opacity-90 transition duration-300"> | |
| Contact Us | |
| </button> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Academy Section --> | |
| <section id="academy" class="py-20 bg-gray-50"> | |
| <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> | |
| <div class="text-center mb-16"> | |
| <h2 class="text-3xl font-bold text-vlnxDark mb-4">VELNEXOR Academy</h2> | |
| <p class="text-gray-600 max-w-2xl mx-auto"> | |
| Learn blockchain development, smart contract programming, and Web3 fundamentals from industry experts | |
| </p> | |
| </div> | |
| <div class="grid grid-cols-1 md:grid-cols-3 gap-8 mb-12"> | |
| <!-- Course 1 --> | |
| <div class="bg-white rounded-xl shadow-lg overflow-hidden"> | |
| <div class="h-48 bg-gradient-to-r from-vlnxPrimary to-vlnxSecondary flex items-center justify-center"> | |
| <i class="fas fa-ethereum text-white text-6xl"></i> | |
| </div> | |
| <div class="p-6"> | |
| <h3 class="text-xl font-bold text-vlnxDark mb-2">Blockchain Fundamentals</h3> | |
| <p class="text-gray-600 mb-4"> | |
| Learn the core concepts of blockchain technology, consensus mechanisms, and decentralized systems. | |
| </p> | |
| <div class="flex justify-between items-center"> | |
| <span class="text-sm text-gray-500">Beginner • 4 Weeks</span> | |
| <button class="text-vlnxPrimary font-medium hover:text-vlnxSecondary"> | |
| Enroll Now | |
| </button> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Course 2 --> | |
| <div class="bg-white rounded-xl shadow-lg overflow-hidden"> | |
| <div class="h-48 bg-gradient-to-r from-vlnxPrimary to-vlnxSecondary flex items-center justify-center"> | |
| <i class="fas fa-solid fa-code text-white text-6xl"></i> | |
| </div> | |
| <div class="p-6"> | |
| <h3 class="text-xl font-bold text-vlnxDark mb-2">Smart Contract Development</h3> | |
| <p class="text-gray-600 mb-4"> | |
| Master Solidity and build secure smart contracts for Ethereum and EVM-compatible chains. | |
| </p> | |
| <div class="flex justify-between items-center"> | |
| <span class="text-sm text-gray-500">Intermediate • 6 Weeks</span> | |
| <button class="text-vlnxPrimary font-medium hover:text-vlnxSecondary"> | |
| Enroll Now | |
| </button> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Course 3 --> | |
| <div class="bg-white rounded-xl shadow-lg overflow-hidden"> | |
| <div class="h-48 bg-gradient-to-r from-vlnxPrimary to-vlnxSecondary flex items-center justify-center"> | |
| <i class="fas fa-chart-pie text-white text-6xl"></i> | |
| </div> | |
| <div class="p-6"> | |
| <h3 class="text-xl font-bold text-vlnxDark mb-2">DeFi & Tokenomics</h3> | |
| <p class="text-gray-600 mb-4"> | |
| Understand decentralized finance protocols and design effective token economies. | |
| </p> | |
| <div class="flex justify-between items-center"> | |
| <span class="text-sm text-gray-500">Advanced • 8 Weeks</span> | |
| <button class="text-vlnxPrimary font-medium hover:text-vlnxSecondary"> | |
| Enroll Now | |
| </button> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="text-center"> | |
| <button class="bg-vlnxPrimary text-white px-6 py-3 rounded-md text-lg font-semibold hover:bg-vlnxSecondary transition duration-300"> | |
| View All Courses | |
| </button> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- About Section --> | |
| <section id="about" class="py-20 bg-vlnxDark text-white"> | |
| <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> | |
| <div class="md:flex items-center"> | |
| <div class="md:w-1/2 mb-10 md:mb-0"> | |
| <h2 class="text-3xl font-bold mb-6">About VELNEXOR</h2> | |
| <p class="mb-6 opacity-90"> | |
| Founded in 2022, VELNEXOR is a leading Web3 solutions provider with a mission to accelerate blockchain adoption through innovative technology and education. | |
| </p> | |
| <p class="mb-8 opacity-90"> | |
| Our team of blockchain experts, developers, and educators come from diverse backgrounds in technology, finance, and academia, united by a shared vision of a decentralized future. | |
| </p> | |
| <div class="flex space-x-4"> | |
| <a href="#" class="w-10 h-10 rounded-full bg-white bg-opacity-10 flex items-center justify-center hover:bg-opacity-20 transition duration-300"> | |
| <i class="fab fa-twitter"></i> | |
| </a> | |
| <a href="#" class="w-10 h-10 rounded-full bg-white bg-opacity-10 flex items-center justify-center hover:bg-opacity-20 transition duration-300"> | |
| <i class="fab fa-discord"></i> | |
| </a> | |
| <a href="#" class="w-10 h-10 rounded-full bg-white bg-opacity-10 flex items-center justify-center hover:bg-opacity-20 transition duration-300"> | |
| <i class="fab fa-github"></i> | |
| </a> | |
| <a href="#" class="w-10 h-10 rounded-full bg-white bg-opacity-10 flex items-center justify-center hover:bg-opacity-20 transition duration-300"> | |
| <i class="fab fa-telegram"></i> | |
| </a> | |
| </div> | |
| </div> | |
| <div class="md:w-1/2"> | |
| <div class="bg-white bg-opacity-10 rounded-xl p-8"> | |
| <h3 class="text-xl font-bold mb-4">Join Our Community</h3> | |
| <p class="mb-6 opacity-90"> | |
| Stay updated with the latest news, product releases, and educational content from VELNEXOR. | |
| </p> | |
| <form> | |
| <div class="mb-4"> | |
| <input type="email" placeholder="Your email address" class="w-full bg-white bg-opacity-10 border border-white border-opacity-20 rounded-md px-4 py-3 text-white placeholder-white placeholder-opacity-70 focus:outline-none focus:ring-2 focus:ring-vlnxSecondary"> | |
| </div> | |
| <button type="submit" class="w-full bg-vlnxPrimary text-white px-6 py-3 rounded-md text-lg font-semibold hover:bg-vlnxSecondary transition duration-300"> | |
| Subscribe | |
| </button> | |
| </form> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- Footer --> | |
| <footer class="bg-gray-900 text-white py-12"> | |
| <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> | |
| <div class="grid grid-cols-1 md:grid-cols-4 gap-8"> | |
| <div> | |
| <div class="flex items-center mb-4"> | |
| <i class="fas fa-cube text-vlnxPrimary text-2xl mr-2"></i> | |
| <span class="text-xl font-bold">VELNEXOR</span> | |
| </div> | |
| <p class="text-gray-400"> | |
| Building the decentralized future through technology and education. | |
| </p> | |
| </div> | |
| <div> | |
| <h3 class="text-lg font-semibold mb-4">Services</h3> | |
| <ul class="space-y-2"> | |
| <li><a href="#" class="text-gray-400 hover:text-white transition duration-300">Smart Contracts</a></li> | |
| <li><a href="#" class="text-gray-400 hover:text-white transition duration-300">DeFi Solutions</a></li> | |
| <li><a href="#" class="text-gray-400 hover:text-white transition duration-300">NFT Platforms</a></li> | |
| <li><a href="#" class="text-gray-400 hover:text-white transition duration-300">Blockchain Development</a></li> | |
| </ul> | |
| </div> | |
| <div> | |
| <h3 class="text-lg font-semibold mb-4">Resources</h3> | |
| <ul class="space-y-2"> | |
| <li><a href="#" class="text-gray-400 hover:text-white transition duration-300">Documentation</a></li> | |
| <li><a href="#" class="text-gray-400 hover:text-white transition duration-300">Academy</a></li> | |
| <li><a href="#" class="text-gray-400 hover:text-white transition duration-300">Blog</a></li> | |
| <li><a href="#" class="text-gray-400 hover:text-white transition duration-300">GitHub</a></li> | |
| </ul> | |
| </div> | |
| <div> | |
| <h3 class="text-lg font-semibold mb-4">Company</h3> | |
| <ul class="space-y-2"> | |
| <li><a href="#" class="text-gray-400 hover:text-white transition duration-300">About Us</a></li> | |
| <li><a href="#" class="text-gray-400 hover:text-white transition duration-300">Careers</a></li> | |
| <li><a href="#" class="text-gray-400 hover:text-white transition duration-300">Contact</a></li> | |
| <li><a href="#" class="text-gray-400 hover:text-white transition duration-300">Press</a></li> | |
| </ul> | |
| </div> | |
| </div> | |
| <div class="border-t border-gray-800 mt-12 pt-8 flex flex-col md:flex-row justify-between items-center"> | |
| <p class="text-gray-400 mb-4 md:mb-0"> | |
| © 2023 VELNEXOR. All rights reserved. | |
| </p> | |
| <div class="flex space-x-6"> | |
| <a href="#" class="text-gray-400 hover:text-white transition duration-300"> | |
| <i class="fab fa-twitter"></i> | |
| </a> | |
| <a href="#" class="text-gray-400 hover:text-white transition duration-300"> | |
| <i class="fab fa-discord"></i> | |
| </a> | |
| <a href="#" class="text-gray-400 hover:text-white transition duration-300"> | |
| <i class="fab fa-github"></i> | |
| </a> | |
| <a href="#" class="text-gray-400 hover:text-white transition duration-300"> | |
| <i class="fab fa-telegram"></i> | |
| </a> | |
| <a href="#" class="text-gray-400 hover:text-white transition duration-300"> | |
| <i class="fab fa-medium"></i> | |
| </a> | |
| </div> | |
| </div> | |
| </div> | |
| </footer> | |
| <!-- Back to Top Button --> | |
| <button id="backToTop" class="fixed bottom-8 right-8 bg-vlnxPrimary text-white w-12 h-12 rounded-full flex items-center justify-center shadow-lg hover:bg-vlnxSecondary transition duration-300 hidden"> | |
| <i class="fas fa-arrow-up"></i> | |
| </button> | |
| <script> | |
| // Back to Top Button | |
| const backToTopButton = document.getElementById('backToTop'); | |
| window.addEventListener('scroll', () => { | |
| if (window.pageYOffset > 300) { | |
| backToTopButton.classList.remove('hidden'); | |
| } else { | |
| backToTopButton.classList.add('hidden'); | |
| } | |
| }); | |
| backToTopButton.addEventListener('click', () => { | |
| window.scrollTo({ | |
| top: 0, | |
| behavior: 'smooth' | |
| }); | |
| }); | |
| // Mobile Menu Toggle (would need actual implementation) | |
| const mobileMenuButton = document.querySelector('.md\\:hidden'); | |
| mobileMenuButton.addEventListener('click', () => { | |
| alert('Mobile menu would open here in a full implementation'); | |
| }); | |
| // Wallet Connection (simulated) | |
| const connectWalletButton = document.querySelector('button:contains("Connect Wallet")'); | |
| connectWalletButton.addEventListener('click', () => { | |
| alert('Wallet connection modal would appear here'); | |
| }); | |
| </script> | |
| <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=ocholla144/latstt" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> | |
| </html> |