jank/casino
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

finished homepage skeleton

Browse source
This commit is contained in:
Lea 2025-02-12 10:21:41 +01:00
parent bbbf0a9473
commit f5ae0e358c
3 changed files with 20 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
frontend/src/app/homepage/homepage/homepage.component.css
View file

@ -0,0 +1 @@

21
frontend/src/app/homepage/homepage/homepage.component.html
View file

@ -3,33 +3,32 @@
<div class="container mx-auto px-4 py-3 flex justify-between items-center">
<!-- logo goes here -->
<div class="flex gap-4">
<button (click)="onLogout()" class="px-6 py-2 text-black bg-amber-500 hover:bg-amber-400 rounded-full font-bold transition-all duration-300 hover:shadow-lg hover:shadow-amber-500/20">
<button (click)="onLogout()" class="btn-primary">
Ausloggen
</button>
</div>
<div>
<button (click)="openUserInfo()" class="px-6 py-2 text-black bg-amber-500 hover:bg-amber-400 rounded-full font-bold transition-all duration-300 hover:shadow-lg hover:shadow-amber-500/20">
<button (click)="openUserInfo()" class="btn-primary">
Benutzer
</button>
</div>
</div>
<!-- Todo Dropdown für Benutzermenu (Dailytracker) -->
</nav>
<!-- Spiele mit Vorschau, Name und "Jetzt spielen" Button -->
<div class="gird grid-col-3">
<div class="w-full h-full">
<div class="grid grid-cols-3">
<div class="w-1/3 h-1/4">
<p>Spiel Vorschau</p>
<p>Spiel Name</p>
<button type="button" >Jetzt spielen</button>
<button type="button" class="btn-primary">Jetzt spielen</button>
</div>
<div class="w-full h-full">
<div class="w-1/3 h-1/4">
<p>Spiel Vorschau</p>
<p>Spiel Name</p>
<button type="button" >Jetzt spielen</button>
<button type="button" class="btn-primary">Jetzt spielen</button>
</div>
<div class="w-full h-full">
<div class="w-1/3 h-1/4">
<p>Spiel Vorschau</p>
<p>Spiel Name</p>
<button type="button" >Jetzt spielen</button>
<button type="button" class="btn-primary">Jetzt spielen</button>
</div>
</div>

9
frontend/src/styles.css
View file

@ -1 +1,10 @@
@import "tailwindcss";
.btn-primary {
@apply px-4 py-2 cursor-pointer relative font-bold rounded-lg transition-all duration-300 ease-out transform-gpu hover:scale-105 will-change-transform bg-gradient-to-r from-emerald-500 to-emerald-400 text-black hover:shadow-xl hover:shadow-emerald-500/20
}
.btn-secondary {
@apply px-4 py-2 cursor-pointer relative font-bold rounded-lg transition-all duration-300 ease-out transform-gpu hover:scale-105 will-change-transform bg-white/10 text-white hover:bg-white/20
}