separate wiki from site
This commit is contained in:
@@ -1,204 +1,26 @@
|
||||
'use client'
|
||||
|
||||
import { motion } from 'framer-motion'
|
||||
import Navigation from '@/components/Navigation'
|
||||
import Footer from '@/components/Footer'
|
||||
import { useState, useEffect } from 'react'
|
||||
|
||||
export default function Wiki() {
|
||||
const [showFullPage, setShowFullPage] = useState(true)
|
||||
const [iframeError, setIframeError] = useState(false)
|
||||
|
||||
// Wiki URL - konfigurierbar über Umgebungsvariable, Standard: localhost:3033
|
||||
const wikiUrl = process.env.NEXT_PUBLIC_WIKI_URL || 'http://localhost:3033'
|
||||
|
||||
useEffect(() => {
|
||||
// Reset error when URL changes
|
||||
setIframeError(false)
|
||||
}, [wikiUrl])
|
||||
|
||||
if (showFullPage) {
|
||||
// Vollständige Wiki-Seite als iframe
|
||||
return (
|
||||
<>
|
||||
<Navigation />
|
||||
<main style={{ paddingTop: '52px', height: 'calc(100vh - 52px)', display: 'flex', flexDirection: 'column' }}>
|
||||
<div style={{
|
||||
position: 'fixed',
|
||||
top: '52px',
|
||||
left: 0,
|
||||
right: 0,
|
||||
background: 'rgba(0, 0, 0, 0.9)',
|
||||
padding: '10px 20px',
|
||||
display: 'flex',
|
||||
justifyContent: 'space-between',
|
||||
alignItems: 'center',
|
||||
zIndex: 999,
|
||||
borderBottom: '1px solid rgba(255, 255, 255, 0.1)'
|
||||
}}>
|
||||
<h2 style={{ fontSize: '18px', fontWeight: '600', margin: 0 }}>doing-it Wiki</h2>
|
||||
<button
|
||||
onClick={() => setShowFullPage(false)}
|
||||
className="btn btn-secondary"
|
||||
style={{ padding: '8px 20px', fontSize: '14px' }}
|
||||
>
|
||||
Zur Übersicht
|
||||
</button>
|
||||
</div>
|
||||
{iframeError ? (
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
height: '100%',
|
||||
padding: '40px',
|
||||
marginTop: '50px',
|
||||
textAlign: 'center'
|
||||
}}>
|
||||
<h2 style={{ fontSize: '24px', fontWeight: '600', marginBottom: '20px' }}>
|
||||
Wiki konnte nicht geladen werden
|
||||
</h2>
|
||||
<p style={{ color: 'var(--color-text-secondary)', marginBottom: '30px' }}>
|
||||
Bitte versuchen Sie es später erneut oder kontaktieren Sie den Support.
|
||||
</p>
|
||||
<button
|
||||
onClick={() => {
|
||||
setIframeError(false)
|
||||
window.location.reload()
|
||||
}}
|
||||
className="btn btn-primary"
|
||||
>
|
||||
Seite neu laden
|
||||
</button>
|
||||
</div>
|
||||
) : (
|
||||
<iframe
|
||||
src={wikiUrl}
|
||||
style={{
|
||||
width: '100%',
|
||||
height: '100%',
|
||||
border: 'none',
|
||||
marginTop: '50px',
|
||||
background: '#fff'
|
||||
}}
|
||||
title="doing-it Wiki"
|
||||
onError={() => setIframeError(true)}
|
||||
onLoad={(e) => {
|
||||
// Check if iframe loaded successfully
|
||||
try {
|
||||
const iframe = e.target as HTMLIFrameElement
|
||||
if (iframe.contentDocument?.location.href === 'about:blank') {
|
||||
// Iframe might have error
|
||||
setTimeout(() => setIframeError(true), 3000)
|
||||
}
|
||||
} catch (err) {
|
||||
// Cross-origin - can't check, assume it's working
|
||||
}
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
</main>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
// Übersichtsseite mit Option zum Öffnen des Wikis
|
||||
return (
|
||||
<>
|
||||
<Navigation />
|
||||
<main>
|
||||
<section className="hero">
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: 20 }}
|
||||
animate={{ opacity: 1, y: 0 }}
|
||||
transition={{ duration: 0.8 }}
|
||||
className="hero-content"
|
||||
>
|
||||
<h1 className="hero-title">Wiki</h1>
|
||||
<p className="hero-subtitle">
|
||||
Unser Wissensbereich mit nützlichen Informationen<br />
|
||||
rund um IT-Weiterbildung und Schulungen
|
||||
</p>
|
||||
<div className="hero-buttons" style={{ marginTop: '40px' }}>
|
||||
<button
|
||||
onClick={() => setShowFullPage(true)}
|
||||
className="btn btn-primary"
|
||||
style={{ cursor: 'pointer' }}
|
||||
>
|
||||
Wiki öffnen
|
||||
</button>
|
||||
<a
|
||||
href={wikiUrl}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="btn btn-secondary"
|
||||
>
|
||||
In neuem Tab öffnen
|
||||
</a>
|
||||
</div>
|
||||
</motion.div>
|
||||
</section>
|
||||
|
||||
<section className="features" style={{ paddingTop: '80px' }}>
|
||||
<div className="container">
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: 20 }}
|
||||
animate={{ opacity: 1, y: 0 }}
|
||||
transition={{ duration: 0.8, delay: 0.2 }}
|
||||
>
|
||||
<h2 style={{ fontSize: '48px', fontWeight: '600', marginBottom: '40px', textAlign: 'center' }}>
|
||||
Was finden Sie im Wiki?
|
||||
</h2>
|
||||
<div style={{ display: 'grid', gridTemplateColumns: 'repeat(auto-fit, minmax(300px, 1fr))', gap: '30px', marginTop: '60px' }}>
|
||||
<div className="feature-card">
|
||||
<h3 style={{ fontSize: '24px', fontWeight: '600', marginBottom: '16px' }}>
|
||||
IT-Grundlagen
|
||||
</h3>
|
||||
<p style={{ color: 'var(--color-text-secondary)', lineHeight: '1.6' }}>
|
||||
Umfassende Informationen zu grundlegenden IT-Konzepten, Technologien und Best Practices.
|
||||
</p>
|
||||
</div>
|
||||
<div className="feature-card">
|
||||
<h3 style={{ fontSize: '24px', fontWeight: '600', marginBottom: '16px' }}>
|
||||
Schulungsmethoden
|
||||
</h3>
|
||||
<p style={{ color: 'var(--color-text-secondary)', lineHeight: '1.6' }}>
|
||||
Moderne Ansätze und bewährte Methoden für effektive IT-Schulungen und Weiterbildungen.
|
||||
</p>
|
||||
</div>
|
||||
<div className="feature-card">
|
||||
<h3 style={{ fontSize: '24px', fontWeight: '600', marginBottom: '16px' }}>
|
||||
Ressourcen
|
||||
</h3>
|
||||
<p style={{ color: 'var(--color-text-secondary)', lineHeight: '1.6' }}>
|
||||
Sammlung von nützlichen Tools, Materialien und weiterführenden Ressourcen.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</motion.div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section className="features" style={{ paddingTop: '80px', paddingBottom: '120px' }}>
|
||||
<div className="container">
|
||||
<motion.div
|
||||
initial={{ opacity: 0, y: 20 }}
|
||||
animate={{ opacity: 1, y: 0 }}
|
||||
transition={{ duration: 0.8, delay: 0.4 }}
|
||||
style={{ textAlign: 'center' }}
|
||||
>
|
||||
<h3 style={{ fontSize: '32px', fontWeight: '600', marginBottom: '20px' }}>
|
||||
Bereit loszulegen?
|
||||
</h3>
|
||||
<p style={{ color: 'var(--color-text-secondary)', fontSize: '20px', marginBottom: '40px' }}>
|
||||
Klicken Sie auf den Button oben, um direkt zum Wiki zu gelangen.
|
||||
</p>
|
||||
</motion.div>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
<Footer />
|
||||
</>
|
||||
)
|
||||
}
|
||||
'use client'
|
||||
|
||||
import { useEffect } from 'react'
|
||||
|
||||
export default function Wiki() {
|
||||
useEffect(() => {
|
||||
// Redirect to external wiki
|
||||
window.location.href = 'https://wiki.doing-it.de'
|
||||
}, [])
|
||||
|
||||
return (
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
height: '100vh',
|
||||
flexDirection: 'column',
|
||||
gap: '20px'
|
||||
}}>
|
||||
<p>Weiterleitung zum Wiki...</p>
|
||||
<a href="https://wiki.doing-it.de" style={{ color: 'var(--color-primary)' }}>
|
||||
Falls die Weiterleitung nicht funktioniert, klicken Sie hier.
|
||||
</a>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user