1 rok pred · eaefd70c0a
--- a/src/html/components/dashboard/_sidenav.astro
+++ b/src/html/components/dashboard/_sidenav.astro
@@ -279,7 +279,7 @@ const htmlPath = convertPathToHtml(path);
 
				           <a href="#" class="nav-link">
			
 
				             <i class="nav-icon bi bi-box-arrow-in-right"></i>
			
 
				             <p>
			
 
				-              Login & Register
			
 
				+              Auth
			
 
				               <i class="nav-arrow bi bi-chevron-right"></i>
			
 
				             </p>
			
 
				           </a>
			
@@ -296,6 +296,12 @@ const htmlPath = convertPathToHtml(path);
 
				                 <p>Register v1</p>
			
 
				               </a>
			
 
				             </li>
			
 
				+            <li class="nav-item">
			
 
				+              <a href={htmlPath + "/examples/lockscreen.html"} class="nav-link">
			
 
				+                <i class="nav-icon bi bi-circle"></i>
			
 
				+                <p>Lockscreen</p>
			
 
				+              </a>
			
 
				+            </li>
			
 
				           </ul>
			
 
				         </li>
			
 
				 
			
--- a/src/html/pages/examples/lockscreen.astro
+++ b/src/html/pages/examples/lockscreen.astro
@@ -0,0 +1,63 @@
 
				+---
			
 
				+import Head from "@components/_head.astro";
			
 
				+import Scripts from "@components/_scripts.astro";
			
 
				+
			
 
				+const title = "AdminLTE 4 | Lockscreen";
			
 
				+const path = "../../../dist";
			
 
				+const htmlPath = "..";
			
 
				+const year = new Date().getFullYear();
			
 
				+---
			
 
				+
			
 
				+<!DOCTYPE html>
			
 
				+<html lang="en">
			
 
				+  <!--begin::Head-->
			
 
				+  <head>
			
 
				+    <Head title={title} path={path} />
			
 
				+  </head>
			
 
				+  <!--end::Head-->
			
 
				+  <!--begin::Body-->
			
 
				+  <body class="lockscreen bg-body-secondary">
			
 
				+    <div class="lockscreen-wrapper">
			
 
				+      <div class="lockscreen-logo">
			
 
				+        <a href={htmlPath + "/index2.html"}><b>Admin</b>LTE</a>
			
 
				+      </div>
			
 
				+
			
 
				+      <div class="lockscreen-name">John Doe</div>
			
 
				+
			
 
				+      <div class="lockscreen-item">
			
 
				+        <div class="lockscreen-image">
			
 
				+          <img src={path + "/assets/img/user1-128x128.jpg"} alt="User Image" />
			
 
				+        </div>
			
 
				+
			
 
				+        <form class="lockscreen-credentials">
			
 
				+          <div class="input-group">
			
 
				+            <input
			
 
				+              type="password"
			
 
				+              class="form-control shadow-none"
			
 
				+              placeholder="password"
			
 
				+            />
			
 
				+            <div class="input-group-text border-0 bg-transparent px-1">
			
 
				+              <button type="button" class="btn shadow-none">
			
 
				+                <i class="bi bi-box-arrow-right text-body-secondary"></i>
			
 
				+              </button>
			
 
				+            </div>
			
 
				+          </div>
			
 
				+        </form>
			
 
				+      </div>
			
 
				+
			
 
				+      <div class="help-block text-center">
			
 
				+        Enter your password to retrieve your session
			
 
				+      </div>
			
 
				+      <div class="text-center">
			
 
				+        <a href="login.html">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 />
			
 
				+        All rights reserved
			
 
				+      </div>
			
 
				+    </div>
			
 
				+
			
 
				+    <Scripts />
			
 
				+  </body><!--end::Body-->
			
 
				+</html>
			
--- a/src/scss/pages/_lockscreen.scss
+++ b/src/scss/pages/_lockscreen.scss
@@ -0,0 +1,74 @@
 
				+//
			
 
				+// Pages: Lock Screen
			
 
				+//
			
 
				+
			
 
				+// ADD THIS CLASS TO THE <BODY> TAG
			
 
				+.lockscreen {
			
 
				+  // User name [optional]
			
 
				+  .lockscreen-name {
			
 
				+    font-weight: 600;
			
 
				+    text-align: center;
			
 
				+  }
			
 
				+
			
 
				+  .lockscreen-logo {
			
 
				+    margin-bottom: 25px;
			
 
				+    font-size: 35px;
			
 
				+    font-weight: 300;
			
 
				+    text-align: center;
			
 
				+
			
 
				+    a {
			
 
				+      color: var(--#{$prefix}emphasis-color);
			
 
				+    }
			
 
				+  }
			
 
				+
			
 
				+  .lockscreen-wrapper {
			
 
				+    max-width: 400px;
			
 
				+    margin: 0 auto;
			
 
				+    margin-top: 10%;
			
 
				+  }
			
 
				+
			
 
				+  // Will contain the image and the sign in form
			
 
				+  .lockscreen-item {
			
 
				+    position: relative;
			
 
				+    width: 290px;
			
 
				+    padding: 0;
			
 
				+    margin: 10px auto 30px;
			
 
				+    background-color: var(--#{$prefix}body-bg);
			
 
				+    @include border-radius(4px);
			
 
				+  }
			
 
				+
			
 
				+  // User image
			
 
				+  .lockscreen-image {
			
 
				+    position: absolute;
			
 
				+    top: -25px;
			
 
				+    left: -10px;
			
 
				+    z-index: 10;
			
 
				+    padding: 5px;
			
 
				+    background-color: var(--#{$prefix}body-bg);
			
 
				+    @include border-radius(50%);
			
 
				+
			
 
				+    > img {
			
 
				+      @include border-radius(50%);
			
 
				+      width: 70px;
			
 
				+      height: 70px;
			
 
				+    }
			
 
				+  }
			
 
				+
			
 
				+  // Contains the password input and the login button
			
 
				+  .lockscreen-credentials {
			
 
				+    margin-left: 70px;
			
 
				+
			
 
				+    .form-control {
			
 
				+      border: 0;
			
 
				+    }
			
 
				+
			
 
				+    .btn {
			
 
				+      padding: 0 10px;
			
 
				+      border: 0;
			
 
				+    }
			
 
				+  }
			
 
				+
			
 
				+  .lockscreen-footer {
			
 
				+    margin-top: 10px;
			
 
				+  }
			
 
				+}
			
--- a/src/scss/parts/_pages.scss
+++ b/src/scss/parts/_pages.scss
@@ -3,3 +3,4 @@
 
				 //
			
 
				 
			
 
				 @import "../pages/login_and_register";
			
 
				+@import "../pages/lockscreen";