Add login splash screen

2022-04-03 18:51:18 +02:00
parent fef8ca84f4
commit 8436a02c10
3 changed files with 21 additions and 0 deletions
--- a/assets/css/base_login_page.css
+++ b/assets/css/base_login_page.css
@@ -11,6 +11,20 @@ body {
  /* background-color: #f5f5f5; */
 }

+/* background */
+@media screen and (min-width: 767px) {
+    .bg-login {
+        background-image: url(/assets/img/forest.jpg);
+        width: 100%;
+        height: 100%;
+        position: fixed;
+        filter: blur(10px);
+        z-index: -10;
+        background-size: cover;
+        opacity: 0.4;
+    }
+}
+
 .form-signin {
  width: 100%;
  max-width: 330px;
@@ -55,3 +69,7 @@ body {
  background-color: var(--bs-gray-600);
  color: var(--bs-gray-100);
 }
+
+.text-muted {
+    color: #c6c4c4 !important;
+}
--- a/assets/img/forest.jpg
+++ b/assets/img/forest.jpg
--- a/templates/base_login_page.html
+++ b/templates/base_login_page.html
@@ -36,6 +36,9 @@
 </head>
 <body class="text-center">

+<!-- Background filter -->
+<div class="bg-login"></div>
+
 <main class="form-signin">

    <h1 class="h3 mb-3 fw-normal">{{ page_title }}</h1>