index.html

<!DOCTYPE html>
<html>

<head>
    <title>Index</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script src="https://cdn.tailwindcss.com?plugins=forms,typography,aspect-ratio,line-clamp"></script>
</head>

<body>
    <!-- Header -->
    <header class="text-gray-400 bg-gray-900 body-font">
        <div class="container mx-auto flex flex-wrap p-5 flex-col md:flex-row items-center">
            <a class="flex title-font font-medium items-center text-white mb-4 md:mb-0">
                <svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" stroke-linecap="round"
                    stroke-linejoin="round" stroke-width="2" width="24" height="24" viewBox="0 0 24 24"
                    class="h-10 w-10 p-2 text-red-500" viewBox="0 0 24 24">
                    <path d="M6 4h11a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-11a1 1 0 0 1 -1 -1v-14a1 1 0 0 1 1 -1m3 0v18">
                    </path>
                </svg>
                <span class="ml-3 text-xl">&lt;html/&gt;</span>
            </a>
            <nav class="md:ml-auto md:mr-auto flex flex-wrap items-center text-base justify-center">
                <a class="mr-2 hover:text-gray-900" href="index.html">Home</a>
                <a class="mr-2 hover:text-gray-900" href="Sem_3/project_6/index.html" alt="soon">About</a>
            </nav>
        </div>
    </header>

    <!-- Main Content -->
    <section class="text-gray-400 bg-gray-900 body-font">
        <div class="container px-5 py-24 mx-auto">
            <div class="flex flex-wrap -m-4">
                <div class="p-4 md:w-1/3">
                    <div class="h-full border-2 border-gray-800 rounded-lg overflow-hidden">
                        <img class="lg:h-48 md:h-36 w-full object-cover object-center"
                            src="https://dummyimage.com/720x400" alt="blog">
                        <div class="p-6">
                            <h2>Completed</h2>
                            <h1 class="title-font text-lg font-medium text-white mb-3">Sem 3</h1>
                            <p class="leading-relaxed mb-3">Completed</p>
                            <div class="flex items-center flex-wrap ">
                                <a href="Sem_3.html"
                                    class="text-red-400 inline-flex items-center md:mb-2 lg:mb-0">Check the Project
                                    <svg class="w-4 h-4 ml-2" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"
                                        fill="none" stroke-linecap="round" stroke-linejoin="round">
                                        <path d="M5 12h14"></path>
                                        <path d="M12 5l7 7-7 7"></path>
                                    </svg>
                                </a>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="p-4 md:w-1/3">
                    <div class="h-full border-2 border-gray-800 rounded-lg overflow-hidden">
                        <img class="lg:h-48 md:h-36 w-full object-cover object-center"
                            src="https://dummyimage.com/721x401" alt="blog">
                        <div class="p-6">
                            <h2>Ongoing</h2>
                            <h1 class="title-font text-lg font-medium text-white mb-3">Sem 4</h1>
                            <p class="leading-relaxed mb-3"></p>
                            <div class="flex items-center flex-wrap">
                                <a href="Sem_4.html"
                                    class="text-red-400 inline-flex items-center md:mb-2 lg:mb-0">Check the Project
                                    <svg class="w-4 h-4 ml-2" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"
                                        fill="none" stroke-linecap="round" stroke-linejoin="round">
                                        <path d="M5 12h14"></path>
                                        <path d="M12 5l7 7-7 7"></path>
                                    </svg>
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
</body>

</html>