bam/my2
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Implement authentication phase with Cidaas OAuth2 integration

Browse Source 
- Add authentication middleware to protect routes
- Create API endpoints for login, logout, registration, and user info
- Develop UI components for login and registration forms
- Integrate VeeValidate for form validation
- Update environment configuration for Cidaas settings
- Add i18n support for English and German languages
- Enhance Tailwind CSS for improved styling of auth components
- Document authentication flow and testing procedures
This commit is contained in:
Bastian Masanek
2025-10-31 11:44:48 +01:00
parent 749d5401c6
commit f8572c3386
57 changed files with 3357 additions and 132 deletions
Download Patch File Download Diff File Expand all files Collapse all files

53
app/pages/internal/styleguide.vue
View File

@@ -223,20 +223,20 @@ const copyCode = async (code: string) => {
</p>
<div class="flex flex-wrap gap-4 items-center mb-6">
<UiButton variant="experimenta" size="experimenta" @click="handleClick">
<Button variant="experimenta" size="experimenta" @click="handleClick">
experimenta Button
</UiButton>
</Button>
<UiButton variant="experimenta" size="experimenta" as="a" href="https://www.experimenta.science/">
<Button variant="experimenta" size="experimenta" as="a" href="https://www.experimenta.science/">
As Link
</UiButton>
</Button>
</div>
<details class="bg-white/5 p-4 rounded-lg">
<summary class="cursor-pointer text-white/90 font-semibold">Show Code</summary>
<pre class="mt-4 text-sm text-white/80 overflow-x-auto"><code>&lt;UiButton variant="experimenta" size="experimenta" @click="handleClick"&gt;
<pre class="mt-4 text-sm text-white/80 overflow-x-auto"><code>&lt;Button variant="experimenta" size="experimenta" @click="handleClick"&gt;
experimenta Button
&lt;/UiButton&gt;</code></pre>
&lt;/Button&gt;</code></pre>
</details>
</div>
@@ -246,22 +246,22 @@ const copyCode = async (code: string) => {
<p class="mb-6 text-white/90">All button variants from shadcn-nuxt component library:</p>
<div class="flex flex-wrap gap-4 mb-6">
<UiButton variant="default" @click="handleClick">Default</UiButton>
<UiButton variant="destructive" @click="handleClick">Destructive</UiButton>
<UiButton variant="outline" @click="handleClick">Outline</UiButton>
<UiButton variant="secondary" @click="handleClick">Secondary</UiButton>
<UiButton variant="ghost" @click="handleClick">Ghost</UiButton>
<UiButton variant="link" @click="handleClick">Link</UiButton>
<Button variant="default" @click="handleClick">Default</Button>
<Button variant="destructive" @click="handleClick">Destructive</Button>
<Button variant="outline" @click="handleClick">Outline</Button>
<Button variant="secondary" @click="handleClick">Secondary</Button>
<Button variant="ghost" @click="handleClick">Ghost</Button>
<Button variant="link" @click="handleClick">Link</Button>
</div>
<details class="bg-white/5 p-4 rounded-lg">
<summary class="cursor-pointer text-white/90 font-semibold">Show Code</summary>
<pre class="mt-4 text-sm text-white/80 overflow-x-auto"><code>&lt;UiButton variant="default"&gt;Default&lt;/UiButton&gt;
&lt;UiButton variant="destructive"&gt;Destructive&lt;/UiButton&gt;
&lt;UiButton variant="outline"&gt;Outline&lt;/UiButton&gt;
&lt;UiButton variant="secondary"&gt;Secondary&lt;/UiButton&gt;
&lt;UiButton variant="ghost"&gt;Ghost&lt;/UiButton&gt;
&lt;UiButton variant="link"&gt;Link&lt;/UiButton&gt;</code></pre>
<pre class="mt-4 text-sm text-white/80 overflow-x-auto"><code>&lt;Button variant="default"&gt;Default&lt;/Button&gt;
&lt;Button variant="destructive"&gt;Destructive&lt;/Button&gt;
&lt;Button variant="outline"&gt;Outline&lt;/Button&gt;
&lt;Button variant="secondary"&gt;Secondary&lt;/Button&gt;
&lt;Button variant="ghost"&gt;Ghost&lt;/Button&gt;
&lt;Button variant="link"&gt;Link&lt;/Button&gt;</code></pre>
</details>
</div>
</section>
@@ -431,6 +431,21 @@ const copyCode = async (code: string) => {
</label>
</div>
</div>
<!-- Error Messages -->
<div>
<label class="form-label">Form mit Fehlermeldung</label>
<input type="email" class="form-input border-red-500/50" placeholder="ihre.email@beispiel.de" />
<p class="form-error">Bitte geben Sie eine gültige E-Mail-Adresse ein</p>
</div>
<!-- Error Message Styles -->
<div class="space-y-3 mt-6">
<h4 class="text-lg font-semibold text-white">Fehlermeldungen (.form-error)</h4>
<p class="form-error">Dies ist eine Fehlermeldung mit gutem Kontrast</p>
<p class="form-error">Required</p>
<p class="form-error">Das Passwort muss mindestens 8 Zeichen lang sein</p>
</div>
</div>
<details class="bg-white/5 p-4 rounded-lg mt-6">
@@ -568,7 +583,7 @@ const copyCode = async (code: string) => {
<ul class="list-disc list-inside space-y-2 text-white/90">
<li><strong>CommonHeader</strong> - Main navigation header with experimenta logo</li>
<li><strong>CommonFooter</strong> - Footer with 4-column grid (links, contact, legal, social)</li>
<li><strong>UiButton</strong> - shadcn-nuxt Button component with 7 variants</li>
<li><strong>Button</strong> - shadcn-nuxt Button component with 7 variants</li>
</ul>
<p class="mt-4 text-sm text-white/70">
See individual component files in <code