From 31588535cef17fb160d1998a2014e24f0fd58663 Mon Sep 17 00:00:00 2001
From: Martin Rohrmeier <martin.ra.rohrmeier@bmw.de>
Date: Wed, 5 Jul 2023 16:32:07 +0200
Subject: [PATCH] bugfix(login theme): fix registration shared theme layout
 issue (#11)

Description
Fixed screen layout for wide displays.

Why
On wide displays the login dialog did look broken. Restrict width to a maximum value.

Issue
n/a
---
 .../login/resources/css/Main.css               |  2 +-
 .../catenax-shared/login/resources/js/Main.js  | 18 ++++++++++++------
 2 files changed, 13 insertions(+), 7 deletions(-)

diff --git a/import/keycloak-themes/catenax-shared/login/resources/css/Main.css b/import/keycloak-themes/catenax-shared/login/resources/css/Main.css
index 7db1e2ea..0ddeefef 100644
--- a/import/keycloak-themes/catenax-shared/login/resources/css/Main.css
+++ b/import/keycloak-themes/catenax-shared/login/resources/css/Main.css
@@ -76,7 +76,7 @@ section {
   box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px,
   rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px,
   rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
-
+  max-width: 520px;
   text-align: center;
 }
 
diff --git a/import/keycloak-themes/catenax-shared/login/resources/js/Main.js b/import/keycloak-themes/catenax-shared/login/resources/js/Main.js
index 588bff0b..bac950f6 100644
--- a/import/keycloak-themes/catenax-shared/login/resources/js/Main.js
+++ b/import/keycloak-themes/catenax-shared/login/resources/js/Main.js
@@ -295,8 +295,8 @@ class FormLogin extends Form {
     constructor(form) {
         super(
             N('div', [
-                N('h3', 'Register to Catena-X' ),
-                N('p', 'Finish the company registration form to join Catena-X automotive network. Please use your email address as username and enter your password.' ),
+                N('h3', 'Register to Catena-X'),
+                N('p', 'Finish the company registration form to join Catena-X automotive network. Please use your email address as username and enter your password.'),
                 form
             ])
         )
@@ -331,8 +331,8 @@ class FormUpdate extends Form {
     constructor(form) {
         super(
             N('div', [
-                N('h3', 'Update your password' ),
-                N('p', 'Enter a new login password and confirm it.' ),
+                N('h3', 'Update your password'),
+                N('p', 'Enter a new login password and confirm it.'),
                 form
             ])
         )
@@ -396,7 +396,13 @@ class FormUpdate extends Form {
 class FormReset extends Form {
 
     constructor(form) {
-        super(form)
+        super(
+            N('div', [
+                N('h3', 'Reset your password'),
+                N('p', 'Enter your username or email address.'),
+                form
+            ])
+        )
     }
 
 }
@@ -408,7 +414,7 @@ class Section extends Viewable {
             N('section',
                 N('div', [
                     N('div', null, { class: 'user-icon' }),
-                ], { class: 'section-header' } )
+                ], { class: 'section-header' })
             )
         )
     }