Login Shib refactor

OpenConext · Jan 28, 2025 · 495e560 · 495e560
1 parent c23c8d2
commit 495e560
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 13 deletions.
diff --git a/servicedesk-gui/src/icons/frontdesk.svg b/servicedesk-gui/src/icons/frontdesk.svg
diff --git a/servicedesk-gui/src/pages/Login.jsx b/servicedesk-gui/src/pages/Login.jsx
@@ -3,26 +3,22 @@ import {Button, ButtonSize, ButtonType} from "@surfnet/sds";
 import './Login.scss';
 import I18n from "../locale/I18n";
 import DOMPurify from "dompurify";
-import students from "../icons/chatgpt/openart-image_raw.jpg";
+import Frontdesk from "../icons/frontdesk.svg";
 import {LandingInfo} from "../components/LandingInfo";
-import {useAppStore} from "../stores/AppStore.js";
 
 export const Login = () => {
 
-    const {config} = useAppStore(state => state);
-
     const doLogin = () => {
-        window.location.href = `${config.loginUrl}?redirect_path=/`;
-        // const encodedQueryParams = `target=${encodeURIComponent("/startSSO")}&redirect_url=${encodeURIComponent(path + "/home")}`
-        // window.location.href = `${path}/Shibboleth.sso/Login?${encodedQueryParams}`;
+        const path = window.location.origin;
+        window.location.href = `${path}/Shibboleth.sso/Login?target=/`;
     }
 
     return (
         <div className="top-container">
             <div className="mod-login-container">
                 <div className="mod-login">
                     <div className="header-left">
-                        <h2 className={"header-title"}
+                        <h1 className={"header-title"}
                             dangerouslySetInnerHTML={{__html: DOMPurify.sanitize(I18n.t("landing.header.title"))}}/>
                         <Button onClick={() => doLogin()}
                                 txt={I18n.t("landing.header.login")}
@@ -32,7 +28,7 @@ export const Login = () => {
                            dangerouslySetInnerHTML={{__html: DOMPurify.sanitize(I18n.t("landing.header.sup"))}}/>
                     </div>
                     <div className="header-right">
-                        <img className="screen" src={students} alt="logo"/>
+                        <Frontdesk/>
                     </div>
                 </div>
             </div>

diff --git a/servicedesk-gui/src/pages/Login.scss b/servicedesk-gui/src/pages/Login.scss
@@ -17,7 +17,7 @@
         }
 
         .header-title {
-            margin-bottom: 60px;
+            margin-bottom: 40px;
         }
 
         &.bottom {
@@ -91,10 +91,13 @@
                     margin: 25px auto;
                 }
 
-                img {
-                    width: 240px;
+                svg {
+                    width: 160px;
                     height: auto;
                     border-radius: $br;
+                    color: var(--sds--color--blue--400);
+                    padding: 15px;
+                    border: 1px solid var(--sds--color--blue--400);
 
                     @media (max-width: $medium) {
                         width: 180px;