Database Connected Successfully
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/css/bootstrap.min.css" rel="stylesheet">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/js/bootstrap.bundle.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/font/bootstrap-icons.min.css">
<link rel="stylesheet" href="/notedemo/assets/css/style.css">

<header class="container-fluid">
    <div class="row m-0 align-items-center">

        <!-- LOGO -->
        <div class="col-lg-2 logo">
            <img src="/notedemo/assets/img/logo.png" alt="note bazar logo">
        </div>

        <!-- SEARCH -->
        <div class="col-lg-6">
            <div class="searchArea d-flex gap-2 align-items-center">
                <input type="search" name="search">
                <i class="fa-solid fa-magnifying-glass"></i>
            </div>
        </div>

        <!-- NAV -->
        <div class="navItems col-lg-4 d-flex align-items-center justify-content-end gap-4">

                        <a href="/notedemo/index.php">Home</a>
            
            
            <a href="/notedemo/login.php">Login</a>
            <a href="/notedemo/register.php">Register</a>

            
        </div>
    </div>
</header>
<link rel="stylesheet" href="./assets/css/style.css">

<div class="dashboard-layout" id="dashboardLayout">

    <main class="main container">


        <section class="mt-5 pt-3">
            <div class="text-center">
                <h1 class="m-0">Public Notes</h1>
            </div>
        </section>

        <!-- SEARCH + FILTER -->
        <div class="container mt-4">

            <form method="GET" class="d-flex mb-4">

                <!-- SEARCH -->
                <input type="text" name="search" class="form-control" placeholder="Search notes..."
                    value="">

                <!-- CATEGORY -->
                <select name="category" class="form-control ms-2">
                    <option value="">All Categories</option>

                                    </select>

                <!-- UPLOADER -->
                <select name="uploader" class="form-control ms-2">
                    <option value="">All Users</option>

                                    </select>

                <button class="btn btn-primary ms-2">Search</button>

            </form>

        </div>

        <!-- NOTES -->
        <div class="row">

            
            <p class="text-center">No notes found.</p>

            
        </div>

        <!-- PAGINATION -->
        <div class="pagination mt-4 pb-3 d-flex justify-content-center gap-2">

            
            
            
        </div>

    </main>
</div>
<div style="
    text-align:center;
    padding:25px 15px;
    background:linear-gradient(135deg, #0f172a, #1e293b);
    color:#e2e8f0;
    margin-top:40px;
    border-top:3px solid #38bdf8;
    font-family:Arial, sans-serif;
">

    <p style="margin:0; font-size:16px; font-weight:600; letter-spacing:0.5px;">
        📚 Note Sharing System
    </p>

    <p style="margin:8px 0; font-size:13px; color:#94a3b8;">
        Share Notes • Learn Faster • Build Knowledge
    </p>

    <p style="margin:0; font-size:13px; color:#cbd5e1;">
        © 2026 Note Sharing System | All Rights Reserved
    </p>

</div>

<!-- Bootstrap JS (keep single version only) -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/js/bootstrap.bundle.min.js"></script>