Merge pull request #5312 from glewe/bs5-components

Bs5 Components
This commit is contained in:
Daniel
2023-09-14 17:56:06 +05:30
committed by GitHub
8 changed files with 1519 additions and 21 deletions

View File

@@ -9,21 +9,25 @@ const adminlteJsUrl = path + "/js/adminlte.js";
integrity="sha256-NRZchBuHZWSXldqrtAOeCZpucH/1n1ToJ3C8mSK95NU="
crossorigin="anonymous"
></script>
<!--end::Third Party Plugin(OverlayScrollbars)--><!--begin::Required Plugin(popperjs for Bootstrap 5)-->
<!--end::Third Party Plugin(OverlayScrollbars)-->
<!--begin::Required Plugin(popperjs for Bootstrap 5)-->
<script
src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.7/dist/umd/popper.min.js"
integrity="sha384-zYPOMqeu1DAVkHiLqWBUTcbYfZ8osu1Nd6Z89ify25QV9guujx43ITvfi12/QExE"
crossorigin="anonymous"
></script>
<!--end::Required Plugin(popperjs for Bootstrap 5)--><!--begin::Required Plugin(Bootstrap 5)-->
<!--end::Required Plugin(popperjs for Bootstrap 5)-->
<!--begin::Required Plugin(Bootstrap 5)-->
<script
src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha3/dist/js/bootstrap.min.js"
integrity="sha384-Y4oOpwW3duJdCWv5ly8SCFYWqFDsfob/3GkgExXKV4idmbt98QcxXYs9UoXAB7BZ"
crossorigin="anonymous"
></script>
<!--end::Required Plugin(Bootstrap 5)--><!--begin::Required Plugin(AdminLTE)-->
<!--end::Required Plugin(Bootstrap 5)-->
<!--begin::Required Plugin(AdminLTE)-->
<script src={adminlteJsUrl} is:inline></script>
<!--end::Required Plugin(AdminLTE)--><!--begin::OverlayScrollbars Configure-->
<!--end::Required Plugin(AdminLTE)-->
<!--begin::OverlayScrollbars Configure-->
<script is:inline>
const SELECTOR_SIDEBAR_WRAPPER = ".sidebar-wrapper";
const Default = {
@@ -31,7 +35,6 @@ const adminlteJsUrl = path + "/js/adminlte.js";
scrollbarAutoHide: "leave",
scrollbarClickScroll: true,
};
document.addEventListener("DOMContentLoaded", function () {
const sidebarWrapper = document.querySelector(SELECTOR_SIDEBAR_WRAPPER);
if (

View File

@@ -1,6 +1,6 @@
---
import { convertPathToHtml } from "../../../utils/index.js";
const { path, mainPage, page } = Astro.props;
import {convertPathToHtml} from "../../../utils/index.js";
const {path, mainPage, page} = Astro.props;
const htmlPath = convertPathToHtml(path);
---
@@ -125,7 +125,7 @@ const htmlPath = convertPathToHtml(path);
<p>
Layout Options
<span class="nav-badge badge text-bg-secondary me-3"
>6</span
>6</span
>
<i class="nav-arrow bi bi-chevron-right"></i>
</p>
@@ -216,6 +216,15 @@ const htmlPath = convertPathToHtml(path);
</p>
</a>
<ul class="nav nav-treeview">
<li class="nav-item">
<a
href={htmlPath + "/UI/general.html"}
class:list={["nav-link", page === "general" && "active"]}
>
<i class="nav-icon bi bi-circle"></i>
<p>General</p>
</a>
</li>
<li class="nav-item">
<a
href={htmlPath + "/UI/timeline.html"}

File diff suppressed because it is too large Load Diff

View File

@@ -58,7 +58,7 @@ const page = "general";
<!--begin::Col-->
<div class="col-12">
<div class="callout callout-info">
For detailed documentaion of Form visit <a
For detailed documentation of Form visit <a
href="https://getbootstrap.com/docs/5.3/forms/overview/"
target="_blank"
rel="noopener noreferrer"
@@ -72,7 +72,7 @@ const page = "general";
<!--begin::Col-->
<div class="col-md-6">
<!--begin::Quick Example-->
<div class="card card-primary card-outline">
<div class="card card-primary card-outline mb-4">
<!--begin::Header-->
<div class="card-header">
<div class="card-title">Quick Example</div>
@@ -140,7 +140,7 @@ const page = "general";
</div>
<!--end::Quick Example-->
<!--begin::Input Group-->
<div class="card card-success card-outline">
<div class="card card-success card-outline mb-4">
<!--begin::Header-->
<div class="card-header">
<div class="card-title">Input Group</div>
@@ -234,7 +234,7 @@ const page = "general";
</div>
<!--end::Input Group-->
<!--begin::Horizontal Form-->
<div class="card card-warning card-outline">
<div class="card card-warning card-outline mb-4">
<!--begin::Header-->
<div class="card-header">
<div class="card-title">Horizontal Form</div>
@@ -348,7 +348,7 @@ const page = "general";
<!--begin::Col-->
<div class="col-md-6">
<!--begin::Different Height-->
<div class="card card-secondary card-outline">
<div class="card card-secondary card-outline mb-4">
<!--begin::Header-->
<div class="card-header">
<div class="card-title">Different Height</div>
@@ -381,7 +381,7 @@ const page = "general";
</div>
<!--end::Different Height-->
<!--begin::Different Width-->
<div class="card card-danger card-outline">
<div class="card card-danger card-outline mb-4">
<!--begin::Header-->
<div class="card-header">
<div class="card-title">Different Width</div>
@@ -425,7 +425,7 @@ const page = "general";
</div>
<!--end::Different Width-->
<!--begin::Form Validation-->
<div class="card card-info card-outline">
<div class="card card-info card-outline mb-4">
<!--begin::Header-->
<div class="card-header">
<div class="card-title">Form Validation</div>