mirror of https://github.com/ColorlibHQ/AdminLTE
minor bugs fixes (#5350)
Daniel
GitHub
parent
2f64c3da87
commit
7fe4beb503
|
|
@ -9,8 +9,8 @@ const year = new Date().getFullYear();
|
|||
<!--end::To the end-->
|
||||
<!--begin::Copyright-->
|
||||
<strong>
|
||||
Copyright © 2014-{year}
|
||||
<a href="https://adminlte.io">AdminLTE.io</a>.
|
||||
Copyright © 2014-{year}
|
||||
<a href="https://adminlte.io" class="text-decoration-none">AdminLTE.io</a>.
|
||||
</strong>
|
||||
All rights reserved.
|
||||
<!--end::Copyright-->
|
||||
|
|
|
|||
|
|
@ -63,7 +63,7 @@ const pageTitle = "General UI Elements";
|
|||
href="https://getbootstrap.com/docs/5.3/components/"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="fw-bold"
|
||||
class="callout-link"
|
||||
>
|
||||
Bootstrap Components
|
||||
</a>
|
||||
|
|
|
|||
|
|
@ -60,8 +60,10 @@ const page = "color-mode";
|
|||
<div class="callout callout-info">
|
||||
<h5 class="fw-bold">Tips</h5>
|
||||
<p>
|
||||
First Visit
|
||||
https://getbootstrap.com/docs/5.3/customize/color-modes/
|
||||
<a href="https://getbootstrap.com/docs/5.3/customize/color-modes/" target="_blank" rel="noopener noreferrer" class="callout-link">
|
||||
Color modes in Bootstrap
|
||||
</a> allow you to switch between light and dark modes. You can do this using the data-bs-theme attribute. You can also create your own custom color modes.
|
||||
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -59,8 +59,9 @@ const distPath = path;
|
|||
<h5 class="fw-bold">Reminder!</h5>
|
||||
<p>
|
||||
AdminLTE uses all of Bootstrap 5 components. It's a good start
|
||||
to review the [Bootstrap
|
||||
documentation](https://getbootstrap.com/) to get an idea of the
|
||||
to review the <a href="https://getbootstrap.com/" target="_blank" rel="noopener noreferrer" class="callout-link">
|
||||
Bootstrap documentation
|
||||
</a> to get an idea of the
|
||||
various components that this documentation <b>does not</b> cover.
|
||||
</p>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -55,7 +55,7 @@ const page = "layout";
|
|||
<div class="callout callout-info mb-4">
|
||||
<h5 class="fw-bold">Tips</h5>
|
||||
<p>
|
||||
The <a href="/starter.html" class="link-primary">
|
||||
The <a href="/starter.html" target="_blank" rel="noopener noreferrer" class="callout-link">
|
||||
starter page
|
||||
</a> is a good place to start building your app if you’d like to
|
||||
start from scratch.
|
||||
|
|
|
|||
|
|
@ -49,11 +49,11 @@ const year = new Date().getFullYear();
|
|||
Enter your password to retrieve your session
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<a href="login.html">Or sign in as a different user</a>
|
||||
<a href="login.html" class="text-decoration-none">Or sign in as a different user</a>
|
||||
</div>
|
||||
<div class="lockscreen-footer text-center">
|
||||
Copyright © 2014-{year}
|
||||
<b><a href="https://adminlte.io">AdminLTE.io</a></b><br />
|
||||
Copyright © 2014-{year}
|
||||
<b><a href="https://adminlte.io" class="link-primary link-offset-2 link-underline-opacity-25 link-underline-opacity-100-hover">AdminLTE.io</a></b> <br />
|
||||
All rights reserved
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -62,7 +62,7 @@ const page = "general";
|
|||
href="https://getbootstrap.com/docs/5.3/forms/overview/"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="fw-bold"
|
||||
class="callout-link"
|
||||
>
|
||||
Bootstrap Form
|
||||
</a>
|
||||
|
|
|
|||
|
|
@ -11,7 +11,7 @@ const mainPage = "dashboard";
|
|||
const page = "index";
|
||||
---
|
||||
|
||||
<!DOCTYPE html>
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<!--begin::Head-->
|
||||
<head>
|
||||
|
|
@ -91,7 +91,10 @@ const page = "index";
|
|||
d="M2.25 2.25a.75.75 0 000 1.5h1.386c.17 0 .318.114.362.278l2.558 9.592a3.752 3.752 0 00-2.806 3.63c0 .414.336.75.75.75h15.75a.75.75 0 000-1.5H5.378A2.25 2.25 0 017.5 15h11.218a.75.75 0 00.674-.421 60.358 60.358 0 002.96-7.228.75.75 0 00-.525-.965A60.864 60.864 0 005.68 4.509l-.232-.867A1.875 1.875 0 003.636 2.25H2.25zM3.75 20.25a1.5 1.5 0 113 0 1.5 1.5 0 01-3 0zM16.5 20.25a1.5 1.5 0 113 0 1.5 1.5 0 01-3 0z"
|
||||
></path>
|
||||
</svg>
|
||||
<a href="#" class="small-box-footer link-light link-underline-opacity-0 link-underline-opacity-50-hover">
|
||||
<a
|
||||
href="#"
|
||||
class="small-box-footer link-light link-underline-opacity-0 link-underline-opacity-50-hover"
|
||||
>
|
||||
More info <i class="bi bi-link-45deg"></i>
|
||||
</a>
|
||||
</div>
|
||||
|
|
@ -117,7 +120,10 @@ const page = "index";
|
|||
d="M18.375 2.25c-1.035 0-1.875.84-1.875 1.875v15.75c0 1.035.84 1.875 1.875 1.875h.75c1.035 0 1.875-.84 1.875-1.875V4.125c0-1.036-.84-1.875-1.875-1.875h-.75zM9.75 8.625c0-1.036.84-1.875 1.875-1.875h.75c1.036 0 1.875.84 1.875 1.875v11.25c0 1.035-.84 1.875-1.875 1.875h-.75a1.875 1.875 0 01-1.875-1.875V8.625zM3 13.125c0-1.036.84-1.875 1.875-1.875h.75c1.036 0 1.875.84 1.875 1.875v6.75c0 1.035-.84 1.875-1.875 1.875h-.75A1.875 1.875 0 013 19.875v-6.75z"
|
||||
></path>
|
||||
</svg>
|
||||
<a href="#" class="small-box-footer link-light link-underline-opacity-0 link-underline-opacity-50-hover">
|
||||
<a
|
||||
href="#"
|
||||
class="small-box-footer link-light link-underline-opacity-0 link-underline-opacity-50-hover"
|
||||
>
|
||||
More info <i class="bi bi-link-45deg"></i>
|
||||
</a>
|
||||
</div>
|
||||
|
|
@ -143,7 +149,10 @@ const page = "index";
|
|||
d="M6.25 6.375a4.125 4.125 0 118.25 0 4.125 4.125 0 01-8.25 0zM3.25 19.125a7.125 7.125 0 0114.25 0v.003l-.001.119a.75.75 0 01-.363.63 13.067 13.067 0 01-6.761 1.873c-2.472 0-4.786-.684-6.76-1.873a.75.75 0 01-.364-.63l-.001-.122zM19.75 7.5a.75.75 0 00-1.5 0v2.25H16a.75.75 0 000 1.5h2.25v2.25a.75.75 0 001.5 0v-2.25H22a.75.75 0 000-1.5h-2.25V7.5z"
|
||||
></path>
|
||||
</svg>
|
||||
<a href="#" class="small-box-footer link-light link-underline-opacity-0 link-underline-opacity-50-hover">
|
||||
<a
|
||||
href="#"
|
||||
class="small-box-footer link-dark link-underline-opacity-0 link-underline-opacity-50-hover"
|
||||
>
|
||||
More info <i class="bi bi-link-45deg"></i>
|
||||
</a>
|
||||
</div>
|
||||
|
|
@ -176,7 +185,10 @@ const page = "index";
|
|||
d="M12.75 3a.75.75 0 01.75-.75 8.25 8.25 0 018.25 8.25.75.75 0 01-.75.75h-7.5a.75.75 0 01-.75-.75V3z"
|
||||
></path>
|
||||
</svg>
|
||||
<a href="#" class="small-box-footer link-light link-underline-opacity-0 link-underline-opacity-50-hover">
|
||||
<a
|
||||
href="#"
|
||||
class="small-box-footer link-light link-underline-opacity-0 link-underline-opacity-50-hover"
|
||||
>
|
||||
More info <i class="bi bi-link-45deg"></i>
|
||||
</a>
|
||||
</div>
|
||||
|
|
@ -201,7 +213,7 @@ const page = "index";
|
|||
<!-- /.card -->
|
||||
|
||||
<!-- DIRECT CHAT -->
|
||||
<div class="card direct-chat direct-chat-primary">
|
||||
<div class="card direct-chat direct-chat-primary mb-4">
|
||||
<div class="card-header">
|
||||
<h3 class="card-title">Direct Chat</h3>
|
||||
|
||||
|
|
@ -510,7 +522,7 @@ const page = "index";
|
|||
<!-- Start col -->
|
||||
<div class="col-lg-5 connectedSortable">
|
||||
<div
|
||||
class="card mb-4 text-white bg-primary bg-gradient border-primary"
|
||||
class="card text-white bg-primary bg-gradient border-primary mb-4"
|
||||
>
|
||||
<div class="card-header border-0">
|
||||
<h3 class="card-title">Sales Value</h3>
|
||||
|
|
@ -532,15 +544,15 @@ const page = "index";
|
|||
<!--begin::Row-->
|
||||
<div class="row">
|
||||
<div class="col-4 text-center">
|
||||
<div id="sparkline-1"></div>
|
||||
<div id="sparkline-1" class="text-dark"></div>
|
||||
<div class="text-white">Visitors</div>
|
||||
</div>
|
||||
<div class="col-4 text-center">
|
||||
<div id="sparkline-2"></div>
|
||||
<div id="sparkline-2" class="text-dark"></div>
|
||||
<div class="text-white">Online</div>
|
||||
</div>
|
||||
<div class="col-4 text-center">
|
||||
<div id="sparkline-3"></div>
|
||||
<div id="sparkline-3" class="text-dark"></div>
|
||||
<div class="text-white">Sales</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -569,8 +581,7 @@ const page = "index";
|
|||
<script
|
||||
src="https://cdn.jsdelivr.net/npm/sortablejs@1.15.0/Sortable.min.js"
|
||||
integrity="sha256-ipiJrswvAR4VAx/th+6zWsdeYmVae0iJuiR+6OqHJHQ="
|
||||
crossorigin="anonymous"
|
||||
></script>
|
||||
crossorigin="anonymous"></script>
|
||||
|
||||
<!-- sortablejs -->
|
||||
<script is:inline>
|
||||
|
|
@ -579,11 +590,12 @@ const page = "index";
|
|||
connectedSortables.forEach((connectedSortable) => {
|
||||
let sortable = new Sortable(connectedSortable, {
|
||||
group: "shared",
|
||||
handle: ".card-header",
|
||||
});
|
||||
});
|
||||
|
||||
const cardHeaders = document.querySelectorAll(
|
||||
".connectedSortable .card-header"
|
||||
".connectedSortable .card-header",
|
||||
);
|
||||
cardHeaders.forEach((cardHeader) => {
|
||||
cardHeader.style.cursor = "move";
|
||||
|
|
@ -594,8 +606,7 @@ const page = "index";
|
|||
<script
|
||||
src="https://cdn.jsdelivr.net/npm/apexcharts@3.37.1/dist/apexcharts.min.js"
|
||||
integrity="sha256-+vh8GkaU7C9/wbSLIcwq82tQ2wTf44aOHA8HlBMwRI8="
|
||||
crossorigin="anonymous"
|
||||
></script>
|
||||
crossorigin="anonymous"></script>
|
||||
|
||||
<!-- ChartJS -->
|
||||
<script is:inline>
|
||||
|
|
@ -652,7 +663,7 @@ const page = "index";
|
|||
|
||||
const sales_chart = new ApexCharts(
|
||||
document.querySelector("#revenue-chart"),
|
||||
sales_chart_options
|
||||
sales_chart_options,
|
||||
);
|
||||
sales_chart.render();
|
||||
</script>
|
||||
|
|
@ -661,13 +672,11 @@ const page = "index";
|
|||
<script
|
||||
src="https://cdn.jsdelivr.net/npm/jsvectormap@1.5.3/dist/js/jsvectormap.min.js"
|
||||
integrity="sha256-/t1nN2956BT869E6H4V1dnt0X5pAQHPytli+1nTZm2Y="
|
||||
crossorigin="anonymous"
|
||||
></script>
|
||||
crossorigin="anonymous"></script>
|
||||
<script
|
||||
src="https://cdn.jsdelivr.net/npm/jsvectormap@1.5.3/dist/maps/world.js"
|
||||
integrity="sha256-XPpPaZlU8S/HWf7FZLAncLg2SAkP8ScUTII89x9D3lY="
|
||||
crossorigin="anonymous"
|
||||
></script>
|
||||
crossorigin="anonymous"></script>
|
||||
|
||||
<!-- jsvectormap -->
|
||||
<script is:inline>
|
||||
|
|
@ -719,7 +728,7 @@ const page = "index";
|
|||
|
||||
const sparkline1 = new ApexCharts(
|
||||
document.querySelector("#sparkline-1"),
|
||||
option_sparkline1
|
||||
option_sparkline1,
|
||||
);
|
||||
sparkline1.render();
|
||||
|
||||
|
|
@ -750,7 +759,7 @@ const page = "index";
|
|||
|
||||
const sparkline2 = new ApexCharts(
|
||||
document.querySelector("#sparkline-2"),
|
||||
option_sparkline2
|
||||
option_sparkline2,
|
||||
);
|
||||
sparkline2.render();
|
||||
|
||||
|
|
@ -781,7 +790,7 @@ const page = "index";
|
|||
|
||||
const sparkline3 = new ApexCharts(
|
||||
document.querySelector("#sparkline-3"),
|
||||
option_sparkline3
|
||||
option_sparkline3,
|
||||
);
|
||||
sparkline3.render();
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -11,7 +11,7 @@ const mainPage = "dashboard";
|
|||
const page = "index2";
|
||||
---
|
||||
|
||||
<!DOCTYPE html>
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<!--begin::Head-->
|
||||
<head>
|
||||
|
|
@ -309,7 +309,7 @@ const page = "index2";
|
|||
<!-- Start col -->
|
||||
<div class="col-md-8">
|
||||
<!--begin::Row-->
|
||||
<div class="row">
|
||||
<div class="row g-4 mb-4">
|
||||
<div class="col-md-6">
|
||||
<!-- DIRECT CHAT -->
|
||||
<div class="card direct-chat direct-chat-warning">
|
||||
|
|
@ -329,7 +329,8 @@ const page = "index2";
|
|||
data-lte-toggle="card-collapse"
|
||||
>
|
||||
<i data-lte-icon="expand" class="bi bi-plus-lg"></i>
|
||||
<i data-lte-icon="collapse" class="bi bi-dash-lg"></i>
|
||||
<i data-lte-icon="collapse" class="bi bi-dash-lg"
|
||||
></i>
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
|
|
@ -622,7 +623,7 @@ const page = "index2";
|
|||
|
||||
<div class="col-md-6">
|
||||
<!-- USERS LIST -->
|
||||
<div class="card mb-4">
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<h3 class="card-title">Latest Members</h3>
|
||||
|
||||
|
|
@ -636,7 +637,8 @@ const page = "index2";
|
|||
data-lte-toggle="card-collapse"
|
||||
>
|
||||
<i data-lte-icon="expand" class="bi bi-plus-lg"></i>
|
||||
<i data-lte-icon="collapse" class="bi bi-dash-lg"></i>
|
||||
<i data-lte-icon="collapse" class="bi bi-dash-lg"
|
||||
></i>
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
|
|
@ -767,7 +769,7 @@ const page = "index2";
|
|||
</div>
|
||||
<!-- /.card-body -->
|
||||
<div class="card-footer text-center">
|
||||
<a href="javascript:">View All Users</a>
|
||||
<a href="javascript:" class="link-primary link-offset-2 link-underline-opacity-25 link-underline-opacity-100-hover">View All Users</a>
|
||||
</div>
|
||||
<!-- /.card-footer -->
|
||||
</div>
|
||||
|
|
@ -777,7 +779,7 @@ const page = "index2";
|
|||
</div>
|
||||
<!--end::Row-->
|
||||
|
||||
<!-- TABLE: LATEST ORDERS -->
|
||||
<!--begin::Latest Order Widget-->
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<h3 class="card-title">Latest Orders</h3>
|
||||
|
|
@ -815,7 +817,7 @@ const page = "index2";
|
|||
<tbody>
|
||||
<tr>
|
||||
<td>
|
||||
<a href="pages/examples/invoice.html">OR9842</a>
|
||||
<a href="pages/examples/invoice.html" class="link-primary link-offset-2 link-underline-opacity-25 link-underline-opacity-100-hover">OR9842</a>
|
||||
</td>
|
||||
<td>Call of Duty IV</td>
|
||||
<td>
|
||||
|
|
@ -824,36 +826,24 @@ const page = "index2";
|
|||
</span>
|
||||
</td>
|
||||
<td>
|
||||
<div
|
||||
class="sparkbar"
|
||||
data-color="#00a65a"
|
||||
data-height="20"
|
||||
>
|
||||
90,80,90,-70,61,-83,63
|
||||
</div>
|
||||
<div id="table-sparkline-1"></div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<a href="pages/examples/invoice.html">OR1848</a>
|
||||
<a href="pages/examples/invoice.html" class="link-primary link-offset-2 link-underline-opacity-25 link-underline-opacity-100-hover">OR1848</a>
|
||||
</td>
|
||||
<td>Samsung Smart TV</td>
|
||||
<td>
|
||||
<span class="badge text-bg-warning">Pending</span>
|
||||
</td>
|
||||
<td>
|
||||
<div
|
||||
class="sparkbar"
|
||||
data-color="#f39c12"
|
||||
data-height="20"
|
||||
>
|
||||
90,80,-90,70,61,-83,68
|
||||
</div>
|
||||
<div id="table-sparkline-2"></div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<a href="pages/examples/invoice.html">OR7429</a>
|
||||
<a href="pages/examples/invoice.html" class="link-primary link-offset-2 link-underline-opacity-25 link-underline-opacity-100-hover">OR7429</a>
|
||||
</td>
|
||||
<td>iPhone 6 Plus</td>
|
||||
<td>
|
||||
|
|
@ -862,54 +852,36 @@ const page = "index2";
|
|||
</span>
|
||||
</td>
|
||||
<td>
|
||||
<div
|
||||
class="sparkbar"
|
||||
data-color="#f56954"
|
||||
data-height="20"
|
||||
>
|
||||
90,-80,90,70,-61,83,63
|
||||
</div>
|
||||
<div id="table-sparkline-3"></div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<a href="pages/examples/invoice.html">OR7429</a>
|
||||
<a href="pages/examples/invoice.html" class="link-primary link-offset-2 link-underline-opacity-25 link-underline-opacity-100-hover">OR7429</a>
|
||||
</td>
|
||||
<td>Samsung Smart TV</td>
|
||||
<td>
|
||||
<span class="badge text-bg-info">Processing</span>
|
||||
</td>
|
||||
<td>
|
||||
<div
|
||||
class="sparkbar"
|
||||
data-color="#00c0ef"
|
||||
data-height="20"
|
||||
>
|
||||
90,80,-90,70,-61,83,63
|
||||
</div>
|
||||
<div id="table-sparkline-4"></div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<a href="pages/examples/invoice.html">OR1848</a>
|
||||
<a href="pages/examples/invoice.html" class="link-primary link-offset-2 link-underline-opacity-25 link-underline-opacity-100-hover">OR1848</a>
|
||||
</td>
|
||||
<td>Samsung Smart TV</td>
|
||||
<td>
|
||||
<span class="badge text-bg-warning">Pending</span>
|
||||
</td>
|
||||
<td>
|
||||
<div
|
||||
class="sparkbar"
|
||||
data-color="#f39c12"
|
||||
data-height="20"
|
||||
>
|
||||
90,80,-90,70,61,-83,68
|
||||
</div>
|
||||
<div id="table-sparkline-5"></div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<a href="pages/examples/invoice.html">OR7429</a>
|
||||
<a href="pages/examples/invoice.html" class="link-primary link-offset-2 link-underline-opacity-25 link-underline-opacity-100-hover">OR7429</a>
|
||||
</td>
|
||||
<td>iPhone 6 Plus</td>
|
||||
<td>
|
||||
|
|
@ -918,31 +890,19 @@ const page = "index2";
|
|||
</span>
|
||||
</td>
|
||||
<td>
|
||||
<div
|
||||
class="sparkbar"
|
||||
data-color="#f56954"
|
||||
data-height="20"
|
||||
>
|
||||
90,-80,90,70,-61,83,63
|
||||
</div>
|
||||
<div id="table-sparkline-6"></div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<a href="pages/examples/invoice.html">OR9842</a>
|
||||
<a href="pages/examples/invoice.html" class="link-primary link-offset-2 link-underline-opacity-25 link-underline-opacity-100-hover">OR9842</a>
|
||||
</td>
|
||||
<td>Call of Duty IV</td>
|
||||
<td>
|
||||
<span class="badge text-bg-success">Shipped</span>
|
||||
</td>
|
||||
<td>
|
||||
<div
|
||||
class="sparkbar"
|
||||
data-color="#00a65a"
|
||||
data-height="20"
|
||||
>
|
||||
90,80,90,-70,61,-83,63
|
||||
</div>
|
||||
<div id="table-sparkline-7"></div>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
|
|
@ -1063,7 +1023,7 @@ const page = "index2";
|
|||
United States of America
|
||||
<span class="float-end text-danger">
|
||||
<i class="bi bi-arrow-down fs-7"></i>
|
||||
12%
|
||||
12%
|
||||
</span>
|
||||
</a>
|
||||
</li>
|
||||
|
|
@ -1233,8 +1193,7 @@ const page = "index2";
|
|||
<script
|
||||
src="https://cdn.jsdelivr.net/npm/apexcharts@3.37.1/dist/apexcharts.min.js"
|
||||
integrity="sha256-+vh8GkaU7C9/wbSLIcwq82tQ2wTf44aOHA8HlBMwRI8="
|
||||
crossorigin="anonymous"
|
||||
></script>
|
||||
crossorigin="anonymous"></script>
|
||||
|
||||
<script is:inline>
|
||||
// NOTICE!! DO NOT USE ANY OF THIS JAVASCRIPT
|
||||
|
|
@ -1250,7 +1209,7 @@ const page = "index2";
|
|||
// - MONTHLY SALES CHART -
|
||||
//-----------------------
|
||||
|
||||
var sales_chart_options = {
|
||||
const sales_chart_options = {
|
||||
series: [
|
||||
{
|
||||
name: "Digital Goods",
|
||||
|
|
@ -1297,9 +1256,9 @@ const page = "index2";
|
|||
},
|
||||
};
|
||||
|
||||
var sales_chart = new ApexCharts(
|
||||
const sales_chart = new ApexCharts(
|
||||
document.querySelector("#sales-chart"),
|
||||
sales_chart_options
|
||||
sales_chart_options,
|
||||
);
|
||||
sales_chart.render();
|
||||
|
||||
|
|
@ -1307,11 +1266,80 @@ const page = "index2";
|
|||
// - END MONTHLY SALES CHART -
|
||||
//---------------------------
|
||||
|
||||
function createSparklineChart(selector, data) {
|
||||
const options = {
|
||||
series: [{ data }],
|
||||
chart: {
|
||||
type: "line",
|
||||
width: 150,
|
||||
height: 30,
|
||||
sparkline: {
|
||||
enabled: true,
|
||||
},
|
||||
},
|
||||
colors: ["var(--bs-primary)"],
|
||||
stroke: {
|
||||
width: 2,
|
||||
},
|
||||
tooltip: {
|
||||
fixed: {
|
||||
enabled: false,
|
||||
},
|
||||
x: {
|
||||
show: false,
|
||||
},
|
||||
y: {
|
||||
title: {
|
||||
formatter: function (seriesName) {
|
||||
return "";
|
||||
},
|
||||
},
|
||||
},
|
||||
marker: {
|
||||
show: false,
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
const chart = new ApexCharts(document.querySelector(selector), options);
|
||||
chart.render();
|
||||
}
|
||||
|
||||
const table_sparkline_1_data = [
|
||||
25, 66, 41, 89, 63, 25, 44, 12, 36, 9, 54,
|
||||
];
|
||||
const table_sparkline_2_data = [
|
||||
12, 56, 21, 39, 73, 45, 64, 52, 36, 59, 44,
|
||||
];
|
||||
const table_sparkline_3_data = [
|
||||
15, 46, 21, 59, 33, 15, 34, 42, 56, 19, 64,
|
||||
];
|
||||
const table_sparkline_4_data = [
|
||||
30, 56, 31, 69, 43, 35, 24, 32, 46, 29, 64,
|
||||
];
|
||||
const table_sparkline_5_data = [
|
||||
20, 76, 51, 79, 53, 35, 54, 22, 36, 49, 64,
|
||||
];
|
||||
const table_sparkline_6_data = [
|
||||
5, 36, 11, 69, 23, 15, 14, 42, 26, 19, 44,
|
||||
];
|
||||
const table_sparkline_7_data = [
|
||||
12, 56, 21, 39, 73, 45, 64, 52, 36, 59, 74,
|
||||
];
|
||||
|
||||
createSparklineChart("#table-sparkline-1", table_sparkline_1_data);
|
||||
createSparklineChart("#table-sparkline-2", table_sparkline_2_data);
|
||||
createSparklineChart("#table-sparkline-3", table_sparkline_3_data);
|
||||
createSparklineChart("#table-sparkline-4", table_sparkline_4_data);
|
||||
createSparklineChart("#table-sparkline-5", table_sparkline_5_data);
|
||||
createSparklineChart("#table-sparkline-6", table_sparkline_6_data);
|
||||
createSparklineChart("#table-sparkline-7", table_sparkline_7_data);
|
||||
|
||||
//-------------
|
||||
// - PIE CHART -
|
||||
//-------------
|
||||
|
||||
var pie_chart_options = {
|
||||
const pie_chart_options = {
|
||||
series: [700, 500, 400, 600, 300, 100],
|
||||
chart: {
|
||||
type: "donut",
|
||||
|
|
@ -1330,9 +1358,9 @@ const page = "index2";
|
|||
],
|
||||
};
|
||||
|
||||
var pie_chart = new ApexCharts(
|
||||
const pie_chart = new ApexCharts(
|
||||
document.querySelector("#pie-chart"),
|
||||
pie_chart_options
|
||||
pie_chart_options,
|
||||
);
|
||||
pie_chart.render();
|
||||
|
||||
|
|
|
|||
|
|
@ -65,7 +65,7 @@ const page = "index3";
|
|||
<div class="card-header border-0">
|
||||
<div class="d-flex justify-content-between">
|
||||
<h3 class="card-title">Online Store Visitors</h3>
|
||||
<a href="javascript:void(0);">View Report</a>
|
||||
<a href="javascript:void(0);" class="link-primary link-offset-2 link-underline-opacity-25 link-underline-opacity-100-hover">View Report</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
|
|
@ -100,7 +100,7 @@ const page = "index3";
|
|||
</div>
|
||||
<!-- /.card -->
|
||||
|
||||
<div class="card">
|
||||
<div class="card mb-4">
|
||||
<div class="card-header border-0">
|
||||
<h3 class="card-title">Products</h3>
|
||||
<div class="card-tools">
|
||||
|
|
@ -157,7 +157,7 @@ const page = "index3";
|
|||
</td>
|
||||
<td>$29 USD</td>
|
||||
<td>
|
||||
<small class="text-warning me-1">
|
||||
<small class="text-info me-1">
|
||||
<i class="bi bi-arrow-down"></i>
|
||||
0.5%
|
||||
</small>
|
||||
|
|
@ -228,7 +228,7 @@ const page = "index3";
|
|||
<div class="card-header border-0">
|
||||
<div class="d-flex justify-content-between">
|
||||
<h3 class="card-title">Sales</h3>
|
||||
<a href="javascript:void(0);">View Report</a>
|
||||
<a href="javascript:void(0);" class="link-primary link-offset-2 link-underline-opacity-25 link-underline-opacity-100-hover">View Report</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
|
|
@ -298,7 +298,7 @@ const page = "index3";
|
|||
</p>
|
||||
<p class="d-flex flex-column text-end">
|
||||
<span class="fw-bold">
|
||||
<i class="ion ion-android-arrow-up text-success"></i> 12%
|
||||
<i class="bi bi-graph-up-arrow text-success"></i> 12%
|
||||
</span>
|
||||
<span class="text-secondary">CONVERSION RATE</span>
|
||||
</p>
|
||||
|
|
@ -307,7 +307,7 @@ const page = "index3";
|
|||
<div
|
||||
class="d-flex justify-content-between align-items-center border-bottom mb-3"
|
||||
>
|
||||
<p class="text-warning fs-2">
|
||||
<p class="text-info fs-2">
|
||||
<svg
|
||||
height="32"
|
||||
fill="none"
|
||||
|
|
@ -326,7 +326,7 @@ const page = "index3";
|
|||
</p>
|
||||
<p class="d-flex flex-column text-end">
|
||||
<span class="fw-bold">
|
||||
<i class="ion ion-android-arrow-up text-warning"></i> 0.8%
|
||||
<i class="bi bi-graph-up-arrow text-info"></i> 0.8%
|
||||
</span>
|
||||
<span class="text-secondary">SALES RATE</span>
|
||||
</p>
|
||||
|
|
@ -354,7 +354,7 @@ const page = "index3";
|
|||
</p>
|
||||
<p class="d-flex flex-column text-end">
|
||||
<span class="fw-bold">
|
||||
<i class="ion ion-android-arrow-down text-danger"></i>
|
||||
<i class="bi bi-graph-down-arrow text-danger"></i>
|
||||
1%
|
||||
</span>
|
||||
<span class="text-secondary">REGISTRATION RATE</span>
|
||||
|
|
@ -393,7 +393,7 @@ const page = "index3";
|
|||
// IT'S ALL JUST JUNK FOR DEMO
|
||||
// ++++++++++++++++++++++++++++++++++++++++++
|
||||
|
||||
var visitors_chart_options = {
|
||||
const visitors_chart_options = {
|
||||
series: [
|
||||
{
|
||||
name: "High - 2023",
|
||||
|
|
@ -433,13 +433,13 @@ const page = "index3";
|
|||
},
|
||||
};
|
||||
|
||||
var visitors_chart = new ApexCharts(
|
||||
const visitors_chart = new ApexCharts(
|
||||
document.querySelector("#visitors-chart"),
|
||||
visitors_chart_options
|
||||
);
|
||||
visitors_chart.render();
|
||||
|
||||
var sales_chart_options = {
|
||||
const sales_chart_options = {
|
||||
series: [
|
||||
{
|
||||
name: "Net Profit",
|
||||
|
|
@ -502,7 +502,7 @@ const page = "index3";
|
|||
},
|
||||
};
|
||||
|
||||
var sales_chart = new ApexCharts(
|
||||
const sales_chart = new ApexCharts(
|
||||
document.querySelector("#sales-chart"),
|
||||
sales_chart_options
|
||||
);
|
||||
|
|
|
|||
|
|
@ -56,7 +56,7 @@ const page = "simple";
|
|||
<!--begin::Row-->
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<div class="card">
|
||||
<div class="card mb-4">
|
||||
<div class="card-header">
|
||||
<h3 class="card-title">Bordered Table</h3>
|
||||
</div>
|
||||
|
|
@ -72,7 +72,7 @@ const page = "simple";
|
|||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<tr class="align-middle">
|
||||
<td>1.</td>
|
||||
<td>Update software</td>
|
||||
<td>
|
||||
|
|
@ -86,7 +86,7 @@ const page = "simple";
|
|||
</td>
|
||||
<td><span class="badge text-bg-danger">55%</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<tr class="align-middle">
|
||||
<td>2.</td>
|
||||
<td>Clean database</td>
|
||||
<td>
|
||||
|
|
@ -102,7 +102,7 @@ const page = "simple";
|
|||
<span class="badge text-bg-warning">70%</span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<tr class="align-middle">
|
||||
<td>3.</td>
|
||||
<td>Cron job running</td>
|
||||
<td>
|
||||
|
|
@ -120,7 +120,7 @@ const page = "simple";
|
|||
<span class="badge text-bg-primary">30%</span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<tr class="align-middle">
|
||||
<td>4.</td>
|
||||
<td>Fix and squish bugs</td>
|
||||
<td>
|
||||
|
|
@ -164,7 +164,7 @@ const page = "simple";
|
|||
</div>
|
||||
<!-- /.card -->
|
||||
|
||||
<div class="card">
|
||||
<div class="card mb-4">
|
||||
<div class="card-header">
|
||||
<h3 class="card-title">Condensed Full Width Table</h3>
|
||||
</div>
|
||||
|
|
@ -180,7 +180,7 @@ const page = "simple";
|
|||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<tr class="align-middle">
|
||||
<td>1.</td>
|
||||
<td>Update software</td>
|
||||
<td>
|
||||
|
|
@ -194,7 +194,7 @@ const page = "simple";
|
|||
</td>
|
||||
<td><span class="badge text-bg-danger">55%</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<tr class="align-middle">
|
||||
<td>2.</td>
|
||||
<td>Clean database</td>
|
||||
<td>
|
||||
|
|
@ -210,7 +210,7 @@ const page = "simple";
|
|||
<span class="badge text-bg-warning">70%</span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<tr class="align-middle">
|
||||
<td>3.</td>
|
||||
<td>Cron job running</td>
|
||||
<td>
|
||||
|
|
@ -228,7 +228,7 @@ const page = "simple";
|
|||
<span class="badge text-bg-primary">30%</span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<tr class="align-middle">
|
||||
<td>4.</td>
|
||||
<td>Fix and squish bugs</td>
|
||||
<td>
|
||||
|
|
@ -255,7 +255,7 @@ const page = "simple";
|
|||
</div>
|
||||
<!-- /.col -->
|
||||
<div class="col-md-6">
|
||||
<div class="card">
|
||||
<div class="card mb-4">
|
||||
<div class="card-header">
|
||||
<h3 class="card-title">Simple Full Width Table</h3>
|
||||
|
||||
|
|
@ -291,7 +291,7 @@ const page = "simple";
|
|||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<tr class="align-middle">
|
||||
<td>1.</td>
|
||||
<td>Update software</td>
|
||||
<td>
|
||||
|
|
@ -305,7 +305,7 @@ const page = "simple";
|
|||
</td>
|
||||
<td><span class="badge text-bg-danger">55%</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<tr class="align-middle">
|
||||
<td>2.</td>
|
||||
<td>Clean database</td>
|
||||
<td>
|
||||
|
|
@ -321,7 +321,7 @@ const page = "simple";
|
|||
<span class="badge text-bg-warning">70%</span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<tr class="align-middle">
|
||||
<td>3.</td>
|
||||
<td>Cron job running</td>
|
||||
<td>
|
||||
|
|
@ -339,7 +339,7 @@ const page = "simple";
|
|||
<span class="badge text-bg-primary">30%</span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<tr class="align-middle">
|
||||
<td>4.</td>
|
||||
<td>Fix and squish bugs</td>
|
||||
<td>
|
||||
|
|
@ -364,7 +364,7 @@ const page = "simple";
|
|||
</div>
|
||||
<!-- /.card -->
|
||||
|
||||
<div class="card">
|
||||
<div class="card mb-4">
|
||||
<div class="card-header">
|
||||
<h3 class="card-title">Striped Full Width Table</h3>
|
||||
</div>
|
||||
|
|
@ -380,7 +380,7 @@ const page = "simple";
|
|||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<tr class="align-middle">
|
||||
<td>1.</td>
|
||||
<td>Update software</td>
|
||||
<td>
|
||||
|
|
@ -394,7 +394,7 @@ const page = "simple";
|
|||
</td>
|
||||
<td><span class="badge text-bg-danger">55%</span></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<tr class="align-middle">
|
||||
<td>2.</td>
|
||||
<td>Clean database</td>
|
||||
<td>
|
||||
|
|
@ -410,7 +410,7 @@ const page = "simple";
|
|||
<span class="badge text-bg-warning">70%</span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<tr class="align-middle">
|
||||
<td>3.</td>
|
||||
<td>Cron job running</td>
|
||||
<td>
|
||||
|
|
@ -428,7 +428,7 @@ const page = "simple";
|
|||
<span class="badge text-bg-primary">30%</span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<tr class="align-middle">
|
||||
<td>4.</td>
|
||||
<td>Fix and squish bugs</td>
|
||||
<td>
|
||||
|
|
|
|||
|
|
@ -57,7 +57,7 @@ const page = "cards";
|
|||
|
||||
<h5 class="mb-2">Abilities</h5>
|
||||
<!--begin::Row-->
|
||||
<div class="row">
|
||||
<div class="row g-4 mb-4">
|
||||
<div class="col-md-3">
|
||||
<div class="card card-primary collapsed-card">
|
||||
<div class="card-header">
|
||||
|
|
@ -158,7 +158,7 @@ const page = "cards";
|
|||
|
||||
<h5 class="mb-2">Card Outlined</h5>
|
||||
<!--begin::Row-->
|
||||
<div class="row">
|
||||
<div class="row g-4 mb-4">
|
||||
<div class="col-md-3">
|
||||
<div class="card card-outline card-primary collapsed-card">
|
||||
<div class="card-header">
|
||||
|
|
@ -259,7 +259,7 @@ const page = "cards";
|
|||
|
||||
<h5 class="mb-2">Card with <code>.text-bg-*</code></h5>
|
||||
<!--begin::Row-->
|
||||
<div class="row">
|
||||
<div class="row g-4 mb-4">
|
||||
<div class="col-md-3">
|
||||
<div class="card text-bg-primary collapsed-card">
|
||||
<div class="card-header">
|
||||
|
|
|
|||
|
|
@ -126,7 +126,7 @@ const page = "small-box";
|
|||
d="M6.25 6.375a4.125 4.125 0 118.25 0 4.125 4.125 0 01-8.25 0zM3.25 19.125a7.125 7.125 0 0114.25 0v.003l-.001.119a.75.75 0 01-.363.63 13.067 13.067 0 01-6.761 1.873c-2.472 0-4.786-.684-6.76-1.873a.75.75 0 01-.364-.63l-.001-.122zM19.75 7.5a.75.75 0 00-1.5 0v2.25H16a.75.75 0 000 1.5h2.25v2.25a.75.75 0 001.5 0v-2.25H22a.75.75 0 000-1.5h-2.25V7.5z"
|
||||
></path>
|
||||
</svg>
|
||||
<a href="#" class="small-box-footer link-light link-underline-opacity-0 link-underline-opacity-50-hover">
|
||||
<a href="#" class="small-box-footer link-dark link-underline-opacity-0 link-underline-opacity-50-hover">
|
||||
More info <i class="bi bi-link-45deg"></i>
|
||||
</a>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -12,6 +12,10 @@
|
|||
padding: 0;
|
||||
margin-bottom: 0;
|
||||
line-height: 2.5rem;
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -187,7 +187,7 @@
|
|||
|
||||
.nav-arrow {
|
||||
@include transition(transform $lte-transition-fn $lte-transition-speed);
|
||||
transform: translateY(-50%) #{"/*rtl:rotate(180deg)*/"};
|
||||
transform: translateY(-50%) #{"/*rtl:append:rotate(180deg)*/"};
|
||||
animation-name: fadeIn;
|
||||
animation-duration: $lte-transition-speed;
|
||||
animation-fill-mode: both;
|
||||
|
|
@ -244,7 +244,7 @@
|
|||
|
||||
> .nav-link {
|
||||
.nav-arrow {
|
||||
transform: translateY(-50%) rotate(90deg) #{"/*rtl:rotate(90deg)*/"};
|
||||
transform: translateY(-50%) rotate(90deg) #{"/*rtl:ignore*/"};
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -11,6 +11,11 @@
|
|||
background-color: var(--#{$lte-prefix}callout-bg, var(--bs-gray-100));
|
||||
border-left: .25rem solid var(--#{$lte-prefix}callout-border, var(--bs-gray-300));
|
||||
|
||||
.callout-link {
|
||||
font-weight: $lte-callout-link-font-weight;
|
||||
color: var(--#{$prefix}callout-link-color);
|
||||
}
|
||||
|
||||
h4 {
|
||||
margin-bottom: .25rem;
|
||||
}
|
||||
|
|
@ -30,5 +35,6 @@
|
|||
--#{$lte-prefix}callout-color: var(--#{$prefix}#{$name}-text-emphasis);
|
||||
--#{$lte-prefix}callout-bg: var(--#{$prefix}#{$name}-bg-subtle);
|
||||
--#{$lte-prefix}callout-border: var(--#{$prefix}#{$name}-border-subtle);
|
||||
--#{$prefix}callout-link-color: var(--#{$prefix}#{$name}-text-emphasis);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -172,6 +172,7 @@
|
|||
}
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
border-top: 3px solid transparent;
|
||||
|
||||
&:hover {
|
||||
|
|
|
|||
|
|
@ -169,11 +169,16 @@
|
|||
@include clearfix();
|
||||
padding: 10px;
|
||||
margin: 0;
|
||||
text-decoration: none;
|
||||
border-bottom: 1px solid rgba($black, .2);
|
||||
|
||||
&:last-of-type {
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -204,6 +204,7 @@
|
|||
border-bottom: 1px solid var(--#{$prefix}border-color-translucent);
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
@include media-breakpoint-up(sm) {
|
||||
color: var(--#{$prefix}body-color) !important;
|
||||
background-color: var(--#{$prefix}body-bg) !important;
|
||||
|
|
|
|||
|
|
@ -18,10 +18,10 @@
|
|||
.progress {
|
||||
height: 2px;
|
||||
margin: 5px 0;
|
||||
background-color: rgba($black, .125);
|
||||
background-color: rgba(var(--#{$lte-prefix}card-variant-color-rgb), .125);
|
||||
|
||||
.progress-bar {
|
||||
background-color: $white;
|
||||
background-color: var(--#{$lte-prefix}card-variant-color);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -62,14 +62,6 @@
|
|||
white-space: nowrap;
|
||||
}
|
||||
|
||||
@each $name, $color in $theme-colors {
|
||||
.info-box {
|
||||
.progress-bar {
|
||||
background-color: color-contrast($color);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.info-box-more {
|
||||
display: block;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -58,6 +58,7 @@
|
|||
// Link in header
|
||||
> a {
|
||||
font-weight: 600;
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
// Item body and footer
|
||||
|
|
|
|||
|
|
@ -101,6 +101,10 @@ $lte-card-title-font-weight: $font-weight-normal !default;
|
|||
// --------------------------------------------------------
|
||||
$lte-progress-bar-border-radius: 1px !default;
|
||||
|
||||
// CALLOUTS
|
||||
// --------------------------------------------------------
|
||||
$lte-callout-link-font-weight: $alert-link-font-weight !default;
|
||||
|
||||
// DIRECT CHAT
|
||||
// --------------------------------------------------------
|
||||
$lte-direct-chat-default-msg-bg: var(--#{$prefix}secondary-bg) !default;
|
||||
|
|
|
|||
|
|
@ -18,6 +18,7 @@
|
|||
|
||||
a {
|
||||
color: var(--#{$prefix}emphasis-color);
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -11,6 +11,7 @@
|
|||
|
||||
a {
|
||||
color: var(--#{$prefix}secondary-color);
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue