mmintel/klz-cables.com
1
0
Fork 0
Code Issues Pull Requests 2 Actions Packages Projects Releases Wiki Activity

style: design refinements — reduce title/heading sizes, remove Scribble decorations, add image quality
Some checks failed
Build & Deploy / 🔍 Prepare (push) Successful in 12s
Details
Build & Deploy / 🧪 QA (push) Successful in 3m19s
Details
Build & Deploy / 🏗️ Build (push) Successful in 5m26s
Details
Build & Deploy / 🧪 Post-Deploy Verification (push) Successful in 5m4s
Details
Build & Deploy / 🚀 Deploy (push) Successful in 25s
Details
Build & Deploy / 🔔 Notify (push) Successful in 2s
Details
Nightly QA / call-qa-workflow (push) Failing after 43s
Details

Browse Source 
- Hero title: text-7xl → text-5xl, removed text-shadow
- Removed all Scribble decorative strokes from Hero, VideoSection, products page
- PayloadRichText headings reduced by one size step
- Team page: harmonized Michael/Klaus heading sizes (both text-4xl)
- Product overview: removed min-height from hero, reduced CTA heading
- Added quality={100} to team photos, Experience and MeetTheTeam backgrounds
- Cleaned up unused Scribble imports
This commit is contained in:
Marc Mintel
2026-03-02 01:11:22 +01:00
parent fb3ec6e10a
commit 92bc88dfbd
8 changed files with 49 additions and 79 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
components/home/Experience.tsx
View File

@@ -15,6 +15,7 @@ export default function Experience({ data }: { data?: any }) {
fill
className="object-cover object-center scale-105 animate-slow-zoom"
sizes="100vw"
quality={100}
/>
<div className="absolute inset-0 bg-primary/80 mix-blend-multiply" />
<div className="absolute inset-0 bg-gradient-to-r from-primary via-primary/40 to-transparent" />

45
components/home/Hero.tsx
View File

@@ -1,6 +1,5 @@
'use client';
import Scribble from '@/components/Scribble';
import { Button, Container, Heading, Section } from '@/components/ui';
import { useTranslations, useLocale } from 'next-intl';
import dynamic from 'next/dynamic';
@@ -20,45 +19,19 @@ export default function Hero({ data }: { data?: any }) {
<div>
<Heading
level={1}
className="text-center md:text-left mb-6 md:mb-8 md:max-w-none text-white text-4xl sm:text-5xl md:text-7xl font-extrabold [text-shadow:_-2px_-2px_0_#002b49,_2px_-2px_0_#002b49,_-2px_2px_0_#002b49,_2px_2px_0_#002b49,_-2px_0_0_#002b49,_2px_0_0_#002b49,_0_-2px_0_#002b49,_0_2px_0_#002b49]"
className="text-center md:text-left mb-6 md:mb-8 md:max-w-none text-white text-3xl sm:text-4xl md:text-5xl font-extrabold"
>
{data?.title ? (
<>
{data.title.split(/(<green>.*?<\/green>)/g).map((part: string, i: number) => {
if (part.startsWith('<green>') && part.endsWith('</green>')) {
const content = part.replace(/<\/?green>/g, '');
return (
<span key={i} className="relative inline-block">
<span className="relative z-10 text-accent italic inline-block">
{content}
</span>
<div
className="w-[140%] h-[140%] -top-[20%] -left-[20%] text-accent/30 hidden md:block absolute -z-10 animate-in fade-in zoom-in-0 duration-1000 ease-out fill-mode-both"
style={{ animationDelay: '500ms' }}
>
<Scribble variant="circle" />
</div>
</span>
);
}
return <span key={i}>{part}</span>;
})}
</>
<span
dangerouslySetInnerHTML={{
__html: data.title
.replace(/<green>/g, '<span class="text-accent italic">')
.replace(/<\/green>/g, '</span>'),
}}
/>
) : (
t.rich('title', {
green: (chunks) => (
<span className="relative inline-block">
<span className="relative z-10 text-accent italic inline-block">
{chunks}
</span>
<div
className="w-[140%] h-[140%] -top-[20%] -left-[20%] text-accent/30 hidden md:block absolute -z-10 animate-in fade-in zoom-in-0 duration-1000 ease-out fill-mode-both"
style={{ animationDelay: '500ms' }}
>
<Scribble variant="circle" />
</div>
</span>
),
green: (chunks) => <span className="text-accent italic">{chunks}</span>,
})
)}
</Heading>

1
components/home/MeetTheTeam.tsx
View File

@@ -17,6 +17,7 @@ export default function MeetTheTeam({ data }: { data?: any }) {
fill
className="object-cover scale-105 animate-slow-zoom"
sizes="100vw"
quality={100}
/>
<div className="absolute inset-0 bg-primary/70 mix-blend-multiply" />
<div className="absolute inset-0 bg-gradient-to-t from-primary via-primary/20 to-transparent" />

19
components/home/VideoSection.tsx
View File

@@ -1,7 +1,6 @@
'use client';
import React, { useState, useEffect, useRef } from 'react';
import Scribble from '@/components/Scribble';
import { useTranslations } from 'next-intl';
export default function VideoSection({ data }: { data?: any }) {
@@ -41,18 +40,16 @@ export default function VideoSection({ data }: { data?: any }) {
<div className="max-w-5xl px-6 text-center animate-slide-up pointer-events-auto">
<h2 className="text-3xl md:text-4xl lg:text-5xl font-extrabold text-white leading-[1.1]">
{data?.title ? (
<span dangerouslySetInnerHTML={{ __html: data.title.replace(/<future>/g, '<span class="relative inline-block mx-2"><span class="relative z-10 italic text-accent">').replace(/<\/future>/g, '</span><Scribble variant="underline" class="w-full h-4 -bottom-2 left-0 text-accent/40" /></span>') }} />
<span
dangerouslySetInnerHTML={{
__html: data.title
.replace(/<future>/g, '<span class="italic text-accent">')
.replace(/<\/future>/g, '</span>'),
}}
/>
) : (
t.rich('title', {
future: (chunks) => (
<span className="relative inline-block mx-2">
<span className="relative z-10 italic text-accent">{chunks}</span>
<Scribble
variant="underline"
className="w-full h-4 -bottom-2 left-0 text-accent/40"
/>
</span>
),
future: (chunks) => <span className="italic text-accent">{chunks}</span>,
})
)}
</h2>