Scribd
Upload
7 views5 pages

Dashboard

This PHP document creates a dashboard for a user logged into the Smart BodaBoda System. It checks if the user is logged in, retrieves user information from the session, and displays a welcome message along with the user's role and username. The page includes a logout button and is styled with CSS for a visually appealing layout.

Uploaded by

Evans Mwaura
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
7 views5 pages

Dashboard

This PHP document creates a dashboard for a user logged into the Smart BodaBoda System. It checks if the user is logged in, retrieves user information from the session, and displays a welcome message along with the user's role and username. The page includes a logout button and is styled with CSS for a visually appealing layout.

Uploaded by

Evans Mwaura
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 5

<?

php

session_start();

// If user is not logged in, redirect to login page

if (!isset($_SESSION['username'])) {

header("Location: login.php");

exit();

$fullname = $_SESSION['fullname'];

$role = ucfirst($_SESSION['role']);

$username = $_SESSION['username'];

?>

<!DOCTYPE html>

<html>

<head>

<title>Dashboard | Smart BodaBoda System</title>

<style>

body {

font-family: 'Poppins', sans-serif;

margin: 0;

height: 100vh;

background: linear-gradient(135deg, rgba(0,176,155,0.8), rgba(150,201,61,0.8)),

url('https://images.unsplash.com/photo-1602503008533-0fce7f7af406?
auto=format&fit=crop&w=1500&q=80') no-repeat center center/cover;
display: flex;

justify-content: center;

align-items: center;

color: #fff;

.container {

background: rgba(0, 0, 0, 0.6);

padding: 40px;

border-radius: 15px;

box-shadow: 0 6px 20px rgba(0, 0, 0, 0.3);

width: 400px;

text-align: center;

animation: fadeIn 1s ease-in-out;

.logo {

width: 100px;

border-radius: 50%;

border: 2px solid #fff;

margin-bottom: 15px;

h2 {

color: #fff;
margin-bottom: 10px;

p{

color: #ddd;

font-size: 0.95em;

.role {

background-color: #00b09b;

color: white;

display: inline-block;

padding: 5px 15px;

border-radius: 20px;

font-size: 0.9em;

margin-top: 5px;

.logout-btn {

background-color: #ff3b3b;

color: white;

border: none;

padding: 10px 20px;

border-radius: 8px;

cursor: pointer;
margin-top: 20px;

font-weight: bold;

transition: 0.3s;

.logout-btn:hover {

background-color: #cc2e2e;

@keyframes fadeIn {

from {opacity: 0; transform: translateY(-20px);}

to {opacity: 1; transform: translateY(0);}

</style>

</head>

<body>

<div class="container">

<!-- Real BodaBoda motorcycle photo -->

<img src="https://images.unsplash.com/photo-1602503008533-0fce7f7af406?
auto=format&fit=crop&w=500&q=80"

alt="BodaBoda Motorcycle" class="logo">

<h2>Welcome, <?php echo htmlspecialchars($fullname); ?> 👋</h2>

<p>You are logged in as <span class="role"><?php echo htmlspecialchars($role); ?></span></p>

<p>Your username: <strong><?php echo htmlspecialchars($username); ?></strong></p>


<form action="logout.php" method="POST">

<input type="submit" value="Logout" class="logout-btn">

</form>

</div>

</body>

</html>

You might also like