mirror/aliasvault
1
0
Fork 0
mirror of https://github.com/aliasvault/aliasvault.git synced 2026-05-19 05:47:43 -04:00
Code Issues Packages Projects Releases Wiki Activity

Update form validation (#758)

Browse Source
This commit is contained in:
Leendert de Borst
2025-04-02 19:19:24 +02:00
committed by Leendert de Borst
parent 81362b165b
commit 7e1f33e4e1
2 changed files with 51 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

41
browser-extension/src/entrypoints/contentScript/Popup.ts
View File

@@ -880,12 +880,41 @@ export async function createEditNamePopup(defaultName: string, rootContainer: HT
const serviceName = customInput.value.trim();
if (serviceName) {
if (!customEmail.value.trim() && !customUsername.value.trim()) {
// Show error message
const errorMsg = document.createElement('div');
errorMsg.className = 'av-create-popup-error';
errorMsg.textContent = 'Please fill in either email or username';
customMode.insertBefore(errorMsg, customMode.querySelector('.av-create-popup-actions'));
setTimeout(() => errorMsg.remove(), 2000);
// Add error styling to fields
customEmail.classList.add('av-create-popup-input-error');
customUsername.classList.add('av-create-popup-input-error');
// Add error messages after labels
const emailLabel = customEmail.previousElementSibling as HTMLLabelElement;
const usernameLabel = customUsername.previousElementSibling as HTMLLabelElement;
if (!emailLabel.querySelector('.av-create-popup-error-text')) {
const emailError = document.createElement('span');
emailError.className = 'av-create-popup-error-text';
emailError.textContent = 'Enter email and/or username';
emailLabel.appendChild(emailError);
}
if (!usernameLabel.querySelector('.av-create-popup-error-text')) {
const usernameError = document.createElement('span');
usernameError.className = 'av-create-popup-error-text';
usernameError.textContent = 'Enter email and/or username';
usernameLabel.appendChild(usernameError);
}
// Remove error styling when user starts typing
const removeError = () => {
customEmail.classList.remove('av-create-popup-input-error');
customUsername.classList.remove('av-create-popup-input-error');
const emailError = emailLabel.querySelector('.av-create-popup-error-text');
const usernameError = usernameLabel.querySelector('.av-create-popup-error-text');
if (emailError) emailError.remove();
if (usernameError) usernameError.remove();
};
customEmail.addEventListener('input', removeError, { once: true });
customUsername.addEventListener('input', removeError, { once: true });
return;
}
closePopup({

19
browser-extension/src/entrypoints/contentScript/style.css
View File

@@ -453,14 +453,27 @@ body {
}
.av-create-popup-field-group {
margin-bottom: 2px;
margin-bottom: 1rem;
}
.av-create-popup-field-group label {
display: block;
margin-bottom: 8px;
font-size: 14px;
margin-bottom: 0.5rem;
color: #eee;
font-size: 0.875rem;
font-weight: 500;
}
.av-create-popup-input-error {
border-color: #ef4444 !important;
box-shadow: 0 0 0 1px #ef4444 !important;
}
.av-create-popup-error-text {
color: #ef4444;
font-size: 0.875rem;
margin-top: 0.25rem;
margin-left: 5px;
}
.av-create-popup-password-preview {