update sidebar

This commit is contained in:
2026-04-08 06:44:02 -05:00
parent e226ee859e
commit fc9587528d
2 changed files with 177 additions and 181 deletions

View File

@@ -337,196 +337,20 @@
</div>
<!-- New graph -->
<div class="row">
<div class="row"> <!-- This section creates the links at the top separated by a / -->
<nav aria-label="breadcrumb">
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="#">Home</a></li>
<li class="breadcrumb-item active" aria-current="page">Overview</li>
<li class="breadcrumb-item active" aria-current="/dashboard">Overview</li>
</ol>
</nav>
<p>This is the homepage of a simple admin interface which is part of a tutorial written on Themesberg</p>
</div>
<!-- This section yields to the content -->
@yield('content')
<div class="row my-4">
<div class="col-12 col-md-6 col-lg-3 mb-4 mb-lg-0">
<div class="card">
<h5 class="card-header">Customers</h5>
<div class="card-body">
<h5 class="card-title">345k</h5>
<p class="card-text">Feb 1 - Apr 1, United States</p>
<p class="card-text text-success">18.2% increase since last month</p>
</div>
</div>
</div>
<div class="col-12 col-md-6 mb-4 mb-lg-0 col-lg-3">
<div class="card">
<h5 class="card-header">Revenue</h5>
<div class="card-body">
<h5 class="card-title">$2.4k</h5>
<p class="card-text">Feb 1 - Apr 1, United States</p>
<p class="card-text text-success">4.6% increase since last month</p>
</div>
</div>
</div>
<div class="col-12 col-md-6 mb-4 mb-lg-0 col-lg-3">
<div class="card">
<h5 class="card-header">Purchases</h5>
<div class="card-body">
<h5 class="card-title">43</h5>
<p class="card-text">Feb 1 - Apr 1, United States</p>
<p class="card-text text-danger">2.6% decrease since last month</p>
</div>
</div>
</div>
<div class="col-12 col-md-6 mb-4 mb-lg-0 col-lg-3">
<div class="card">
<h5 class="card-header">Traffic</h5>
<div class="card-body">
<h5 class="card-title">64k</h5>
<p class="card-text">Feb 1 - Apr 1, United States</p>
<p class="card-text text-success">2.5% increase since last month</p>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-12 col-xl-8 mb-4 mb-lg-0">
<div class="card">
<h5 class="card-header">Latest transactions</h5>
<div class="card-body">
<div class="table-responsive">
<table class="table">
<thead>
<tr>
<th scope="col">Order</th>
<th scope="col">Product</th>
<th scope="col">Customer</th>
<th scope="col">Total</th>
<th scope="col">Date</th>
<th scope="col"></th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row">17371705</th>
<td>Volt Premium Bootstrap 5 Dashboard</td>
<td>johndoe@gmail.com</td>
<td>€61.11</td>
<td>Aug 31 2020</td>
<td><a href="#" class="btn btn-sm btn-primary">View</a></td>
</tr>
<tr>
<th scope="row">17370540</th>
<td>Pixel Pro Premium Bootstrap UI Kit</td>
<td>jacob.monroe@company.com</td>
<td>$153.11</td>
<td>Aug 28 2020</td>
<td><a href="#" class="btn btn-sm btn-primary">View</a></td>
</tr>
<tr>
<th scope="row">17371705</th>
<td>Volt Premium Bootstrap 5 Dashboard</td>
<td>johndoe@gmail.com</td>
<td>€61.11</td>
<td>Aug 31 2020</td>
<td><a href="#" class="btn btn-sm btn-primary">View</a></td>
</tr>
<tr>
<th scope="row">17370540</th>
<td>Pixel Pro Premium Bootstrap UI Kit</td>
<td>jacob.monroe@company.com</td>
<td>$153.11</td>
<td>Aug 28 2020</td>
<td><a href="#" class="btn btn-sm btn-primary">View</a></td>
</tr>
<tr>
<th scope="row">17371705</th>
<td>Volt Premium Bootstrap 5 Dashboard</td>
<td>johndoe@gmail.com</td>
<td>€61.11</td>
<td>Aug 31 2020</td>
<td><a href="#" class="btn btn-sm btn-primary">View</a></td>
</tr>
<tr>
<th scope="row">17370540</th>
<td>Pixel Pro Premium Bootstrap UI Kit</td>
<td>jacob.monroe@company.com</td>
<td>$153.11</td>
<td>Aug 28 2020</td>
<td><a href="#" class="btn btn-sm btn-primary">View</a></td>
</tr>
</tbody>
</table>
</div>
<a href="#" class="btn btn-block btn-light">View all</a>
</div>
</div>
</div>
<div class="col-12 col-xl-4">
<div class="card">
<h5 class="card-header">Traffic last 6 months</h5>
<div class="card-body">
<div id="traffic-chart"></div>
</div>
</div>
</div>
</div>
</div>
<div class="my-3 p-3 bg-body rounded shadow-sm">
<h6 class="border-bottom pb-2 mb-0">Recent updates</h6>
<div class="d-flex text-body-secondary pt-3">
<svg class="bd-placeholder-img flex-shrink-0 me-2 rounded" width="32" height="32"
xmlns="http://www.w3.org/2000/svg" role="img" aria-label="Placeholder: 32x32"
preserveAspectRatio="xMidYMid slice" focusable="false">
<title>Placeholder</title>
<rect width="100%" height="100%" fill="#007bff" /><text x="50%" y="50%" fill="#007bff"
dy=".3em">32x32</text>
</svg>
<p class="pb-3 mb-0 small lh-sm border-bottom">
<strong class="d-block text-gray-dark">@username</strong>
Some representative placeholder content, with some information about this user. Imagine this being some sort
of status update, perhaps?
</p>
</div>
<div class="d-flex text-body-secondary pt-3">
<svg class="bd-placeholder-img flex-shrink-0 me-2 rounded" width="32" height="32"
xmlns="http://www.w3.org/2000/svg" role="img" aria-label="Placeholder: 32x32"
preserveAspectRatio="xMidYMid slice" focusable="false">
<title>Placeholder</title>
<rect width="100%" height="100%" fill="#e83e8c" /><text x="50%" y="50%" fill="#e83e8c"
dy=".3em">32x32</text>
</svg>
<p class="pb-3 mb-0 small lh-sm border-bottom">
<strong class="d-block text-gray-dark">@username</strong>
Some more representative placeholder content, related to this other user. Another status update, perhaps.
</p>
</div>
<div class="d-flex text-body-secondary pt-3">
<svg class="bd-placeholder-img flex-shrink-0 me-2 rounded" width="32" height="32"
xmlns="http://www.w3.org/2000/svg" role="img" aria-label="Placeholder: 32x32"
preserveAspectRatio="xMidYMid slice" focusable="false">
<title>Placeholder</title>
<rect width="100%" height="100%" fill="#6f42c1" /><text x="50%" y="50%" fill="#6f42c1"
dy=".3em">32x32</text>
</svg>
<p class="pb-3 mb-0 small lh-sm border-bottom">
<strong class="d-block text-gray-dark">@username</strong>
This user also gets some representative placeholder content. Maybe they did something interesting, and you
really want to highlight this in the recent updates.
</p>
</div>
<small class="d-block text-end mt-3">
<a href="#">All updates</a>
</small>
</div>
<!-- Footer for end section -->
<div class="row">
<footer class="pt-5 d-flex justify-content-between">
<p class="col-md-4 mb-0 text-body-secondary">© Alliance-Services</p>
<a href="/" class="col-md-4 d-flex align-items-center justify-content-center mb-3 mb-md-0 me-md-auto link-body-emphasis text-decoration-none" aria-label="Bootstrap">
<svg class="bi me-2" width="40" height="32" aria-hidden="true"><use xlink:href="#bootstrap"></use></svg>
</a>
<ul class="nav col-md-4 justify-content-end">
<li class="nav-item"><a href="/dashboard" class="nav-link px-2 text-body-secondary">Home</a></li>
<li class="nav-item"><a href="#" class="nav-link px-2 text-body-secondary">FAQs</a></li>
@@ -538,7 +362,7 @@
</div>
</main>
<!-- end main -->
<!-- end main -->
<!-- offcanvas - heres is a copy of aside and must be the same, probably fixing later to not duplicate -->
<div class="offcanvas offcanvas-start" data-bs-scroll="true" tabindex="-1" id="offcanvasExample"