gitmedia/b2in
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

23-01-2026

Browse source
This commit is contained in:
Kevin Adametz 2026-01-23 17:33:10 +01:00
parent 07959c0ba2
commit 854ce02bf6
166 changed files with 32909 additions and 1262 deletions
Download patch file Download diff file Expand all files Collapse all files

174
resources/views/emails/README.md Normal file
View file

@ -0,0 +1,174 @@
# E-Mail-Vorlagen
Diese Anwendung verwendet angepasste E-Mail-Vorlagen mit einem professionellen B2IN-Design.
## 📧 Verfügbare E-Mail-Vorlagen
### 1. Partner-Einladung
**Datei:** `partner-invitation.blade.php`
Wird versendet wenn ein Partner eingeladen wird.
**Variablen:**
- `$contactFullName` - Vollständiger Name des Kontakts
- `$companyName` - Firmenname
- `$partnerType` - Partner-Typ (Rolle)
- `$invitationUrl` - Einladungs-URL
- `$expiresAt` - Ablaufdatum der Einladung
- `$invitation` - Komplettes Invitation-Objekt
### 2. Passwort zurücksetzen
**Klasse:** `App\Notifications\CustomResetPasswordNotification`
Wird versendet wenn ein Benutzer sein Passwort zurücksetzen möchte.
**Features:**
- Zeitlich begrenzter Reset-Link
- Klare Sicherheitshinweise
- Responsives Design
### 3. E-Mail-Verifizierung
**Klasse:** `App\Notifications\CustomVerifyEmailNotification`
Wird nach der Registrierung versendet.
**Features:**
- Zeitlich begrenzter Bestätigungslink (60 Minuten)
- Willkommenstext
- Klare Call-to-Action
## 🎨 Design-System
Das E-Mail-Design verwendet das B2IN-Theme mit folgenden Farben:
- **Primary (Anthracite):** `#2b3f51`
- **Secondary (Dynamic Blue):** `#20a0da`
- **Font:** Instrument Sans
### CSS-Theme
Die Styles befinden sich in:
```
resources/views/vendor/mail/html/themes/b2in.css
```
## 🔧 Anpassungen
### Neue E-Mail-Vorlage erstellen
1. Erstelle eine neue Blade-Datei in `resources/views/emails/`
2. Verwende die Mail-Komponenten:
```blade
@component('mail::message')
# Überschrift
Hier kommt der Inhalt.
@component('mail::button', ['url' => $actionUrl, 'color' => 'primary'])
Button Text
@endcomponent
@component('mail::panel')
Wichtige Information in einem Panel
@endcomponent
Mit freundlichen Grüßen
Ihr **{{ config('app.name') }}** Team
@endcomponent
```
### Verfügbare Komponenten
#### Button
```blade
@component('mail::button', ['url' => $url, 'color' => 'primary|success|error'])
Button Text
@endcomponent
```
**Farben:**
- `primary` - Blauer Gradient (Standard)
- `success` - Grüner Gradient
- `error` - Roter Gradient
#### Panel
```blade
@component('mail::panel')
Wichtiger Inhalt
@endcomponent
```
#### Tabelle
```blade
@component('mail::table')
| Spalte 1 | Spalte 2 |
|:---------|:---------|
| Wert 1 | Wert 2 |
@endcomponent
```
### Custom Notification erstellen
1. Erstelle eine neue Notification-Klasse in `app/Notifications/`
2. Erweitere die gewünschte Laravel-Notification
3. Überschreibe die `buildMailMessage` Methode
Beispiel:
```php
<?php
namespace App\Notifications;
use Illuminate\Auth\Notifications\ResetPassword;
use Illuminate\Notifications\Messages\MailMessage;
class CustomNotification extends ResetPassword
{
protected function buildMailMessage($url)
{
return (new MailMessage)
->subject('Betreff')
->greeting('Hallo!')
->line('Nachrichtentext')
->action('Button', $url)
->salutation('Grüße');
}
}
```
## 📱 Responsive Design
Alle E-Mails sind für mobile Geräte optimiert und passen sich automatisch der Bildschirmgröße an.
## 🌙 Dark Mode
Das Theme unterstützt automatisch Dark Mode für E-Mail-Clients, die dies unterstützen.
## 🧪 Testen
E-Mails können im Browser getestet werden. Laravel speichert E-Mails standardmäßig im Log:
```bash
php artisan tinker
>>> $user = App\Models\User::first();
>>> $user->sendPasswordResetNotification('test-token');
```
Die E-Mail wird in `storage/logs/laravel.log` gespeichert.
## 🔄 Weitere E-Mail-Typen hinzufügen
Falls weitere E-Mail-Typen benötigt werden:
1. Erstelle eine neue Mailable-Klasse: `php artisan make:mail YourMail --markdown=emails.your-mail`
2. Erstelle die Blade-Vorlage in `resources/views/emails/`
3. Verwende die Standard-Komponenten für konsistentes Design
4. Sende die E-Mail mit `Mail::to($user)->send(new YourMail())`
## 📝 Hinweise
- Alle E-Mails verwenden automatisch das B2IN-Theme
- Die Vorlagen sind mehrsprachig vorbereitet
- Header und Footer sind in allen E-Mails konsistent
- E-Mails werden inline-styled für beste Kompatibilität mit E-Mail-Clients

89
resources/views/emails/partner-invitation.blade.php
View file

@ -1,47 +1,64 @@
<x-mail::message>
# Willkommen bei B2In!
@component('mail::message')
# Willkommen bei {{ config('app.name') }}!
@if($contactFullName)
Hallo {{ $contactFullName }},
Sie wurden eingeladen, Teil unserer Plattform zu werden.
Sie wurden eingeladen, Teil unserer innovativen Partner-Plattform zu werden.
@else
Sie wurden eingeladen, Teil unserer Plattform zu werden.
Sie wurden eingeladen, Teil unserer innovativen Partner-Plattform zu werden.
@endif
## Firmeninformationen
**Firmenname:** {{ $companyName }}
**Partner-Typ:** {{ $partnerType }}
Wir freuen uns, Sie als **{{ $partnerType }}** in unserem Netzwerk begrüßen zu dürfen!
## Nächste Schritte
Klicken Sie auf den Button unten, um Ihre Registrierung abzuschließen. Sie können dann:
- Ihr Unternehmensprofil vervollständigen
- Zugriff auf unser Partner-Portal erhalten
- Mit anderen Partnern im Netzwerk interagieren
<x-mail::button :url="$invitationUrl" color="primary">
Registrierung abschließen
</x-mail::button>
<x-mail::panel>
**Wichtig:** Diese Einladung ist gültig bis zum {{ $expiresAt->format('d.m.Y H:i') }} Uhr.
</x-mail::panel>
Falls Sie Fragen haben, können Sie uns jederzeit kontaktieren.
Mit freundlichen Grüßen,
{{ config('app.name') }} Team
Wir freuen uns sehr, dass Sie Teil unseres wachsenden Netzwerks werden möchten!
---
<small>
## Ihre Einladungsdetails
<x-mail::table>
| Detail | Information |
|:-------|:------------|
| **Firmenname** | {{ $companyName }} |
| **Partner-Typ** | {{ $partnerType }} |
| **E-Mail** | {{ $invitation->email }} |
</x-mail::table>
---
## So geht es weiter
Klicken Sie einfach auf den Button unten, um Ihre Registrierung in wenigen Schritten abzuschließen:
<x-mail::button :url="$invitationUrl" color="primary">
Jetzt registrieren
</x-mail::button>
Nach erfolgreicher Registrierung können Sie:
**Ihr Unternehmensprofil vervollständigen** – Präsentieren Sie Ihr Unternehmen optimal
**Zugriff auf das Partner-Portal erhalten** – Nutzen Sie alle Funktionen unserer Plattform
**Mit anderen Partnern vernetzen** – Profitieren Sie von unserem starken Netzwerk
**Projekte verwalten und koordinieren** – Effiziente Zusammenarbeit in Echtzeit
---
<x-mail::panel>
**Wichtig:** Diese Einladung ist gültig bis zum **{{ $expiresAt->format('d.m.Y') }}** um **{{ $expiresAt->format('H:i') }} Uhr**.
</x-mail::panel>
## Haben Sie Fragen?
Unser Support-Team steht Ihnen jederzeit gerne zur Verfügung. Zögern Sie nicht, uns zu kontaktieren!
Mit freundlichen Grüßen
Ihr **{{ config('app.name') }}** Team
@slot('subcopy')
Falls der Button nicht funktioniert, kopieren Sie bitte den folgenden Link in Ihren Browser:
{{ $invitationUrl }}
</small>
</x-mail::message>
[{{ $invitationUrl }}]({{ $invitationUrl }})
@endslot
@endcomponent

165
resources/views/emails/test-overview.blade.php Normal file
View file

@ -0,0 +1,165 @@
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>E-Mail-Vorlagen Vorschau</title>
<script src="https://cdn.tailwindcss.com"></script>
<link href="https://fonts.googleapis.com/css2?family=Instrument+Sans:wght@400;500;600;700&display=swap" rel="stylesheet">
<style>
body {
font-family: 'Instrument Sans', sans-serif;
}
</style>
</head>
<body class="bg-gray-50">
<div class="min-h-screen py-12 px-4 sm:px-6 lg:px-8">
<div class="max-w-4xl mx-auto">
<!-- Header -->
<div class="text-center mb-12">
<h1 class="text-4xl font-bold text-gray-900 mb-4">📧 E-Mail-Vorlagen Vorschau</h1>
<p class="text-lg text-gray-600">Testen Sie alle E-Mail-Vorlagen im B2IN-Design</p>
</div>
<!-- Email Templates Grid -->
<div class="grid gap-6 md:grid-cols-2 lg:grid-cols-3">
<!-- Partner Invitation -->
<a href="{{ route('test.email.partner-invitation') }}"
target="_blank"
class="block p-6 bg-white rounded-xl shadow-md hover:shadow-xl transition-shadow duration-300 border-2 border-transparent hover:border-blue-500">
<div class="flex items-center justify-between mb-4">
<div class="p-3 bg-blue-100 rounded-lg">
<svg class="w-6 h-6 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z" />
</svg>
</div>
<span class="text-sm font-medium text-green-600 bg-green-100 px-3 py-1 rounded-full">Aktiv</span>
</div>
<h3 class="text-xl font-semibold text-gray-900 mb-2">Partner-Einladung</h3>
<p class="text-gray-600 mb-4">E-Mail für neue Partner-Einladungen mit allen Details und Call-to-Action</p>
<div class="flex items-center text-blue-600 font-medium">
<span>Vorschau anzeigen</span>
<svg class="w-4 h-4 ml-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7" />
</svg>
</div>
</a>
<!-- Password Reset -->
<a href="{{ route('test.email.password-reset') }}"
target="_blank"
class="block p-6 bg-white rounded-xl shadow-md hover:shadow-xl transition-shadow duration-300 border-2 border-transparent hover:border-blue-500">
<div class="flex items-center justify-between mb-4">
<div class="p-3 bg-orange-100 rounded-lg">
<svg class="w-6 h-6 text-orange-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z" />
</svg>
</div>
<span class="text-sm font-medium text-green-600 bg-green-100 px-3 py-1 rounded-full">Aktiv</span>
</div>
<h3 class="text-xl font-semibold text-gray-900 mb-2">Passwort zurücksetzen</h3>
<p class="text-gray-600 mb-4">E-Mail für Passwort-Reset-Anfragen mit zeitlich begrenztem Link</p>
<div class="flex items-center text-blue-600 font-medium">
<span>Vorschau anzeigen</span>
<svg class="w-4 h-4 ml-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7" />
</svg>
</div>
</a>
<!-- Email Verification -->
<a href="{{ route('test.email.verification') }}"
target="_blank"
class="block p-6 bg-white rounded-xl shadow-md hover:shadow-xl transition-shadow duration-300 border-2 border-transparent hover:border-blue-500">
<div class="flex items-center justify-between mb-4">
<div class="p-3 bg-green-100 rounded-lg">
<svg class="w-6 h-6 text-green-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z" />
</svg>
</div>
<span class="text-sm font-medium text-green-600 bg-green-100 px-3 py-1 rounded-full">Aktiv</span>
</div>
<h3 class="text-xl font-semibold text-gray-900 mb-2">E-Mail-Verifizierung</h3>
<p class="text-gray-600 mb-4">Willkommens-E-Mail mit Bestätigungslink für neue Registrierungen</p>
<div class="flex items-center text-blue-600 font-medium">
<span>Vorschau anzeigen</span>
<svg class="w-4 h-4 ml-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7" />
</svg>
</div>
</a>
</div>
<!-- Design System Info -->
<div class="mt-12 bg-white rounded-xl shadow-md p-8">
<h2 class="text-2xl font-bold text-gray-900 mb-6">🎨 Design-System</h2>
<div class="grid gap-6 md:grid-cols-2">
<div>
<h3 class="text-lg font-semibold text-gray-900 mb-3">Farben</h3>
<div class="space-y-3">
<div class="flex items-center">
<div class="w-12 h-12 rounded-lg" style="background-color: #2b3f51;"></div>
<div class="ml-4">
<p class="font-medium text-gray-900">Primary (Anthracite)</p>
<p class="text-sm text-gray-600">#2b3f51</p>
</div>
</div>
<div class="flex items-center">
<div class="w-12 h-12 rounded-lg" style="background-color: #20a0da;"></div>
<div class="ml-4">
<p class="font-medium text-gray-900">Secondary (Dynamic Blue)</p>
<p class="text-sm text-gray-600">#20a0da</p>
</div>
</div>
</div>
</div>
<div>
<h3 class="text-lg font-semibold text-gray-900 mb-3">Typografie</h3>
<div class="space-y-2">
<p class="font-medium text-gray-900">Font Family</p>
<p class="text-gray-600">Instrument Sans</p>
</div>
<div class="mt-4">
<h3 class="text-lg font-semibold text-gray-900 mb-3">Features</h3>
<ul class="space-y-2 text-gray-600">
<li class="flex items-center">
<svg class="w-5 h-5 text-green-500 mr-2" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd" />
</svg>
Responsive Design
</li>
<li class="flex items-center">
<svg class="w-5 h-5 text-green-500 mr-2" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd" />
</svg>
Dark Mode Support
</li>
<li class="flex items-center">
<svg class="w-5 h-5 text-green-500 mr-2" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd" />
</svg>
Inline CSS (E-Mail-Client kompatibel)
</li>
</ul>
</div>
</div>
</div>
</div>
<!-- Documentation Link -->
<div class="mt-8 text-center">
<a href="/emails/README.md" class="inline-flex items-center text-blue-600 hover:text-blue-700 font-medium">
<svg class="w-5 h-5 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
</svg>
Dokumentation anzeigen
</a>
</div>
</div>
</div>
</body>
</html>