gitea_admin/Styleguide
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Validate newsletter email before activation

Browse Source
This commit is contained in:
Mathias Gläser
2026-08-03 16:55:29 +02:00
parent 26764625ac
commit 51fc9b87e0
2 changed files with 3 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/public-page-components.html
+1 -1
View File
@@ -59,7 +59,7 @@
<div class="sg-card-segment sg-card-segment--body sg-call-to-action-card__body" data-component-part="card-body">
<p class="sg-body sg-call-to-action-card__text">Mit dem Newsletter immer über neue Inhalte informiert bleiben.</p>
<div class="sg-labeled-input-row" data-component="single-line-input" data-component-state="inactive-selectable">
<input class="sg-interaction-element sg-input-single-line sg-input-single-line--inactive-selectable sg-form-inactive-selectable" type="email" placeholder="E-Mail-Adresse" aria-label="E-Mail-Adresse">
<input class="sg-interaction-element sg-input-single-line sg-input-single-line--inactive-selectable sg-form-inactive-selectable" type="email" placeholder="E-Mail-Adresse" aria-label="E-Mail-Adresse" required>
</div>
<div class="sg-call-to-action-card__action">
<button class="sg-interaction-element sg-button sg-button--process sg-button--process-inactive" type="button" data-component="button" data-component-variant="process" data-component-state="inactive" disabled aria-disabled="true">Prozess Button</button>
patterns/public-page-patterns.html
+2 -1
View File
@@ -208,6 +208,7 @@
type="email"
placeholder="E-Mail-Adresse"
aria-label="E-Mail-Adresse"
required
>
</div>
@@ -235,7 +236,7 @@
}
const updateProcessButtonState = () => {
const isActive = input.value.trim().length > 0;
const isActive = input.checkValidity();
processButton.disabled = !isActive;
processButton.setAttribute('aria-disabled', String(!isActive));
processButton.setAttribute('data-component-state', isActive ? 'active' : 'inactive');