index.html

<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
    
    <link rel="stylesheet" href="./index.css">
    <title>MCRCON GUI</title>
</head>
<body>
    <div class="heading">
        <h1>MCRCON - GUI Edition</h1>
    </div>
    <div class="description">
        <p>A New and Innovative Way of Managing your Minecraft Server On The Go</p>
        <p>✨GUI Style✨</p>
    </div>
    <div class="imgshowcasecontainer">
        <div class="imgshowcase">
            <div id="carouselExample" class="carousel slide" data-bs-ride="carousel">
                <div class="carousel-inner">
                    <div class="carousel-item active">
                        <img src="app.png" class="d-block w-100" alt="Slide 1">
                        <div class="carousel-caption d-none d-md-block">
                            <h5>Caption for Slide 1</h5>
                            <p>Description for Slide 1.</p>
                        </div>
                    </div>
                    <div class="carousel-item">
                        <img src="./app2.png" class="d-block w-100" alt="Slide 2">
                        <div class="carousel-caption d-none d-md-block">
                            <h5>Caption for Slide 2</h5>
                            <p>Description for Slide 2.</p>
                        </div>
                    </div>
                    <div class="carousel-item">
                        <img src="app3.png" class="d-block w-100" alt="Slide 3">
                        <div class="carousel-caption d-none d-md-block">
                            <h5>Caption for Slide 3</h5>
                            <p>Description for Slide 3.</p>
                        </div>
                    </div>
                </div>
                <button class="carousel-control-prev" type="button" data-bs-target="#carouselExample" data-bs-slide="prev">
                    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                    <span class="visually-hidden">Previous</span>
                </button>
                <button class="carousel-control-next" type="button" data-bs-target="#carouselExample" data-bs-slide="next">
                    <span class="carousel-control-next-icon" aria-hidden="true"></span>
                    <span class="visually-hidden">Next</span>
                </button>
            </div>
        </div>
    </div>
    <div class="btn-container">
        <a href="https://github.com/Wasdeq68/MCRCON-GUI" style="text-align: center; display: block;">
            <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" fill="currentColor" class="bi bi-github" viewBox="0 0 16 16">
                <path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27s1.36.09 2 .27c1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.01 8.01 0 0 0 16 8c0-4.42-3.58-8-8-8"/>
            </svg> Github Repo
        </a>
        <a href="https://github.com/Wasdeq68/MCRCON-GUI" style="text-align: center; display: block;">Download</a>
        <a href="https://github.com/Wasdeq68/MCRCON-GUI" style="text-align: center; display: block;">Download</a>
    </div>
    
    <div class="features-container">
        <div>
            <h2>Server Management</h2>
            <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Neque numquam assumenda esse sit! Doloribus, sit!</p>
        </div>
        <div>
            <h2>FEATURE 2</h2>
            <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Id iste, voluptatibus velit obcaecati nulla veritatis.</p>
        </div>
        <div>
            <h2>FEATURE 3</h2>
            <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Similique nobis voluptate corporis delectus non deserunt.</p>
        </div>
        <div>
            <h2>Many More To Come</h2>
            <p>Each day, I strive to enhance the app, constantly adding and improving features for a better user experience.</p>
        </div>
    </div>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>
    
</body>
</html>