Scribd Logo
Upload

Welcome to Scribd!

  • 18 views

    Admin Dashboard

    Uploaded by

    C - k
    The document is an HTML code for an admin dashboard interface. It includes navigation menus on the left side for dashboard, users, statistics, and reports. The main section displays quick stats like daily, weekly, monthly, and yearly visitor counts. Charts also show visitor locations and data in tables.

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content

    You might also like

    Admin Dashboard

    Uploaded by

    C - k
    18 views6 pages
    The document is an HTML code for an admin dashboard interface. It includes navigation menus on the left side for dashboard, users, statistics, and reports. The main section displays quick stats like daily, weekly, monthly, and yearly visitor counts. Charts also show visitor locations and data in tables.

    Original Description:

    Copyright

    © © All Rights Reserved

    Available Formats

    PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document
    The document is an HTML code for an admin dashboard interface. It includes navigation menus on the left side for dashboard, users, statistics, and reports. The main section displays quick stats like daily, weekly, monthly, and yearly visitor counts. Charts also show visitor locations and data in tables.

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content
    Download as pdf or txt
    18 views6 pages

    Admin Dashboard

    Uploaded by

    C - k
    The document is an HTML code for an admin dashboard interface. It includes navigation menus on the left side for dashboard, users, statistics, and reports. The main section displays quick stats like daily, weekly, monthly, and yearly visitor counts. Charts also show visitor locations and data in tables.

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content
    Download as pdf or txt
    of 6

    <!

    DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Admin Dashboard</title>
    <link
    href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css"
    rel="stylesheet" integrity="sha384-
    EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC"
    crossorigin="anonymous">
    <script src="https://kit.fontawesome.com/98dfc436c4.js"
    crossorigin="anonymous"></script>
    </head>
    <body>
    <div class="container-fluid">
    <div class="row g-0">
    <nav class="col-2 bg-light pe-3">
    <h1 class="h4 text-center text-primary py-3">
    <i class="fas fa-ghost me-2"></i>
    <span class="d-none d-lg-inline">Ghost Admin</span>
    </h1>

    <div class="list-group text-center text-lg-start">


    <span class="list-group-item disabled d-none d-lg-block">
    <small>CONTROLS</small>
    </span>
    <a href="#" class="list-group-item list-group-item-action
    active">
    <i class="fas fa-home"></i>
    <span class="d-none d-lg-inline">Dashboard</span>
    </a>
    <a href="#" class="list-group-item list-group-item-action">
    <i class="fas fa-users"></i>
    <span class="d-none d-lg-inline">Users</span>
    </a>
    <a href="#" class="list-group-item list-group-item-action">
    <i class="fas fa-chart-line"></i>
    <span class="d-none d-lg-inline">Statistics</span>
    </a>
    <a href="#" class="list-group-item list-group-item-action">
    <i class="fas fa-flag"></i>
    <span class="d-none d-lg-inline">Reports</span>
    </a>
    </div>

    <div class="list-group mt-4 text-center text-lg-start">


    <span class="list-group-item d-none d-lg-block disabled">
    <small>ACTIONS</small>
    </span>
    <a href="#" class="list-group-item list-group-item-action">
    <i class="fas fa-user"></i>
    <span class="d-none d-lg-inline">New User</span>
    </a>
    <a href="#" class="list-group-item list-group-item-action">
    <i class="fas fa-edit"></i>
    <span class="d-none d-lg-inline">Update Data</span>
    </a>
    <a href="#" class="list-group-item list-group-item-action">
    <i class="fas fa-calendar-alt"></i>
    <span class="d-none d-lg-inline">Add Event</span>
    </a>
    </div>
    </nav>

    <main class="col-10 bg-secondary">


    <div class="container-fluid">
    <nav class="navbar navbar-expand-lg navbar-light bg-light">
    <div class="flex-fill"></div>

    <div class="navbar nav">


    <li class="nav-item dropdown">
    <a href="#" class="nav-link dropdown-toggle"
    data-bs-toggle="dropdown">
    <i class="fas fa-user-circle"></i>
    </a>
    <ul class="dropdown-menu">
    <li><a href="#" class="dropdown-item">User
    Profile</a></li>
    <li><a href="#" class="dropdown-
    item">Logout</a></li>
    </ul>
    </li>

    <li class="nav-item">
    <a href="#" class="nav-link">
    <i class="fas fa-cog"></i>
    </a>
    </li>
    </div>
    </nav>
    </div>

    <div class="container-fluid mt-3 p-4">

    <div class="row">
    <div class="col">
    <div class="alert alert-info">
    The New version of admin dashboard is released.
    <a href="#"><i class="fas
    fadownload"></i>Download Now!</a>
    </div>
    </div>
    </div>

    <div class="row flex-column flex-lg-row">


    <h2 class="h6 text-white-50">QUICKS STAT</h2>
    <div class="col">
    <div class="card mb-3">
    <div class="card-body">
    <h2 class="card-title h2">1,203</h2>
    <span class="text-success">
    <i class="fas fa-chart-line"></i>
    Daily Visitors
    </span>
    </div>
    </div>
    </div>
    <div class="col">
    <div class="card mb-3">
    <div class="card-body">
    <h2 class="card-tilte h2">8,431</h2>
    <span class="text-success">
    <i class="fas fa-chart-line"></i>
    Weekly Visitors
    </span>
    </div>
    </div>
    </div>
    <div class="col">
    <div class="card mb-3">
    <div class="card-body">
    <h2 class="card-title h2">35,680</h2>
    <span class="text-success">
    <i class="fas fa-chart-line"></i>
    Monthly Visitors
    </span>
    </div>
    </div>
    </div>
    <div class="col">
    <div class="card mb-3">
    <div class="card-body">
    <h2 class="card-title h2">103,204</h2>
    <span class="text-success">
    <i class="fas fa-chart-line"></i>
    Yearly Visitors
    </span>
    </div>
    </div>
    </div>
    </div>

    <div class="row flex-column flex-lg-row mt-4">


    <div class="col">
    <h2 class="h6 text-white-50">LOCATION</h2>

    <div class="card mb-3" style="height: 280px;">


    <div class="card-body">
    <small class="text-muted">Regional</small>
    <div class="progress mt-2 mb-4"
    style="height: 5px;">
    <div class="progress-bar bg-success w-
    75"></div>
    </div>

    <small class="text-muted">Global</small>
    <div class="progress mt-2 mb-4"
    style="height: 5px;">
    <div class="progress-bar bg-primary w-
    50"></div>
    </div>

    <small class="text-muted">Local</small>
    <div class="progress mt-2 mb-4"
    style="height: 5px;">
    <div class="progress-bar bg-danger w-
    75"></div>
    </div>

    <small class="text-muted">Internal</small>
    <div class="progress mt-2 mb-4"
    style="height: 5px;">
    <div class="progress-bar bg-info w-
    25"></div>
    </div>
    </div>
    </div>
    </div>

    <div class="col">
    <h2 class="h6 text-white-50">DATA</h2>
    <div class="card mb-3" style="height: 280px;">
    <div class="text-end">
    <button class="btn btn-sm btn-outline-
    secondary">
    <i class="fas fa-search"></i>
    </button>
    <button class="btn btn-sm btn-outline-
    secondary">
    <i class="fas fa-sort-amount-up"></i>
    </button>
    <button class="btn btn-sm btn-outline-
    secondary">
    <i class="fas fa-filter"></i>
    </button>
    </div>

    <table class="table text-center">


    <tr>
    <th>ID</th>
    <th>Age Group</th>
    <th>Data</th>
    <th>Progress</th>
    </tr>
    <tr>
    <td>1</td>
    <td>20-30</td>
    <td>19%</td>
    <td><i class="fas fa-chart-pie"></i></td>
    </tr>
    <tr>
    <td>2</td>
    <td>30-40</td>
    <td>40%</td>
    <td><i class="fas fa-chart-bar"></i></td>
    </tr>
    <tr>
    <td>3</td>
    <td>40-50</td>
    <td>20%</td>
    <td><i class="fas fa-chart-
    line"></i></td>
    </tr>
    <tr>
    <td>4</td>
    <td>>50</td>
    <td>11%</td>
    <td><i class="fas fa-chart-pie"></i></td>
    </tr>
    </table>
    </div>
    </div>
    </div>

    </div>
    </main>
    <footer>
    <div class="text-center text-muted py-4">
    &copy; Copyright 2022
    </div>
    </footer>
    </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>
    Admin Dashboard sample project pdf file.

    You might also like