diff --git a/InvenTree/InvenTree/static/css/inventree.css b/InvenTree/InvenTree/static/css/inventree.css
index a184faec46..60ea030960 100644
--- a/InvenTree/InvenTree/static/css/inventree.css
+++ b/InvenTree/InvenTree/static/css/inventree.css
@@ -11,6 +11,45 @@
--label-yellow: #fdc82a;
}
+.login-screen {
+ background-image: url("/static/img/paper_splash.jpg");
+ background-size: cover;
+ background-repeat: no-repeat;
+ height: 100%;
+ font-family: 'Numans', sans-serif;
+ color: #eee;
+}
+
+.login-container {
+ left: 50%;
+ position: fixed;
+ top: 50%;
+ transform: translate(-50%, -50%);
+ width: 30%;
+ align-content: center;
+ border-radius: 15px;
+ padding: 20px;
+ padding-bottom: 35px;
+ background-color: rgba(50, 50, 50, 0.5);
+}
+
+.login-header {
+ padding-right: 30px;
+ margin-right: 30px;
+}
+
+.login-container input {
+ background-color: rgba(250, 250, 250, 0.9);
+}
+
+.login-button {
+ background-color: rgba(250, 250, 250, 0.9);
+ color: #333;
+ border-color: #AAA;
+ width: 100%;
+ border-radius: 5px;
+}
+
.markdownx .row {
margin: 5px;
padding: 5px;
@@ -708,13 +747,6 @@ input[type="submit"] {
color: #e00;
}
-.login {
- position: absolute;
- top: 50%;
- left: 50%;
- transform: translate(-50%, -50%);
-}
-
.part-allocation {
padding: 3px 10px;
border: 1px solid #ccc;
diff --git a/InvenTree/InvenTree/static/img/paper_splash.jpg b/InvenTree/InvenTree/static/img/paper_splash.jpg
new file mode 100644
index 0000000000..c195f71aeb
Binary files /dev/null and b/InvenTree/InvenTree/static/img/paper_splash.jpg differ
diff --git a/InvenTree/templates/registration/login.html b/InvenTree/templates/registration/login.html
index 6aab0bb801..3ffbbb0760 100644
--- a/InvenTree/templates/registration/login.html
+++ b/InvenTree/templates/registration/login.html
@@ -14,38 +14,70 @@
+
+
+
+
+
+
InvenTree
-
+
-
+
+
+
+
+
+
-
-
-
-
-
InvenTree
-
-
+
-