diff --git a/docs/team.md b/docs/about_us.md similarity index 94% rename from docs/team.md rename to docs/about_us.md index f69597746..c8621284d 100755 --- a/docs/team.md +++ b/docs/about_us.md @@ -2,7 +2,8 @@ title: Team hide: - navigation -# - toc + - toc + - title --- ## Entwicklung @@ -81,3 +82,12 @@ Mit diesen Referenzdatensätzen können die mit OpenTrafficCam automatisiert abg - ![NFDI4ing](assets/img/NFDI4Ing.png){height="50" style="display: block; margin: 0 auto" } + + +## Kontakt + +Haben Sie Fragen oder möchten ein Projekt mit uns besprechen? + +

+ Kontakt aufnehmen +

diff --git a/docs/case_studies.md b/docs/case_studies.md new file mode 100644 index 000000000..e69de29bb diff --git a/docs/contact.md b/docs/contact.md new file mode 100644 index 000000000..e69de29bb diff --git a/docs/downloads.md b/docs/downloads.md new file mode 100644 index 000000000..af6d7132a --- /dev/null +++ b/docs/downloads.md @@ -0,0 +1,29 @@ +--- +title: Downloads +hide: + - toc +--- + +# Downloads + +Hier stellen wir hilfreiche Unterlagen für unsere Zielgruppe bereit: + +- DSGVO-Informationen und Leitfäden +- Open-Source-Übersichten +- Produkt- und Leistungsflyer +- Checklisten und Best Practices + +Wenn Sie spezielle Materialien benötigen, schreiben Sie uns: [team@opentrafficcam.org](mailto:team@opentrafficcam.org) + + +??? faq "Welche Lieferzeiten sind zu erwarten?" + + Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod + nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor + massa, nec semper lorem quam in massa. + +??? question "Welche Lieferzeiten sind zu erwarten?" + + Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod + nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor + massa, nec semper lorem quam in massa. \ No newline at end of file diff --git a/docs/service/OTCamera.webp b/docs/service/OTCamera.webp new file mode 100644 index 000000000..fb2827e1a Binary files /dev/null and b/docs/service/OTCamera.webp differ diff --git a/docs/service/camera.md b/docs/service/camera.md new file mode 100644 index 000000000..4c4a403d6 --- /dev/null +++ b/docs/service/camera.md @@ -0,0 +1,149 @@ +--- +title: Hardware +hero_title: OTCamera +hero_subtitle: Deine Kamera für alle Begebenheiten +hero_layout: split-image +hero_cta_text: Kontakt aufnehmen +hero_cta_link: /contact +hero_cta_variant: secondary +hero_image_url: /service/OTCamera.webp +hide: + - toc + - title +--- + + +
+ +- :material-shield-check:
**Robust & autark** +- :material-shield-account:
**DSGVO‑konform** +- :material-puzzle:
**Nahtlos integrierbar** + +
+ + +## Vorteile + +
+ +- :material-shield-check: **Robustheit** + Ausfallsichere Hardware im wetterfesten Gehäuse. + +- :material-power-plug: **Autark** + Mehrtägiger Betrieb mit Akku/Speicher – flexibel im Einsatz. + +- :material-shield-account: **Datenschutz** + DSGVO‑konforme Nutzung durch Auflösung/Defokus und Abstände. + +- :material-cog: **Einstellungen** + Bildrate, Auflösung, Aufnahmefenster – anpassbar an Ihren Use‑Case. + +- :material-connection: **Kompatibilität** + Reibungslos mit OTVision/OTAnalytics und Fremdmaterial. + +- :material-clock-fast: **Schnelles Setup** + Einfache Montage, klare Anleitung, zügige Inbetriebnahme. + +
+ +

+ +![Image title](https://dummyimage.com/600x400/f5f5f5/aaaaaa?text=–%20Image%20–){ align=left width=300 } + +Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod +nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor +massa, nec semper lorem quam in massa. + +





+ +![Image title](https://dummyimage.com/600x400/f5f5f5/aaaaaa?text=–%20Image%20–){ align=right width=300 } + +Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod +nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor +massa, nec semper lorem quam in massa. + +





+ +![Image title](https://dummyimage.com/600x400/f5f5f5/aaaaaa?text=–%20Image%20–){ align=left width=300 } + +Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod +nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor +massa, nec semper lorem quam in massa. +





+ +## Technische Details + +
+ +- :material-shield-check: **Robustheit** + Ausfallsichere Hardware im wetterfesten Gehäuse. + +- :material-power-plug: **Autark** + Mehrtägiger Betrieb mit Akku/Speicher – flexibel im Einsatz. + +- :material-shield-account: **Datenschutz** + DSGVO‑konforme Nutzung durch Auflösung/Defokus und Abstände. + +- :material-cog: **Einstellungen** + Bildrate, Auflösung, Aufnahmefenster – anpassbar an Ihren Use‑Case. + +- :material-connection: **Kompatibilität** + Reibungslos mit OTVision/OTAnalytics und Fremdmaterial. + +- :material-clock-fast: **Schnelles Setup** + Einfache Montage, klare Anleitung, zügige Inbetriebnahme. + + +
+ +
+ +[Jetzt Projekt besprechen](/contact){ .md-button } + +
+ +## FAQ + +??? faq "Welche Lieferzeiten sind zu erwarten?" + + Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod + nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor + massa, nec semper lorem quam in massa. + +??? faq "Welche Lieferzeiten sind zu erwarten?" + + Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod + nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor + massa, nec semper lorem quam in massa. + +??? faq "Welche Lieferzeiten sind zu erwarten?" + + Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod + nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor + massa, nec semper lorem quam in massa. + +??? faq "Welche Lieferzeiten sind zu erwarten?" + + Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod + nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor + massa, nec semper lorem quam in massa. + +??? faq "Welche Lieferzeiten sind zu erwarten?" + + Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod + nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor + massa, nec semper lorem quam in massa. + +??? faq "Welche Lieferzeiten sind zu erwarten?" + + Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod + nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor + massa, nec semper lorem quam in massa. + + +
+ +[Kontakt aufnehmen](/contact){ .md-button } +[Dokumentation](/OTCamera/){ .md-button } + +
\ No newline at end of file diff --git a/docs/service/consulting.md b/docs/service/consulting.md new file mode 100644 index 000000000..ec5a21d4e --- /dev/null +++ b/docs/service/consulting.md @@ -0,0 +1,149 @@ +--- +title: Spezialauswertungen +hero_title: Spezialauswertungen +hero_subtitle: Unabhängige Beratung rund um Spezialauswertungen +hero_layout: split-image +hero_cta_text: Jetzt Beratung anfordern +hero_cta_link: /contact +hero_cta_variant: secondary +hero_image_url: /service/OTCamera.webp +hide: + - toc + - title +--- + + +
+ +- :material-shield-check:
**Robust & autark** +- :material-shield-account:
**DSGVO‑konform** +- :material-puzzle:
**Nahtlos integrierbar** + +
+ + +## Vorteile + +
+ +- :material-shield-check: **Robustheit** + Ausfallsichere Hardware im wetterfesten Gehäuse. + +- :material-power-plug: **Autark** + Mehrtägiger Betrieb mit Akku/Speicher – flexibel im Einsatz. + +- :material-shield-account: **Datenschutz** + DSGVO‑konforme Nutzung durch Auflösung/Defokus und Abstände. + +- :material-cog: **Einstellungen** + Bildrate, Auflösung, Aufnahmefenster – anpassbar an Ihren Use‑Case. + +- :material-connection: **Kompatibilität** + Reibungslos mit OTVision/OTAnalytics und Fremdmaterial. + +- :material-clock-fast: **Schnelles Setup** + Einfache Montage, klare Anleitung, zügige Inbetriebnahme. + +
+ +

+ +![Image title](https://dummyimage.com/600x400/f5f5f5/aaaaaa?text=–%20Image%20–){ align=left width=300 } + +Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod +nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor +massa, nec semper lorem quam in massa. + +





+ +![Image title](https://dummyimage.com/600x400/f5f5f5/aaaaaa?text=–%20Image%20–){ align=right width=300 } + +Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod +nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor +massa, nec semper lorem quam in massa. + +





+ +![Image title](https://dummyimage.com/600x400/f5f5f5/aaaaaa?text=–%20Image%20–){ align=left width=300 } + +Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod +nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor +massa, nec semper lorem quam in massa. +





+ +## Technische Details + +
+ +- :material-shield-check: **Robustheit** + Ausfallsichere Hardware im wetterfesten Gehäuse. + +- :material-power-plug: **Autark** + Mehrtägiger Betrieb mit Akku/Speicher – flexibel im Einsatz. + +- :material-shield-account: **Datenschutz** + DSGVO‑konforme Nutzung durch Auflösung/Defokus und Abstände. + +- :material-cog: **Einstellungen** + Bildrate, Auflösung, Aufnahmefenster – anpassbar an Ihren Use‑Case. + +- :material-connection: **Kompatibilität** + Reibungslos mit OTVision/OTAnalytics und Fremdmaterial. + +- :material-clock-fast: **Schnelles Setup** + Einfache Montage, klare Anleitung, zügige Inbetriebnahme. + + +
+ +
+ +[Jetzt Projekt besprechen](/contact){ .md-button } + +
+ +## FAQ + +??? faq "Welche Lieferzeiten sind zu erwarten?" + + Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod + nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor + massa, nec semper lorem quam in massa. + +??? faq "Welche Lieferzeiten sind zu erwarten?" + + Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod + nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor + massa, nec semper lorem quam in massa. + +??? faq "Welche Lieferzeiten sind zu erwarten?" + + Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod + nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor + massa, nec semper lorem quam in massa. + +??? faq "Welche Lieferzeiten sind zu erwarten?" + + Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod + nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor + massa, nec semper lorem quam in massa. + +??? faq "Welche Lieferzeiten sind zu erwarten?" + + Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod + nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor + massa, nec semper lorem quam in massa. + +??? faq "Welche Lieferzeiten sind zu erwarten?" + + Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod + nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor + massa, nec semper lorem quam in massa. + + +
+ +[Kontakt aufnehmen](/contact){ .md-button } +[Dokumentation](/OTCamera/){ .md-button } + +
\ No newline at end of file diff --git a/docs/service/index.md b/docs/service/index.md new file mode 100644 index 000000000..352030e65 --- /dev/null +++ b/docs/service/index.md @@ -0,0 +1,118 @@ +--- +template: base.html +title: Unser Angebot +hide: + -toc +--- + + + +
+
+
+
+ OTCamera +
+

OTCamera – intelligente Verkehrskamera

+

Robuste Hardware, einfaches Setup und zuverlässige Datenerfassung. Ideal für Verkehrszählungen, Geschwindigkeit und Sicherheit.

+
+ Mehr erfahren +
+
+ +
+
+ +
+

Video Processing – von Rohdaten zu Insights

+

Automatisierte Erkennung und Verfolgung von Verkehrsteilnehmern – skalierbar, präzise und DSGVO‑konform.

+
+ Mehr erfahren +
+
+ +
+
+ +
+

Consulting – Expertise für Ihre Projekte

+

Wir unterstützen bei Planung, Datenerhebung und Analyse – individuell und praxisnah für Kommunen, Büros und Forschung.

+
+ Kontakt & Details +
+
+
+
\ No newline at end of file diff --git a/docs/service/video_processing.md b/docs/service/video_processing.md new file mode 100644 index 000000000..1394a9710 --- /dev/null +++ b/docs/service/video_processing.md @@ -0,0 +1,149 @@ +--- +title: Standardauswertungen +hero_title: Standardauswertungen +hero_subtitle: Automatisierte Auswertung Ihrer Videos +hero_layout: split-image +hero_cta_text: Angebot anfragen +hero_cta_link: /contact +hero_cta_variant: secondary +hero_image_url: /service/OTCamera.webp +hide: + - toc + - title +--- + + +
+ +- :material-shield-check:
**Robust & autark** +- :material-shield-account:
**DSGVO‑konform** +- :material-puzzle:
**Nahtlos integrierbar** + +
+ + +## Vorteile + +
+ +- :material-shield-check: **Robustheit** + Ausfallsichere Hardware im wetterfesten Gehäuse. + +- :material-power-plug: **Autark** + Mehrtägiger Betrieb mit Akku/Speicher – flexibel im Einsatz. + +- :material-shield-account: **Datenschutz** + DSGVO‑konforme Nutzung durch Auflösung/Defokus und Abstände. + +- :material-cog: **Einstellungen** + Bildrate, Auflösung, Aufnahmefenster – anpassbar an Ihren Use‑Case. + +- :material-connection: **Kompatibilität** + Reibungslos mit OTVision/OTAnalytics und Fremdmaterial. + +- :material-clock-fast: **Schnelles Setup** + Einfache Montage, klare Anleitung, zügige Inbetriebnahme. + +
+ +

+ +![Image title](https://dummyimage.com/600x400/f5f5f5/aaaaaa?text=–%20Image%20–){ align=left width=300 } + +Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod +nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor +massa, nec semper lorem quam in massa. + +





+ +![Image title](https://dummyimage.com/600x400/f5f5f5/aaaaaa?text=–%20Image%20–){ align=right width=300 } + +Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod +nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor +massa, nec semper lorem quam in massa. + +





+ +![Image title](https://dummyimage.com/600x400/f5f5f5/aaaaaa?text=–%20Image%20–){ align=left width=300 } + +Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod +nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor +massa, nec semper lorem quam in massa. +





+ +## Technische Details + +
+ +- :material-shield-check: **Robustheit** + Ausfallsichere Hardware im wetterfesten Gehäuse. + +- :material-power-plug: **Autark** + Mehrtägiger Betrieb mit Akku/Speicher – flexibel im Einsatz. + +- :material-shield-account: **Datenschutz** + DSGVO‑konforme Nutzung durch Auflösung/Defokus und Abstände. + +- :material-cog: **Einstellungen** + Bildrate, Auflösung, Aufnahmefenster – anpassbar an Ihren Use‑Case. + +- :material-connection: **Kompatibilität** + Reibungslos mit OTVision/OTAnalytics und Fremdmaterial. + +- :material-clock-fast: **Schnelles Setup** + Einfache Montage, klare Anleitung, zügige Inbetriebnahme. + + +
+ +
+ +[Jetzt Projekt besprechen](/contact){ .md-button } + +
+ +## FAQ + +??? faq "Welche Lieferzeiten sind zu erwarten?" + + Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod + nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor + massa, nec semper lorem quam in massa. + +??? faq "Welche Lieferzeiten sind zu erwarten?" + + Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod + nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor + massa, nec semper lorem quam in massa. + +??? faq "Welche Lieferzeiten sind zu erwarten?" + + Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod + nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor + massa, nec semper lorem quam in massa. + +??? faq "Welche Lieferzeiten sind zu erwarten?" + + Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod + nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor + massa, nec semper lorem quam in massa. + +??? faq "Welche Lieferzeiten sind zu erwarten?" + + Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod + nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor + massa, nec semper lorem quam in massa. + +??? faq "Welche Lieferzeiten sind zu erwarten?" + + Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla et euismod + nulla. Curabitur feugiat, tortor non consequat finibus, justo purus auctor + massa, nec semper lorem quam in massa. + + +
+ +[Kontakt aufnehmen](/contact){ .md-button } +[Dokumentation](/OTCamera/){ .md-button } + +
\ No newline at end of file diff --git a/docs/stylesheets/service.css b/docs/stylesheets/service.css new file mode 100644 index 000000000..a1a06c67a --- /dev/null +++ b/docs/stylesheets/service.css @@ -0,0 +1,46 @@ +:root { + --md-admonition-icon--faq: url('data:image/svg+xml;charset=utf-8,') +} + +.md-typeset .admonition.faq, +.md-typeset details.faq { + border-color: rgb(43, 155, 70); +} +.md-typeset .faq > .admonition-title, +.md-typeset .faq > summary { + background-color: rgba(43, 155, 70, 0.1); +} +.md-typeset .faq > .admonition-title::before, +.md-typeset .faq > summary::before { + background-color: rgb(43, 155, 70); + + -webkit-mask-image: var(--md-admonition-icon--faq); + mask-image: var(--md-admonition-icon--faq); +} +.cta-dual { + display: flex; + justify-content: center; + gap: 0.75rem; + align-items: center; + margin: 2rem 0; +} + +.md-typeset h2 { + text-align: center; +} + +.three-header { + display: flex !important; + justify-content: space-around !important; + text-align: center; +} +.three-header > ul > li { + padding: 1.1rem 1rem; + font-size: 1.05rem; +} + +.grid.cards.tech-details-3col > ul { + display: grid !important; + grid-template-columns: repeat(3, minmax(0, 1fr)); + gap: 0.75rem; +} diff --git a/docs/stylesheets/styles.css b/docs/stylesheets/styles.css index de470eccc..e8c6413b9 100644 --- a/docs/stylesheets/styles.css +++ b/docs/stylesheets/styles.css @@ -301,3 +301,104 @@ p { padding: 0.2em 0.4em; border-radius: 0.4em; } + +/* Uniform hero height for service pages */ +.service-hero { + min-height: 52vh; /* match Beratung height */ + display: flex; + align-items: center; /* vertical centering of inner container */ +} + +@media (max-width: 768px) { + .service-hero { + min-height: 44vh; /* slightly smaller on mobile */ + } +} + + +/* Secondary button (outline, for service hero CTAs) */ +.md-button.secondary-btn { + display: inline-block; + padding: 0.7rem 1.2rem; + border-radius: 999px; + /* Give a faint tint so the button is visible without hover */ + background-color: #fff !important; + color: var(--md-accent-fg-color) !important; + border: 2px solid var(--md-accent-fg-color) !important; + text-decoration: none !important; + font-weight: 700; + font-size: 0.95rem; + line-height: 1.2; + box-shadow: 0 3px 14px rgba(0,0,0,0.10); + transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.05s ease, box-shadow 0.2s ease; +} + +/* Arrow indicator */ +.md-button.secondary-btn::after { + content: "\2192"; /* → */ + margin-left: 0.55rem; + transition: transform 0.15s ease; +} + +.md-button.secondary-btn:hover::after, +.md-button.secondary-btn:focus::after { + transform: translateX(2px); +} + +.md-button.secondary-btn:hover, +.md-button.secondary-btn:focus { + background-color: var(--md-accent-fg-color) !important; + color: var(--md-accent-bg-color) !important; + border-color: var(--md-accent-fg-color) !important; + box-shadow: 0 6px 20px rgba(0,0,0,0.16); +} + +/* Accessible focus ring */ +.md-button.secondary-btn:focus-visible { + outline: none; + box-shadow: 0 0 0 3px color-mix(in oklab, var(--md-primary-fg-color) 30%, transparent), 0 4px 14px rgba(0,0,0,0.12); +} + +.md-button.secondary-btn:active { + transform: translateY(1px); +} + +@media (prefers-reduced-motion: reduce) { + .md-button.secondary-btn, + .md-button.secondary-btn::after { + transition: none; + } +} + +/* Swap colors for header hero buttons: default shows previous hover, and hover shows previous default */ +header.hero .md-button.highlighted-btn { + background-color: var(--md-primary-fg-color) !important; /* was hover */ + color: var(--md-primary-bg-color) !important; + border-color: var(--md-primary-fg-color) !important; +} +header.hero .md-button.highlighted-btn:hover, +header.hero .md-button.highlighted-btn:focus { + background-color: var(--md-accent-fg-color) !important; /* was default */ + color: var(--md-accent-bg-color) !important; + border-color: var(--md-accent-fg-color) !important; +} + +header.hero .md-button.secondary-btn { + background-color: var(--md-accent-fg-color) !important; /* was hover */ + color: var(--md-accent-bg-color) !important; + border-color: var(--md-accent-fg-color) !important; +} +header.hero .md-button.secondary-btn:hover, +header.hero .md-button.secondary-btn:focus { + background-color: #fff !important; /* was default */ + color: var(--md-accent-fg-color) !important; + border-color: var(--md-accent-fg-color) !important; +} + +/* Unified button shape: mostly square with slight rounding */ +.md-button, +.md-typeset .md-button, +.md-button.highlighted-btn, +.md-button.secondary-btn { + border-radius: 6px !important; +} diff --git a/mkdocs.yml b/mkdocs.yml index 027af74d5..8d32d56ad 100644 --- a/mkdocs.yml +++ b/mkdocs.yml @@ -24,22 +24,33 @@ theme: - search.suggest - search.highlight - content.tabs.link + - content.icon icon: repo: fontawesome/brands/github nav: - - index.md - - live.md - - pricing.md - # - use-cases.md + - Home: + - index.md + - Angebot: + - service/index.md + - service/camera.md + - service/video_processing.md + - service/consulting.md + - Case Studies: + - case_studies.md + - case_studies/live.md + - Pricing: + - pricing.md + - Über uns: + - about_us.md + - Downloads: + - downloads.md + - Kontakt: + - contact.md - Documentation: - Overview: - overview/index.md - overview/dataprivacy.md - # - Use Cases: - # - overview/usecases/trafficcounts.md - # - overview/usecases/vehiclespeeds.md - # - overview/usecases/trafficsafety.md - OTCamera: - OTCamera/index.md - OTCamera/gettingstarted/requirements.md @@ -52,9 +63,6 @@ nav: - OTCamera/gettingstarted/installation/otcamera.md - OTCamera/gettingstarted/firstuse.md - OTCamera/usage/buttons_leds.md - # - Advanced Usage: - # - OTCamera/advanced_usage/configration.md - # - OTCamera/advanced_usage/calibrate.md - OTVision: - OTVision/index.md - OTVision/gettingstarted/requirements.md @@ -65,16 +73,11 @@ nav: - OTVision/usage/detect.md - OTVision/usage/track.md - OTVision/advanced_usage/configuration.md - - OTAnalytics: - OTAnalytics/index.md - OTAnalytics/installation.md - OTAnalytics/usage-ui.md - OTAnalytics/usage-cli.md - # - OTAnalytics/otconfig.md - # - Accuracy: - # - OTAnalytics/Accuracy/counts.md - - OTLabels: - OTLabels/index.md - Getting Started: @@ -97,12 +100,8 @@ nav: - contribute/github.md - contribute/coding.md - contribute/otanalytics.md - # - contribute/gui.md - contribute/vscode.md - contribute/documentation.md - # - contribute/otcamera.md - - Team: - - team.md extra_css: - stylesheets/color.css - stylesheets/fonts.css @@ -138,7 +137,7 @@ edit_uri: edit/master/docs/ markdown_extensions: - toc: - permalink: true + permalink: false toc_depth: 3 - admonition - pymdownx.emoji: diff --git a/overrides/main.html b/overrides/main.html index e2057cdcf..d67cd9d4f 100644 --- a/overrides/main.html +++ b/overrides/main.html @@ -1,7 +1,27 @@ -{% extends "base.html" %} {% block analytics %} - +{% extends "base.html" %} + +{% set _is_service_page = page and page.file and page.file.src_path and page.file.src_path.startswith('service/') %} + +{% block styles %} {{ super() }} + {# Add the extra CSS only for service pages, mirroring overrides/hero.html #} + {% if _is_service_page %} + + + + + {# Service pages shared stylesheet (only for camera, video_processing, consulting) #} + {% if page and page.file and page.file.src_path in ['service/camera.md','service/video_processing.md','service/consulting.md'] %} + + {% endif %} + {% endif %} {% endblock %} + +{# Inject hero header for all service pages #} +{% block hero %} + {% if _is_service_page %} + {% include "partials/hero_header.html" %} + {% else %} + {{ super() }} + {% endif %} +{% endblock %} + diff --git a/overrides/partials/hero_header.html b/overrides/partials/hero_header.html new file mode 100644 index 000000000..fcc002f70 --- /dev/null +++ b/overrides/partials/hero_header.html @@ -0,0 +1,128 @@ +{% set _hero_title = page and page.meta and page.meta.hero_title or (page and page.title) or config.site_name or 'OpenTrafficCam' %} +{% set _hero_subtitle = page and page.meta and page.meta.hero_subtitle or 'Die transparente Verkehrsdatenerfassung' %} +{% set _hero_layout = page and page.meta and page.meta.hero_layout or '' %} +{% set _cta_text = page and page.meta and page.meta.hero_cta_text or 'Kontakt' %} +{% set _cta_link = page and page.meta and page.meta.hero_cta_link or 'mailto:team@opentrafficcam.org?subject=Anfrage%20zu%20OpenTrafficCam' %} +{% set _cta_variant = page and page.meta and page.meta.hero_cta_variant or 'primary' %} +{% set _secondary_cta_text = page and page.meta and page.meta.hero_secondary_cta_text or '' %} +{% set _secondary_cta_link = page and page.meta and page.meta.hero_secondary_cta_link or '' %} +{% set _secondary_cta_variant = page and page.meta and page.meta.hero_secondary_cta_variant or 'secondary' %} +{% set _video_url = page and page.meta and page.meta.hero_video_url or '' %} +{% set _video_poster = page and page.meta and page.meta.hero_video_poster or '/assets/video/videoerfassung.webp' %} +{% set _image_url = page and page.meta and page.meta.hero_image_url or '' %} +{% set _btn_class = 'highlighted-btn' if _cta_variant == 'primary' else 'secondary-btn' %} +{% set _btn2_class = 'highlighted-btn' if _secondary_cta_variant == 'primary' else 'secondary-btn' %} + +{# If this page explicitly hides the title, also hide the top header topic and any first H1 in content #} +{% if page and page.meta and page.meta.hide and 'title' in page.meta.hide %} + +{% endif %} + +{% if _hero_layout == 'split-video' %} + +{% elif _hero_layout == 'centered-cta' %} + +{% elif _hero_layout == 'split-image' %} + +{% else %} + +{% endif %}