diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx
index c54eae455c265806175ef8022f8a461387b6a741..c18c6df1add6c3dd602d1ae4da3b1084af04f94c 100644
--- a/src/components/Footer.tsx
+++ b/src/components/Footer.tsx
@@ -69,6 +69,11 @@ const navigation = {
href: 'mailto:info@opencode.de',
external: false,
},
+ {
+ name: 'Leichte Sprache',
+ href: '/leichte-sprache-info',
+ external: false,
+ },
],
}
diff --git a/src/components/landing-page-leichte-sprache/ApiSmallDemo.tsx b/src/components/landing-page-leichte-sprache/ApiSmallDemo.tsx
deleted file mode 100644
index 8c7b546fec5ad21e94b450970412077107200ec0..0000000000000000000000000000000000000000
--- a/src/components/landing-page-leichte-sprache/ApiSmallDemo.tsx
+++ /dev/null
@@ -1,82 +0,0 @@
-// Copyright 2025 Zentrum für Digitale Souveränität der Öffentlichen Verwaltung (ZenDiS) GmbH.
-// SPDX-License-Identifier: MIT
-
-import { useState } from 'react'
-import { SarifApiResponse } from '../../lib/apiClient'
-import CheckRepoForm from '../CheckRepoForm'
-import { Toaster } from '../ui/toaster'
-import ResultGrid from '../ResultGrid'
-
-export default function ApiSmallDemo() {
- const [currentScan, setCurrentScan] = useState<SarifApiResponse | null>(
- null,
- )
-
- const handleScanFinished = (scanReport: SarifApiResponse) => {
- setCurrentScan(scanReport)
- }
- return (
- <div className="mx-auto mt-16 max-w-7xl" id="api-small-demo">
- <Toaster />
- <div className="relative isolate overflow-hidden bg-blue-900 px-6 py-24 shadow-2xl sm:rounded-3xl sm:px-24 xl:py-32">
- <h2 className="mx-auto max-w-3xl text-center text-4xl font-semibold tracking-tight text-white sm:text-5xl">
- Testen Sie die Badge API
- </h2>
- <p className="mx-auto mt-6 max-w-lg text-center text-lg text-zinc-200">
- Geben Sie die URL eines öffentlichen openCode-Repositorys
- ein, um zu sehen, welche der offiziellen Badges vergeben
- werden.
- </p>
- <div className="mx-auto mt-12 max-w-4xl">
- <CheckRepoForm onScanFinished={handleScanFinished} />
- </div>
- <div className="absolute inset-0 -z-20 size-[64rem] overflow-hidden bg-gradient-to-r from-blue-800">
- <svg
- className="absolute opacity-20"
- width="1096"
- height="520"
- viewBox="0 0 1096 520"
- fill="none"
- xmlns="http://www.w3.org/2000/svg"
- >
- <path
- d="M-24 363.645L52.8404 363.645C89.7778 363.645 107.965 343.08 107.965 343.08L170.309 281.082C170.309 281.082 186.133 260.701 216.35 260.701L366.578 260.701C404.001 260.701 421.409 283.667 421.409 283.667L610.638 471.848C610.638 471.848 626.8 489.712 654.513 489.712L700.49 489.712C728.202 489.712 746.831 471.168 746.831 471.168L1096.42 121.584L1446 -228"
- stroke="url(#paint0_linear_2866_45205)"
- strokeWidth="59.3123"
- strokeMiterlimit="10"
- ></path>
- <defs>
- <linearGradient
- id="paint0_linear_2866_45205"
- x1="108"
- y1="347.301"
- x2="1040"
- y2="347.301"
- gradientUnits="userSpaceOnUse"
- >
- <stop
- stopColor="#1544FF"
- stopOpacity="0"
- ></stop>
- <stop offset="0.295" stopColor="#1544FF"></stop>
- <stop
- offset="0.700368"
- stopColor="#00E6CC"
- stopOpacity="0.5"
- ></stop>
- <stop
- offset="1"
- stopColor="#00E6CC"
- stopOpacity="0"
- ></stop>
- </linearGradient>
- </defs>
- </svg>
- </div>
- </div>
- <div>
- <ResultGrid currentScan={currentScan} />
- </div>
- </div>
- )
-}
diff --git a/src/components/landing-page-leichte-sprache/Hero.tsx b/src/components/landing-page-leichte-sprache/Hero.tsx
deleted file mode 100644
index 2e271884d8ab3ed993a70baef66f5600c8437b6c..0000000000000000000000000000000000000000
--- a/src/components/landing-page-leichte-sprache/Hero.tsx
+++ /dev/null
@@ -1,147 +0,0 @@
-// Copyright 2025 Zentrum für Digitale Souveränität der Öffentlichen Verwaltung (ZenDiS) GmbH.
-// SPDX-License-Identifier: MIT
-
-import Image from 'next/image'
-
-export default function Hero() {
- return (
- <div className="bg-white">
- <main>
- <div className="relative isolate">
- <svg
- aria-hidden="true"
- className="absolute inset-x-0 top-0 -z-10 h-[64rem] w-full stroke-zinc-200 [mask-image:radial-gradient(32rem_32rem_at_center,white,transparent)]"
- >
- <defs>
- <pattern
- x="50%"
- y={-1}
- id="1f932ae7-37de-4c0a-a8b0-a6e3b4d44b84"
- width={200}
- height={200}
- patternUnits="userSpaceOnUse"
- >
- <path d="M.5 200V.5H200" fill="none" />
- </pattern>
- </defs>
- <svg
- x="50%"
- y={-1}
- className="overflow-visible fill-zinc-50"
- >
- <path
- d="M-200 0h201v201h-201Z M600 0h201v201h-201Z M-400 600h201v201h-201Z M200 800h201v201h-201Z"
- strokeWidth={0}
- />
- </svg>
- <rect
- fill="url(#1f932ae7-37de-4c0a-a8b0-a6e3b4d44b84)"
- width="100%"
- height="100%"
- strokeWidth={0}
- />
- </svg>
- <div
- aria-hidden="true"
- className="absolute left-1/2 right-0 top-0 -z-10 -ml-24 transform-gpu overflow-hidden blur-3xl lg:ml-24 xl:ml-48"
- >
- <div
- style={{
- clipPath:
- 'polygon(63.1% 29.5%, 100% 17.1%, 76.6% 3%, 48.4% 0%, 44.6% 4.7%, 54.5% 25.3%, 59.8% 49%, 55.2% 57.8%, 44.4% 57.2%, 27.8% 47.9%, 35.1% 81.5%, 0% 97.7%, 39.2% 100%, 35.2% 81.4%, 97.2% 52.8%, 63.1% 29.5%)',
- }}
- className="aspect-[801/1036] w-[50.0625rem] bg-gradient-to-tr from-[#b3dbff] to-[#2f6eff] opacity-20"
- />
- </div>
- <div className="overflow-hidden">
- <div className="mx-auto max-w-7xl px-6 pb-32 pt-36 sm:pt-60 lg:px-8 lg:pt-32">
- <div className="mx-auto max-w-2xl gap-x-14 lg:mx-0 lg:flex lg:max-w-none lg:items-center">
- <div className="relative w-full lg:max-w-xl lg:shrink-0 xl:max-w-2xl">
- <h1 className="text-pretty text-5xl font-semibold tracking-tight text-zinc-900 sm:text-7xl">
- Badge API - Vertrauen in Open Source
- Software fördern (leichte-Sprache)
- </h1>
- <p className="mt-8 text-pretty text-lg font-medium text-zinc-600 sm:max-w-md sm:text-xl/8 lg:max-w-none">
- Die Badge-API ist ein Dienst, der
- openCode Repositories nach bestimmten
- Kriterien durchsucht und auf Basis der
- Ergebnisse Badges generiert, die im{' '}
- <a
- target="_blank"
- rel="noreferrer noopener"
- href="https://opencode.de/en/software"
- className="text-blue-500 underline"
- >
- openCode Software Katalog
- </a>{' '}
- angezeigt werden und den Status des
- epositories in Bezug auf Sicherheit,
- Wartung und Wiederverwendung anzeigen.
- </p>
- <div className="mt-10 flex items-center gap-x-6">
- <a
- href="/introduction"
- className="rounded-md bg-blue-600 px-3.5 py-2.5 text-sm font-semibold text-white shadow-sm hover:bg-blue-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-blue-600"
- >
- Zur Dokumentation
- </a>
- <a
- href="#api-small-demo"
- className="text-sm/6 font-semibold text-zinc-900"
- >
- API Live Demo{' '}
- <span aria-hidden="true">→</span>
- </a>
- </div>
- </div>
- <div className="mt-14 flex justify-end gap-8 sm:-mt-44 sm:justify-start sm:pl-20 lg:mt-0 lg:pl-0">
- <div className="ml-auto w-44 flex-none space-y-8 pt-32 sm:ml-0 sm:pt-80 lg:order-last lg:pt-36 xl:order-none xl:pt-80">
- <div className="relative aspect-square">
- <Image
- alt="Open Source badge"
- src="/assets/badges/OSS.svg"
- fill
- />
- </div>
- </div>
- <div className="mr-auto w-44 flex-none space-y-8 sm:mr-0 sm:pt-52 lg:pt-36">
- <div className="aspect relative aspect-square">
- <Image
- alt="Krisensichere Wartung Badge"
- src="/assets/badges/MAINTAINED-3.svg"
- fill
- />
- </div>
- <div className="relative aspect-square">
- <Image
- alt="Wird Aktiv genutzt Badge"
- src="/assets/badges/REUSED-2.svg"
- fill
- />
- </div>
- </div>
- <div className="w-44 flex-none space-y-8 pt-32 sm:pt-0">
- <div className="relative aspect-square">
- <Image
- alt="Sicherheitsüberprüfung Badge"
- src="/assets/badges/SECURITY-3.svg"
- fill
- />
- </div>
- <div className="relative aspect-square">
- <Image
- alt="Verlässliche Wartung Badge"
- src="/assets/badges/MAINTAINED-2.svg"
- fill
- />
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- </main>
- </div>
- )
-}
diff --git a/src/pages/_meta.ts b/src/pages/_meta.ts
index 62aa662955ee3fc35e3257fc799c36b45888cfb9..1bdb8e442976c771add37054e06aafe232887d34 100644
--- a/src/pages/_meta.ts
+++ b/src/pages/_meta.ts
@@ -10,12 +10,6 @@ export default {
},
display: 'hidden',
},
- 'leichte-sprache': {
- theme: {
- layout: 'raw',
- },
- display: 'hidden',
- },
introduction: { title: 'Introduction' },
'official-badges': { title: 'Official Badges 🛡ï¸' },
concepts: { title: 'Concepts' },
@@ -39,4 +33,7 @@ export default {
'declaration-on-accessibility': {
display: 'hidden',
},
+ 'leichte-sprache-info': {
+ display: 'hidden',
+ },
}
diff --git a/src/pages/leichte-sprache-info.mdx b/src/pages/leichte-sprache-info.mdx
new file mode 100644
index 0000000000000000000000000000000000000000..144302aa58751ec464c053040c76026135b625e5
--- /dev/null
+++ b/src/pages/leichte-sprache-info.mdx
@@ -0,0 +1,55 @@
+---
+sidebar_position: 1
+title: Introduction
+---
+
+{/* Copyright 2025 Zentrum für Digitale Souveränität der Öffentlichen Verwaltung (ZenDiS) GmbH.
+SPDX-License-Identifier: MIT */}
+
+
+### Was ist das Badge Programm?
+
+ Das Badge Programm ist ein System, das hilft, **Vertrauen in Open-Source-Software** zu schaffen. Es überprüft Software-Repositories (das sind Sammlungen von Code) und vergibt **Badges**. Diese Badges sind wie kleine Auszeichnungen. Die zeigen, wie gut ein Repository in bestimmten Bereichen ist.
+### Wofür werden die Badges vergeben?
+ Die Badges geben an, ob ein Repository in folgenden Bereichen gut ist:
+- **Sicherheit:** Der Code wird auf Schwachstellen und Sicherheitsprobleme überprüft.
+- **Wartung:** Es wird geprüft, ob der Code regelmäßig gepflegt und aktualisiert wird.
+- **Wiederverwendung:** Es wird bewertet, wie gut der Code von anderen wiederverwendet werden kann.
+Weitere werden folgen
+
+### Wie funktioniert das Badge Programm?
+- **Prüfung des Repositories:**
+ - Man gibt die URL (also den Link) eines öffentlichen Repositories ein.
+ - Die Badge API ist ein Programm, das die Überprüfung macht. Sie schaut sich den Code genau an.
+- **Bewertung nach Kriterien:**
+ - Das System hat festgelegte Kriterien. Diese Kriterien sind wie eine Checkliste.
+ - Jedes Kriterium wird mit „wahr“ oder „falsch“ bewertet.
+ (Zum Beispiel: Wird der Code regelmäßig aktualisiert? Das ist eine Frage, die mit Ja oder Nein beantwortet wird.)
+- **Vergabe der Badges:**
+ - Je nachdem, welche Kriterien erfüllt sind, bekommt das Repository bestimmte Badges.
+ - Es gibt verschiedene Arten von Badges, wie zum Beispiel:
+ - **Open Source Badge**
+ - **Krisensichere Wartung Badge**
+ - **Wird Aktiv genutzt Badge**
+ - **Sicherheitsüberprüfung Badge**
+ - **Verlässliche Wartung Badge**
+
+---
+### Was bietet die Webseite noch?
+- **Dokumentation und API-Demo:**
+ Auf der Webseite gibt es einen Bereich, in dem man mehr über das Badge Programm und die Funktionsweise der API (Programmierschnittstelle) erfährt.
+ Dort kann man auch direkt ausprobieren, wie die API funktioniert.
+- **Weitere Informationen:**
+ Es wird erklärt, welche Ideen und Konzepte hinter dem Programm stehen.
+ Außerdem findet man Informationen, wie man das Badge System selbst nutzen oder sogar auf seinem eigenen Server betreiben kann. Diese Informationen finden Sie im Menü.
+- **Mitmachen und Weiterentwickeln:**
+ Die Quelle des Badge Programms ist öffentlich. Das heißt, jeder kann mithelfen und Beiträge leisten.Es gibt auch Hinweise, wie man Fragen stellen oder Probleme melden kann.
+
+---
+### Warum ist uns das wichtig?
+- **Mehr Vertrauen:**
+ Open-Source-Software ist oft sehr komplex. Mit den Badges können Nutzer schnell erkennen, welche Projekte gut gepflegt, sicher und wiederverwendbar sind.
+- **Klare Information:**
+ Jeder, egal ob Programmierer oder jemand, der sich für Software interessiert, kann leicht verstehen, wie es um ein Repository steht.
+- **Transparenz:**
+ Da die Kriterien offen kommuniziert werden, weiß jeder, woran es gemessen wird.
\ No newline at end of file
diff --git a/src/pages/leichte-sprache.mdx b/src/pages/leichte-sprache.mdx
deleted file mode 100644
index 96b6dad4be440fc115db34aad87812843c0c4506..0000000000000000000000000000000000000000
--- a/src/pages/leichte-sprache.mdx
+++ /dev/null
@@ -1,20 +0,0 @@
----
-title: Home
----
-
-{/* Copyright 2025 Zentrum für Digitale Souveränität der Öffentlichen Verwaltung (ZenDiS) GmbH.
-SPDX-License-Identifier: MIT */}
-
-import Hero from '../components/landing-page-leichte-sprache/Hero'
-import ApiSmallDemo from '../components/landing-page-leichte-sprache/ApiSmallDemo'
-
-export default function Home() {
- return (
- <div className="overflow-hidden">
- <Hero />
- <main>
- <ApiSmallDemo />
- </main>
- </div>
- )
-}