v1 production
This commit is contained in:
318
app/ueber-uns/page.tsx
Executable file → Normal file
318
app/ueber-uns/page.tsx
Executable file → Normal file
@@ -1,220 +1,98 @@
|
||||
'use client'
|
||||
|
||||
import { motion } from 'framer-motion'
|
||||
import Link from 'next/link'
|
||||
import Navigation from '@/components/Navigation'
|
||||
import Footer from '@/components/Footer'
|
||||
|
||||
export default function UeberUns() {
|
||||
return (
|
||||
<>
|
||||
<Navigation />
|
||||
<main>
|
||||
{/* Hero Section */}
|
||||
<section className="page-hero">
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: 20 }}
|
||||
animate={{ opacity: 1, y: 0 }}
|
||||
transition={{ duration: 0.8 }}
|
||||
className="container"
|
||||
>
|
||||
<h1>Über uns</h1>
|
||||
<p className="page-hero-subtitle">
|
||||
Ihre Experten für IT-Weiterbildung
|
||||
</p>
|
||||
</motion.div>
|
||||
</section>
|
||||
|
||||
{/* Main Content */}
|
||||
<section className="page-content">
|
||||
<div className="container">
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: 30 }}
|
||||
whileInView={{ opacity: 1, y: 0 }}
|
||||
viewport={{ once: true }}
|
||||
transition={{ duration: 0.6 }}
|
||||
className="content-block"
|
||||
>
|
||||
<h2>Unsere Mission</h2>
|
||||
<p>
|
||||
doing-it.de wurde mit dem Ziel gegründet, IT-Weiterbildung für jeden zugänglich zu machen.
|
||||
Wir glauben daran, dass jeder – unabhängig von Vorkenntnissen – die Möglichkeit haben sollte,
|
||||
sich in der IT weiterzubilden und neue Karrierewege einzuschlagen.
|
||||
</p>
|
||||
</motion.div>
|
||||
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: 30 }}
|
||||
whileInView={{ opacity: 1, y: 0 }}
|
||||
viewport={{ once: true }}
|
||||
transition={{ duration: 0.6 }}
|
||||
className="content-block"
|
||||
>
|
||||
<h2>Was uns auszeichnet</h2>
|
||||
<p>
|
||||
Unser Ansatz ist individuell, praxisnah und ergebnisorientiert. Wir schulen nicht nur
|
||||
theoretisch, sondern direkt an der realen IT-Infrastruktur. So wird Wissen sofort
|
||||
anwendbar und nachhaltig verankert.
|
||||
</p>
|
||||
</motion.div>
|
||||
|
||||
<div className="features-grid">
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: 30 }}
|
||||
whileInView={{ opacity: 1, y: 0 }}
|
||||
viewport={{ once: true }}
|
||||
transition={{ duration: 0.6, delay: 0.1 }}
|
||||
className="feature-card"
|
||||
>
|
||||
<div className="feature-icon">🎯</div>
|
||||
<h3>Individuell</h3>
|
||||
<p>Jede Schulung wird auf Ihre spezifischen Bedürfnisse zugeschnitten</p>
|
||||
</motion.div>
|
||||
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: 30 }}
|
||||
whileInView={{ opacity: 1, y: 0 }}
|
||||
viewport={{ once: true }}
|
||||
transition={{ duration: 0.6, delay: 0.2 }}
|
||||
className="feature-card"
|
||||
>
|
||||
<div className="feature-icon">💼</div>
|
||||
<h3>Praxisnah</h3>
|
||||
<p>Lernen direkt an Ihrer eigenen IT-Infrastruktur</p>
|
||||
</motion.div>
|
||||
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: 30 }}
|
||||
whileInView={{ opacity: 1, y: 0 }}
|
||||
viewport={{ once: true }}
|
||||
transition={{ duration: 0.6, delay: 0.3 }}
|
||||
className="feature-card"
|
||||
>
|
||||
<div className="feature-icon">👥</div>
|
||||
<h3>Experten-Team</h3>
|
||||
<p>Erfahrene IT-Profis mit jahrelanger Branchenerfahrung</p>
|
||||
</motion.div>
|
||||
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: 30 }}
|
||||
whileInView={{ opacity: 1, y: 0 }}
|
||||
viewport={{ once: true }}
|
||||
transition={{ duration: 0.6, delay: 0.4 }}
|
||||
className="feature-card"
|
||||
>
|
||||
<div className="feature-icon">📚</div>
|
||||
<h3>Niveaubasiert</h3>
|
||||
<p>Stufenweise Freischaltung für optimalen Lernerfolg</p>
|
||||
</motion.div>
|
||||
</div>
|
||||
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: 30 }}
|
||||
whileInView={{ opacity: 1, y: 0 }}
|
||||
viewport={{ once: true }}
|
||||
transition={{ duration: 0.6 }}
|
||||
className="content-block"
|
||||
style={{ marginTop: '80px' }}
|
||||
>
|
||||
<h2>Unser Team</h2>
|
||||
<p>
|
||||
Unsere Dozenten, Trainer und Experten bringen jahrelange Erfahrung in der IT-Branche mit.
|
||||
Lernen Sie die Menschen kennen, die Sie auf Ihrem Weg begleiten.
|
||||
</p>
|
||||
</motion.div>
|
||||
|
||||
<div className="features-grid" style={{ marginTop: '60px' }}>
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: 30 }}
|
||||
whileInView={{ opacity: 1, y: 0 }}
|
||||
viewport={{ once: true }}
|
||||
transition={{ duration: 0.6, delay: 0.1 }}
|
||||
className="feature-card"
|
||||
>
|
||||
<div className="feature-icon" style={{ fontSize: '64px' }}>👨💼</div>
|
||||
<h3>Dr. Michael Schneider</h3>
|
||||
<p style={{ color: 'var(--color-accent)', marginBottom: '15px' }}>
|
||||
IT-Sicherheitsexperte
|
||||
</p>
|
||||
<p>
|
||||
15+ Jahre Erfahrung in IT-Sicherheit und Compliance. Zertifizierter CISSP und
|
||||
Experte für DSGVO-Implementierung.
|
||||
</p>
|
||||
</motion.div>
|
||||
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: 30 }}
|
||||
whileInView={{ opacity: 1, y: 0 }}
|
||||
viewport={{ once: true }}
|
||||
transition={{ duration: 0.6, delay: 0.2 }}
|
||||
className="feature-card"
|
||||
>
|
||||
<div className="feature-icon" style={{ fontSize: '64px' }}>👩💻</div>
|
||||
<h3>Sarah Müller</h3>
|
||||
<p style={{ color: 'var(--color-accent)', marginBottom: '15px' }}>
|
||||
Cloud-Architektin
|
||||
</p>
|
||||
<p>
|
||||
Spezialistin für Cloud-Migration und moderne IT-Infrastrukturen. AWS und Azure
|
||||
zertifiziert mit 10+ Jahren Projekterfahrung.
|
||||
</p>
|
||||
</motion.div>
|
||||
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: 30 }}
|
||||
whileInView={{ opacity: 1, y: 0 }}
|
||||
viewport={{ once: true }}
|
||||
transition={{ duration: 0.6, delay: 0.3 }}
|
||||
className="feature-card"
|
||||
>
|
||||
<div className="feature-icon" style={{ fontSize: '64px' }}>👨💻</div>
|
||||
<h3>Thomas Weber</h3>
|
||||
<p style={{ color: 'var(--color-accent)', marginBottom: '15px' }}>
|
||||
Systemadministrator & Trainer
|
||||
</p>
|
||||
<p>
|
||||
Experte für Linux, Windows-Server und Netzwerktechnik. Bringt komplexe Themen
|
||||
verständlich und praxisnah rüber.
|
||||
</p>
|
||||
</motion.div>
|
||||
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: 30 }}
|
||||
whileInView={{ opacity: 1, y: 0 }}
|
||||
viewport={{ once: true }}
|
||||
transition={{ duration: 0.6, delay: 0.4 }}
|
||||
className="feature-card"
|
||||
>
|
||||
<div className="feature-icon" style={{ fontSize: '64px' }}>👩🏫</div>
|
||||
<h3>Lisa Schmidt</h3>
|
||||
<p style={{ color: 'var(--color-accent)', marginBottom: '15px' }}>
|
||||
Pädagogin & IT-Trainerin
|
||||
</p>
|
||||
<p>
|
||||
Spezialisiert auf die Schulung von Quereinsteigern. Entwickelt Lernkonzepte, die
|
||||
auch ohne Vorkenntnisse zum Erfolg führen.
|
||||
</p>
|
||||
</motion.div>
|
||||
</div>
|
||||
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: 30 }}
|
||||
whileInView={{ opacity: 1, y: 0 }}
|
||||
viewport={{ once: true }}
|
||||
transition={{ duration: 0.6 }}
|
||||
className="cta-section"
|
||||
>
|
||||
<h2>Lernen Sie uns kennen</h2>
|
||||
<p>Kontaktieren Sie uns und erfahren Sie mehr über unsere Angebote</p>
|
||||
<Link href="/kontakt" className="btn btn-primary">
|
||||
Jetzt Kontakt aufnehmen
|
||||
</Link>
|
||||
</motion.div>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
<Footer />
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
'use client'
|
||||
|
||||
import { motion } from 'framer-motion'
|
||||
import Link from 'next/link'
|
||||
import Image from 'next/image'
|
||||
import Navigation from '@/components/Navigation'
|
||||
import Footer from '@/components/Footer'
|
||||
|
||||
export default function UeberUns() {
|
||||
return (
|
||||
<>
|
||||
<Navigation />
|
||||
<main>
|
||||
<section className="page-hero">
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: 20 }}
|
||||
animate={{ opacity: 1, y: 0 }}
|
||||
transition={{ duration: 0.8 }}
|
||||
className="container"
|
||||
>
|
||||
<h1>Über uns</h1>
|
||||
<p className="page-hero-subtitle">
|
||||
IT für alle verständlich machen
|
||||
</p>
|
||||
</motion.div>
|
||||
</section>
|
||||
|
||||
<section className="page-content">
|
||||
<div className="container">
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: 30 }}
|
||||
whileInView={{ opacity: 1, y: 0 }}
|
||||
viewport={{ once: true }}
|
||||
transition={{ duration: 0.6 }}
|
||||
className="content-block"
|
||||
>
|
||||
<h2>Unsere Mission</h2>
|
||||
<p>
|
||||
Wir möchten IT für alle verständlich machen. Unser Fokus liegt auf praktischen, verständlichen und realistischen Schulungsangeboten für Quereinsteiger und Unternehmen. Dabei setzen wir auf Erfahrung, Ehrlichkeit und moderne Lernmethoden.
|
||||
</p>
|
||||
</motion.div>
|
||||
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: 30 }}
|
||||
whileInView={{ opacity: 1, y: 0 }}
|
||||
viewport={{ once: true }}
|
||||
transition={{ duration: 0.6, delay: 0.2 }}
|
||||
style={{
|
||||
maxWidth: '800px',
|
||||
margin: '80px auto',
|
||||
textAlign: 'center',
|
||||
position: 'relative',
|
||||
zIndex: 1
|
||||
}}
|
||||
>
|
||||
<Image
|
||||
src="/motorrad.png"
|
||||
alt="Motorradfahren"
|
||||
width={800}
|
||||
height={600}
|
||||
style={{
|
||||
width: '100%',
|
||||
height: 'auto',
|
||||
display: 'block',
|
||||
borderRadius: '20px',
|
||||
border: '1px solid rgba(255, 255, 255, 0.1)'
|
||||
}}
|
||||
/>
|
||||
<p style={{
|
||||
marginTop: '30px',
|
||||
fontSize: '19px',
|
||||
color: 'var(--color-text-secondary)',
|
||||
lineHeight: '1.7'
|
||||
}}>
|
||||
Neben der IT teilen wir beide die Leidenschaft für das Motorradfahren.
|
||||
</p>
|
||||
</motion.div>
|
||||
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: 30 }}
|
||||
whileInView={{ opacity: 1, y: 0 }}
|
||||
viewport={{ once: true }}
|
||||
transition={{ duration: 0.6 }}
|
||||
className="cta-section"
|
||||
>
|
||||
<h2>Kontaktieren Sie uns</h2>
|
||||
<p>Haben Sie Fragen oder möchten Sie mehr über unsere Angebote erfahren?</p>
|
||||
<Link href="/kontakt" className="btn btn-primary btn-large">
|
||||
Jetzt Kontakt aufnehmen
|
||||
</Link>
|
||||
</motion.div>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
<Footer />
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user