favicon + new header
This commit is contained in:
Your Name
parent
ae9017020c
commit
28393570a6
|
|
@ -49,7 +49,8 @@
|
|||
{
|
||||
"glob": "**/*",
|
||||
"input": "public"
|
||||
}
|
||||
},
|
||||
"src/assets"
|
||||
],
|
||||
"styles": [
|
||||
"src/styles.scss"
|
||||
|
|
|
|||
Binary file not shown.
|
Before Width: | Height: | Size: 993 B After Width: | Height: | Size: 489 B |
Binary file not shown.
|
Before Width: | Height: | Size: 1.9 KiB After Width: | Height: | Size: 562 B |
Binary file not shown.
|
Before Width: | Height: | Size: 3.2 KiB After Width: | Height: | Size: 593 B |
|
|
@ -9,7 +9,25 @@ import { PopoverService } from './services/popover.service';
|
|||
@Component({
|
||||
selector: 'app-root',
|
||||
template: `
|
||||
<div *ngIf="!isLoggedIn" class="min-h-screen flex flex-col items-center justify-center bg-gradient-to-r from-blue-500 to-purple-600 text-white">
|
||||
<!-- <div *ngIf="!isLoggedIn" class="min-h-screen flex flex-col items-center justify-center bg-gradient-to-r from-blue-500 to-purple-600 text-white">
|
||||
<div class="text-center">
|
||||
<h1 class="text-5xl font-bold mb-4">Master Your Learning</h1>
|
||||
<p class="text-xl mb-8">Learn smarter, not harder. Start your journey today</p>
|
||||
<button (click)="loginWithGoogle()" class="bg-white text-blue-600 px-6 py-3 rounded-lg shadow-lg hover:bg-gray-100 transition duration-300 flex items-center justify-center">
|
||||
<svg class="w-6 h-6 mr-2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48">
|
||||
<path
|
||||
fill="#FFC107"
|
||||
d="M43.611 20.083H42V20H24v8h11.303c-1.649 4.657-6.08 8-11.303 8-6.627 0-12-5.373-12-12s5.373-12 12-12c3.059 0 5.842 1.154 7.961 3.039l5.657-5.657C34.046 6.053 29.268 4 24 4 12.955 4 4 12.955 4 24s8.955 20 20 20 20-8.955 20-20c0-1.341-.138-2.65-.389-3.917z"
|
||||
/>
|
||||
<path fill="#FF3D00" d="M6.306 14.691l6.571 4.819C14.655 15.108 18.961 12 24 12c3.059 0 5.842 1.154 7.961 3.039l5.657-5.657C34.046 6.053 29.268 4 24 4 16.318 4 9.656 8.337 6.306 14.691z" />
|
||||
<path fill="#4CAF50" d="M24 44c5.166 0 9.86-1.977 13.409-5.192l-6.19-5.238A11.91 11.91 0 0124 36c-5.202 0-9.619-3.317-11.283-7.946l-6.522 5.025C9.505 39.556 16.227 44 24 44z" />
|
||||
<path fill="#1976D2" d="M43.611 20.083H42V20H24v8h11.303a12.04 12.04 0 01-4.087 5.571l.003-.002 6.19 5.238C36.971 39.205 44 34 44 24c0-1.341-.138-2.65-.389-3.917z" />
|
||||
</svg>
|
||||
Login with Google
|
||||
</button>
|
||||
</div>
|
||||
</div> -->
|
||||
<div *ngIf="!isLoggedIn" class="min-h-screen flex flex-col items-center justify-center" style="background: linear-gradient(to right, rgba(0, 119, 179, 0.95), rgba(255, 255, 255, 0.95));">
|
||||
<div class="text-center">
|
||||
<h1 class="text-5xl font-bold mb-4">Master Your Learning</h1>
|
||||
<p class="text-xl mb-8">Learn smarter, not harder. Start your journey today</p>
|
||||
|
|
@ -28,7 +46,7 @@ import { PopoverService } from './services/popover.service';
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div *ngIf="isLoggedIn" class="container mx-auto p-4">
|
||||
<!-- <div *ngIf="isLoggedIn" class="container mx-auto p-4">
|
||||
<div class="flex justify-center items-center mb-8">
|
||||
<h1 class="text-3xl font-bold mx-auto">Haiky Spaced Repetition Training</h1>
|
||||
<div class="relative" appClickOutside (clickOutside)="showDropdown = false">
|
||||
|
|
@ -44,7 +62,39 @@ import { PopoverService } from './services/popover.service';
|
|||
</div>
|
||||
</div>
|
||||
<app-deck-list></app-deck-list>
|
||||
</div> -->
|
||||
<div *ngIf="isLoggedIn" class="bg-white shadow mb-4">
|
||||
<div class="container mx-auto px-4 py-2 flex justify-between items-center">
|
||||
<!-- Logo und Name -->
|
||||
<div class="flex items-center space-x-2">
|
||||
<img src="../assets/logo.svg" alt="Logo" class="w-10 h-10" />
|
||||
<span class="text-xl font-bold">Haiky</span>
|
||||
</div>
|
||||
|
||||
<!-- Navigation -->
|
||||
<div class="hidden md:flex space-x-6">
|
||||
<!-- <a href="#" class="text-gray-700 hover:text-gray-900">Kompakt</a>
|
||||
<a href="#" class="text-gray-700 hover:text-gray-900">Umwandeln</a>
|
||||
<a href="#" class="text-gray-700 hover:text-gray-900">Zusammenführen</a>
|
||||
<a href="#" class="text-gray-700 hover:text-gray-900">Bearbeiten</a>
|
||||
<a href="#" class="text-gray-700 hover:text-gray-900">KI PDF</a> -->
|
||||
<span class="text-xl font-bold">Spaced Repetition Training</span>
|
||||
</div>
|
||||
|
||||
<!-- User-Bereich -->
|
||||
<div appClickOutside class="relative">
|
||||
<img *ngIf="photoURL" [src]="photoURL" alt="User Photo" class="w-10 h-10 rounded-full cursor-pointer" (click)="toggleDropdown()" referrerpolicy="no-referrer" crossorigin="anonymous" />
|
||||
<div *ngIf="!photoURL" class="image-placeholder w-10 h-10 rounded-full cursor-pointer bg-gray-300"></div>
|
||||
|
||||
<!-- Dropdown -->
|
||||
<div *ngIf="showDropdown" class="absolute right-0 mt-2 w-48 bg-white rounded-lg shadow-lg z-10">
|
||||
<button (click)="logout()" class="block w-full text-left px-4 py-2 text-gray-700 hover:bg-gray-100">Abmelden</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<app-deck-list *ngIf="isLoggedIn"></app-deck-list>
|
||||
|
||||
<app-popover
|
||||
[visible]="popoverVisible"
|
||||
[title]="popoverTitle"
|
||||
|
|
|
|||
|
|
@ -1,54 +1,19 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 40">
|
||||
<!-- Definitionen für Gradienten und Stile -->
|
||||
<defs>
|
||||
<!-- Hauptpfeil-Gradient - Intensivere Farben -->
|
||||
<linearGradient id="arrowGradient" x1="0%" y1="0%" x2="0%" y2="100%">
|
||||
<stop offset="0%" style="stop-color:#0066FF"/>
|
||||
<stop offset="50%" style="stop-color:#7B00FF"/>
|
||||
<stop offset="100%" style="stop-color:#00FFB3"/>
|
||||
</linearGradient>
|
||||
|
||||
<!-- Kreisgradienten - Intensivere Farben -->
|
||||
<linearGradient id="circle1Gradient" x1="0%" y1="0%" x2="100%" y2="100%">
|
||||
<stop offset="0%" style="stop-color:#FF0000"/>
|
||||
<stop offset="100%" style="stop-color:#FFD700"/>
|
||||
</linearGradient>
|
||||
|
||||
<linearGradient id="circle2Gradient" x1="100%" y1="0%" x2="0%" y2="100%">
|
||||
<stop offset="0%" style="stop-color:#00FFE0"/>
|
||||
<stop offset="100%" style="stop-color:#1E3DEE"/>
|
||||
</linearGradient>
|
||||
|
||||
<linearGradient id="circle3Gradient" x1="0%" y1="100%" x2="100%" y2="0%">
|
||||
<stop offset="0%" style="stop-color:#FF6B00"/>
|
||||
<stop offset="100%" style="stop-color:#FF0000"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
|
||||
<!-- Hintergrund - Dunklerer Hintergrund für mehr Kontrast -->
|
||||
<rect width="40" height="40" fill="#000000"/>
|
||||
<!-- Hintergrund -->
|
||||
<rect width="40" height="40" fill="#ffffff"/>
|
||||
|
||||
<!-- Äußerer Kreis - Dickere Linien -->
|
||||
<circle cx="20" cy="20" r="16"
|
||||
stroke="url(#circle1Gradient)"
|
||||
stroke-width="2"
|
||||
stroke-dasharray="4,2"
|
||||
fill="none"/>
|
||||
<!-- Basis H - Rot -->
|
||||
<path d="M6 4 H14 V16 H26 V4 H34 V36 H26 V24 H14 V36 H6 Z" fill="#FF4F4F"/>
|
||||
|
||||
<!-- Mittlerer Kreis -->
|
||||
<circle cx="20" cy="20" r="12"
|
||||
stroke="url(#circle2Gradient)"
|
||||
stroke-width="1.75"
|
||||
stroke-dasharray="3,1.5"
|
||||
fill="none"/>
|
||||
<!-- Grünes Element -->
|
||||
<path d="M6 4 H14 V16 H26 V4 H34 V20 H6 Z" fill="#2ECC40"/>
|
||||
|
||||
<!-- Innerer Kreis -->
|
||||
<circle cx="20" cy="20" r="8"
|
||||
stroke="url(#circle3Gradient)"
|
||||
stroke-width="1.5"
|
||||
fill="none"/>
|
||||
<!-- Gelber Bereich -->
|
||||
<path d="M10 8 H16 V16 H24 V8 H30 V32 H24 V24 H16 V32 H10 Z" fill="#FFBE00"/>
|
||||
|
||||
<!-- Kleinerer dynamischer Pfeil im innersten Kreis -->
|
||||
<path d="M20,14 L18,26 L22,26 Z"
|
||||
fill="url(#arrowGradient)"/>
|
||||
<!-- Jadegrüner Bereich -->
|
||||
<path d="M12 12 H18 V16 H22 V12 H28 V28 H22 V24 H18 V28 H12 Z" fill="#00C4A7"/>
|
||||
|
||||
<!-- Innerstes blaues Element -->
|
||||
<path d="M14 14 H19 V16 H21 V14 H26 V26 H21 V24 H19 V26 H14 Z" fill="#0077B3"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 1.9 KiB After Width: | Height: | Size: 682 B |
Loading…
Reference in New Issue