Skip to content

admin/dorfarchiv

PublicMirror
Clone

Mirror of https://forge.levinkeller.de/levin/dorfarchiv.git

996be48c7166e2cddb5057a879def3d1d6d3f9b3

Branches

    Levin KellerDorfarchiv für Rössing eingerichtet12eb484History
    139 lines · 4.8 KB
    Raw
    1import type {ReactNode} from 'react';
    2import clsx from 'clsx';
    3import Link from '@docusaurus/Link';
    4import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
    5import Layout from '@theme/Layout';
    6import Heading from '@theme/Heading';
    7
    8import styles from './index.module.css';
    9
    10function HomepageHeader() {
    11 const {siteConfig} = useDocusaurusContext();
    12 return (
    13 <header className={clsx('hero hero--primary', styles.heroBanner)}>
    14 <div className="container">
    15 <Heading as="h1" className="hero__title">
    16 {siteConfig.title}
    17 </Heading>
    18 <p className="hero__subtitle">{siteConfig.tagline}</p>
    19 <div className={styles.buttons}>
    20 <Link
    21 className="button button--secondary button--lg"
    22 to="/unterlagen/intro">
    23 Zu den Unterlagen
    24 </Link>
    25 <Link
    26 className="button button--primary button--lg"
    27 to="/berichte"
    28 style={{marginLeft: '1rem'}}>
    29 Berichte lesen
    30 </Link>
    31 </div>
    32 </div>
    33 </header>
    34 );
    35}
    36
    37function FeatureCard({title, description, icon}: {title: string; description: string; icon: string}) {
    38 return (
    39 <div className="col col--4">
    40 <div className="card shadow--md margin-bottom--lg padding--lg" style={{height: '100%'}}>
    41 <div className="text--center">
    42 <div style={{fontSize: '3rem'}}>{icon}</div>
    43 </div>
    44 <div className="text--center margin-top--md">
    45 <h3>{title}</h3>
    46 <p>{description}</p>
    47 </div>
    48 </div>
    49 </div>
    50 );
    51}
    52
    53function HomepageContent() {
    54 return (
    55 <>
    56 <section className="padding-vert--xl" style={{backgroundColor: 'var(--ifm-color-emphasis-100)'}}>
    57 <div className="container">
    58 <div className="row">
    59 <div className="col col--8 col--offset-2 text--center">
    60 <Heading as="h2" className="margin-bottom--md">
    61 Willkommen im digitalen Dorfarchiv Rössing
    62 </Heading>
    63 <p className="hero__subtitle">
    64 Rössing ist ein Dorf in der Gemeinde Nordstemmen im Landkreis Hildesheim.
    65 Dieses digitale Archiv bewahrt die Geschichte und Geschichten unseres Dorfes
    66 für kommende Generationen.
    67 </p>
    68 </div>
    69 </div>
    70 </div>
    71 </section>
    72
    73 <section className="padding-vert--xl">
    74 <div className="container">
    75 <div className="row">
    76 <FeatureCard
    77 icon="📚"
    78 title="Unterlagen durchstöbern"
    79 description="Historische Dokumente, Fotografien und Materialien zur Dorfgeschichte digital aufbereitet und leicht zugänglich."
    80 />
    81 <FeatureCard
    82 icon="📝"
    83 title="Berichte lesen"
    84 description="Geschichten, Chroniken und Berichte über das Leben im Dorf – von historischen Ereignissen bis zu aktuellen Entwicklungen."
    85 />
    86 <FeatureCard
    87 icon="🤝"
    88 title="Erinnerungen teilen"
    89 description="Tragen Sie eigene Beiträge zur Dorfgeschichte bei und helfen Sie mit, unser kollektives Gedächtnis zu bewahren."
    90 />
    91 </div>
    92 </div>
    93 </section>
    94
    95 <section className="padding-vert--xl" style={{backgroundColor: 'var(--ifm-color-emphasis-100)'}}>
    96 <div className="container">
    97 <div className="row">
    98 <div className="col col--10 col--offset-1 text--center">
    99 <Heading as="h2" className="margin-bottom--lg">
    100 Ziel des Archivs
    101 </Heading>
    102 <div className="avatar avatar--vertical margin-bottom--lg">
    103 <div className="avatar__intro">
    104 <p className="hero__subtitle">
    105 Unser Ziel ist es, die reichhaltige Geschichte Rössings zu dokumentieren und
    106 zugänglich zu machen. Von alten Fotografien über Zeitungsartikel bis hin zu
    107 persönlichen Erinnerungen – jedes Dokument trägt dazu bei, das kollektive
    108 Gedächtnis unseres Dorfes zu bewahren.
    109 </p>
    110 </div>
    111 </div>
    112 <div className="margin-top--lg">
    113 <Link
    114 className="button button--primary button--lg"
    115 to="/unterlagen/intro">
    116 Mehr erfahren
    117 </Link>
    118 </div>
    119 </div>
    120 </div>
    121 </div>
    122 </section>
    123 </>
    124 );
    125}
    126
    127export default function Home(): ReactNode {
    128 const {siteConfig} = useDocusaurusContext();
    129 return (
    130 <Layout
    131 title={`Willkommen`}
    132 description="Digitales Dorfarchiv Rössing - Geschichte und Geschichten aus Rössing bewahren">
    133 <HomepageHeader />
    134 <main>
    135 <HomepageContent />
    136 </main>
    137 </Layout>
    138 );
    139}