nestict/ihrm
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[FIX] HORILLA: Fixed load demo database password show hide button style and script

Browse Source
This commit is contained in:
Horilla
2025-11-11 15:32:00 +05:30
parent 656f063947
commit b58746e4a3
2 changed files with 27 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

41
horilla_theme/templates/login.html
View File

@@ -77,7 +77,7 @@
<label for="password" class="text-sm text-color-600"
>{% trans "Password" %}</label
>
<div class="relative">
<div class="oh-password-input-container relative">
<input
type="password"
id="password"
@@ -155,7 +155,6 @@
id="dataLoadAuthentication"
role="dialog"
aria-labelledby="dataLoadAuthenticationLabel"
aria-hidden="true"
style="backdrop-filter: blur(8px)"
>
<div class="oh-modal__dialog">
@@ -165,23 +164,33 @@
{% endif %}
</div>
</div>
<script type="module" src="{% static 'images/ionicons/ui_icons/ionicons/ionicons.esm.js' %}"></script>
<script>
document.querySelector('.oh-password-input--toggle').addEventListener('click', function (e) {
e.preventDefault();
const passwordInput = document.querySelector('.oh-input--password');
const showIcon = document.querySelector('.oh-password-input__show-icon');
const hideIcon = document.querySelector('.oh-password-input__hide-icon');
document.querySelectorAll('.oh-password-input--toggle').forEach(toggle => {
toggle.addEventListener('click', function (e) {
console.log("ppppppppppppppp")
e.preventDefault();
const container = this.closest('.oh-password-input-container');
if (passwordInput.type === 'password') {
passwordInput.type = 'text';
showIcon.classList.add('hidden');
hideIcon.classList.remove('hidden');
} else {
passwordInput.type = 'password';
showIcon.classList.remove('hidden');
hideIcon.classList.add('hidden');
}
if (!container) return;
const passwordInput = container.querySelector('.oh-input--password');
const showIcon = container.querySelector('.oh-password-input__show-icon, .oh-passowrd-input__show-icon');
const hideIcon = container.querySelector('.oh-password-input__hide-icon, .oh-passowrd-input__hide-icon');
if (!passwordInput || !showIcon || !hideIcon) return;
if (passwordInput.type === 'password') {
passwordInput.type = 'text';
showIcon.classList.add('hidden', 'd-none');
hideIcon.classList.remove('hidden', 'd-none');
} else {
passwordInput.type = 'password';
showIcon.classList.remove('hidden', 'd-none');
hideIcon.classList.add('hidden', 'd-none');
}
});
});
</script>
</body>

4
templates/demo_database/auth_load_data.html
View File

@@ -18,11 +18,11 @@
<div class="col-12 col-sm-12 col-md-12 col-lg-12">
<div class="oh-input-group">
<label class="oh-label" for="password">{% trans "Password" %}</label>
<div class="oh-password-input-container">
<div class="oh-password-input-container relative">
<input type="password" id="load_data_password" name="load_data_password"
class="oh-input oh-input--password w-100" placeholder="Database authentication password"
required />
<button type="button" class="oh-btn oh-btn--transparent oh-password-input--toggle">
<button type="button" class="oh-btn oh-btn--transparent oh-password-input--toggle top-[-7px]">
<ion-icon class="oh-passowrd-input__show-icon" title="Show Password"
name="eye-outline"></ion-icon>
<ion-icon class="oh-passowrd-input__hide-icon d-none" title="Hide Password"