This is an automated email from the ASF dual-hosted git repository.
ilgrosso pushed a commit to branch 4_0_X
in repository https://gitbox.apache.org/repos/asf/syncope.git
The following commit(s) were added to refs/heads/4_0_X by this push:
new 77c5c0b3fc [SYNCOPE-1990] "Eye" button to show password in enduser and
console login page (#1506)
77c5c0b3fc is described below
commit 77c5c0b3fce82a78d6a1e171fffe3e30d88398e7
Author: mrcx5 <[email protected]>
AuthorDate: Wed Aug 26 15:01:43 2026 +0200
[SYNCOPE-1990] "Eye" button to show password in enduser and console login
page (#1506)
---
.../apache/syncope/client/console/pages/Login.html | 36 +++++++++++++++-------
.../apache/syncope/client/enduser/pages/Login.html | 36 +++++++++++++++-------
2 files changed, 50 insertions(+), 22 deletions(-)
diff --git
a/client/idrepo/console/src/main/resources/org/apache/syncope/client/console/pages/Login.html
b/client/idrepo/console/src/main/resources/org/apache/syncope/client/console/pages/Login.html
index 10fa864d45..03709f0c08 100644
---
a/client/idrepo/console/src/main/resources/org/apache/syncope/client/console/pages/Login.html
+++
b/client/idrepo/console/src/main/resources/org/apache/syncope/client/console/pages/Login.html
@@ -27,16 +27,16 @@ under the License.
<link rel="shortcut icon" href="ui-commons/img/favicon.png"
type="image/png"/>
- <link href="webjars/font-awesome/${font-awesome.version}/css/all.min.css"
rel="stylesheet" type="text/css" />
- <link href="webjars/ionicons/${ionicons.version}/css/ionicons.min.css"
rel="stylesheet" type="text/css" />
+ <link href="webjars/font-awesome/${font-awesome.version}/css/all.min.css"
rel="stylesheet" type="text/css"/>
+ <link href="webjars/ionicons/${ionicons.version}/css/ionicons.min.css"
rel="stylesheet" type="text/css"/>
<link href="ui-commons/css/fonts.css" rel="stylesheet" type="text/css"/>
- <link href="ui-commons/css/login.css" rel="stylesheet" type="text/css" />
+ <link href="ui-commons/css/login.css" rel="stylesheet" type="text/css"/>
<link href="ui-commons/css/syncopeUI.css" rel="stylesheet"
type="text/css"/>
<link href="css/syncopeConsole.css" rel="stylesheet" type="text/css"/>
<!-- accessibility -->
- <link href="ui-commons/css/accessibility.css" rel="stylesheet"
type="text/css" />
+ <link href="ui-commons/css/accessibility.css" rel="stylesheet"
type="text/css"/>
<script type="text/javascript"
src="ui-commons/js/accessibility.js"></script>
</head>
@@ -56,18 +56,32 @@ under the License.
<div class="container">
<div class="login-card card card-container">
- <img class="login-logo" src="ui-commons/img/logo-green.png" />
+ <img class="login-logo" src="ui-commons/img/logo-green.png"/>
<span wicket:id="feedback" role="alert"/>
<form class="form-signin" wicket:id="login">
<fieldset class="form-group">
- <input type="text" wicket:id="username" class="form-control"
- wicket:message="placeholder:username" required="required"
autofocus="autofocus" />
-
- <input type="password" wicket:id="password" class="form-control"
- wicket:message="placeholder:password" required="required" />
-
+ <input type="text" wicket:id="username" class="form-control"
+ wicket:message="placeholder:username" required="required"
autofocus="autofocus"/>
+ <div class="input-group d-flex">
+ <input type="password" class="form-control w-75"
wicket:id="password"
+ wicket:message="placeholder:password"
required="required"/>
+ <button type="button" class="btn btn-warning btn-flat
input-group-text w-25 m-0 h-100" onclick="
+ var input = $(this).prevAll('input');
+ var type = input.attr('type');
+ var children = $(this).children();
+ if (type !== 'text') {
+ $(input).attr('type', 'text');
+ $(children).addClass('fa-eye-slash').removeClass('fa-eye');
+ } else {
+ $(input).attr('type', 'password');
+ $(children).removeClass('fa-eye-slash').addClass('fa-eye');
+ }
+ return false;">
+ <i class="fa fa-eye"></i>
+ </button>
+ </div>
<div class="mb-3">
<select class="form-select select2bs4 select2-hidden-accessible"
style="font-size: 100%" wicket:id="language"/>
</div>
diff --git
a/client/idrepo/enduser/src/main/resources/org/apache/syncope/client/enduser/pages/Login.html
b/client/idrepo/enduser/src/main/resources/org/apache/syncope/client/enduser/pages/Login.html
index 3f72fce27a..6ae569adc1 100644
---
a/client/idrepo/enduser/src/main/resources/org/apache/syncope/client/enduser/pages/Login.html
+++
b/client/idrepo/enduser/src/main/resources/org/apache/syncope/client/enduser/pages/Login.html
@@ -27,16 +27,16 @@ under the License.
<link rel="shortcut icon" href="ui-commons/img/favicon.png"
type="image/png"/>
- <link href="webjars/font-awesome/${font-awesome.version}/css/all.min.css"
rel="stylesheet" type="text/css" />
- <link href="webjars/ionicons/${ionicons.version}/css/ionicons.min.css"
rel="stylesheet" type="text/css" />
+ <link href="webjars/font-awesome/${font-awesome.version}/css/all.min.css"
rel="stylesheet" type="text/css"/>
+ <link href="webjars/ionicons/${ionicons.version}/css/ionicons.min.css"
rel="stylesheet" type="text/css"/>
<link href="ui-commons/css/fonts.css" rel="stylesheet" type="text/css"/>
- <link href="ui-commons/css/login.css" rel="stylesheet" type="text/css" />
+ <link href="ui-commons/css/login.css" rel="stylesheet" type="text/css"/>
<link href="ui-commons/css/syncopeUI.css" rel="stylesheet"
type="text/css"/>
<link href="css/syncopeEnduser.css" rel="stylesheet" type="text/css"/>
<!-- accessibility -->
- <link href="ui-commons/css/accessibility.css" rel="stylesheet"
type="text/css" />
+ <link href="ui-commons/css/accessibility.css" rel="stylesheet"
type="text/css"/>
<script type="text/javascript"
src="ui-commons/js/accessibility.js"></script>
</head>
@@ -55,18 +55,32 @@ under the License.
</div>
<div class="container">
<div class="login-card card card-container">
- <img class="login-logo" src="ui-commons/img/logo-green.png" />
+ <img class="login-logo" src="ui-commons/img/logo-green.png"/>
<span wicket:id="feedback" role="alert"/>
<form class="form-signin" wicket:id="login">
<fieldset class="form-group">
- <input type="text" wicket:id="username" class="form-control"
- wicket:message="placeholder:username" required="required"
autofocus="autofocus" />
-
- <input type="password" wicket:id="password" class="form-control"
- wicket:message="placeholder:password" required="required" />
-
+ <input type="text" wicket:id="username" class="form-control"
+ wicket:message="placeholder:username" required="required"
autofocus="autofocus"/>
+ <div class="input-group d-flex">
+ <input type="password" class="form-control w-75"
wicket:id="password"
+ wicket:message="placeholder:password"
required="required"/>
+ <button type="button" class="btn btn-warning btn-flat
input-group-text w-25 m-0 h-100" onclick="
+ var input = $(this).prevAll('input');
+ var type = input.attr('type');
+ var children = $(this).children();
+ if (type !== 'text') {
+ $(input).attr('type', 'text');
+ $(children).addClass('fa-eye-slash').removeClass('fa-eye');
+ } else {
+ $(input).attr('type', 'password');
+ $(children).removeClass('fa-eye-slash').addClass('fa-eye');
+ }
+ return false;">
+ <i class="fa fa-eye"></i>
+ </button>
+ </div>
<div class="mb-3">
<select class="form-control form-select select2bs4
select2-hidden-accessible" wicket:id="language"/>
</div>
