Add basic bootstrap dashboard with sample data.
This commit is contained in:
@ -1,8 +1,73 @@
|
||||
<%~ E.includeFile("head.eta.html", {"title": "Bootstrap Demo Page"}) %>
|
||||
<%~ E.includeFile("partials/head.eta.html", {"title": "Bootstrap Demo Page"}) %>
|
||||
<%~ E.includeFile("partials/controls.eta.html", {"active": "Orders"}) %>
|
||||
|
||||
<div class="alert alert-primary" role="alert">
|
||||
A simple primary alert—check it out!
|
||||
|
||||
<h1>
|
||||
Good evening, ${user}
|
||||
</h1>
|
||||
<div class="container text-center">
|
||||
<div class="row">
|
||||
<div class="card col m-2">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title">+10</h5>
|
||||
<p class="card-text">New Stock</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card col m-2">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title">10</h5>
|
||||
<p class="card-text">Uncategorized items</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card col m-2">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title">Everything ok</h5>
|
||||
<p class="card-text">Instance Status</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="alert alert-light" role="alert">
|
||||
A new version is available. <a href="#" class="alert-link">Click here to update</a>
|
||||
</div>
|
||||
|
||||
<h2>Recent items</h2>
|
||||
<div class="container">
|
||||
<table class="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col">#</th>
|
||||
<th scope="col">Name</th>
|
||||
<th scope="col">Status</th>
|
||||
<th scope="col">SKU</th>
|
||||
<th scope="col">Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<th scope="row">1</th>
|
||||
<td>Samsung 65W USB-C Ladegerät</td>
|
||||
<td><span class="badge text-bg-success">Normal</span></td>
|
||||
<td>DB8031E8</td>
|
||||
<td><a href="#" class="btn btn-primary">Edit</a></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">2</th>
|
||||
<td>2.5mm Klinken Verlängerung 40mm</td>
|
||||
<td><span class="badge text-bg-success">Normal</span></td>
|
||||
<td>25A1E9DE</td>
|
||||
<td><a href="#" class="btn btn-primary">Edit</a></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th scope="row">3</th>
|
||||
<td>Elgato Streamdeck XL</td>
|
||||
<td><span class="badge text-bg-danger">Stolen</span></td>
|
||||
<td>9AF2388E</td>
|
||||
<td><a href="#" class="btn btn-primary">Edit</a></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<%~ E.includeFile("foot.eta.html") %>
|
||||
<%~ E.includeFile("partials/controlsFoot.eta.html") %>
|
||||
<%~ E.includeFile("partials/foot.eta.html") %>
|
||||
|
@ -1,4 +0,0 @@
|
||||
<script src="/static/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
|
||||
<script src="/static/@popperjs/core/dist/cjs/popper.js"></script>
|
||||
</body>
|
||||
</html>
|
6
src/frontend/index.eta.html
Normal file
6
src/frontend/index.eta.html
Normal file
@ -0,0 +1,6 @@
|
||||
<%~ E.includeFile("partials/head.eta.html", {"title": "Bootstrap Demo Page"}) %>
|
||||
<%~ E.includeFile("partials/controls.eta.html") %>
|
||||
|
||||
<div class="alert alert-primary" role="alert">A simple primary alert—check it out!</div>
|
||||
|
||||
<%~ E.includeFile("partials/foot.eta.html") %>
|
67
src/frontend/partials/controls.eta.html
Normal file
67
src/frontend/partials/controls.eta.html
Normal file
@ -0,0 +1,67 @@
|
||||
<header class="navbar navbar-dark sticky-top bg-dark flex-md-nowrap p-0 shadow">
|
||||
<a class="navbar-brand col-md-3 col-lg-2 me-0 px-3 test-white-50" href="#">AssetFlow</a>
|
||||
<button
|
||||
class="navbar-toggler position-absolute d-md-none collapsed"
|
||||
type="button"
|
||||
data-bs-toggle="collapse"
|
||||
data-bs-target="#sidebarMenu"
|
||||
aria-controls="sidebarMenu"
|
||||
aria-expanded="false"
|
||||
aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<input class="form-control form-control-dark w-100 bg-secondary" type="text" placeholder="Search" aria-label="Search" />
|
||||
<div class="navbar-nav">
|
||||
<div class="nav-item text-nowrap">
|
||||
<a class="nav-link px-3" href="#">Sign out</a>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="container-fluid">
|
||||
<div class="row">
|
||||
<nav id="sidebarMenu" class="col-md-3 col-lg-2 d-md-block bg-light sidebar collapse">
|
||||
<div class="position-sticky pt-3">
|
||||
<ul class="nav flex-column">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link active" aria-current="page" href="#"> Dashboard </a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#"> Orders </a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#"> Products </a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#"> Customers </a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#"> Reports </a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#"> Integrations </a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<h6 class="sidebar-heading d-flex justify-content-between align-items-center px-3 mt-4 mb-1 text-muted">
|
||||
<span>Saved reports</span>
|
||||
<a class="link-secondary" href="#" aria-label="Add a new report"> </a>
|
||||
</h6>
|
||||
<ul class="nav flex-column mb-2">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#"> Current month </a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#"> Last quarter </a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#"> Social engagement </a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#"> Year-end sale </a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<main class="col-md-9 ms-sm-auto col-lg-10 px-md-4">
|
3
src/frontend/partials/controlsFoot.eta.html
Normal file
3
src/frontend/partials/controlsFoot.eta.html
Normal file
@ -0,0 +1,3 @@
|
||||
</main>
|
||||
</div>
|
||||
</div>
|
5
src/frontend/partials/foot.eta.html
Normal file
5
src/frontend/partials/foot.eta.html
Normal file
@ -0,0 +1,5 @@
|
||||
<script src="/static/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
|
||||
<script src="/static/@popperjs/core/dist/umd/popper.min.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/feather-icons@4.28.0/dist/feather.min.js" integrity="sha384-uO3SXW5IuS1ZpFPKugNNWqTZRRglnUJK6UAZ/gxOX80nxEkN9NcGZTftn6RzhGWE" crossorigin="anonymous"></script>
|
||||
</body>
|
||||
</html>
|
@ -15,6 +15,7 @@
|
||||
<script src="/static/jquery/dist/jquery.min.js"></script>
|
||||
<link href="/static/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link href="/static/bootstrap-icons/font/bootstrap-icons.css" rel="stylesheet">
|
||||
<link href="css/dashboard.css" rel="stylesheet">
|
||||
|
||||
</head>
|
||||
<body>
|
Reference in New Issue
Block a user