diff --git a/apps/theming/css/theming.scss b/apps/theming/css/theming.scss
index f21f00f438..e8987a8567 100644
--- a/apps/theming/css/theming.scss
+++ b/apps/theming/css/theming.scss
@@ -142,12 +142,14 @@ $invert: luma($color-primary) > 0.6;
#theming-preview {
background-image: $image-login-background;
background-color: $color-primary;
+ background-color: linear-gradient(40deg, $color-primary 0%, rgba(28,175,255,1) 100%);
}
} @else {
- #theming-preview {
- background-image: $image-login-background;
- background-color: $color-primary;
- }
+ #theming-preview {
+ background-image: $image-login-background;
+ background-color: $color-primary;
+ background-color: linear-gradient(40deg, $color-primary 0%, rgba(28,175,255,1) 100%);
+ }
}
@if variable_exists('theming-logoheader-mime') and $theming-logoheader-mime != '' {
@@ -207,6 +209,7 @@ input.primary,
#body-login, #firstrunwizard .firstrunwizard-header, #theming-preview {
background-image: none !important;
background-color: $color-primary;
+ background-color: linear-gradient(40deg, $color-primary 0%, rgba(28,175,255,1) 100%);
}
#body-login {
@@ -218,6 +221,7 @@ input.primary,
} @else {
#body-login {
background-color: $color-primary;
+ background-color: linear-gradient(40deg, $color-primary 0%, rgba(28,175,255,1) 100%);
}
}
diff --git a/core/css/guest.css b/core/css/guest.css
index d922712473..15bb83f576 100644
--- a/core/css/guest.css
+++ b/core/css/guest.css
@@ -25,9 +25,10 @@ body {
text-align: center;
background-color: #0082c9;
background-image: url('../img/background.png?v=2');
+ background-image: url('../img/background.png?v=2'), linear-gradient(40deg, #0082c9 0%, rgba(28,175,255,1) 100%);
background-position: 50% 50%;
- background-repeat: no-repeat;
- background-size: cover;
+ background-repeat: repeat;
+ background-size: 275px, contain;
background-attachment: fixed; /* fix background gradient */
min-height: 100%; /* fix sticky footer */
height: auto;
@@ -524,22 +525,24 @@ form .warning input[type='checkbox']+label {
#remember_login {
margin: 18px 5px 0 16px !important;
}
-.remember-login-container,
.lost-password-container {
display: inline-block;
margin: 10px 0;
text-align: center;
width: 100%;
- text-shadow: 0 0 2px rgba(0, 0, 0, .4); /* better readability on bright background */
}
-.lost-password-container #lost-password,
-.lost-password-container #lost-password-back {
+#lost-password,
+#lost-password-back,
+#reset-password-wrapper + a {
display: inline-block;
- font-weight: normal;
+ font-weight: normal !important;
padding: 12px;
- margin-top: -6px;
color: #fff;
cursor: pointer;
+ text-shadow: 0 0 2px rgba(0, 0, 0, .4); /* better readability on bright background */
+}
+#lost-password {
+ margin-top: -6px;
}
#forgot-password {
padding: 11px;
diff --git a/core/css/header.scss b/core/css/header.scss
index 2b63dc978a..5c09bdee82 100644
--- a/core/css/header.scss
+++ b/core/css/header.scss
@@ -50,6 +50,7 @@
z-index: 2000;
height: $header-height;
background-color: var(--color-primary);
+ background-image: linear-gradient(40deg, var(--color-primary) 0%, rgba(28,175,255,1) 100%);
box-sizing: border-box;
justify-content: space-between;
}
@@ -444,7 +445,6 @@ nav[role='navigation'] {
text-overflow: initial;
width: auto;
overflow: hidden;
- background-color: var(--color-primary);
padding: 0 5px;
z-index: 2;
}
diff --git a/core/css/styles.scss b/core/css/styles.scss
index 7e4af17c6a..1ff81a17cb 100644
--- a/core/css/styles.scss
+++ b/core/css/styles.scss
@@ -87,6 +87,7 @@ ul {
body {
background-color: var(--color-main-background);
+ background-color: linear-gradient(40deg, var(--color-main-background) 0%, rgba(28,175,255,1) 100%);
font-weight: normal;
/* bring the default font size up to 14px */
font-size: .875em;
diff --git a/core/img/background.png b/core/img/background.png
index 67e1a4b003..39c97bebe3 100644
Binary files a/core/img/background.png and b/core/img/background.png differ
diff --git a/core/img/background.svg b/core/img/background.svg
index 6002015ef0..84ce997058 100644
--- a/core/img/background.svg
+++ b/core/img/background.svg
@@ -1,20024 +1 @@
-
+