lisone/AdminLTE
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

removed gulp and implement cli and astro

Browse Source
This commit is contained in:
Daniel
2023-02-19 21:40:29 +05:30
parent 034bda7138
commit 3113ac5efe
33 changed files with 8416 additions and 11089 deletions
Download Patch File Download Diff File Expand all files Collapse all files

307
src/html/pages/widgets/cards.astro Normal file
View File

@@ -0,0 +1,307 @@
---
import Head from '@components/_head.astro';
import Footer from '@components/dashboard/_footer.astro';
import Topbar from '@components/dashboard/_topbar.astro';
import Sidenav from '@components/dashboard/_sidenav.astro';
import Scripts from '@components/_scripts.astro';
const title = 'AdminLTE 4 | Widgets - Cards'
const mainPage = 'widgets'
const page = 'cards'
---
<!DOCTYPE html>
<html lang="en">
<head>
<Head title={title} />
</head>
<body class="layout-fixed bg-body-tertiary">
<div class="app-wrapper">
<Topbar />
<Sidenav mainPage={mainPage} page={page} />
<!-- Main content -->
<main class="app-main">
<div class="app-content-header">
<div class="container-fluid">
<div class="row">
<div class="col-sm-6">
<h3 class="mb-0">Cards</h3>
</div>
<div class="col-sm-6">
<ol class="breadcrumb float-sm-end">
<li class="breadcrumb-item"><a href="#">Home</a></li>
<li class="breadcrumb-item active" aria-current="page">Cards</li>
</ol>
</div>
</div>
</div>
</div>
<!-- Main content -->
<div class="app-content">
<div class="container-fluid">
<h4 class="mb-2">Cards</h4>
<h5 class="mb-2">Abilities</h5>
<div class="row">
<div class="col-md-3">
<div class="card card-primary collapsed-card">
<div class="card-header">
<h3 class="card-title">Expandable</h3>
<div class="card-tools">
<button type="button" class="btn btn-tool" data-lte-toggle="card-collapse"><i class="fa-solid fa-plus"></i>
</button>
</div>
<!-- /.card-tools -->
</div>
<!-- /.card-header -->
<div class="card-body">
The body of the card
</div>
<!-- /.card-body -->
</div>
<!-- /.card -->
</div>
<!-- /.col -->
<div class="col-md-3">
<div class="card card-success">
<div class="card-header">
<h3 class="card-title">Collapsable</h3>
<div class="card-tools">
<button type="button" class="btn btn-tool" data-lte-toggle="card-collapse"><i class="fa-solid fa-minus"></i>
</button>
</div>
<!-- /.card-tools -->
</div>
<!-- /.card-header -->
<div class="card-body">
The body of the card
</div>
<!-- /.card-body -->
</div>
<!-- /.card -->
</div>
<!-- /.col -->
<div class="col-md-3">
<div class="card card-warning">
<div class="card-header">
<h3 class="card-title">Removable</h3>
<div class="card-tools">
<button type="button" class="btn btn-tool" data-lte-dismiss="card-remove"><i class="fa-solid fa-times"></i>
</button>
</div>
<!-- /.card-tools -->
</div>
<!-- /.card-header -->
<div class="card-body">
The body of the card
</div>
<!-- /.card-body -->
</div>
<!-- /.card -->
</div>
<!-- /.col -->
<div class="col-md-3">
<div class="card card-danger">
<div class="card-header">
<h3 class="card-title">Maximizable</h3>
<div class="card-tools">
<button type="button" class="btn btn-tool" data-lte-toggle="card-maximize"><i class="fa-solid fa-expand"></i>
</button>
</div>
<!-- /.card-tools -->
</div>
<!-- /.card-header -->
<div class="card-body">
The body of the card
</div>
<!-- /.card-body -->
</div>
<!-- /.card -->
</div>
<!-- /.col -->
</div>
<h5 class="mb-2">Card Outlined</h5>
<div class="row">
<div class="col-md-3">
<div class="card card-outline card-primary collapsed-card">
<div class="card-header">
<h3 class="card-title">Expandable</h3>
<div class="card-tools">
<button type="button" class="btn btn-tool" data-lte-toggle="card-collapse"><i class="fa-solid fa-plus"></i>
</button>
</div>
<!-- /.card-tools -->
</div>
<!-- /.card-header -->
<div class="card-body">
The body of the card
</div>
<!-- /.card-body -->
</div>
<!-- /.card -->
</div>
<!-- /.col -->
<div class="col-md-3">
<div class="card card-outline card-success">
<div class="card-header">
<h3 class="card-title">Collapsable</h3>
<div class="card-tools">
<button type="button" class="btn btn-tool" data-lte-toggle="card-collapse"><i class="fa-solid fa-minus"></i>
</button>
</div>
<!-- /.card-tools -->
</div>
<!-- /.card-header -->
<div class="card-body">
The body of the card
</div>
<!-- /.card-body -->
</div>
<!-- /.card -->
</div>
<!-- /.col -->
<div class="col-md-3">
<div class="card card-outline card-warning">
<div class="card-header">
<h3 class="card-title">Removable</h3>
<div class="card-tools">
<button type="button" class="btn btn-tool" data-lte-dismiss="card-remove"><i class="fa-solid fa-times"></i>
</button>
</div>
<!-- /.card-tools -->
</div>
<!-- /.card-header -->
<div class="card-body">
The body of the card
</div>
<!-- /.card-body -->
</div>
<!-- /.card -->
</div>
<!-- /.col -->
<div class="col-md-3">
<div class="card card-outline card-danger">
<div class="card-header">
<h3 class="card-title">Maximizable</h3>
<div class="card-tools">
<button type="button" class="btn btn-tool" data-lte-toggle="card-maximize"><i class="fa-solid fa-expand"></i>
</button>
</div>
<!-- /.card-tools -->
</div>
<!-- /.card-header -->
<div class="card-body">
The body of the card
</div>
<!-- /.card-body -->
</div>
<!-- /.card -->
</div>
<!-- /.col -->
</div>
<h5 class="mb-2">Card with <code>.text-bg-*</code> </h5>
<div class="row">
<div class="col-md-3">
<div class="card text-bg-primary collapsed-card">
<div class="card-header">
<h3 class="card-title">Expandable</h3>
<div class="card-tools">
<button type="button" class="btn btn-tool" data-lte-toggle="card-collapse"><i class="fa-solid fa-plus"></i>
</button>
</div>
<!-- /.card-tools -->
</div>
<!-- /.card-header -->
<div class="card-body">
The body of the card
</div>
<!-- /.card-body -->
</div>
<!-- /.card -->
</div>
<!-- /.col -->
<div class="col-md-3">
<div class="card text-bg-success">
<div class="card-header">
<h3 class="card-title">Collapsable</h3>
<div class="card-tools">
<button type="button" class="btn btn-tool" data-lte-toggle="card-collapse"><i class="fa-solid fa-minus"></i>
</button>
</div>
<!-- /.card-tools -->
</div>
<!-- /.card-header -->
<div class="card-body">
The body of the card
</div>
<!-- /.card-body -->
</div>
<!-- /.card -->
</div>
<!-- /.col -->
<div class="col-md-3">
<div class="card text-bg-warning">
<div class="card-header">
<h3 class="card-title">Removable</h3>
<div class="card-tools">
<button type="button" class="btn btn-tool" data-lte-dismiss="card-remove"><i class="fa-solid fa-times"></i>
</button>
</div>
<!-- /.card-tools -->
</div>
<!-- /.card-header -->
<div class="card-body">
The body of the card
</div>
<!-- /.card-body -->
</div>
<!-- /.card -->
</div>
<!-- /.col -->
<div class="col-md-3">
<div class="card text-bg-danger">
<div class="card-header">
<h3 class="card-title">Maximizable</h3>
<div class="card-tools">
<button type="button" class="btn btn-tool" data-lte-toggle="card-maximize"><i class="fa-solid fa-expand"></i>
</button>
</div>
<!-- /.card-tools -->
</div>
<!-- /.card-header -->
<div class="card-body">
The body of the card
</div>
<!-- /.card-body -->
</div>
<!-- /.card -->
</div>
<!-- /.col -->
</div>
<!-- /.row -->
</div><!-- /.container-fluid -->
</div>
<!-- /.content -->
</main>
<!-- /.app-content -->
<Footer />
</div>
<!-- ./app-wrapper -->
<Scripts />
</body>
</html>

358
src/html/pages/widgets/info-box.astro Normal file
View File

@@ -0,0 +1,358 @@
---
import Head from '@components/_head.astro';
import Footer from '@components/dashboard/_footer.astro';
import Topbar from '@components/dashboard/_topbar.astro';
import Sidenav from '@components/dashboard/_sidenav.astro';
import Scripts from '@components/_scripts.astro';
const title = 'AdminLTE 4 | Widgets - Info Box'
const mainPage = 'widgets'
const page = 'info-box'
---
<!DOCTYPE html>
<html lang="en">
<head>
<Head title={title} />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/ionicons@2.0.1/css/ionicons.min.css" integrity="sha256-kqxQgiD1u2DslOB2UFKOtmYl+CpHQK2gaM3gU2V4EoY=" crossorigin="anonymous">
</head>
<body class="layout-fixed bg-body-tertiary">
<div class="app-wrapper">
<Topbar />
<Sidenav mainPage={mainPage} page={page} />
<!-- Main content -->
<main class="app-main">
<div class="app-content-header">
<div class="container-fluid">
<div class="row">
<div class="col-sm-6">
<h3 class="mb-0">Info Box</h3>
</div>
<div class="col-sm-6">
<ol class="breadcrumb float-sm-end">
<li class="breadcrumb-item"><a href="#">Home</a></li>
<li class="breadcrumb-item active" aria-current="page">Info Box</li>
</ol>
</div>
</div>
</div>
</div>
<!-- Main content -->
<div class="app-content">
<div class="container-fluid">
<h5 class="mb-2">Info Box</h5>
<div class="row">
<div class="col-12 col-sm-6 col-md-3">
<div class="info-box">
<span class="info-box-icon text-bg-primary shadow-sm"><i class="fa-solid fa-cog"></i></span>
<div class="info-box-content">
<span class="info-box-text">CPU Traffic</span>
<span class="info-box-number">
10
<small>%</small>
</span>
</div>
<!-- /.info-box-content -->
</div>
<!-- /.info-box -->
</div>
<!-- /.col -->
<div class="col-12 col-sm-6 col-md-3">
<div class="info-box">
<span class="info-box-icon text-bg-success shadow-sm"><i class="fa-solid fa-shopping-cart"></i></span>
<div class="info-box-content">
<span class="info-box-text">Sales</span>
<span class="info-box-number">760</span>
</div>
<!-- /.info-box-content -->
</div>
<!-- /.info-box -->
</div>
<!-- /.col -->
<!-- fix for small devices only -->
<!-- <div class="clearfix hidden-md-up"></div> -->
<div class="col-12 col-sm-6 col-md-3">
<div class="info-box">
<span class="info-box-icon text-bg-warning shadow-sm"><i class="fa-solid fa-users"></i></span>
<div class="info-box-content">
<span class="info-box-text">New Members</span>
<span class="info-box-number">2,000</span>
</div>
<!-- /.info-box-content -->
</div>
<!-- /.info-box -->
</div>
<!-- /.col -->
<div class="col-12 col-sm-6 col-md-3">
<div class="info-box">
<span class="info-box-icon text-bg-danger shadow-sm"><i class="fa-solid fa-thumbs-up"></i></span>
<div class="info-box-content">
<span class="info-box-text">Likes</span>
<span class="info-box-number">41,410</span>
</div>
<!-- /.info-box-content -->
</div>
<!-- /.info-box -->
</div>
<!-- /.col -->
</div>
<!-- /.row -->
<!-- =========================================================== -->
<h5 class="mb-2">Info Box With Custom Shadows <small><i>Using Bootstrap's Shadow Utility</i></small></h5>
<div class="row">
<div class="col-12 col-sm-6 col-md-3">
<div class="info-box shadow-none">
<span class="info-box-icon text-bg-primary shadow-sm"><i class="fa-solid fa-cog"></i></span>
<div class="info-box-content">
<span class="info-box-text">CPU Traffic</span>
<span class="info-box-number">
10
<small>%</small>
</span>
</div>
<!-- /.info-box-content -->
</div>
<!-- /.info-box -->
</div>
<!-- /.col -->
<div class="col-12 col-sm-6 col-md-3">
<div class="info-box shadow-sm">
<span class="info-box-icon text-bg-success shadow-sm"><i class="fa-solid fa-shopping-cart"></i></span>
<div class="info-box-content">
<span class="info-box-text">Sales</span>
<span class="info-box-number">760</span>
</div>
<!-- /.info-box-content -->
</div>
<!-- /.info-box -->
</div>
<!-- /.col -->
<!-- fix for small devices only -->
<!-- <div class="clearfix hidden-md-up"></div> -->
<div class="col-12 col-sm-6 col-md-3">
<div class="info-box shadow">
<span class="info-box-icon text-bg-warning shadow-sm"><i class="fa-solid fa-users"></i></span>
<div class="info-box-content">
<span class="info-box-text">New Members</span>
<span class="info-box-number">2,000</span>
</div>
<!-- /.info-box-content -->
</div>
<!-- /.info-box -->
</div>
<!-- /.col -->
<div class="col-12 col-sm-6 col-md-3">
<div class="info-box shadow-lg">
<span class="info-box-icon text-bg-danger shadow-sm"><i class="fa-solid fa-thumbs-up"></i></span>
<div class="info-box-content">
<span class="info-box-text">Likes</span>
<span class="info-box-number">41,410</span>
</div>
<!-- /.info-box-content -->
</div>
<!-- /.info-box -->
</div>
<!-- /.col -->
</div>
<!-- /.row -->
<!-- =========================================================== -->
<h5 class="mt-4 mb-2">Info Box With <code>bg-*</code></h5>
<div class="row">
<div class="col-md-3 col-sm-6 col-12">
<div class="info-box text-bg-primary">
<span class="info-box-icon"><i class="fa-regular fa-bookmark"></i></span>
<div class="info-box-content">
<span class="info-box-text">Bookmarks</span>
<span class="info-box-number">41,410</span>
<div class="progress">
<div class="progress-bar" style="width: 70%"></div>
</div>
<span class="progress-description">
70% Increase in 30 Days
</span>
</div>
<!-- /.info-box-content -->
</div>
<!-- /.info-box -->
</div>
<!-- /.col -->
<div class="col-md-3 col-sm-6 col-12">
<div class="info-box text-bg-success">
<span class="info-box-icon"><i class="fa-regular fa-thumbs-up"></i></span>
<div class="info-box-content">
<span class="info-box-text">Likes</span>
<span class="info-box-number">41,410</span>
<div class="progress">
<div class="progress-bar" style="width: 70%"></div>
</div>
<span class="progress-description">
70% Increase in 30 Days
</span>
</div>
<!-- /.info-box-content -->
</div>
<!-- /.info-box -->
</div>
<!-- /.col -->
<div class="col-md-3 col-sm-6 col-12">
<div class="info-box text-bg-warning">
<span class="info-box-icon"><i class="fa-regular fa-calendar-alt"></i></span>
<div class="info-box-content">
<span class="info-box-text">Events</span>
<span class="info-box-number">41,410</span>
<div class="progress">
<div class="progress-bar" style="width: 70%"></div>
</div>
<span class="progress-description">
70% Increase in 30 Days
</span>
</div>
<!-- /.info-box-content -->
</div>
<!-- /.info-box -->
</div>
<!-- /.col -->
<div class="col-md-3 col-sm-6 col-12">
<div class="info-box text-bg-danger">
<span class="info-box-icon"><i class="fa-solid fa-comments"></i></span>
<div class="info-box-content">
<span class="info-box-text">Comments</span>
<span class="info-box-number">41,410</span>
<div class="progress">
<div class="progress-bar" style="width: 70%"></div>
</div>
<span class="progress-description">
70% Increase in 30 Days
</span>
</div>
<!-- /.info-box-content -->
</div>
<!-- /.info-box -->
</div>
<!-- /.col -->
</div>
<!-- /.row -->
<!-- =========================================================== -->
<h5 class="mt-4 mb-2">Info Box With <code>bg-gradient</code></h5>
<div class="row">
<div class="col-md-3 col-sm-6 col-12">
<div class="info-box text-bg-primary bg-gradient">
<span class="info-box-icon"><i class="fa-regular fa-bookmark"></i></span>
<div class="info-box-content">
<span class="info-box-text">Bookmarks</span>
<span class="info-box-number">41,410</span>
<div class="progress">
<div class="progress-bar" style="width: 70%"></div>
</div>
<span class="progress-description">
70% Increase in 30 Days
</span>
</div>
<!-- /.info-box-content -->
</div>
<!-- /.info-box -->
</div>
<!-- /.col -->
<div class="col-md-3 col-sm-6 col-12">
<div class="info-box text-bg-success bg-gradient">
<span class="info-box-icon"><i class="fa-regular fa-thumbs-up"></i></span>
<div class="info-box-content">
<span class="info-box-text">Likes</span>
<span class="info-box-number">41,410</span>
<div class="progress">
<div class="progress-bar" style="width: 70%"></div>
</div>
<span class="progress-description">
70% Increase in 30 Days
</span>
</div>
<!-- /.info-box-content -->
</div>
<!-- /.info-box -->
</div>
<!-- /.col -->
<div class="col-md-3 col-sm-6 col-12">
<div class="info-box text-bg-warning bg-gradient">
<span class="info-box-icon"><i class="fa-regular fa-calendar-alt"></i></span>
<div class="info-box-content">
<span class="info-box-text">Events</span>
<span class="info-box-number">41,410</span>
<div class="progress">
<div class="progress-bar" style="width: 70%"></div>
</div>
<span class="progress-description">
70% Increase in 30 Days
</span>
</div>
<!-- /.info-box-content -->
</div>
<!-- /.info-box -->
</div>
<!-- /.col -->
<div class="col-md-3 col-sm-6 col-12">
<div class="info-box text-bg-danger bg-gradient">
<span class="info-box-icon"><i class="fa-solid fa-comments"></i></span>
<div class="info-box-content">
<span class="info-box-text">Comments</span>
<span class="info-box-number">41,410</span>
<div class="progress">
<div class="progress-bar" style="width: 70%"></div>
</div>
<span class="progress-description">
70% Increase in 30 Days
</span>
</div>
<!-- /.info-box-content -->
</div>
<!-- /.info-box -->
</div>
<!-- /.col -->
</div>
<!-- /.row -->
</div><!-- /.container-fluid -->
</div>
<!-- /.content -->
</main>
<!-- /.app-content -->
<Footer />
</div>
<!-- ./app-wrapper -->
<Scripts />
</body>
</html>

119
src/html/pages/widgets/small-box.astro Normal file
View File

@@ -0,0 +1,119 @@
---
import Head from '@components/_head.astro';
import Footer from '@components/dashboard/_footer.astro';
import Topbar from '@components/dashboard/_topbar.astro';
import Sidenav from '@components/dashboard/_sidenav.astro';
import Scripts from '@components/_scripts.astro';
const title = 'AdminLTE 4 | Widgets - Small Box'
const mainPage = 'widgets'
const page = 'small-box'
---
<!DOCTYPE html>
<html lang="en">
<head>
<Head title={title} />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/ionicons@2.0.1/css/ionicons.min.css" integrity="sha256-kqxQgiD1u2DslOB2UFKOtmYl+CpHQK2gaM3gU2V4EoY=" crossorigin="anonymous">
</head>
<body class="layout-fixed bg-body-tertiary">
<div class="app-wrapper">
<Topbar />
<Sidenav mainPage={mainPage} page={page} />
<!-- Main content -->
<main class="app-main">
<div class="app-content-header">
<div class="container-fluid">
<div class="row">
<div class="col-sm-6">
<h3 class="mb-0">Small Box</h3>
</div>
<div class="col-sm-6">
<ol class="breadcrumb float-sm-end">
<li class="breadcrumb-item"><a href="#">Home</a></li>
<li class="breadcrumb-item active" aria-current="page">Small Box</li>
</ol>
</div>
</div>
</div>
</div>
<!-- Main content -->
<div class="app-content">
<div class="container-fluid">
<!-- Small Box (Stat card) -->
<h5 class="mb-2">Small Box</h5>
<div class="row">
<div class="col-lg-3 col-6">
<!-- small box -->
<div class="small-box text-bg-primary">
<div class="inner">
<h3>150</h3>
<p>New Orders</p>
</div>
<div class="icon">
<i class="inner-icon ion ion-bag"></i>
</div>
<a href="#" class="small-box-footer">More info <i class="fa-solid fa-arrow-circle-right"></i></a>
</div>
</div>
<!-- ./col -->
<div class="col-lg-3 col-6">
<!-- small box -->
<div class="small-box text-bg-success">
<div class="inner">
<h3>53<sup class="fs-5">%</sup></h3>
<p>Bounce Rate</p>
</div>
<div class="icon">
<i class="inner-icon ion ion-stats-bars"></i>
</div>
<a href="#" class="small-box-footer">More info <i class="fa-solid fa-arrow-circle-right"></i></a>
</div>
</div>
<!-- ./col -->
<div class="col-lg-3 col-6">
<!-- small box -->
<div class="small-box text-bg-warning">
<div class="inner">
<h3>44</h3>
<p>User Registrations</p>
</div>
<div class="icon">
<i class="inner-icon ion ion-person-add"></i>
</div>
<a href="#" class="small-box-footer">More info <i class="fa-solid fa-arrow-circle-right"></i></a>
</div>
</div>
<!-- ./col -->
<div class="col-lg-3 col-6">
<!-- small box -->
<div class="small-box text-bg-danger">
<div class="inner">
<h3>65</h3>
<p>Unique Visitors</p>
</div>
<div class="icon">
<i class="inner-icon ion ion-pie-graph"></i>
</div>
<a href="#" class="small-box-footer">More info <i class="fa-solid fa-arrow-circle-right"></i></a>
</div>
</div>
<!-- ./col -->
</div>
<!-- /.row -->
</div><!-- /.container-fluid -->
</div>
<!-- /.content -->
</main>
<!-- /.app-content -->
<Footer />
</div>
<!-- ./app-wrapper -->
<Scripts />
</body>
</html>