feat: update bg forms (#32)

* wip: upgrade to keycloak 26

* feat: update login bg

* fix resize background

* apply new bg design

* apply bg design dots on top

---------

Co-authored-by: Chandrasekhar Ramakrishnan <ciyer@users.noreply.github.com>

Author: andre-code

Dockerfile.dev

@@ -1,4 +1,4 @@
-FROM keycloak/keycloak:20.0.1
+FROM keycloak/keycloak:26.0.7
 
 # Turn of caching in the configuration so we can modify the theme and refresh to see changes
 COPY ./renku-theme-dev/standalone.xml /opt/jboss/keycloak/standalone/configuration/standalone.xml

renku_theme/account/theme.properties

@@ -1,2 +1,2 @@
-parent=keycloak.v2
+parent=keycloak.v3
 logo=/img/logo.svg

renku_theme/login/resources/css/login.css

@@ -26,12 +26,10 @@
 }
 
 .login-pf body {
-  background-color: #07182b;
-  height: 100vh;
-  background-image: url("../img/background.svg");
-  background-size: cover;
-  background-repeat: no-repeat;
-
+  background-color: #09182bbf;
+  background-image: url("../img/dots_background.svg");
+  background-repeat: repeat-x;
+  background-position: top;
   color: #fff;
   font-family: var(--inter-font);
   font-size: 16px;
@@ -70,18 +68,20 @@ a {
 .renku-login-container {
   padding: 1.5rem;
   background-color: #09182bbf;
+  display: flex;
+  flex-flow: column;
+  align-items: center;
 }
 
 @media only screen and (min-width: 768px) {
   .renku-login-container {
     padding: 10px 85px;
-    height: 100%;
   }
 }
 
 .renku-login-card {
   position: relative;
-  top: 50px;
+  top: 30px;
   padding-bottom: 20px;
 }
 
@@ -129,6 +129,7 @@ div#kc-social-providers h4 {
 }
 
 #kc-page-title {
+  margin-top: 0;
   margin-bottom: 40px;
 }
 
@@ -236,11 +237,11 @@ span.pf-m-error.required {
 
 div#kc-header {
   background-image: url("../img/logo.svg");
-  background-color: #07182b;
   background-size: cover;
   background-repeat: no-repeat;
   width: 200px;
   height: 80px;
+  margin-top: 200px;
 }
 
 div#kc-header-wrapper {