admin-lte 4.0.0-alpha2 → 4.0.0-alpha3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.bundlewatch.config.json +6 -6
- package/.cache/.eslintcache +1 -1
- package/.cache/.stylelintcache +1 -1
- package/.gitpod.yml +1 -1
- package/.idea/AdminLTE.iml +4 -0
- package/.idea/codeStyles/Project.xml +24 -0
- package/.idea/dbnavigator.xml +421 -0
- package/.idea/git_toolbox_prj.xml +15 -0
- package/.idea/jsLibraryMappings.xml +6 -0
- package/.idea/jsLinters/eslint.xml +6 -0
- package/.idea/vcs.xml +6 -0
- package/README.md +3 -3
- package/dist/assets/img/AdminLTEFullLogo.png +0 -0
- package/dist/css/adminlte.css +695 -318
- package/dist/css/adminlte.css.map +1 -1
- package/dist/css/adminlte.min.css +1 -1
- package/dist/css/adminlte.min.css.map +1 -1
- package/dist/css/adminlte.rtl.css +693 -316
- package/dist/css/adminlte.rtl.css.map +1 -1
- package/dist/css/adminlte.rtl.min.css +1 -1
- package/dist/css/adminlte.rtl.min.css.map +1 -1
- package/dist/js/adminlte.js +43 -63
- package/dist/js/adminlte.js.map +1 -1
- package/dist/js/adminlte.min.js +2 -2
- package/dist/js/adminlte.min.js.map +1 -1
- package/dist/pages/UI/timeline.html +389 -218
- package/dist/pages/docs/browser-support.html +345 -204
- package/dist/pages/docs/color-mode.html +560 -348
- package/dist/pages/docs/components/main-header.html +579 -368
- package/dist/pages/docs/components/main-sidebar.html +858 -0
- package/dist/pages/docs/faq.html +743 -0
- package/dist/pages/docs/how-to-contribute.html +783 -0
- package/dist/pages/docs/introduction.html +767 -0
- package/dist/pages/docs/javascript/treeview.html +762 -0
- package/dist/pages/docs/layout.html +372 -201
- package/dist/pages/{docs.html → docs/license.html} +347 -218
- package/dist/pages/examples/lockscreen.html +107 -0
- package/dist/pages/examples/login-v2.html +148 -0
- package/dist/pages/examples/login.html +45 -40
- package/dist/pages/examples/register-v2.html +155 -0
- package/dist/pages/examples/register.html +46 -41
- package/dist/pages/forms/general.html +664 -202
- package/dist/pages/index.html +514 -285
- package/dist/pages/index2.html +665 -341
- package/dist/pages/index3.html +415 -254
- package/dist/pages/layout/collapsed-sidebar.html +766 -0
- package/dist/pages/layout/fixed-complete.html +867 -0
- package/dist/pages/layout/fixed-sidebar.html +344 -201
- package/dist/pages/layout/layout-rtl.html +344 -201
- package/dist/pages/layout/logo-switch.html +433 -0
- package/dist/pages/layout/sidebar-mini.html +345 -202
- package/dist/pages/layout/unfixed-sidebar.html +343 -201
- package/dist/pages/tables/simple.html +437 -233
- package/dist/pages/widgets/cards.html +389 -244
- package/dist/pages/widgets/info-box.html +398 -215
- package/dist/pages/widgets/small-box.html +349 -198
- package/index.html +6 -10
- package/package.json +27 -24
- package/src/assets/img/AdminLTEFullLogo.png +0 -0
- package/src/config/astro.config.mjs +3 -1
- package/src/html/.prettierrc.js +11 -0
- package/src/html/components/_head.astro +42 -26
- package/src/html/components/_scripts.astro +38 -27
- package/src/html/components/dashboard/_footer.astro +14 -8
- package/src/html/components/dashboard/_sidenav.astro +343 -113
- package/src/html/components/dashboard/_topbar.astro +90 -49
- package/src/html/components/docs/{browser-support/index.md → browser-support.mdx} +2 -1
- package/src/html/components/docs/color-mode.mdx +169 -0
- package/src/html/components/docs/components/{main-header-1.md → main-header.mdx} +60 -21
- package/src/html/components/docs/components/main-sidebar.mdx +129 -0
- package/src/html/components/docs/faq.mdx +11 -0
- package/src/html/components/docs/how-to-contribute.mdx +34 -0
- package/src/html/components/docs/{introduction/index.md → introduction.mdx} +27 -2
- package/src/html/components/docs/license.mdx +9 -0
- package/src/html/components/javascript/treeview.mdx +39 -0
- package/src/html/pages/UI/timeline.astro +111 -48
- package/src/html/pages/docs/browser-support.astro +24 -11
- package/src/html/pages/docs/color-mode.astro +89 -42
- package/src/html/pages/docs/components/main-header.astro +133 -46
- package/src/html/pages/docs/components/main-sidebar.astro +71 -0
- package/src/html/pages/docs/faq.astro +71 -0
- package/src/html/pages/docs/how-to-contribute.astro +71 -0
- package/src/html/pages/docs/{index.astro → introduction.astro} +24 -11
- package/src/html/pages/docs/javascript/treeview.astro +71 -0
- package/src/html/pages/docs/layout.astro +62 -19
- package/src/html/pages/docs/license.astro +71 -0
- package/src/html/pages/examples/lockscreen.astro +63 -0
- package/src/html/pages/examples/login-v2.astro +109 -0
- package/src/html/pages/examples/login.astro +34 -16
- package/src/html/pages/examples/register-v2.astro +116 -0
- package/src/html/pages/examples/register.astro +36 -18
- package/src/html/pages/forms/general.astro +567 -36
- package/src/html/pages/index.astro +389 -152
- package/src/html/pages/index2.astro +682 -250
- package/src/html/pages/index3.astro +290 -189
- package/src/html/pages/layout/collapsed-sidebar.astro +110 -0
- package/src/html/pages/layout/fixed-complete.astro +209 -0
- package/src/html/pages/layout/fixed-sidebar.astro +52 -27
- package/src/html/pages/layout/layout-rtl.astro +53 -28
- package/src/html/pages/layout/logo-switch.astro +212 -0
- package/src/html/pages/layout/sidebar-mini.astro +53 -28
- package/src/html/pages/layout/unfixed-sidebar.astro +51 -27
- package/src/html/pages/tables/simple.astro +206 -66
- package/src/html/pages/widgets/cards.astro +134 -69
- package/src/html/pages/widgets/info-box.astro +96 -41
- package/src/html/pages/widgets/small-box.astro +93 -32
- package/src/scss/_app-content.scss +52 -0
- package/src/scss/_app-footer.scss +1 -1
- package/src/scss/_app-main.scss +2 -5
- package/src/scss/_app-sidebar.scss +244 -70
- package/src/scss/_bootstrap-variables.scss +4 -4
- package/src/scss/_cards.scss +31 -7
- package/src/scss/_compact-mode.scss +79 -0
- package/src/scss/_small-box.scss +0 -3
- package/src/scss/_variables.scss +21 -4
- package/src/scss/mixins/_animations.scss +0 -5
- package/src/scss/pages/_lockscreen.scss +74 -0
- package/src/scss/pages/_login_and_register.scss +0 -3
- package/src/scss/parts/_core.scss +2 -0
- package/src/scss/parts/_pages.scss +1 -0
- package/src/ts/card-widget.ts +17 -50
- package/src/ts/direct-chat.ts +2 -2
- package/src/ts/layout.ts +2 -2
- package/src/ts/push-menu.ts +3 -20
- package/src/ts/treeview.ts +14 -8
- package/src/ts/util/index.ts +14 -12
- package/src/utils/index.js +20 -3
- package/src/html/components/docs/color-mode/navbar-html.md +0 -80
- package/src/html/components/docs/color-mode/toggle-script.md +0 -48
|
@@ -1,28 +1,36 @@
|
|
|
1
1
|
---
|
|
2
|
-
import Head from
|
|
3
|
-
import Footer from
|
|
4
|
-
import Topbar from
|
|
5
|
-
import Sidenav from
|
|
6
|
-
import Scripts from
|
|
7
|
-
|
|
8
|
-
const title =
|
|
9
|
-
const path =
|
|
10
|
-
const mainPage =
|
|
11
|
-
const page =
|
|
2
|
+
import Head from "@components/_head.astro";
|
|
3
|
+
import Footer from "@components/dashboard/_footer.astro";
|
|
4
|
+
import Topbar from "@components/dashboard/_topbar.astro";
|
|
5
|
+
import Sidenav from "@components/dashboard/_sidenav.astro";
|
|
6
|
+
import Scripts from "@components/_scripts.astro";
|
|
7
|
+
|
|
8
|
+
const title = "AdminLTE 4 | Widgets - Info Box";
|
|
9
|
+
const path = "../../../dist";
|
|
10
|
+
const mainPage = "widgets";
|
|
11
|
+
const page = "info-box";
|
|
12
12
|
---
|
|
13
|
+
|
|
13
14
|
<!DOCTYPE html>
|
|
14
15
|
<html lang="en">
|
|
16
|
+
<!--begin::Head-->
|
|
15
17
|
<head>
|
|
16
18
|
<Head title={title} path={path} />
|
|
17
19
|
</head>
|
|
20
|
+
<!--end::Head-->
|
|
21
|
+
<!--begin::Body-->
|
|
18
22
|
<body class="layout-fixed sidebar-expand-lg bg-body-tertiary">
|
|
23
|
+
<!--begin::App Wrapper-->
|
|
19
24
|
<div class="app-wrapper">
|
|
20
25
|
<Topbar path={path} />
|
|
21
26
|
<Sidenav path={path} mainPage={mainPage} page={page} />
|
|
22
|
-
<!-- Main
|
|
27
|
+
<!--begin::App Main-->
|
|
23
28
|
<main class="app-main">
|
|
29
|
+
<!--begin::App Content Header-->
|
|
24
30
|
<div class="app-content-header">
|
|
31
|
+
<!--begin::Container-->
|
|
25
32
|
<div class="container-fluid">
|
|
33
|
+
<!--begin::Row-->
|
|
26
34
|
<div class="row">
|
|
27
35
|
<div class="col-sm-6">
|
|
28
36
|
<h3 class="mb-0">Info Box</h3>
|
|
@@ -30,20 +38,29 @@ const page = 'info-box'
|
|
|
30
38
|
<div class="col-sm-6">
|
|
31
39
|
<ol class="breadcrumb float-sm-end">
|
|
32
40
|
<li class="breadcrumb-item"><a href="#">Home</a></li>
|
|
33
|
-
<li class="breadcrumb-item active" aria-current="page">
|
|
41
|
+
<li class="breadcrumb-item active" aria-current="page">
|
|
42
|
+
Info Box
|
|
43
|
+
</li>
|
|
34
44
|
</ol>
|
|
35
45
|
</div>
|
|
36
46
|
</div>
|
|
47
|
+
<!--end::Row-->
|
|
37
48
|
</div>
|
|
49
|
+
<!--end::Container-->
|
|
38
50
|
</div>
|
|
39
|
-
<!--
|
|
51
|
+
<!--end::App Content Header-->
|
|
52
|
+
<!--begin::App Content-->
|
|
40
53
|
<div class="app-content">
|
|
54
|
+
<!--begin::Container-->
|
|
41
55
|
<div class="container-fluid">
|
|
42
56
|
<h5 class="mb-2">Info Box</h5>
|
|
57
|
+
<!--begin::Row-->
|
|
43
58
|
<div class="row">
|
|
44
59
|
<div class="col-12 col-sm-6 col-md-3">
|
|
45
60
|
<div class="info-box">
|
|
46
|
-
<span class="info-box-icon text-bg-primary shadow-sm"
|
|
61
|
+
<span class="info-box-icon text-bg-primary shadow-sm">
|
|
62
|
+
<i class="bi bi-gear-fill"></i>
|
|
63
|
+
</span>
|
|
47
64
|
|
|
48
65
|
<div class="info-box-content">
|
|
49
66
|
<span class="info-box-text">CPU Traffic</span>
|
|
@@ -60,7 +77,9 @@ const page = 'info-box'
|
|
|
60
77
|
|
|
61
78
|
<div class="col-12 col-sm-6 col-md-3">
|
|
62
79
|
<div class="info-box">
|
|
63
|
-
<span class="info-box-icon text-bg-success shadow-sm"
|
|
80
|
+
<span class="info-box-icon text-bg-success shadow-sm">
|
|
81
|
+
<i class="bi bi-cart-fill"></i>
|
|
82
|
+
</span>
|
|
64
83
|
|
|
65
84
|
<div class="info-box-content">
|
|
66
85
|
<span class="info-box-text">Sales</span>
|
|
@@ -77,7 +96,9 @@ const page = 'info-box'
|
|
|
77
96
|
|
|
78
97
|
<div class="col-12 col-sm-6 col-md-3">
|
|
79
98
|
<div class="info-box">
|
|
80
|
-
<span class="info-box-icon text-bg-warning shadow-sm"
|
|
99
|
+
<span class="info-box-icon text-bg-warning shadow-sm">
|
|
100
|
+
<i class="bi bi-people-fill"></i>
|
|
101
|
+
</span>
|
|
81
102
|
|
|
82
103
|
<div class="info-box-content">
|
|
83
104
|
<span class="info-box-text">New Members</span>
|
|
@@ -91,7 +112,9 @@ const page = 'info-box'
|
|
|
91
112
|
|
|
92
113
|
<div class="col-12 col-sm-6 col-md-3">
|
|
93
114
|
<div class="info-box">
|
|
94
|
-
<span class="info-box-icon text-bg-danger shadow-sm"
|
|
115
|
+
<span class="info-box-icon text-bg-danger shadow-sm">
|
|
116
|
+
<i class="bi bi-hand-thumbs-up-fill"></i>
|
|
117
|
+
</span>
|
|
95
118
|
|
|
96
119
|
<div class="info-box-content">
|
|
97
120
|
<span class="info-box-text">Likes</span>
|
|
@@ -103,14 +126,21 @@ const page = 'info-box'
|
|
|
103
126
|
</div>
|
|
104
127
|
<!-- /.col -->
|
|
105
128
|
</div>
|
|
106
|
-
<!--
|
|
129
|
+
<!--end::Row-->
|
|
107
130
|
|
|
108
131
|
<!-- =========================================================== -->
|
|
109
|
-
<h5 class="mb-2">
|
|
132
|
+
<h5 class="mb-2">
|
|
133
|
+
Info Box With Custom Shadows <small>
|
|
134
|
+
<i>Using Bootstrap's Shadow Utility</i>
|
|
135
|
+
</small>
|
|
136
|
+
</h5>
|
|
137
|
+
<!--begin::Row-->
|
|
110
138
|
<div class="row">
|
|
111
139
|
<div class="col-12 col-sm-6 col-md-3">
|
|
112
140
|
<div class="info-box shadow-none">
|
|
113
|
-
<span class="info-box-icon text-bg-primary shadow-sm"
|
|
141
|
+
<span class="info-box-icon text-bg-primary shadow-sm">
|
|
142
|
+
<i class="bi bi-gear-fill"></i>
|
|
143
|
+
</span>
|
|
114
144
|
|
|
115
145
|
<div class="info-box-content">
|
|
116
146
|
<span class="info-box-text">CPU Traffic</span>
|
|
@@ -127,7 +157,9 @@ const page = 'info-box'
|
|
|
127
157
|
|
|
128
158
|
<div class="col-12 col-sm-6 col-md-3">
|
|
129
159
|
<div class="info-box shadow-sm">
|
|
130
|
-
<span class="info-box-icon text-bg-success shadow-sm"
|
|
160
|
+
<span class="info-box-icon text-bg-success shadow-sm">
|
|
161
|
+
<i class="bi bi-cart-fill"></i>
|
|
162
|
+
</span>
|
|
131
163
|
|
|
132
164
|
<div class="info-box-content">
|
|
133
165
|
<span class="info-box-text">Sales</span>
|
|
@@ -144,7 +176,9 @@ const page = 'info-box'
|
|
|
144
176
|
|
|
145
177
|
<div class="col-12 col-sm-6 col-md-3">
|
|
146
178
|
<div class="info-box shadow">
|
|
147
|
-
<span class="info-box-icon text-bg-warning shadow-sm"
|
|
179
|
+
<span class="info-box-icon text-bg-warning shadow-sm">
|
|
180
|
+
<i class="bi bi-people-fill"></i>
|
|
181
|
+
</span>
|
|
148
182
|
|
|
149
183
|
<div class="info-box-content">
|
|
150
184
|
<span class="info-box-text">New Members</span>
|
|
@@ -158,7 +192,9 @@ const page = 'info-box'
|
|
|
158
192
|
|
|
159
193
|
<div class="col-12 col-sm-6 col-md-3">
|
|
160
194
|
<div class="info-box shadow-lg">
|
|
161
|
-
<span class="info-box-icon text-bg-danger shadow-sm"
|
|
195
|
+
<span class="info-box-icon text-bg-danger shadow-sm">
|
|
196
|
+
<i class="bi bi-hand-thumbs-up-fill"></i>
|
|
197
|
+
</span>
|
|
162
198
|
|
|
163
199
|
<div class="info-box-content">
|
|
164
200
|
<span class="info-box-text">Likes</span>
|
|
@@ -170,14 +206,17 @@ const page = 'info-box'
|
|
|
170
206
|
</div>
|
|
171
207
|
<!-- /.col -->
|
|
172
208
|
</div>
|
|
173
|
-
<!--
|
|
209
|
+
<!--end::Row-->
|
|
174
210
|
|
|
175
211
|
<!-- =========================================================== -->
|
|
176
212
|
<h5 class="mt-4 mb-2">Info Box With <code>bg-*</code></h5>
|
|
213
|
+
<!--begin::Row-->
|
|
177
214
|
<div class="row">
|
|
178
215
|
<div class="col-md-3 col-sm-6 col-12">
|
|
179
216
|
<div class="info-box text-bg-primary">
|
|
180
|
-
<span class="info-box-icon"
|
|
217
|
+
<span class="info-box-icon">
|
|
218
|
+
<i class="bi bi-bookmark-fill"></i>
|
|
219
|
+
</span>
|
|
181
220
|
|
|
182
221
|
<div class="info-box-content">
|
|
183
222
|
<span class="info-box-text">Bookmarks</span>
|
|
@@ -197,7 +236,9 @@ const page = 'info-box'
|
|
|
197
236
|
<!-- /.col -->
|
|
198
237
|
<div class="col-md-3 col-sm-6 col-12">
|
|
199
238
|
<div class="info-box text-bg-success">
|
|
200
|
-
<span class="info-box-icon"
|
|
239
|
+
<span class="info-box-icon">
|
|
240
|
+
<i class="bi bi-hand-thumbs-up"></i>
|
|
241
|
+
</span>
|
|
201
242
|
|
|
202
243
|
<div class="info-box-content">
|
|
203
244
|
<span class="info-box-text">Likes</span>
|
|
@@ -217,7 +258,9 @@ const page = 'info-box'
|
|
|
217
258
|
<!-- /.col -->
|
|
218
259
|
<div class="col-md-3 col-sm-6 col-12">
|
|
219
260
|
<div class="info-box text-bg-warning">
|
|
220
|
-
<span class="info-box-icon"
|
|
261
|
+
<span class="info-box-icon">
|
|
262
|
+
<i class="bi bi-calendar3"></i>
|
|
263
|
+
</span>
|
|
221
264
|
|
|
222
265
|
<div class="info-box-content">
|
|
223
266
|
<span class="info-box-text">Events</span>
|
|
@@ -237,7 +280,9 @@ const page = 'info-box'
|
|
|
237
280
|
<!-- /.col -->
|
|
238
281
|
<div class="col-md-3 col-sm-6 col-12">
|
|
239
282
|
<div class="info-box text-bg-danger">
|
|
240
|
-
<span class="info-box-icon"
|
|
283
|
+
<span class="info-box-icon">
|
|
284
|
+
<i class="bi bi-chat-text-fill"></i>
|
|
285
|
+
</span>
|
|
241
286
|
|
|
242
287
|
<div class="info-box-content">
|
|
243
288
|
<span class="info-box-text">Comments</span>
|
|
@@ -256,14 +301,17 @@ const page = 'info-box'
|
|
|
256
301
|
</div>
|
|
257
302
|
<!-- /.col -->
|
|
258
303
|
</div>
|
|
259
|
-
<!--
|
|
304
|
+
<!--end::Row-->
|
|
260
305
|
|
|
261
306
|
<!-- =========================================================== -->
|
|
262
307
|
<h5 class="mt-4 mb-2">Info Box With <code>bg-gradient</code></h5>
|
|
308
|
+
<!--begin::Row-->
|
|
263
309
|
<div class="row">
|
|
264
310
|
<div class="col-md-3 col-sm-6 col-12">
|
|
265
311
|
<div class="info-box text-bg-primary bg-gradient">
|
|
266
|
-
<span class="info-box-icon"
|
|
312
|
+
<span class="info-box-icon">
|
|
313
|
+
<i class="bi bi-bookmark-fill"></i>
|
|
314
|
+
</span>
|
|
267
315
|
|
|
268
316
|
<div class="info-box-content">
|
|
269
317
|
<span class="info-box-text">Bookmarks</span>
|
|
@@ -283,7 +331,9 @@ const page = 'info-box'
|
|
|
283
331
|
<!-- /.col -->
|
|
284
332
|
<div class="col-md-3 col-sm-6 col-12">
|
|
285
333
|
<div class="info-box text-bg-success bg-gradient">
|
|
286
|
-
<span class="info-box-icon"
|
|
334
|
+
<span class="info-box-icon">
|
|
335
|
+
<i class="bi bi-hand-thumbs-up"></i>
|
|
336
|
+
</span>
|
|
287
337
|
|
|
288
338
|
<div class="info-box-content">
|
|
289
339
|
<span class="info-box-text">Likes</span>
|
|
@@ -303,7 +353,9 @@ const page = 'info-box'
|
|
|
303
353
|
<!-- /.col -->
|
|
304
354
|
<div class="col-md-3 col-sm-6 col-12">
|
|
305
355
|
<div class="info-box text-bg-warning bg-gradient">
|
|
306
|
-
<span class="info-box-icon"
|
|
356
|
+
<span class="info-box-icon">
|
|
357
|
+
<i class="bi bi-calendar3"></i>
|
|
358
|
+
</span>
|
|
307
359
|
|
|
308
360
|
<div class="info-box-content">
|
|
309
361
|
<span class="info-box-text">Events</span>
|
|
@@ -323,7 +375,9 @@ const page = 'info-box'
|
|
|
323
375
|
<!-- /.col -->
|
|
324
376
|
<div class="col-md-3 col-sm-6 col-12">
|
|
325
377
|
<div class="info-box text-bg-danger bg-gradient">
|
|
326
|
-
<span class="info-box-icon"
|
|
378
|
+
<span class="info-box-icon">
|
|
379
|
+
<i class="bi bi-chat-text-fill"></i>
|
|
380
|
+
</span>
|
|
327
381
|
|
|
328
382
|
<div class="info-box-content">
|
|
329
383
|
<span class="info-box-text">Comments</span>
|
|
@@ -342,17 +396,18 @@ const page = 'info-box'
|
|
|
342
396
|
</div>
|
|
343
397
|
<!-- /.col -->
|
|
344
398
|
</div>
|
|
345
|
-
<!--
|
|
346
|
-
</div
|
|
399
|
+
<!--end::Row-->
|
|
400
|
+
</div>
|
|
401
|
+
<!--end::Container-->
|
|
347
402
|
</div>
|
|
348
|
-
<!--
|
|
403
|
+
<!--end::App Content-->
|
|
349
404
|
</main>
|
|
350
|
-
<!--
|
|
351
|
-
|
|
405
|
+
<!--end::App Main-->
|
|
352
406
|
<Footer />
|
|
353
407
|
</div>
|
|
354
|
-
<!--
|
|
355
|
-
|
|
408
|
+
<!--end::App Wrapper-->
|
|
409
|
+
<!--begin::Script-->
|
|
356
410
|
<Scripts path={path} />
|
|
357
|
-
|
|
411
|
+
<!--end::Script-->
|
|
412
|
+
</body><!--end::Body-->
|
|
358
413
|
</html>
|
|
@@ -1,28 +1,36 @@
|
|
|
1
1
|
---
|
|
2
|
-
import Head from
|
|
3
|
-
import Footer from
|
|
4
|
-
import Topbar from
|
|
5
|
-
import Sidenav from
|
|
6
|
-
import Scripts from
|
|
2
|
+
import Head from "@components/_head.astro";
|
|
3
|
+
import Footer from "@components/dashboard/_footer.astro";
|
|
4
|
+
import Topbar from "@components/dashboard/_topbar.astro";
|
|
5
|
+
import Sidenav from "@components/dashboard/_sidenav.astro";
|
|
6
|
+
import Scripts from "@components/_scripts.astro";
|
|
7
7
|
|
|
8
|
-
const title =
|
|
9
|
-
const path =
|
|
10
|
-
const mainPage =
|
|
11
|
-
const page =
|
|
8
|
+
const title = "AdminLTE 4 | Widgets - Small Box";
|
|
9
|
+
const path = "../../../dist";
|
|
10
|
+
const mainPage = "widgets";
|
|
11
|
+
const page = "small-box";
|
|
12
12
|
---
|
|
13
|
+
|
|
13
14
|
<!DOCTYPE html>
|
|
14
15
|
<html lang="en">
|
|
16
|
+
<!--begin::Head-->
|
|
15
17
|
<head>
|
|
16
18
|
<Head title={title} path={path} />
|
|
17
19
|
</head>
|
|
20
|
+
<!--end::Head-->
|
|
21
|
+
<!--begin::Body-->
|
|
18
22
|
<body class="layout-fixed sidebar-expand-lg bg-body-tertiary">
|
|
23
|
+
<!--begin::App Wrapper-->
|
|
19
24
|
<div class="app-wrapper">
|
|
20
25
|
<Topbar path={path} />
|
|
21
26
|
<Sidenav path={path} mainPage={mainPage} page={page} />
|
|
22
|
-
<!-- Main
|
|
27
|
+
<!--begin::App Main-->
|
|
23
28
|
<main class="app-main">
|
|
29
|
+
<!--begin::App Content Header-->
|
|
24
30
|
<div class="app-content-header">
|
|
31
|
+
<!--begin::Container-->
|
|
25
32
|
<div class="container-fluid">
|
|
33
|
+
<!--begin::Row-->
|
|
26
34
|
<div class="row">
|
|
27
35
|
<div class="col-sm-6">
|
|
28
36
|
<h3 class="mb-0">Small Box</h3>
|
|
@@ -30,14 +38,20 @@ const page = 'small-box'
|
|
|
30
38
|
<div class="col-sm-6">
|
|
31
39
|
<ol class="breadcrumb float-sm-end">
|
|
32
40
|
<li class="breadcrumb-item"><a href="#">Home</a></li>
|
|
33
|
-
<li class="breadcrumb-item active" aria-current="page">
|
|
41
|
+
<li class="breadcrumb-item active" aria-current="page">
|
|
42
|
+
Small Box
|
|
43
|
+
</li>
|
|
34
44
|
</ol>
|
|
35
45
|
</div>
|
|
36
46
|
</div>
|
|
47
|
+
<!--end::Row-->
|
|
37
48
|
</div>
|
|
49
|
+
<!--end::Container-->
|
|
38
50
|
</div>
|
|
39
|
-
<!--
|
|
51
|
+
<!--end::App Content Header-->
|
|
52
|
+
<!--begin::App Content-->
|
|
40
53
|
<div class="app-content">
|
|
54
|
+
<!--begin::Container-->
|
|
41
55
|
<div class="container-fluid">
|
|
42
56
|
<!-- Small Box (Stat card) -->
|
|
43
57
|
<h5 class="mb-2">Small Box</h5>
|
|
@@ -51,10 +65,20 @@ const page = 'small-box'
|
|
|
51
65
|
|
|
52
66
|
<p>New Orders</p>
|
|
53
67
|
</div>
|
|
54
|
-
<svg
|
|
55
|
-
|
|
68
|
+
<svg
|
|
69
|
+
class="small-box-icon"
|
|
70
|
+
fill="currentColor"
|
|
71
|
+
viewBox="0 0 24 24"
|
|
72
|
+
xmlns="http://www.w3.org/2000/svg"
|
|
73
|
+
aria-hidden="true"
|
|
74
|
+
>
|
|
75
|
+
<path
|
|
76
|
+
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"
|
|
77
|
+
></path>
|
|
56
78
|
</svg>
|
|
57
|
-
<a href="#" class="small-box-footer
|
|
79
|
+
<a href="#" class="small-box-footer link-light link-underline-opacity-0 link-underline-opacity-50-hover">
|
|
80
|
+
More info <i class="bi bi-link-45deg"></i>
|
|
81
|
+
</a>
|
|
58
82
|
</div>
|
|
59
83
|
</div>
|
|
60
84
|
<!-- ./col -->
|
|
@@ -66,10 +90,20 @@ const page = 'small-box'
|
|
|
66
90
|
|
|
67
91
|
<p>Bounce Rate</p>
|
|
68
92
|
</div>
|
|
69
|
-
<svg
|
|
70
|
-
|
|
93
|
+
<svg
|
|
94
|
+
class="small-box-icon"
|
|
95
|
+
fill="currentColor"
|
|
96
|
+
viewBox="0 0 24 24"
|
|
97
|
+
xmlns="http://www.w3.org/2000/svg"
|
|
98
|
+
aria-hidden="true"
|
|
99
|
+
>
|
|
100
|
+
<path
|
|
101
|
+
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"
|
|
102
|
+
></path>
|
|
71
103
|
</svg>
|
|
72
|
-
<a href="#" class="small-box-footer
|
|
104
|
+
<a href="#" class="small-box-footer link-light link-underline-opacity-0 link-underline-opacity-50-hover">
|
|
105
|
+
More info <i class="bi bi-link-45deg"></i>
|
|
106
|
+
</a>
|
|
73
107
|
</div>
|
|
74
108
|
</div>
|
|
75
109
|
<!-- ./col -->
|
|
@@ -81,10 +115,20 @@ const page = 'small-box'
|
|
|
81
115
|
|
|
82
116
|
<p>User Registrations</p>
|
|
83
117
|
</div>
|
|
84
|
-
<svg
|
|
85
|
-
|
|
118
|
+
<svg
|
|
119
|
+
class="small-box-icon"
|
|
120
|
+
fill="currentColor"
|
|
121
|
+
viewBox="0 0 24 24"
|
|
122
|
+
xmlns="http://www.w3.org/2000/svg"
|
|
123
|
+
aria-hidden="true"
|
|
124
|
+
>
|
|
125
|
+
<path
|
|
126
|
+
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"
|
|
127
|
+
></path>
|
|
86
128
|
</svg>
|
|
87
|
-
<a href="#" class="small-box-footer
|
|
129
|
+
<a href="#" class="small-box-footer link-light link-underline-opacity-0 link-underline-opacity-50-hover">
|
|
130
|
+
More info <i class="bi bi-link-45deg"></i>
|
|
131
|
+
</a>
|
|
88
132
|
</div>
|
|
89
133
|
</div>
|
|
90
134
|
<!-- ./col -->
|
|
@@ -96,26 +140,43 @@ const page = 'small-box'
|
|
|
96
140
|
|
|
97
141
|
<p>Unique Visitors</p>
|
|
98
142
|
</div>
|
|
99
|
-
<svg
|
|
100
|
-
|
|
101
|
-
|
|
143
|
+
<svg
|
|
144
|
+
class="small-box-icon"
|
|
145
|
+
fill="currentColor"
|
|
146
|
+
viewBox="0 0 24 24"
|
|
147
|
+
xmlns="http://www.w3.org/2000/svg"
|
|
148
|
+
aria-hidden="true"
|
|
149
|
+
>
|
|
150
|
+
<path
|
|
151
|
+
clip-rule="evenodd"
|
|
152
|
+
fill-rule="evenodd"
|
|
153
|
+
d="M2.25 13.5a8.25 8.25 0 018.25-8.25.75.75 0 01.75.75v6.75H18a.75.75 0 01.75.75 8.25 8.25 0 01-16.5 0z"
|
|
154
|
+
></path>
|
|
155
|
+
<path
|
|
156
|
+
clip-rule="evenodd"
|
|
157
|
+
fill-rule="evenodd"
|
|
158
|
+
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"
|
|
159
|
+
></path>
|
|
102
160
|
</svg>
|
|
103
|
-
<a href="#" class="small-box-footer
|
|
161
|
+
<a href="#" class="small-box-footer link-light link-underline-opacity-0 link-underline-opacity-50-hover">
|
|
162
|
+
More info <i class="bi bi-link-45deg"></i>
|
|
163
|
+
</a>
|
|
104
164
|
</div>
|
|
105
165
|
</div>
|
|
106
166
|
<!-- ./col -->
|
|
107
167
|
</div>
|
|
108
168
|
<!-- /.row -->
|
|
109
|
-
</div
|
|
169
|
+
</div>
|
|
170
|
+
<!--end::Container-->
|
|
110
171
|
</div>
|
|
111
|
-
<!--
|
|
172
|
+
<!--end::App Content-->
|
|
112
173
|
</main>
|
|
113
|
-
<!--
|
|
114
|
-
|
|
174
|
+
<!--end::App Main-->
|
|
115
175
|
<Footer />
|
|
116
176
|
</div>
|
|
117
|
-
<!--
|
|
118
|
-
|
|
177
|
+
<!--end::App Wrapper-->
|
|
178
|
+
<!--begin::Script-->
|
|
119
179
|
<Scripts path={path} />
|
|
120
|
-
|
|
180
|
+
<!--end::Script-->
|
|
181
|
+
</body><!--end::Body-->
|
|
121
182
|
</html>
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
.app-content {
|
|
2
|
+
padding: $lte-content-padding-y $lte-content-padding-x;
|
|
3
|
+
}
|
|
4
|
+
|
|
5
|
+
.app-content-top-area,
|
|
6
|
+
.app-content-bottom-area{
|
|
7
|
+
display: flex;
|
|
8
|
+
align-items: center;
|
|
9
|
+
padding: $lte-content-padding-y $lte-content-padding-x;
|
|
10
|
+
overflow: auto;
|
|
11
|
+
background: $lte-app-footer-bg;
|
|
12
|
+
|
|
13
|
+
> .row {
|
|
14
|
+
display: contents;
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
&.app-content-top-area-sm,
|
|
18
|
+
&.app-content-bottom-area-sm{
|
|
19
|
+
min-height: $lte-app-content-bottom-area-height-sm;
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
&.app-content-top-area-md,
|
|
23
|
+
&.app-content-bottom-area-md{
|
|
24
|
+
min-height: $lte-app-content-bottom-area-height-md;
|
|
25
|
+
}
|
|
26
|
+
&.app-content-top-area-lg,
|
|
27
|
+
&.app-content-bottom-area-lg{
|
|
28
|
+
min-height: $lte-app-content-bottom-area-height-lg;
|
|
29
|
+
}
|
|
30
|
+
&.app-content-top-area-xl,
|
|
31
|
+
&.app-content-bottom-area-xl{
|
|
32
|
+
min-height: $lte-app-content-bottom-area-height-xl;
|
|
33
|
+
}
|
|
34
|
+
}
|
|
35
|
+
|
|
36
|
+
.app-content-top-area:not(.app-content-top-area-sm):not(.app-content-top-area-md):not(.app-content-top-area-lg):not(.app-content-top-area-xl),
|
|
37
|
+
.app-content-bottom-area:not(.app-content-bottom-area-sm):not(.app-content-bottom-area-md):not(.app-content-bottom-area-lg):not(.app-content-bottom-area-xl) {
|
|
38
|
+
padding-top: $grid-gutter-width * .625;
|
|
39
|
+
padding-bottom: $grid-gutter-width * .625;
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
.app-content-bottom-area {
|
|
43
|
+
border-top: $lte-app-footer-border-top;
|
|
44
|
+
}
|
|
45
|
+
.app-content-top-area {
|
|
46
|
+
border-bottom: $lte-app-footer-border-top;
|
|
47
|
+
|
|
48
|
+
+ .app-main {
|
|
49
|
+
padding-top: $grid-gutter-width * .5;
|
|
50
|
+
}
|
|
51
|
+
}
|
|
52
|
+
|
|
@@ -6,10 +6,10 @@
|
|
|
6
6
|
grid-area: #{$lte-prefix}app-footer;
|
|
7
7
|
width: inherit;
|
|
8
8
|
max-width: 100vw;
|
|
9
|
+
min-height: 3rem;
|
|
9
10
|
padding: $lte-app-footer-padding;
|
|
10
11
|
color: $lte-app-footer-color;
|
|
11
12
|
background-color: $lte-app-footer-bg;
|
|
12
13
|
border-top: $lte-app-footer-border-top;
|
|
13
14
|
@include transition($lte-transition-speed $lte-transition-fn);
|
|
14
15
|
}
|
|
15
|
-
|
package/src/scss/_app-main.scss
CHANGED
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
.app-main {
|
|
2
|
+
position: relative;
|
|
2
3
|
grid-area: #{$lte-prefix}app-main;
|
|
3
4
|
max-width: 100vw;
|
|
4
|
-
padding-bottom:
|
|
5
|
+
padding-bottom: $grid-gutter-width * .5;
|
|
5
6
|
@include transition($lte-transition-speed $lte-transition-fn);
|
|
6
7
|
|
|
7
8
|
.app-content-header {
|
|
@@ -13,8 +14,4 @@
|
|
|
13
14
|
line-height: 2.5rem;
|
|
14
15
|
}
|
|
15
16
|
}
|
|
16
|
-
|
|
17
|
-
.app-content {
|
|
18
|
-
padding: $lte-content-padding-y $lte-content-padding-x;
|
|
19
|
-
}
|
|
20
17
|
}
|