mmintel/mb-grid-solutions.com
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

mobile
All checks were successful
Build & Deploy MB Grid Solutions / build-and-deploy (push) Successful in 1m49s
Details

Browse Source
This commit is contained in:
Marc Mintel
2026-01-29 17:00:06 +01:00
parent 44d4ac38b6
commit e033fd6290
7 changed files with 41 additions and 41 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
components/AboutContent.tsx
View File

@@ -30,12 +30,12 @@ export default function About() {
</span>
</Reveal>
<Reveal delay={0.2}>
<h1 className="text-5xl md:text-6xl font-extrabold text-primary mb-8 leading-tight">
<h1 className="text-4xl sm:text-5xl md:text-6xl font-extrabold text-primary mb-6 md:mb-8 leading-tight">
Wir gestalten die <span className="text-accent">Infrastruktur</span> der Zukunft
</h1>
</Reveal>
<Reveal delay={0.3}>
<p className="text-slate-600 text-xl md:text-2xl leading-relaxed mb-8">
<p className="text-slate-600 text-lg md:text-2xl leading-relaxed mb-8">
MB Grid Solution steht for technische Exzellenz in der Energiekabeltechnologie. Wir verstehen uns als Ihr technischer Lotse.
</p>
</Reveal>
@@ -89,8 +89,8 @@ export default function About() {
<Counter value={3} className="section-number !text-white/5" />
<Reveal className="mb-20">
<span className="text-accent font-bold uppercase tracking-widest text-sm mb-4 block">Werte</span>
<h2 className="text-4xl md:text-5xl font-bold text-white mb-6">Unser Manifest</h2>
<p className="text-slate-400 text-lg">Werte, die unsere tägliche Arbeit leiten und den Erfolg Ihrer Projekte sichern.</p>
<h2 className="text-3xl md:text-5xl font-bold text-white mb-6">Unser Manifest</h2>
<p className="text-slate-400 text-base md:text-lg">Werte, die unsere tägliche Arbeit leiten und den Erfolg Ihrer Projekte sichern.</p>
</Reveal>
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
@@ -123,17 +123,17 @@ export default function About() {
<div className="container-custom relative z-10">
<div className="section-number">04</div>
<Reveal>
<div className="relative rounded-[2.5rem] bg-slate-900 p-12 md:p-24 overflow-hidden group">
<div className="relative rounded-3xl md:rounded-[2.5rem] bg-slate-900 p-8 md:p-24 overflow-hidden group">
<div className="tech-corner top-8 left-8 border-t-2 border-l-2" />
<div className="tech-corner bottom-8 right-8 border-b-2 border-r-2" />
<div className="relative z-10 max-w-2xl">
<h2 className="text-4xl md:text-5xl font-bold text-white mb-8">
<h2 className="text-3xl md:text-5xl font-bold text-white mb-6 md:mb-8">
Bereit für Ihr nächstes Projekt?
</h2>
<p className="text-slate-400 text-xl mb-12">
<p className="text-slate-400 text-lg md:text-xl mb-8 md:mb-12">
Lassen Sie uns gemeinsam die optimale Lösung für Ihre Energieinfrastruktur finden.
</p>
<Button href="/kontakt" variant="accent" showArrow className="!px-10 !py-5 text-lg">
<Button href="/kontakt" variant="accent" showArrow className="w-full sm:w-auto !px-10 !py-5 text-lg">
Jetzt Kontakt aufnehmen
</Button>
</div>

2
components/Button.tsx
View File

@@ -37,7 +37,7 @@ export const Button = ({
});
};
const baseStyles = "inline-flex items-center justify-center px-10 py-5 rounded-2xl font-bold uppercase tracking-[0.2em] text-[10px] transition-all duration-500 relative group disabled:opacity-50 disabled:cursor-not-allowed select-none overflow-hidden";
const baseStyles = "inline-flex items-center justify-center px-6 py-4 md:px-10 md:py-5 rounded-xl md:rounded-2xl font-bold uppercase tracking-[0.2em] text-[10px] transition-all duration-500 relative group disabled:opacity-50 disabled:cursor-not-allowed select-none overflow-hidden";
const variants = {
primary: "bg-primary text-white shadow-lg",

22
components/ContactContent.tsx
View File

@@ -56,12 +56,12 @@ export default function Contact() {
<span className="text-accent font-bold uppercase tracking-widest text-sm mb-4 block">Kontakt</span>
</Reveal>
<Reveal delay={0.2}>
<h1 className="text-5xl md:text-6xl font-extrabold text-primary mb-8 leading-tight">
<h1 className="text-4xl sm:text-5xl md:text-6xl font-extrabold text-primary mb-6 md:mb-8 leading-tight">
Lassen Sie uns <span className="text-accent">sprechen</span>
</h1>
</Reveal>
<Reveal delay={0.3}>
<p className="text-slate-600 text-xl md:text-2xl leading-relaxed">
<p className="text-slate-600 text-lg md:text-2xl leading-relaxed">
Haben Sie Fragen zu einem Projekt oder benötigen Sie technische Beratung? Wir freuen uns auf Ihre Nachricht.
</p>
</Reveal>
@@ -76,13 +76,13 @@ export default function Contact() {
<div className="grid grid-cols-1 lg:grid-cols-2 gap-16 md:gap-24">
<div className="space-y-8">
<Reveal delay={0.1}>
<div className="bg-white/5 p-8 rounded-2xl border border-white/10 flex gap-6 items-start hover:translate-x-1 transition-transform duration-300 relative overflow-hidden">
<div className="w-14 h-14 rounded-2xl bg-accent/10 text-accent flex items-center justify-center shrink-0 relative z-10">
<div className="bg-white/5 p-6 md:p-8 rounded-2xl border border-white/10 flex flex-col sm:flex-row gap-4 sm:gap-6 items-start hover:translate-x-1 transition-transform duration-300 relative overflow-hidden">
<div className="w-12 h-12 md:w-14 md:h-14 rounded-2xl bg-accent/10 text-accent flex items-center justify-center shrink-0 relative z-10">
<Mail size={24} />
</div>
<div className="relative z-10">
<h4 className="text-slate-400 font-bold text-xs uppercase tracking-widest mb-2">E-Mail</h4>
<a href="mailto:info@mb-grid-solutions.com" className="text-white text-xl font-bold hover:text-accent transition-colors">
<h4 className="text-slate-400 font-bold text-xs uppercase tracking-widest mb-1 md:mb-2">E-Mail</h4>
<a href="mailto:info@mb-grid-solutions.com" className="text-white text-lg md:text-xl font-bold hover:text-accent transition-colors break-all">
info@mb-grid-solutions.com
</a>
</div>
@@ -90,13 +90,13 @@ export default function Contact() {
</Reveal>
<Reveal delay={0.2}>
<div className="bg-white/5 p-8 rounded-2xl border border-white/10 flex gap-6 items-start hover:translate-x-1 transition-transform duration-300 relative overflow-hidden">
<div className="w-14 h-14 rounded-2xl bg-accent/10 text-accent flex items-center justify-center shrink-0 relative z-10">
<div className="bg-white/5 p-6 md:p-8 rounded-2xl border border-white/10 flex flex-col sm:flex-row gap-4 sm:gap-6 items-start hover:translate-x-1 transition-transform duration-300 relative overflow-hidden">
<div className="w-12 h-12 md:w-14 md:h-14 rounded-2xl bg-accent/10 text-accent flex items-center justify-center shrink-0 relative z-10">
<MapPin size={24} />
</div>
<div className="relative z-10">
<h4 className="text-slate-400 font-bold text-xs uppercase tracking-widest mb-2">Anschrift</h4>
<p className="text-white text-xl font-bold leading-relaxed">
<h4 className="text-slate-400 font-bold text-xs uppercase tracking-widest mb-1 md:mb-2">Anschrift</h4>
<p className="text-white text-lg md:text-xl font-bold leading-relaxed">
MB Grid Solutions & Services GmbH<br />
Raiffeisenstraße 22<br />
73630 Remshalden
@@ -122,7 +122,7 @@ export default function Contact() {
</div>
<Reveal delay={0.4}>
<div className="bg-white p-8 md:p-12 rounded-[2.5rem] border border-slate-100 shadow-xl relative overflow-hidden group">
<div className="bg-white p-6 md:p-12 rounded-3xl md:rounded-[2.5rem] border border-slate-100 shadow-xl relative overflow-hidden group">
<div className="tech-corner top-6 left-6 border-t-2 border-l-2 opacity-0 group-hover:opacity-100 transition-opacity duration-500" />
<div className="tech-corner bottom-6 right-6 border-b-2 border-r-2 opacity-0 group-hover:opacity-100 transition-opacity duration-500" />

24
components/HomeContent.tsx
View File

@@ -82,13 +82,13 @@ export default function Home() {
</Reveal>
<Reveal delay={0.2}>
<h1 className="text-5xl md:text-7xl font-extrabold text-primary mb-8 leading-[1.1]">
<h1 className="text-4xl sm:text-5xl md:text-7xl font-extrabold text-primary mb-6 md:mb-8 leading-[1.1]">
Spezialisierter Partner für <span className="text-accent">Energiekabelprojekte</span>
</h1>
</Reveal>
<Reveal delay={0.3}>
<p className="text-slate-600 text-xl md:text-2xl leading-relaxed mb-12 max-w-2xl">
<p className="text-slate-600 text-lg md:text-2xl leading-relaxed mb-8 md:mb-12 max-w-2xl">
Herstellerneutrale technische Beratung für Ihre Projekte in Mittel- und Hochspannungsnetzen bis zu 110 kV.
</p>
</Reveal>
@@ -115,8 +115,8 @@ export default function Home() {
<Reveal className="flex flex-col md:flex-row md:items-end justify-between gap-8 mb-16">
<div>
<span className="text-accent font-bold uppercase tracking-widest text-sm mb-4 block">Portfolio</span>
<h2 className="text-4xl md:text-5xl font-bold text-white mb-6">Unsere Leistungen</h2>
<p className="text-slate-400 text-lg md:text-xl">
<h2 className="text-3xl md:text-5xl font-bold text-white mb-6">Unsere Leistungen</h2>
<p className="text-slate-400 text-base md:text-xl">
Beratung durch unabhängige Experten mit jahrzehntelanger Erfahrung aus Engineering, Normengremien, Planung und Produktion.
</p>
</div>
@@ -181,8 +181,8 @@ export default function Home() {
<div>
<Reveal>
<span className="text-accent font-bold uppercase tracking-widest text-sm mb-4 block">Expertise</span>
<h2 className="text-4xl md:text-5xl font-bold text-primary mb-8">Anwendungen & Zielgruppen</h2>
<p className="text-slate-600 text-lg md:text-xl mb-12">
<h2 className="text-3xl md:text-5xl font-bold text-primary mb-6 md:mb-8">Anwendungen & Zielgruppen</h2>
<p className="text-slate-600 text-base md:text-xl mb-8 md:mb-12">
Wir unterstützen Akteure der Energiewende bei der Realisierung komplexer Kabelprojekte mit höchster Präzision.
</p>
</Reveal>
@@ -231,10 +231,10 @@ export default function Home() {
<Reveal className="mb-20">
<span className="text-accent font-bold uppercase tracking-widest text-sm mb-4 block">Spezifikationen</span>
<h2 className="text-4xl md:text-5xl font-bold text-white mb-6">Technische Expertise</h2>
<h2 className="text-3xl md:text-5xl font-bold text-white mb-6">Technische Expertise</h2>
</Reveal>
<div className="grid grid-cols-1 md:grid-cols-3 gap-8">
<div className="grid grid-cols-1 md:grid-cols-3 gap-6 md:gap-8">
{[
{ label: 'Kabeltypen', value: 'N2XS(FL)2Y, N2X(F)KLD2Y...', desc: 'Umfassende Expertise im Design gängiger Hochspannungskabel.' },
{ label: 'Spannungsebenen', value: '64/110 kV & Mittelspannung', desc: 'Spezialisierte Beratung für komplexe Infrastrukturprojekte.' },
@@ -269,7 +269,7 @@ export default function Home() {
<div className="container-custom relative z-10">
<Counter value={5} className="section-number" />
<Reveal>
<div className="relative rounded-[2.5rem] bg-primary p-12 md:p-24 overflow-hidden group">
<div className="relative rounded-3xl md:rounded-[2.5rem] bg-primary p-8 md:p-24 overflow-hidden group">
{/* Corner Accents */}
<div className="tech-corner top-8 left-8 border-t-2 border-l-2" />
<div className="tech-corner top-8 right-8 border-t-2 border-r-2" />
@@ -297,13 +297,13 @@ export default function Home() {
</div>
<div className="relative z-10">
<h2 className="text-4xl md:text-6xl font-bold text-white mb-8 leading-tight">
<h2 className="text-3xl md:text-6xl font-bold text-white mb-6 md:mb-8 leading-tight">
Bereit für Ihr nächstes Projekt?
</h2>
<p className="text-slate-300 text-xl mb-12 leading-relaxed">
<p className="text-slate-300 text-lg md:text-xl mb-8 md:mb-12 leading-relaxed">
Lassen Sie uns gemeinsam die optimale Lösung für Ihre Energieinfrastruktur finden. Wir beraten Sie herstellerneutral und kompetent.
</p>
<Button href="/kontakt" variant="accent" showArrow className="!px-10 !py-5 text-lg">
<Button href="/kontakt" variant="accent" showArrow className="w-full sm:w-auto !px-10 !py-5 text-lg">
Jetzt Kontakt aufnehmen
</Button>
</div>

14
components/Layout.tsx
View File

@@ -58,7 +58,7 @@ const Layout = ({ children }: { children: React.ReactNode }) => {
<img
src="/assets/logo.png"
alt="MB Grid Solutions"
className={`transition-all duration-300 object-contain ${isScrolled ? 'h-[60px] md:h-[80px] my-[-5px]' : 'h-[100px] md:h-[140px] my-[-20px]'}`}
className={`transition-all duration-300 object-contain ${isScrolled ? 'h-[50px] md:h-[80px] my-[-5px]' : 'h-[80px] md:h-[140px] my-[-10px] md:my-[-20px]'}`}
loading="eager"
/>
</Link>
@@ -169,13 +169,13 @@ const Layout = ({ children }: { children: React.ReactNode }) => {
<div className="tech-corner bottom-8 right-8 border-b border-r border-white/10 group-hover:border-accent/30 transition-colors duration-700" />
<div className="container-custom relative z-10">
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-12 mb-16">
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-10 md:gap-12 mb-12 md:mb-16">
<div className="lg:col-span-2">
<Link href="/" className="inline-block mb-8 group">
<Link href="/" className="inline-block mb-6 md:mb-8 group">
<img
src="/assets/logo.png"
alt="MB Grid Solutions"
className="h-20 brightness-0 invert opacity-80 group-hover:opacity-100 transition-opacity"
className="h-16 md:h-20 brightness-0 invert opacity-80 group-hover:opacity-100 transition-opacity"
loading="lazy"
/>
</Link>
@@ -209,9 +209,9 @@ const Layout = ({ children }: { children: React.ReactNode }) => {
</div>
</div>
<div className="pt-8 border-t border-slate-800 flex flex-col md:flex-row justify-between items-center gap-4 text-sm text-slate-500 relative">
<div className="absolute -top-px left-0 w-12 h-px bg-accent/50" />
<p>&copy; {new Date().getFullYear()} MB Grid Solutions & Services GmbH. Alle Rechte vorbehalten.</p>
<div className="pt-8 border-t border-slate-800 flex flex-col md:flex-row justify-between items-center gap-6 md:gap-4 text-sm text-slate-500 relative text-center md:text-left">
<div className="absolute -top-px left-1/2 -translate-x-1/2 md:left-0 md:translate-x-0 w-12 h-px bg-accent/50" />
<p>&copy; {new Date().getFullYear()} MB Grid Solutions & Services GmbH. <br className="md:hidden" /> Alle Rechte vorbehalten.</p>
<p className="flex items-center gap-2">
<span className="relative flex h-2 w-2">
<span className="animate-ping absolute inline-flex h-full w-full rounded-full bg-accent opacity-75"></span>

2
components/TileGrid.tsx
View File

@@ -40,7 +40,7 @@ export const TileGrid = () => {
delay: Math.random() * 20,
ease: "easeInOut"
}}
className="w-32 h-32 md:w-40 md:h-40 bg-white/10 backdrop-blur-[2px] rounded-3xl border border-white/20 shadow-[0_8px_32px_0_rgba(31,38,135,0.07)] shrink-0"
className="w-24 h-24 md:w-40 md:h-40 bg-white/10 backdrop-blur-[2px] rounded-2xl md:rounded-3xl border border-white/20 shadow-[0_8px_32px_0_rgba(31,38,135,0.07)] shrink-0"
/>
))}
</div>