From dff588a621c23259f4d79a6f07b078c74a95f1ab Mon Sep 17 00:00:00 2001 From: Jannik Stehle Date: Fri, 2 Sep 2022 09:46:32 +0200 Subject: [PATCH 1/4] Improve login screen design --- .../enhancement-login-screen-design.md | 6 ++++++ services/idp/src/app.css | 16 +++++----------- services/idp/src/containers/Login/Login.jsx | 1 - 3 files changed, 11 insertions(+), 12 deletions(-) create mode 100644 changelog/unreleased/enhancement-login-screen-design.md diff --git a/changelog/unreleased/enhancement-login-screen-design.md b/changelog/unreleased/enhancement-login-screen-design.md new file mode 100644 index 0000000000..27d904c10a --- /dev/null +++ b/changelog/unreleased/enhancement-login-screen-design.md @@ -0,0 +1,6 @@ +Enhancement: Improve login screen design + +We've improved the design of the login screen to match with the general design used in Web. + +https://github.com/owncloud/ocis/pull/4500 +https://github.com/owncloud/web/issues/7552 diff --git a/services/idp/src/app.css b/services/idp/src/app.css index 1a7f1d5fff..90cba3feda 100644 --- a/services/idp/src/app.css +++ b/services/idp/src/app.css @@ -42,10 +42,9 @@ strong { } .oc-input { - background-color: #042047; + background-color: #fff; border: 1px solid rgba(78, 133, 200, 0.8); border-radius: 3px; - color: rgba(255, 255, 255, 0.8); height: 40px; width: 300px; padding: 16px; @@ -92,17 +91,12 @@ strong { .oc-button-primary { /* Needs to be important to overwrite material-ui */ - background-color: #4a76ac !important; + width: 100%; + background-size: 103% !important; + background: linear-gradient(to right, #2c588e, #4e85c8) -1px; border: 1px solid transparent !important; } -.oc-button-primary:hover, -.oc-button-primary:focus { - /* Needs to be important to overwrite material-ui */ - background-color: #4a76ac !important; - border: 1px solid white !important; -} - .oc-checkbox-dark svg { /* Needs to be important to overwrite material-ui */ fill: white !important; @@ -123,7 +117,7 @@ strong { /* Helpers */ .oc-mt-l { - margin-top: 30px !important; + margin-top: 24px !important; } .oc-mb-m { diff --git a/services/idp/src/containers/Login/Login.jsx b/services/idp/src/containers/Login/Login.jsx index 89df22b48b..f7bc31eaf0 100644 --- a/services/idp/src/containers/Login/Login.jsx +++ b/services/idp/src/containers/Login/Login.jsx @@ -155,7 +155,6 @@ function Login(props) { {hasError && {errorMessage}}
{loginFailed && passwordResetLink && {"Reset password?"}} -