Design System Demo
Typography
Chillax (Display)
Heading 1
Heading 2
Heading 3
Heading 4
Satoshi (Body)
Large Text - Das ist ein Beispieltext für große Texte.
Body Text - Das ist normaler Fließtext für die meisten Inhalte.
Small Text - Kleinerer Text für Details und Fußnoten.
Extra Small - Für sehr kleine Details oder Copyright-Hinweise.
Typography in Context
Die Zukunft der maritimen Kommunikation
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Technologische Entwicklungen im Seefunk
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.
Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem.
Digitale Transformation der Schifffahrt
Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur?
Automatisierte Notrufsysteme
At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga.
Internationale Standards und Vorschriften
Et harum quidem rerum facilis est et expedita distinctio. Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis voluptas assumenda est, omnis dolor repellendus.
Praktische Anwendung im Alltag
Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates repudiandae sint et molestiae non recusandae. Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus asperiores repellat.
“Die moderne Seefunk-Technologie hat die Sicherheit auf den Weltmeeren revolutioniert und ermöglicht es Seefahrern, auch in entlegenen Gebieten zuverlässige Kommunikation zu gewährleisten.”
— Kapitän Maritime Expert, International Shipping AssociationLorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Corporate Gradient - Sonnenuntergang
Category Badges für Kurse
Kurskategorien
Status Badges
Größenvariationen
Corporate Farbpalette
Hauptfarben
Primary Blue
#0006DE
Accent Purple
#8B2C8B
Accent Gold
#FFB347
Zusatzfarben (zurückhaltend)
#2D1B69
#4C2C85
#D4526A
#FF7F50
Semantic Colors
Success
Warning
Error
Buttons - Corporate Geometric Design
Primary
Secondary
Outline
Cards - Corporate Geometric Design
Basic Corporate Card
Eine professionelle Karte im Corporate Design mit klaren Linien und minimaler Ästhetik.
Success Status
Status-Karte mit farbigem Rand und Icon für Systemzustände.
Data Visualization
Moderne Karte mit geometrischen Elementen und Corporate Farbschema.
Error Alert
Fehler-Benachrichtigung im Corporate Design mit klarer visueller Hierarchie.
Warning Alert
Warnung-Benachrichtigung mit standardisierten Farben und Icons.
Success Alert
Erfolgs-Benachrichtigung mit konsistenter visueller Gestaltung.
Form Components - Shadcn UI
Basic Form Elements
Advanced Elements
Erhalten Sie Updates zu neuen Kursen
Benachrichtigungen auf Ihrem Gerät
Learning Platform Components
Course Cards & Progress
Content Tabs & Navigation
Einführung
Der Seefunkdienst ist ein lebenswichtiger Bestandteil der Seefahrt und dient der Sicherheit auf See...
FAQ & Expandable Content
User Actions & Menus
Navigation & User Interface
Max Mustermann
Fortgeschrittener Lerner
Anna Schmidt
Kursleiter
Toast-Nachrichten erscheinen am unteren Bildschirmrand und verschwinden automatisch.
Markdown Content Rendering
SRC Funkzeugnis - Technische Dokumentation
Das Short Range Certificate (SRC) ist das internationale Funkzeugnis für UKW-Seefunkdienst. Diese Dokumentation erklärt alle wichtigen Aspekte.
1. Kommunikationsverfahren - Mermaid Diagramm Test
DSC-Notruf Prozess
Kanalverwendung
Reichweiten-Diagramm
2. Frequenzbereiche und Kanäle
UKW-Seefunk (VHF)
Der UKW-Seefunk arbeitet im Frequenzbereich von 156,000 - 174,000 MHz mit einer Reichweite von ca. 20-30 Seemeilen.
Wichtige Kanäle
| Kanal | Frequenz | Verwendung | Status |
|---|---|---|---|
| 16 | 156,800 MHz | Not- und Anrufkanal | ✅ Aktiv |
| 70 | 156,525 MHz | DSC (nur digital) | ✅ Aktiv |
| 06 | 156,300 MHz | Schiff-Schiff Sicherheit | ✅ Aktiv |
| 13 | 156,650 MHz | Navigation | ⚠️ Regional |
3. Notverfahren
Wichtig: MAYDAY ist das internationale Notrufsignal für unmittelbare Lebensgefahr!
MAYDAY Verfahren
- DSC-Notruf - Rote Taste 5 Sekunden drücken
- Sprechfunk auf Kanal 16
MAYDAY MAYDAY MAYDAY This is [Schiffsname] [Schiffsname] [Schiffsname] MAYDAY [Schiffsname] Position: [Koordinaten]
Organisationsstruktur GMDSS
6. Sequence Diagram - Funkverkehrsablauf
Notruf-Kommunikation zwischen Schiff und Küstenfunkstelle
7. State Diagram - Funkgerätezustände
Betriebszustände einer UKW-Seefunkanlage
8. Gantt Chart - SRC Kursplanung
Zeitplan für 3-monatigen SRC-Kurs
9. User Journey - Lernpfad
Reise eines Studenten durch den SRC-Kurs
10. Class Diagram - System-Architektur
Datenmodell der Lernplattform
11. Mindmap - SRC Wissensstruktur
Überblick über alle SRC-Themenbereiche
12. Timeline - Geschichte des Seefunks
Entwicklung der maritimen Kommunikation
13. Pie Chart - Prüfungsstatistik
SRC Prüfungserfolg 2024
14. Animierte Funk-Kommunikation
Simplex-Verfahren (UKW-Seefunk Standard)
Duplex-Verfahren (Küstenfunk)
Semiduplex-Verfahren (Moderne Systeme)
DSC-Ruf Sequenz (Digital Selective Calling)
Checkliste für Notfälle
- Ruhe bewahren
- DSC-Notruf senden
- Position durchgeben
- Art der Notlage beschreiben
- Anzahl Personen an Bord
4. Code-Beispiele
JavaScript Frequenzberechnung
javascriptfunction calculateVHFFrequency(channel) { const baseFreq = 156.0; const channelSpacing = 0.025; return baseFreq + (channel * channelSpacing); } // Beispiel: Kanal 16 console.log(calculateVHFFrequency(16)); // 156.8 MHz
Python Distanzberechnung
pythonimport math def vhf_range_nautical_miles(antenna_height_m): """Berechnet VHF-Reichweite basierend auf Antennenhöhe""" range_km = 3.57 * math.sqrt(antenna_height_m) return range_km * 0.539957 # Konvertierung zu Seemeilen # Beispiel für 10m Antennenhöhe print(f"Reichweite: {vhf_range_nautical_miles(10):.1f} sm")
5. Internationale Standards
Die ITU (International Telecommunication Union) definiert folgende Regionen:
- Region 1: Europa, Afrika, Mittlerer Osten
- Region 2: Amerika
- Region 3: Asien, Ozeanien
Links und Referenzen
Veraltete Vorschrift(durchgestrichen)
Fußnote: Diese Dokumentation entspricht den aktuellen Standards von 2024.
Mathematische Formeln
Die Freiraumdämpfung berechnet sich nach:
L = 20 × log₁₀(d) + 20 × log₁₀(f) + 32.45
Wo:
- L = Dämpfung in dB
- d = Distanz in km
- f = Frequenz in MHz