From acf1353beb7417de8d85d1f23b112bef85cd5ec9 Mon Sep 17 00:00:00 2001
From: cgeorgilakis-grnet <cgeorgilakis@admin.grnet.gr>
Date: Thu, 13 Jun 2024 17:32:36 +0300
Subject: [PATCH] Simplify WAYF IdPs search (addition)

---
 CHANGELOG.md                                            | 4 ++++
 pom.xml                                                 | 2 +-
 src/main/resources/theme/rciam/login/login-username.ftl | 5 ++---
 src/main/resources/theme/rciam/login/login.ftl          | 7 +++----
 4 files changed, 10 insertions(+), 8 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 7856233..bb6efb7 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -7,6 +7,10 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 For Keycloak upstream changelog please see https://www.keycloak.org/docs/latest/release_notes/index.html.
   Full Keycloak upstream jira issue can be shown if filtered by Fix version. For example [Keycloak jira issue for 15.0.2 version](https://issues.redhat.com/browse/KEYCLOAK-19161?jql=project%20%3D%20keycloak%20and%20fixVersion%20%3D%2015.0.2)
 
+## [5.1.1] - 2024-06-13
+### Changed
+- Simplify WAYF IdPs search (addition)
+
 ## [5.1.0] - 2024-06-12
 ### Changed
 - Simplify WAYF IdPs search
diff --git a/pom.xml b/pom.xml
index 087758b..8510197 100644
--- a/pom.xml
+++ b/pom.xml
@@ -6,7 +6,7 @@
 
     <groupId>org.rciam.keycloak</groupId>
     <artifactId>keycloak-theme-vanilla</artifactId>
-    <version>5.1.0</version>
+    <version>5.1.1</version>
     <packaging>jar</packaging>
 
     <properties>
diff --git a/src/main/resources/theme/rciam/login/login-username.ftl b/src/main/resources/theme/rciam/login/login-username.ftl
index ded2c05..484370c 100755
--- a/src/main/resources/theme/rciam/login/login-username.ftl
+++ b/src/main/resources/theme/rciam/login/login-username.ftl
@@ -119,7 +119,6 @@
     <style>
         .input-container {
                position: relative;
-               width: 95%;
         }
         .input-container .fa-search {
                position: absolute;
@@ -218,8 +217,8 @@
                 <h4>${msg("identity-provider-login-label")}</h4>
 
                 <div ng-if="(idps.length >= maxIdPsWithoutSearch && fetchParams.keyword==null) || fetchParams.keyword!=null" class="input-container">
-                    <i class="fa fa-search" id="kc-providers-filter-button"> </i>
-                    <input id="kc-providers-filter" type="text" placeholder="Search your authentication provider" ng-model="fetchParams.keyword" ng-keypress="applySearch($event)">
+                    <i class="kc-social-provider-logo fa fa-search" id="kc-providers-filter-button"> </i>
+                    <input id="kc-providers-filter" type="text" placeholder="Search your authentication provider" ng-model="fetchParams.keyword" ng-keypress="applySearch($event)"  style="padding: 5px 40px;">
                 </div>
                 <div ng-if="(idps.length < maxIdPsWithoutSearch) || (fetchParams.keyword!=null && fetchParams.keyword!='')">
                    <ul id="kc-providers-list" class="${properties.kcFormSocialAccountListClass!} login-pf-list-scrollable" on-scroll="scrollCallback($event, $direct)" >
diff --git a/src/main/resources/theme/rciam/login/login.ftl b/src/main/resources/theme/rciam/login/login.ftl
index 1c7418a..4c40ef3 100644
--- a/src/main/resources/theme/rciam/login/login.ftl
+++ b/src/main/resources/theme/rciam/login/login.ftl
@@ -136,11 +136,10 @@
     <style>
             .input-container {
                 position: relative;
-                width: 95%;
             }
             .input-container .fa-search {
                 position: absolute;
-                left: 5px;
+                left: 10px;
                 top: 50%;
                 transform: translateY(-50%);
                 color: #aaa;
@@ -246,8 +245,8 @@
             <h4>${msg("identity-provider-login-label")}</h4>
 -->
             <div ng-if="(idps.length >= maxIdPsWithoutSearch && fetchParams.keyword==null) || fetchParams.keyword!=null" class="input-container">
-                <i class="fa fa-search" id="kc-providers-filter-button"> </i>
-                <input id="kc-providers-filter" type="text" placeholder="Search your authentication provider" ng-model="fetchParams.keyword">
+                <i class="kc-social-provider-logo fa fa-search" id="kc-providers-filter-button"> </i>
+                <input id="kc-providers-filter" type="text" placeholder="Search your authentication provider" ng-model="fetchParams.keyword" style="padding: 5px 40px;">
             </div>
             <div ng-if="(idps.length < maxIdPsWithoutSearch) || (fetchParams.keyword!=null && fetchParams.keyword!='')">
                <ul id="kc-providers-list" class="${properties.kcFormSocialAccountListClass!} login-pf-list-scrollable" on-scroll="scrollCallback($event, $direct)" >