tikaiz/website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

carousel is now as big as the other elements
All checks were successful
publish.yml / publish (push) Successful in 1m3s
Details

Browse Source
This commit is contained in:
Tim Kainz
2026-04-16 19:44:48 +02:00
parent 7032968fe2
commit 3072668e05
2 changed files with 53 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
src/pages/home/home.html
View File

@@ -48,26 +48,28 @@
<span aria-hidden="true">&larr;</span>
</button>
<div class="stack-carousel" #stackCarousel role="region" aria-label="Tech stack carousel">
@for (skill of skills; track skill.name) {
<app-card cardClass="skill-card stack-slide">
<div class="skill-heading">
<span class="skill-icon" role="img" [attr.aria-label]="skill.name + ' logo'">
<img
class="skill-logo"
[src]="skill.logoUrl"
[alt]="skill.name + ' logo'"
loading="lazy"
decoding="async"
(error)="onLogoError($event)"
/>
<span class="skill-fallback" aria-hidden="true">{{ skill.fallbackLabel }}</span>
</span>
<h3>{{ skill.name }}</h3>
</div>
<p class="meta">{{ skill.category }} - {{ skill.level }}</p>
</app-card>
}
<div class="stack-carousel-column">
<div class="stack-carousel" #stackCarousel role="region" aria-label="Tech stack carousel">
@for (skill of skills; track skill.name) {
<app-card cardClass="skill-card stack-slide">
<div class="skill-heading">
<span class="skill-icon" role="img" [attr.aria-label]="skill.name + ' logo'">
<img
class="skill-logo"
[src]="skill.logoUrl"
[alt]="skill.name + ' logo'"
loading="lazy"
decoding="async"
(error)="onLogoError($event)"
/>
<span class="skill-fallback" aria-hidden="true">{{ skill.fallbackLabel }}</span>
</span>
<h3>{{ skill.name }}</h3>
</div>
<p class="meta">{{ skill.category }} - {{ skill.level }}</p>
</app-card>
}
</div>
</div>
<button class="carousel-btn" type="button" aria-label="Next technologies" (click)="scrollStack(1)">