aiden
<body class="bg-gray-100 font-sans leading-normal tracking-normal h-screen flex flex-col"> <header class="bg-white shadow-lg p-4 flex justify-between items-center"> <div class="flex items-center space-x-4"> <i class="iconoir-video text-2xl"></i> <span class="font-bold text-xl">Video Dashboard</span> </div> <div class="flex items-center space-x-4"> <button class="text-gray-700 hover:text-gray-900"> <i class="iconoir-search text-2xl"></i> </button> <button class="text-gray-700 hover:text-gray-900"> <i class="iconoir-user text-2xl"></i> </button> </div> </header> <div class="flex flex-1 overflow-hidden"> <aside class="bg-white w-64 p-4 border-r overflow-y-auto"> <h2 class="font-bold text-lg mb-4">Navigation</h2> <ul> <li class="mb-4"> <a href="#" class="flex items-center space-x-4 p-2 hover:bg-gray-200 rounded"> <i class="iconoir-home text-xl"></i> <span>Home</span> </a> </li> <li class="mb-4"> <a href="#" class="flex items-center space-x-4 p-2 hover:bg-gray-200 rounded"> <i class="iconoir-playlist text-xl"></i> <span>Playlists</span> </a> </li> <li class="mb-4"> <a href="#" class="flex items-center space-x-4 p-2 hover:bg-gray-200 rounded"> <i class="iconoir-chart text-xl"></i> <span>Statistics</span> </a> </li> <li class="mb-4"> <a href="#" class="flex items-center space-x-4 p-2 hover:bg-gray-200 rounded"> <i class="iconoir-settings text-xl"></i> <span>Settings</span> </a> </li> </ul> </aside> <main class="flex-1 flex flex-col p-4"> <h1 class="text-2xl font-bold mb-6">Video Statistics</h1> <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4"> <div class="bg-white p-4 rounded shadow"> <h2 class="font-bold text-lg">Total Views</h2> <p class="text-3xl text-blue-500">1,234,567</p> </div> <div class="bg-white p-4 rounded shadow"> <h2 class="font-bold text-lg">Likes</h2> <p class="text-3xl text-green-500">123,456</p> </div> <div class="bg-white p-4 rounded shadow"> <h2 class="font-bold text-lg">Dislikes</h2> <p class="text-3xl text-red-500">1,234</p> </div> <div class="bg-white p-4 rounded shadow"> <h2 class="font-bold text-lg">Comments</h2> <p class="text-3xl text-gray-700">12,345</p> </div> <div class="bg-white p-4 rounded shadow"> <h2 class="font-bold text-lg">Shares</h2> <p class="text-3xl text-purple-500">5,678</p> </div> <div class="bg-white p-4 rounded shadow"> <h2 class="font-bold text-lg">Watch Time (hrs)</h2> <p class="text-3xl text-orange-500">2,345</p> </div> </div> </main> </div> </body>