From 75ec74fe216a1360f59f528e82388c8e7b4ca250 Mon Sep 17 00:00:00 2001
From: Sluijsens <bdslop@gmail.com>
Date: Mon, 17 Aug 2026 10:15:51 +0200
Subject: [PATCH] Update landing page teksten en verplaats Over-sectie naar
 boven

Ververst hero-, werkwijze- en over-teksten, plaatst de Over-sectie
voor de pakketten en vervangt de tech-stack-lijst door een
fotoplaceholder zodat bezoekers straks een gezicht bij het bedrijf
zien.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
---
 .../landing/components/AboutSection.tsx       | 19 +++------------
 src/features/landing/data/content.ts          | 24 +++++--------------
 src/features/landing/pages/LandingPage.tsx    |  2 +-
 3 files changed, 10 insertions(+), 35 deletions(-)

diff --git a/src/features/landing/components/AboutSection.tsx b/src/features/landing/components/AboutSection.tsx
index 24095ef..ad5a80c 100644
--- a/src/features/landing/components/AboutSection.tsx
+++ b/src/features/landing/components/AboutSection.tsx
@@ -20,22 +20,9 @@ export function AboutSection() {
               </p>
             ))}
           </div>
-          <div className="font-mono rounded border border-line bg-surface p-6 text-[0.85rem]">
-            <div className="mb-3.5 text-[0.75rem] uppercase tracking-wider text-accent">
-              tech_stack
-            </div>
-            <ul className="list-none">
-              {aboutContent.techStack.map((item, index) => (
-                <li
-                  key={item.label}
-                  className={`py-1.5 text-muted ${
-                    index < aboutContent.techStack.length - 1 ? 'border-b border-line' : ''
-                  }`}
-                >
-                  <b className="font-medium text-text">{item.label}</b> — {item.value}
-                </li>
-              ))}
-            </ul>
+          <div className="font-mono 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">
+            <span>foto</span>
+            <span>Bryan Slop</span>
           </div>
         </div>
       </div>
diff --git a/src/features/landing/data/content.ts b/src/features/landing/data/content.ts
index 0aca79c..3363575 100644
--- a/src/features/landing/data/content.ts
+++ b/src/features/landing/data/content.ts
@@ -43,14 +43,8 @@ export interface ProcessStepData {
   description: string;
 }
 
-export interface TechStackItem {
-  label: string;
-  value: string;
-}
-
 export interface AboutContent {
   paragraphs: string[];
-  techStack: TechStackItem[];
 }
 
 export interface ContactInfo {
@@ -69,8 +63,8 @@ export const navLinks: NavLink[] = [
 
 export const heroContent: HeroContent = {
   eyebrow: 'Web & .NET development',
-  heading: 'Software die gewoon werkt. Tegen een prijs die je vooraf kent.',
-  lead: 'SLP Software bouwt snelle websites en maatwerk .NET-oplossingen voor ondernemers die geen verrassingen willen — niet in de code, niet op de factuur.',
+  heading: 'SLP software: websites, apps & meer',
+  lead: 'Bij SLP Software kun je terecht voor maatwerk oplossingen. Of het nou gaat om een website, cms of app: wij bouwen het allemaal. Voor ondernemers die geen verrassingen willen — niet in de code, niet op de factuur.',
   codeLine: 'var website = slp.Bouw(uwIdee);',
 };
 
@@ -128,13 +122,13 @@ export const processSteps: ProcessStepData[] = [
     label: 'stap 01 — intake',
     title: 'Kennismaken',
     description:
-      'We bespreken je idee, doelgroep en wensen. Je krijgt direct een eerlijk advies over welk pakket past.',
+      'We bespreken je idee, doelgroep en wensen. Je krijgt direct een eerlijk advies over welk pakket past bij jouw doel.',
   },
   {
     label: 'stap 02 — bouwen',
     title: 'Ontwerpen & ontwikkelen',
     description:
-      'Ik bouw je site of applicatie en houd je onderweg op de hoogte, zodat er geen verrassingen zijn bij oplevering.',
+      'Ik bouw je site of applicatie en houd je onderweg op de hoogte, zodat er geen verrassingen zijn bij de oplevering.',
   },
   {
     label: 'stap 03 — live',
@@ -146,14 +140,8 @@ export const processSteps: ProcessStepData[] = [
 
 export const aboutContent: AboutContent = {
   paragraphs: [
-    'SLP Software is het bedrijf van een web- en .NET-ontwikkelaar die gelooft dat goede software niet ingewikkeld hoeft te voelen. Geen accountmanagers of lange trajecten: je schakelt direct met degene die je project bouwt.',
-    'Van een strakke landingspagina tot een applicatie met eigen back-end — de aanpak is hetzelfde: heldere afspraken, nette code en een resultaat waar je jaren mee vooruit kunt.',
-  ],
-  techStack: [
-    { label: 'Front-end', value: 'HTML, CSS, JavaScript' },
-    { label: 'Back-end', value: '.NET / C#' },
-    { label: "API's", value: 'REST & koppelingen' },
-    { label: 'Focus', value: 'snelheid & onderhoudbaarheid' },
+    'Hi, ik ben Bryan Slop van SLP Software! Ik ben een ervaren web- en .NET-ontwikkelaar. Ik geloof dat goede software niet ingewikkeld hoeft te voelen. Software zonder lange trajecten: je schakelt direct met mij, de ontwikkelaar van jouw website of applicatie.',
+    'Van een strakke landingspagina tot een applicatie met eigen contentmanagementsysteem — de aanpak is hetzelfde: heldere afspraken, nette code en een resultaat waar je jaren mee vooruit kunt.',
   ],
 };
 
diff --git a/src/features/landing/pages/LandingPage.tsx b/src/features/landing/pages/LandingPage.tsx
index b8b4ede..ffac916 100644
--- a/src/features/landing/pages/LandingPage.tsx
+++ b/src/features/landing/pages/LandingPage.tsx
@@ -8,9 +8,9 @@ export function LandingPage() {
   return (
     <>
       <Hero />
+      <AboutSection />
       <PackagesSection />
       <ProcessSection />
-      <AboutSection />
       <ContactSection />
     </>
   );