marcel/mealprep
1
0
Fork 0
Code Issues 22 Pull Requests Actions Packages Projects Releases Wiki Activity

Frontend: design system, navigation, auth guard, signup screen #33

Merged
marcel merged 25 commits from feat/issue-16-design-system into master 2026-04-02 19:00:19 +02:00
Conversation 12 Commits 25 Files Changed 23 +10
2 changed files with 10 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit afcea6590d - Show all commits

3
frontend/src/lib/auth/SignupForm.svelte
View File

@@ -67,6 +67,7 @@
id="displayName"
name="displayName"
placeholder="z.B. Sarah"
autocomplete="name"
bind:value={displayName}
class="w-full rounded-[var(--radius-md)] border bg-[var(--color-page)] px-[12px] py-[10px] font-[var(--font-sans)] text-[14px] text-[var(--color-text)] outline-none
{errors.displayName ? 'border-[var(--color-error)]' : 'border-[var(--color-border)]'}"
@@ -91,6 +92,7 @@
id="email"
name="email"
placeholder="du@beispiel.de"
autocomplete="email"
bind:value={email}
class="w-full rounded-[var(--radius-md)] border bg-[var(--color-page)] px-[12px] py-[10px] font-[var(--font-sans)] text-[14px] text-[var(--color-text)] outline-none
{errors.email ? 'border-[var(--color-error)]' : 'border-[var(--color-border)]'}"
@@ -116,6 +118,7 @@
id="password"
name="password"
placeholder="Mindestens 8 Zeichen"
autocomplete="new-password"
bind:value={password}
class="w-full rounded-[var(--radius-md)] border bg-[var(--color-page)] px-[12px] py-[10px] pr-[44px] font-[var(--font-sans)] text-[14px] text-[var(--color-text)] outline-none
{errors.password ? 'border-[var(--color-error)]' : 'border-[var(--color-border)]'}"

7
frontend/src/lib/auth/SignupForm.test.ts
View File

@@ -124,6 +124,13 @@ describe('SignupForm', () => {
expect(button.className).toContain('bg-[var(--green-dark)]');
});
it('inputs have correct autocomplete attributes', () => {
render(SignupForm);
expect(screen.getByLabelText('Dein Name')).toHaveAttribute('autocomplete', 'name');
expect(screen.getByLabelText('E-Mail')).toHaveAttribute('autocomplete', 'email');
expect(screen.getByLabelText('Passwort')).toHaveAttribute('autocomplete', 'new-password');
});
it('renders placeholders on inputs', () => {
render(SignupForm);
expect(screen.getByPlaceholderText('z.B. Sarah')).toBeInTheDocument();