CLONE UI

A table to display assignements for students

a table to display assignements for students 465 days ago
<div class="bg-gray-200 py-8">
<div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
<h2 class="text-3xl font-bold text-gray-800 mb-4">Assignments</h2>
<div class="bg-white overflow-hidden shadow-md sm:rounded-lg">
<table class="w-full divide-y divide-gray-200">
<thead class="bg-gray-50">
<tr>
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Student Name</th>
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Assignment Name</th>
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Due Date</th>
<th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Status</th>
</tr>
</thead>
<tbody class="divide-y divide-gray-200">
<tr>
<td class="px-6 py-4">
<div class="flex items-center">
<div class="flex-shrink-0 h-10 w-10">
<img class="h-10 w-10 rounded-full" src="https://placehold.co/50x50/eeeeee/4B5563/png?text=image" alt="">
</div>
<div class="ml-4">
<div class="text-sm font-medium text-gray-900">John Doe</div>
</div>
</div>
</td>
<td class="px-6 py-4">
<div class="text-sm text-gray-900">Math Assignment</div>
</td>
<td class="px-6 py-4">
<div class="text-sm text-gray-900">09/10/21</div>
</td>
<td class="px-6 py-4">
<span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-green-100 text-green-800">Completed</span>
</td>
</tr>
<tr>