index.html


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Dashboard - EcoOps Platform</title>
    <link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet">
</head>
<body class="bg-gray-50">
    <nav class="bg-green-600 text-white p-4">
        <div class="container mx-auto">
            <div class="flex justify-between items-center">
                <h1 class="text-2xl font-bold">EcoOps Platform</h1>
                <div class="space-x-4">
                    
                <a href="index.html" class="px-4 py-2 text-green-100 border-b-2 border-green-100">
                    Dashboard
                </a>
            
                <a href="knowledge.html" class="px-4 py-2 text-green-200 hover:text-green-100">
                    Knowledge Transfer
                </a>
            
                <a href="projects.html" class="px-4 py-2 text-green-200 hover:text-green-100">
                    Project Tracking
                </a>
            
                <a href="tokens.html" class="px-4 py-2 text-green-200 hover:text-green-100">
                    Token Management
                </a>
            
                <a href="community.html" class="px-4 py-2 text-green-200 hover:text-green-100">
                    Community Hub
                </a>
            
                <a href="impact.html" class="px-4 py-2 text-green-200 hover:text-green-100">
                    Impact Analysis
                </a>
            
                </div>
            </div>
        </div>
    </nav>
    <main class="container mx-auto p-8">
        
        <div class="space-y-6">
            <div>
                <h2 class="text-3xl font-bold">Dashboard</h2>
                <p class="text-gray-600">Overall ecosystem operations status and metrics</p>
            </div>

            <div class="grid grid-cols-1 md:grid-cols-3 gap-6">
                <div class="bg-white p-6 rounded-lg shadow-sm">
                    <h3 class="font-semibold text-lg">Biodiversity Metrics</h3>
                    <div class="mt-4 space-y-2">
                        <div class="flex justify-between">
                            <span class="text-gray-600">Species Monitored</span>
                            <span class="font-bold">1,234</span>
                        </div>
                        <div class="flex justify-between">
                            <span class="text-gray-600">Active Regions</span>
                            <span class="font-bold">12</span>
                        </div>
                        <div class="flex justify-between">
                            <span class="text-gray-600">Conservation Status</span>
                            <span class="text-green-600 font-bold">Positive</span>
                        </div>
                    </div>
                </div>

                <div class="bg-white p-6 rounded-lg shadow-sm">
                    <h3 class="font-semibold text-lg">Knowledge Transfer</h3>
                    <div class="mt-4 space-y-2">
                        <div class="flex justify-between">
                            <span class="text-gray-600">Active Holders</span>
                            <span class="font-bold">45</span>
                        </div>
                        <div class="flex justify-between">
                            <span class="text-gray-600">Practices Documented</span>
                            <span class="font-bold">89</span>
                        </div>
                        <div class="flex justify-between">
                            <span class="text-gray-600">Verification Rate</span>
                            <span class="text-green-600 font-bold">92%</span>
                        </div>
                    </div>
                </div>

                <div class="bg-white p-6 rounded-lg shadow-sm">
                    <h3 class="font-semibold text-lg">Token Economy</h3>
                    <div class="mt-4 space-y-2">
                        <div class="flex justify-between">
                            <span class="text-gray-600">POAPs Issued</span>
                            <span class="font-bold">2,345</span>
                        </div>
                        <div class="flex justify-between">
                            <span class="text-gray-600">Active SBTs</span>
                            <span class="font-bold">567</span>
                        </div>
                        <div class="flex justify-between">
                            <span class="text-gray-600">NFT Collections</span>
                            <span class="font-bold">12</span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        
    </main>
    <footer class="bg-gray-800 text-white mt-8 py-6">
        <div class="container mx-auto px-4">
            <div class="text-center text-gray-400">
                <p>© 2024 EcoOps Platform - Generated: 2024-11-17</p>
            </div>
        </div>
    </footer>
</body>
</html>
        