SLP_Software/SlpSoftware
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Maak fotoplaceholder rond, kleiner en met accentkleurige border

Browse Source 
De fotoplek was een grote rechthoek (aspect-[4/5], volledige
kolombreedte) met een stippellijnrand. Vervangen door een kleinere,
gecentreerde ronde vorm (h-40/w-40, sm: h-48/w-48) met een dikkere
accentkleurige rand en schaduw, passend bij de rest van de site-stijl
(vgl. de accent-line/border-stijl in ContactSection).

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
Sluijsens
2026-08-17 20:54:48 +02:00
co-authored by Claude Sonnet 5
parent 43132bb491
commit c228a5d0e2
1 changed files with 5 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/features/landing/components/AboutSection.tsx
+5 -3
View File
@@ -16,9 +16,11 @@ export function AboutSection() {
Eén ontwikkelaar, korte lijnen Eén ontwikkelaar, korte lijnen
</h2> </h2>
</div> </div>
<div className="font-mono order-2 flex aspect-[4/5] w-full flex-col items-center justify-center gap-2 rounded border border-dashed border-line bg-surface p-6 text-center text-[0.8rem] uppercase tracking-wider text-muted sm:order-3 sm:col-start-2 sm:row-start-1 sm:row-span-2"> <div className="order-2 flex items-center justify-center sm:order-3 sm:col-start-2 sm:row-start-1 sm:row-span-2">
<span>foto</span> <div className="font-mono flex h-40 w-40 flex-col items-center justify-center gap-1 rounded-full border-2 border-accent-line bg-surface text-center text-[0.7rem] uppercase tracking-wider text-muted shadow-lg sm:h-48 sm:w-48">
<span>Bryan Slop</span> <span>foto</span>
<span>Bryan Slop</span>
</div>
</div> </div>
<div className="order-3 sm:order-2 sm:col-start-1 sm:row-start-2"> <div className="order-3 sm:order-2 sm:col-start-1 sm:row-start-2">
{aboutContent.paragraphs.map((paragraph) => ( {aboutContent.paragraphs.map((paragraph) => (