Spaces:
Running
Running
| <html lang="en" class="dark"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>DeepDive Labs</title> | |
| <link rel="icon" type="image/x-icon" href="/static/favicon.ico"> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script> | |
| <script src="https://unpkg.com/feather-icons"></script> | |
| <script> | |
| tailwind.config = { | |
| darkMode: 'class', | |
| theme: { | |
| extend: { | |
| colors: { | |
| undefined: { | |
| 500: '#6366f1', | |
| } | |
| } | |
| } | |
| } | |
| } | |
| </script> | |
| <style> | |
| .card-hover { | |
| transition: all 0.3s ease; | |
| } | |
| .card-hover:hover { | |
| transform: translateY(-5px); | |
| box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); | |
| } | |
| .tag-hover { | |
| transition: all 0.2s ease; | |
| } | |
| .tag-hover:hover { | |
| background-color: rgba(99, 102, 241, 0.2); | |
| } | |
| </style> | |
| </head> | |
| <body class="bg-gray-900 text-gray-100 min-h-screen"> | |
| <!-- Navigation --> | |
| <nav class="bg-gray-800 border-b border-gray-700"> | |
| <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8"> | |
| <div class="flex items-center justify-between h-16"> | |
| <div class="flex items-center"> | |
| <div class="flex-shrink-0"> | |
| <span class="text-undefined-500 font-bold text-xl">DeepDive</span> | |
| </div> | |
| <div class="hidden md:block"> | |
| <div class="ml-10 flex items-baseline space-x-4"> | |
| <a href="#" class="bg-gray-900 text-white px-3 py-2 rounded-md text-sm font-medium">Models</a> | |
| <a href="#" class="text-gray-300 hover:bg-gray-700 hover:text-white px-3 py-2 rounded-md text-sm font-medium">Datasets</a> | |
| <a href="#" class="text-gray-300 hover:bg-gray-700 hover:text-white px-3 py-2 rounded-md text-sm font-medium">Papers</a> | |
| <a href="#" class="text-gray-300 hover:bg-gray-700 hover:text-white px-3 py-2 rounded-md text-sm font-medium">Tutorials</a> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="hidden md:block"> | |
| <div class="ml-4 flex items-center md:ml-6"> | |
| <button class="p-1 rounded-full text-gray-400 hover:text-white focus:outline-none"> | |
| <i data-feather="search"></i> | |
| </button> | |
| <button class="ml-3 p-1 rounded-full text-gray-400 hover:text-white focus:outline-none"> | |
| <i data-feather="moon"></i> | |
| </button> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </nav> | |
| <!-- Hero Section --> | |
| <header class="bg-gradient-to-r from-gray-800 to-gray-900 py-16"> | |
| <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center"> | |
| <h1 class="text-4xl font-extrabold tracking-tight text-white sm:text-5xl lg:text-6xl"> | |
| Explore Cutting-Edge AI Projects | |
| </h1> | |
| <p class="mt-6 max-w-3xl mx-auto text-xl text-gray-300"> | |
| Discover, share, and collaborate on machine learning models, datasets, and research. | |
| </p> | |
| <div class="mt-10 flex justify-center"> | |
| <div class="inline-flex rounded-md shadow"> | |
| <a href="#" class="inline-flex items-center justify-center px-5 py-3 border border-transparent text-base font-medium rounded-md text-white bg-undefined-500 hover:bg-undefined-600"> | |
| Upload Project | |
| </a> | |
| </div> | |
| <div class="ml-3 inline-flex"> | |
| <a href="#" class="inline-flex items-center justify-center px-5 py-3 border border-transparent text-base font-medium rounded-md text-undefined-500 bg-white hover:bg-gray-50"> | |
| Browse All | |
| </a> | |
| </div> | |
| </div> | |
| </div> | |
| </header> | |
| <!-- Main Content --> | |
| <main class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-12"> | |
| <!-- Filter Section --> | |
| <div class="flex flex-col md:flex-row justify-between items-center mb-8"> | |
| <div class="w-full md:w-auto mb-4 md:mb-0"> | |
| <div class="relative"> | |
| <input type="text" placeholder="Search projects..." class="bg-gray-800 text-white placeholder-gray-400 rounded-lg px-4 py-2 pl-10 w-full md:w-64 focus:outline-none focus:ring-2 focus:ring-undefined-500"> | |
| <i data-feather="search" class="absolute left-3 top-2.5 text-gray-400"></i> | |
| </div> | |
| </div> | |
| <div class="flex space-x-2"> | |
| <button class="px-4 py-2 bg-gray-800 text-white rounded-lg hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-undefined-500"> | |
| <i data-feather="filter" class="w-4 h-4 inline mr-2"></i> | |
| Filters | |
| </button> | |
| <button class="px-4 py-2 bg-gray-800 text-white rounded-lg hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-undefined-500"> | |
| <i data-feather="list" class="w-4 h-4 inline mr-2"></i> | |
| Sort | |
| </button> | |
| </div> | |
| </div> | |
| <!-- Cards Grid --> | |
| <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6"> | |
| <!-- Card 1 --> | |
| <div class="bg-gray-800 rounded-lg overflow-hidden shadow-lg border border-gray-700 card-hover"> | |
| <div class="p-4"> | |
| <div class="flex items-center mb-4"> | |
| <img src="http://static.photos/technology/320x240/1" alt="Project Icon" class="w-12 h-12 rounded-lg object-cover mr-4"> | |
| <div> | |
| <h3 class="text-lg font-semibold text-white">Project Alpha</h3> | |
| <p class="text-sm text-gray-400">by ML Researcher</p> | |
| </div> | |
| </div> | |
| <p class="text-gray-300 mb-4">A machine learning model for advanced image recognition with 95% accuracy on benchmark datasets.</p> | |
| <div class="flex flex-wrap gap-2 mb-4"> | |
| <span class="text-xs px-2 py-1 bg-gray-700 text-gray-300 rounded-full tag-hover">Computer Vision</span> | |
| <span class="text-xs px-2 py-1 bg-gray-700 text-gray-300 rounded-full tag-hover">PyTorch</span> | |
| <span class="text-xs px-2 py-1 bg-gray-700 text-gray-300 rounded-full tag-hover">CNN</span> | |
| </div> | |
| <div class="flex justify-between items-center text-sm text-gray-400"> | |
| <span><i data-feather="calendar" class="w-4 h-4 inline mr-1"></i> Jan 2023</span> | |
| <span><i data-feather="download" class="w-4 h-4 inline mr-1"></i> 1.2k</span> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Card 2 --> | |
| <div class="bg-gray-800 rounded-lg overflow-hidden shadow-lg border border-gray-700 card-hover"> | |
| <div class="p-4"> | |
| <div class="flex items-center mb-4"> | |
| <img src="http://static.photos/science/320x240/2" alt="Project Icon" class="w-12 h-12 rounded-lg object-cover mr-4"> | |
| <div> | |
| <h3 class="text-lg font-semibold text-white">NLP Transformer</h3> | |
| <p class="text-sm text-gray-400">by AI Labs</p> | |
| </div> | |
| </div> | |
| <p class="text-gray-300 mb-4">State-of-the-art natural language processing model for text classification and generation tasks.</p> | |
| <div class="flex flex-wrap gap-2 mb-4"> | |
| <span class="text-xs px-2 py-1 bg-gray-700 text-gray-300 rounded-full tag-hover">NLP</span> | |
| <span class="text-xs px-2 py-1 bg-gray-700 text-gray-300 rounded-full tag-hover">TensorFlow</span> | |
| <span class="text-xs px-2 py-1 bg-gray-700 text-gray-300 rounded-full tag-hover">Transformer</span> | |
| </div> | |
| <div class="flex justify-between items-center text-sm text-gray-400"> | |
| <span><i data-feather="calendar" class="w-4 h-4 inline mr-1"></i> Mar 2023</span> | |
| <span><i data-feather="download" class="w-4 h-4 inline mr-1"></i> 3.4k</span> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Card 3 --> | |
| <div class="bg-gray-800 rounded-lg overflow-hidden shadow-lg border border-gray-700 card-hover"> | |
| <div class="p-4"> | |
| <div class="flex items-center mb-4"> | |
| <img src="http://static.photos/abstract/320x240/3" alt="Project Icon" class="w-12 h-12 rounded-lg object-cover mr-4"> | |
| <div> | |
| <h3 class="text-lg font-semibold text-white">Reinforcement RL</h3> | |
| <p class="text-sm text-gray-400">by Robotics Team</p> | |
| </div> | |
| </div> | |
| <p class="text-gray-300 mb-4">Deep reinforcement learning framework for autonomous robotics applications.</p> | |
| <div class="flex flex-wrap gap-2 mb-4"> | |
| <span class="text-xs px-2 py-1 bg-gray-700 text-gray-300 rounded-full tag-hover">RL</span> | |
| <span class="text-xs px-2 py-1 bg-gray-700 text-gray-300 rounded-full tag-hover">PyTorch</span> | |
| <span class="text-xs px-2 py-1 bg-gray-700 text-gray-300 rounded-full tag-hover">Robotics</span> | |
| </div> | |
| <div class="flex justify-between items-center text-sm text-gray-400"> | |
| <span><i data-feather="calendar" class="w-4 h-4 inline mr-1"></i> Nov 2022</span> | |
| <span><i data-feather="download" class="w-4 h-4 inline mr-1"></i> 876</span> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Card 4 --> | |
| <div class="bg-gray-800 rounded-lg overflow-hidden shadow-lg border border-gray-700 card-hover"> | |
| <div class="p-4"> | |
| <div class="flex items-center mb-4"> | |
| <img src="http://static.photos/medical/320x240/4" alt="Project Icon" class="w-12 h-12 rounded-lg object-cover mr-4"> | |
| <div> | |
| <h3 class="text-lg font-semibold text-white">MedImage AI</h3> | |
| <p class="text-sm text-gray-400">by HealthTech</p> | |
| </div> | |
| </div> | |
| <p class="text-gray-300 mb-4">Medical image analysis for early detection of abnormalities in X-ray scans.</p> | |
| <div class="flex flex-wrap gap-2 mb-4"> | |
| <span class="text-xs px-2 py-1 bg-gray-700 text-gray-300 rounded-full tag-hover">Healthcare</span> | |
| <span class="text-xs px-2 py-1 bg-gray-700 text-gray-300 rounded-full tag-hover">TensorFlow</span> | |
| <span class="text-xs px-2 py-1 bg-gray-700 text-gray-300 rounded-full tag-hover">Medical AI</span> | |
| </div> | |
| <div class="flex justify-between items-center text-sm text-gray-400"> | |
| <span><i data-feather="calendar" class="w-4 h-4 inline mr-1"></i> Feb 2023</span> | |
| <span><i data-feather="download" class="w-4 h-4 inline mr-1"></i> 2.1k</span> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Card 5 --> | |
| <div class="bg-gray-800 rounded-lg overflow-hidden shadow-lg border border-gray-700 card-hover"> | |
| <div class="p-4"> | |
| <div class="flex items-center mb-4"> | |
| <img src="http://static.photos/finance/320x240/5" alt="Project Icon" class="w-12 h-12 rounded-lg object-cover mr-4"> | |
| <div> | |
| <h3 class="text-lg font-semibold text-white">Stock Predictor</h3> | |
| <p class="text-sm text-gray-400">by FinTech AI</p> | |
| </div> | |
| </div> | |
| <p class="text-gray-300 mb-4">Time series forecasting model for stock market predictions with LSTM architecture.</p> | |
| <div class="flex flex-wrap gap-2 mb-4"> | |
| <span class="text-xs px-2 py-1 bg-gray-700 text-gray-300 rounded-full tag-hover">Finance</span> | |
| <span class="text-xs px-2 py-1 bg-gray-700 text-gray-300 rounded-full tag-hover">TensorFlow</span> | |
| <span class="text-xs px-2 py-1 bg-gray-700 text-gray-300 rounded-full tag-hover">LSTM</span> | |
| </div> | |
| <div class="flex justify-between items-center text-sm text-gray-400"> | |
| <span><i data-feather="calendar" class="w-4 h-4 inline mr-1"></i> Dec 2022</span> | |
| <span><i data-feather="download" class="w-4 h-4 inline mr-1"></i> 1.5k</span> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Card 6 --> | |
| <div class="bg-gray-800 rounded-lg overflow-hidden shadow-lg border border-gray-700 card-hover"> | |
| <div class="p-4"> | |
| <div class="flex items-center mb-4"> | |
| <img src="http://static.photos/education/320x240/6" alt="Project Icon" class="w-12 h-12 rounded-lg object-cover mr-4"> | |
| <div> | |
| <h3 class="text-lg font-semibold text-white">EduChatbot</h3> | |
| <p class="text-sm text-gray-400">by EduTech</p> | |
| </div> | |
| </div> | |
| <p class="text-gray-300 mb-4">Conversational AI assistant for educational content delivery and student support.</p> | |
| <div class="flex flex-wrap gap-2 mb-4"> | |
| <span class="text-xs px-2 py-1 bg-gray-700 text-gray-300 rounded-full tag-hover">NLP</span> | |
| <span class="text-xs px-2 py-1 bg-gray-700 text-gray-300 rounded-full tag-hover">PyTorch</span> | |
| <span class="text-xs px-2 py-1 bg-gray-700 text-gray-300 rounded-full tag-hover">Chatbot</span> | |
| </div> | |
| <div class="flex justify-between items-center text-sm text-gray-400"> | |
| <span><i data-feather="calendar" class="w-4 h-4 inline mr-1"></i> Apr 2023</span> | |
| <span><i data-feather="download" class="w-4 h-4 inline mr-1"></i> 987</span> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Pagination --> | |
| <div class="mt-12 flex justify-center"> | |
| <nav class="inline-flex rounded-md shadow"> | |
| <a href="#" class="px-3 py-2 rounded-l-md border border-gray-700 bg-gray-800 text-sm font-medium text-gray-300 hover:bg-gray-700"> | |
| Previous | |
| </a> | |
| <a href="#" class="px-3 py-2 border-t border-b border-gray-700 bg-undefined-500 text-sm font-medium text-white"> | |
| 1 | |
| </a> | |
| <a href="#" class="px-3 py-2 border border-gray-700 bg-gray-800 text-sm font-medium text-gray-300 hover:bg-gray-700"> | |
| 2 | |
| </a> | |
| <a href="#" class="px-3 py-2 border border-gray-700 bg-gray-800 text-sm font-medium text-gray-300 hover:bg-gray-700"> | |
| 3 | |
| </a> | |
| <a href="#" class="px-3 py-2 rounded-r-md border border-gray-700 bg-gray-800 text-sm font-medium text-gray-300 hover:bg-gray-700"> | |
| Next | |
| </a> | |
| </nav> | |
| </div> | |
| </main> | |
| <!-- Footer --> | |
| <footer class="bg-gray-800 border-t border-gray-700 mt-12"> | |
| <div class="max-w-7xl mx-auto px-4 sm:px-6 | |
| </body> | |
| </html> |