Globaly-CSS-Practice/admin_panel.php

<?php
require 'php/connect.inc.php';

$con = mysqli_connect($mysql_host, $mysql_user, $mysql_pass);
if (mysqli_select_db($con, $mysql_db)) {

    // Check if delete request is made
    if (isset($_POST['delete_email'])) {
        $delete_email = $_POST['delete_email'];
        $delete_query = "DELETE FROM `globaly_accounts` WHERE `email` = '".mysqli_real_escape_string($con, $delete_email)."'";
        mysqli_query($con, $delete_query);
    }

    $query = "SELECT `name`, `surname`, `email`, `birth_day`, `birth_month`, `birth_year`, `city` FROM `globaly_accounts`";
    $query_run = mysqli_query($con, $query);

    if (mysqli_num_rows($query_run) > 0) {
        echo '<table border="1">
                <tr>
                    <th>Name</th>
                    <th>Surname</th>
                    <th>Email</th>
                    <th>Birth Date</th>
                    <th>City</th>
                    <th>Edit</th>
                </tr>';

        while ($query_row = mysqli_fetch_assoc($query_run)) {
            $name = $query_row['name'];
            $surname = $query_row['surname'];
            $email = $query_row['email'];
            $birth_date = $query_row['birth_day'] . '.' . $query_row['birth_month'] . '.' . $query_row['birth_year'] . '.';
            $city = $query_row['city'];

            echo '<tr>
                    <td>' . htmlspecialchars($name) . '</td>
                    <td>' . htmlspecialchars($surname) . '</td>
                    <td>' . htmlspecialchars($email) . '</td>
                    <td>' . htmlspecialchars($birth_date) . '</td>
                    <td>' . htmlspecialchars($city) . '</td>
                    <td id="edit-td">
                        <form id="delete-form" method="POST" action="">
                            <input type="hidden" name="delete_email" value="' . htmlspecialchars($email) . '">
                            <button id="delete-btn" type="submit"><i class="fa-regular fa-circle-xmark"></i></button>
                        </form>
                         <a id="edit-user" href="edit-user.php?name=' . urlencode($name) . '&surname=' . urlencode($surname) . '&email=' . urlencode($email) . '&birth_day=' . urlencode($query_row['birth_day']) . '&birth_month=' . urlencode($query_row['birth_month']) . '&birth_year=' . urlencode($query_row['birth_year'])  . '&city=' . urlencode($query_row['city']) . '"><i class="fa-solid fa-user-pen"></i></a>
                    </td>
                  </tr>';
        }

        echo '</table>';
    } else {
        echo 'No results found.';
    }
} else {
    echo 'Database selection failed.';
}

mysqli_close($con);
?>


<style>
    body{
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: start;
        background-image: url('assets/images/image10.jpg');
        height: 100%; 
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
    }
    #edit-td{
        display: flex;
    }


    #delete-btn{
        background: transparent;
        border: none;
        font-size: 25px;

    }
    #delete-form{
        margin-bottom: 0px;
    }

    #edit-user{
        color: black;
    }

    .fa-regular{
        cursor: pointer;
    }

    .fa-regular:hover{
        color: red;
        transition: 0.2s;
    }

    .fa-solid{
        cursor: pointer;
    }

    .fa-solid:hover{
        color: green;
        transition: 0.2s;
    }
    
    h2{
        color: #15c1cb;
        font-size: 15px;
    }
    table {
        font-size: 8px;
        width: fit-content;
        border-collapse: collapse;
    }
    table, th, td {
        border: 1px solid black;
        background-color: #f2f2f2;
        
    }
    th, td {
        padding: 8px;
        text-align: left;
    }
    th {
        background-color: #f2f2f2;
        color: #15c1cb;
    }
    #btn-back{
        margin-top:30px;
    }

    @media screen and (min-width:768px) {
        body{
        justify-content: center;
        }
        table{
            font-size: 17px;
        }
        h2{
            font-size: 40px;
        }
    }

    @media screen and (min-width:992px) {
        body{

            justify-content: center;
        }
        table{
            font-size: 25px;
        }
        h2{
            font-size: 40px;
        }
    }
</style>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Search people</title>
    <link rel="stylesheet" href="style/style.css">
    <script src="https://kit.fontawesome.com/4bb6479073.js" crossorigin="anonymous"></script>

</head>
<body>
    <div  id="btn-back">
        <a href="index.php"><input class="view-more" type="submit" value="Back"></a>
        <a href="add_user.php"><input class="view-more" type="submit" value="Add user"></a>
    </div>
</body>
</html>