This commit is contained in:
2026-05-03 14:59:47 +02:00
parent 41d017b70f
commit 8bcd9e63df
18 changed files with 772 additions and 1084 deletions
+7 -1
View File
@@ -2,7 +2,13 @@
import { defineConfig } from 'astro/config'; import { defineConfig } from 'astro/config';
import mdx from '@astrojs/mdx'; import mdx from '@astrojs/mdx';
import tailwindcss from '@tailwindcss/vite';
// https://astro.build/config // https://astro.build/config
export default defineConfig({ export default defineConfig({
integrations: [mdx()], integrations: [mdx()],
});
vite: {
plugins: [tailwindcss()],
},
});
+24 -151
View File
@@ -3,140 +3,52 @@ title: Freilichttheater Ziefen 2028
hero: hero:
title_de: Freilichttheater in Ziefen title_de: Freilichttheater in Ziefen
title_en: Open-Air Theater in Ziefen title_en: Open-Air Theater in Ziefen
subtitle_de: 2028 grosses Freilichtspiel geplant. Der Blick auf die Gesellschaft der damaligen Zeit aus der Sicht des in Ziefen aufgewachsenen späteren Pfarrers, Waisenvaters und Mundartautors… Jonas Breitenstein subtitle_de: '2028 grosses Freilichtspiel geplant. Der Blick auf die Gesellschaft der damaligen Zeit aus der Sicht des in Ziefen aufgewachsenen späteren Pfarrers, Waisenvaters und Mundartautors… Jonas Breitenstein'
subtitle_en: A grand open-air play planned for 2028. A view of society of that time from the perspective of Jonas Breitenstein, who grew up in Ziefen and later became a pastor, orphanage father, and dialect author. subtitle_en: 'A grand open-air play planned for 2028. A view of society of that time from the perspective of Jonas Breitenstein, who grew up in Ziefen and later became a pastor, orphanage father, and dialect author.'
projekt: projekt:
title_de: Das Projekt title_de: Das Projekt
title_en: The Project title_en: The Project
content_de: content_de: ''
type: root content_en: ''
children:
- type: p
children:
- type: text
text: 'Beschreibung der Entstehung des Projekts. Zwei Vereine arbeiten zusammen, um dieses einzigartige Freilichtspiel zu realisieren.'
- type: p
children:
- type: text
text: 'Vor den Aufführungen wird es Möglichkeiten zur Verköstigung geben.'
- type: p
children:
- type: text
text: 'Ein besonderer Schwerpunkt liegt auf der Beteiligung der Menschen aus dem Dorf und dem Tal. Wir möchten die lokale Gemeinschaft aktiv einbinden.'
content_en:
type: root
children:
- type: p
children:
- type: text
text: 'Description of how the project came to be. Two associations are working together to realize this unique open-air play.'
- type: p
children:
- type: text
text: 'There will be opportunities for refreshments before the performances.'
- type: p
children:
- type: text
text: 'A special focus is on the participation of people from the village and the valley. We want to actively involve the local community.'
team: team:
title_de: Wer steckt dahinter title_de: Wer steckt dahinter
title_en: Who's Behind It title_en: Who's Behind It
content_de: content_de: ''
type: root content_en: ''
children:
- type: p
children:
- type: text
text: 'Hinter diesem Projekt stehen verschiedene Organisationen und Institutionen aus Ziefen:'
content_en:
type: root
children:
- type: p
children:
- type: text
text: 'Various organizations and institutions from Ziefen are behind this project:'
organizations: organizations:
- name: Verein J.B. - name: Verein J.B.
role_de: Hauptverantwortlich für das Theaterprojekt role_de: Hauptverantwortlich für das Theaterprojekt
role_en: Main responsibility for the theater project role_en: Main responsibility for the theater project
logo: /images/Frontispitz_SW_clean_web.png
url: 'https://jonas-breitenstein.ch/verein.html'
- name: Verein 4417 - name: Verein 4417
role_de: Mitorganisator role_de: Mitorganisator
role_en: Co-organizer role_en: Co-organizer
logo: /images/img_medium.jpg
url: 'https://www.ziefen.ch/freizeit-kultur/vereine.html/87/association/23'
- name: Bürgergemeinde - name: Bürgergemeinde
role_de: Unterstützer role_de: Unterstützer
role_en: Supporter role_en: Supporter
logo: /images/ziefen.svg
url: 'https://bg-ziefen.ch/'
- name: Einwohnergemeinde - name: Einwohnergemeinde
role_de: Unterstützer role_de: Unterstützer
role_en: Supporter role_en: Supporter
logo: /images/ziefen.svg
url: 'https://www.ziefen.ch/'
stueck: stueck:
title_de: Das Stück title_de: Das Stück
title_en: The Play title_en: The Play
content_de: content_de: ''
type: root content_en: ''
children:
- type: h3
children:
- type: text
text: 'Wer macht mit?'
- type: p
children:
- type: text
text: 'Hier wird der Text von Danny Wehrmüller erscheinen, der das Stück näher beschreibt und zum Mitmachen einlädt.'
content_en:
type: root
children:
- type: h3
children:
- type: text
text: 'Who wants to participate?'
- type: p
children:
- type: text
text: "Here will appear the text by Danny Wehrmüller, which describes the play in more detail and invites people to participate."
mitwirkung: mitwirkung:
title_de: Mitwirkung im Schauspiel title_de: Mitwirkung im Schauspiel
title_en: Participation in the Play title_en: Participation in the Play
content_de: content_de: ''
type: root content_en: ''
children:
- type: p
children:
- type: text
text: 'Offen für jeden ab dem 16. Lebensjahr!'
- type: p
children:
- type: text
text: 'Wer auf die Bühne will, meldet sich direkt beim Regisseur (Kontaktdaten unten).'
- type: p
children:
- type: text
text: 'Zu gegebener Zeit erfolgt ein Casting in Gruppen mit dem Zweck, sich gegenseitig spielend kennenzulernen.'
- type: p
children:
- type: text
text: 'Bemerkung: Es geht nicht darum, Leute auszuschliessen.'
content_en:
type: root
children:
- type: p
children:
- type: text
text: 'Open to everyone from the age of 16!'
- type: p
children:
- type: text
text: 'Anyone who wants to be on stage should contact the director directly (contact details below).'
- type: p
children:
- type: text
text: 'At the appropriate time, there will be group casting sessions with the purpose of getting to know each other through play.'
- type: p
children:
- type: text
text: 'Note: The goal is not to exclude people.'
director_name: Danny Wehrmüller director_name: Danny Wehrmüller
director_email: director@theater-ziefen.ch director_email: director@theater-ziefen.ch
director_phone: '+41 XX XXX XX XX' director_phone: +41 XX XXX XX XX
termine: termine:
title_de: Termine title_de: Termine
title_en: Schedule title_en: Schedule
@@ -164,28 +76,8 @@ termine:
presse: presse:
title_de: Presse title_de: Presse
title_en: Press title_en: Press
content_de: content_de: ''
type: root content_en: ''
children:
- type: p
children:
- type: text
text: 'Pressemitteilungen und Artikel werden hier veröffentlicht (digital und print).'
- type: p
children:
- type: text
text: 'Wir streben eine Pressepartnerschaft an, ähnlich wie das Theater Läufelfingen mit der «Volksstimme».'
content_en:
type: root
children:
- type: p
children:
- type: text
text: 'Press releases and articles will be published here (digital and print).'
- type: p
children:
- type: text
text: 'We are aiming for a press partnership, similar to Theater Läufelfingen with «Volksstimme».'
gallery: gallery:
title_de: Foto Galerie title_de: Foto Galerie
title_en: Photo Gallery title_en: Photo Gallery
@@ -193,27 +85,8 @@ gallery:
tickets: tickets:
title_de: Tickets title_de: Tickets
title_en: Tickets title_en: Tickets
content_de: content_de: ''
type: root content_en: ''
children:
- type: p
children:
- type: text
text: 'Tickets werden über eine Partnerfirma erhältlich sein.'
- type: p
children:
- type: text
text: 'Weitere Informationen folgen in Kürze.'
content_en:
type: root
children:
- type: p
children:
- type: text
text: 'Tickets will be available through a partner company.'
- type: p
children:
- type: text
text: 'More information coming soon.'
ticket_url: '' ticket_url: ''
--- ---
+611 -109
View File
@@ -9,8 +9,10 @@
"version": "0.0.1", "version": "0.0.1",
"dependencies": { "dependencies": {
"@astrojs/mdx": "^4.3.13", "@astrojs/mdx": "^4.3.13",
"@tailwindcss/vite": "^4.2.4",
"@tinacms/cli": "^2.1.2", "@tinacms/cli": "^2.1.2",
"astro": "^5.16.16", "astro": "^5.16.16",
"tailwindcss": "^4.2.4",
"tinacms": "^3.3.2" "tinacms": "^3.3.2"
} }
}, },
@@ -4662,6 +4664,249 @@
"tailwindcss": ">=3.2.0" "tailwindcss": ">=3.2.0"
} }
}, },
"node_modules/@tailwindcss/node": {
"version": "4.2.4",
"resolved": "https://registry.npmjs.org/@tailwindcss/node/-/node-4.2.4.tgz",
"integrity": "sha512-Ai7+yQPxz3ddrDQzFfBKdHEVBg0w3Zl83jnjuwxnZOsnH9pGn93QHQtpU0p/8rYWxvbFZHneni6p1BSLK4DkGA==",
"license": "MIT",
"dependencies": {
"@jridgewell/remapping": "^2.3.5",
"enhanced-resolve": "^5.19.0",
"jiti": "^2.6.1",
"lightningcss": "1.32.0",
"magic-string": "^0.30.21",
"source-map-js": "^1.2.1",
"tailwindcss": "4.2.4"
}
},
"node_modules/@tailwindcss/oxide": {
"version": "4.2.4",
"resolved": "https://registry.npmjs.org/@tailwindcss/oxide/-/oxide-4.2.4.tgz",
"integrity": "sha512-9El/iI069DKDSXwTvB9J4BwdO5JhRrOweGaK25taBAvBXyXqJAX+Jqdvs8r8gKpsI/1m0LeJLyQYTf/WLrBT1Q==",
"license": "MIT",
"engines": {
"node": ">= 20"
},
"optionalDependencies": {
"@tailwindcss/oxide-android-arm64": "4.2.4",
"@tailwindcss/oxide-darwin-arm64": "4.2.4",
"@tailwindcss/oxide-darwin-x64": "4.2.4",
"@tailwindcss/oxide-freebsd-x64": "4.2.4",
"@tailwindcss/oxide-linux-arm-gnueabihf": "4.2.4",
"@tailwindcss/oxide-linux-arm64-gnu": "4.2.4",
"@tailwindcss/oxide-linux-arm64-musl": "4.2.4",
"@tailwindcss/oxide-linux-x64-gnu": "4.2.4",
"@tailwindcss/oxide-linux-x64-musl": "4.2.4",
"@tailwindcss/oxide-wasm32-wasi": "4.2.4",
"@tailwindcss/oxide-win32-arm64-msvc": "4.2.4",
"@tailwindcss/oxide-win32-x64-msvc": "4.2.4"
}
},
"node_modules/@tailwindcss/oxide-android-arm64": {
"version": "4.2.4",
"resolved": "https://registry.npmjs.org/@tailwindcss/oxide-android-arm64/-/oxide-android-arm64-4.2.4.tgz",
"integrity": "sha512-e7MOr1SAn9U8KlZzPi1ZXGZHeC5anY36qjNwmZv9pOJ8E4Q6jmD1vyEHkQFmNOIN7twGPEMXRHmitN4zCMN03g==",
"cpu": [
"arm64"
],
"license": "MIT",
"optional": true,
"os": [
"android"
],
"engines": {
"node": ">= 20"
}
},
"node_modules/@tailwindcss/oxide-darwin-arm64": {
"version": "4.2.4",
"resolved": "https://registry.npmjs.org/@tailwindcss/oxide-darwin-arm64/-/oxide-darwin-arm64-4.2.4.tgz",
"integrity": "sha512-tSC/Kbqpz/5/o/C2sG7QvOxAKqyd10bq+ypZNf+9Fi2TvbVbv1zNpcEptcsU7DPROaSbVgUXmrzKhurFvo5eDg==",
"cpu": [
"arm64"
],
"license": "MIT",
"optional": true,
"os": [
"darwin"
],
"engines": {
"node": ">= 20"
}
},
"node_modules/@tailwindcss/oxide-darwin-x64": {
"version": "4.2.4",
"resolved": "https://registry.npmjs.org/@tailwindcss/oxide-darwin-x64/-/oxide-darwin-x64-4.2.4.tgz",
"integrity": "sha512-yPyUXn3yO/ufR6+Kzv0t4fCg2qNr90jxXc5QqBpjlPNd0NqyDXcmQb/6weunH/MEDXW5dhyEi+agTDiqa3WsGg==",
"cpu": [
"x64"
],
"license": "MIT",
"optional": true,
"os": [
"darwin"
],
"engines": {
"node": ">= 20"
}
},
"node_modules/@tailwindcss/oxide-freebsd-x64": {
"version": "4.2.4",
"resolved": "https://registry.npmjs.org/@tailwindcss/oxide-freebsd-x64/-/oxide-freebsd-x64-4.2.4.tgz",
"integrity": "sha512-BoMIB4vMQtZsXdGLVc2z+P9DbETkiopogfWZKbWwM8b/1Vinbs4YcUwo+kM/KeLkX3Ygrf4/PsRndKaYhS8Eiw==",
"cpu": [
"x64"
],
"license": "MIT",
"optional": true,
"os": [
"freebsd"
],
"engines": {
"node": ">= 20"
}
},
"node_modules/@tailwindcss/oxide-linux-arm-gnueabihf": {
"version": "4.2.4",
"resolved": "https://registry.npmjs.org/@tailwindcss/oxide-linux-arm-gnueabihf/-/oxide-linux-arm-gnueabihf-4.2.4.tgz",
"integrity": "sha512-7pIHBLTHYRAlS7V22JNuTh33yLH4VElwKtB3bwchK/UaKUPpQ0lPQiOWcbm4V3WP2I6fNIJ23vABIvoy2izdwA==",
"cpu": [
"arm"
],
"license": "MIT",
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">= 20"
}
},
"node_modules/@tailwindcss/oxide-linux-arm64-gnu": {
"version": "4.2.4",
"resolved": "https://registry.npmjs.org/@tailwindcss/oxide-linux-arm64-gnu/-/oxide-linux-arm64-gnu-4.2.4.tgz",
"integrity": "sha512-+E4wxJ0ZGOzSH325reXTWB48l42i93kQqMvDyz5gqfRzRZ7faNhnmvlV4EPGJU3QJM/3Ab5jhJ5pCRUsKn6OQw==",
"cpu": [
"arm64"
],
"license": "MIT",
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">= 20"
}
},
"node_modules/@tailwindcss/oxide-linux-arm64-musl": {
"version": "4.2.4",
"resolved": "https://registry.npmjs.org/@tailwindcss/oxide-linux-arm64-musl/-/oxide-linux-arm64-musl-4.2.4.tgz",
"integrity": "sha512-bBADEGAbo4ASnppIziaQJelekCxdMaxisrk+fB7Thit72IBnALp9K6ffA2G4ruj90G9XRS2VQ6q2bCKbfFV82g==",
"cpu": [
"arm64"
],
"license": "MIT",
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">= 20"
}
},
"node_modules/@tailwindcss/oxide-linux-x64-gnu": {
"version": "4.2.4",
"resolved": "https://registry.npmjs.org/@tailwindcss/oxide-linux-x64-gnu/-/oxide-linux-x64-gnu-4.2.4.tgz",
"integrity": "sha512-7Mx25E4WTfnht0TVRTyC00j3i0M+EeFe7wguMDTlX4mRxafznw0CA8WJkFjWYH5BlgELd1kSjuU2JiPnNZbJDA==",
"cpu": [
"x64"
],
"license": "MIT",
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">= 20"
}
},
"node_modules/@tailwindcss/oxide-linux-x64-musl": {
"version": "4.2.4",
"resolved": "https://registry.npmjs.org/@tailwindcss/oxide-linux-x64-musl/-/oxide-linux-x64-musl-4.2.4.tgz",
"integrity": "sha512-2wwJRF7nyhOR0hhHoChc04xngV3iS+akccHTGtz965FwF0up4b2lOdo6kI1EbDaEXKgvcrFBYcYQQ/rrnWFVfA==",
"cpu": [
"x64"
],
"license": "MIT",
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">= 20"
}
},
"node_modules/@tailwindcss/oxide-wasm32-wasi": {
"version": "4.2.4",
"resolved": "https://registry.npmjs.org/@tailwindcss/oxide-wasm32-wasi/-/oxide-wasm32-wasi-4.2.4.tgz",
"integrity": "sha512-FQsqApeor8Fo6gUEklzmaa9994orJZZDBAlQpK2Mq+DslRKFJeD6AjHpBQ0kZFQohVr8o85PPh8eOy86VlSCmw==",
"bundleDependencies": [
"@napi-rs/wasm-runtime",
"@emnapi/core",
"@emnapi/runtime",
"@tybys/wasm-util",
"@emnapi/wasi-threads",
"tslib"
],
"cpu": [
"wasm32"
],
"license": "MIT",
"optional": true,
"dependencies": {
"@emnapi/core": "^1.8.1",
"@emnapi/runtime": "^1.8.1",
"@emnapi/wasi-threads": "^1.1.0",
"@napi-rs/wasm-runtime": "^1.1.1",
"@tybys/wasm-util": "^0.10.1",
"tslib": "^2.8.1"
},
"engines": {
"node": ">=14.0.0"
}
},
"node_modules/@tailwindcss/oxide-win32-arm64-msvc": {
"version": "4.2.4",
"resolved": "https://registry.npmjs.org/@tailwindcss/oxide-win32-arm64-msvc/-/oxide-win32-arm64-msvc-4.2.4.tgz",
"integrity": "sha512-L9BXqxC4ToVgwMFqj3pmZRqyHEztulpUJzCxUtLjobMCzTPsGt1Fa9enKbOpY2iIyVtaHNeNvAK8ERP/64sqGQ==",
"cpu": [
"arm64"
],
"license": "MIT",
"optional": true,
"os": [
"win32"
],
"engines": {
"node": ">= 20"
}
},
"node_modules/@tailwindcss/oxide-win32-x64-msvc": {
"version": "4.2.4",
"resolved": "https://registry.npmjs.org/@tailwindcss/oxide-win32-x64-msvc/-/oxide-win32-x64-msvc-4.2.4.tgz",
"integrity": "sha512-ESlKG0EpVJQwRjXDDa9rLvhEAh0mhP1sF7sap9dNZT0yyl9SAG6T7gdP09EH0vIv0UNTlo6jPWyujD6559fZvw==",
"cpu": [
"x64"
],
"license": "MIT",
"optional": true,
"os": [
"win32"
],
"engines": {
"node": ">= 20"
}
},
"node_modules/@tailwindcss/typography": { "node_modules/@tailwindcss/typography": {
"version": "0.5.19", "version": "0.5.19",
"resolved": "https://registry.npmjs.org/@tailwindcss/typography/-/typography-0.5.19.tgz", "resolved": "https://registry.npmjs.org/@tailwindcss/typography/-/typography-0.5.19.tgz",
@@ -4674,6 +4919,20 @@
"tailwindcss": ">=3.0.0 || insiders || >=4.0.0-alpha.20 || >=4.0.0-beta.1" "tailwindcss": ">=3.0.0 || insiders || >=4.0.0-alpha.20 || >=4.0.0-beta.1"
} }
}, },
"node_modules/@tailwindcss/vite": {
"version": "4.2.4",
"resolved": "https://registry.npmjs.org/@tailwindcss/vite/-/vite-4.2.4.tgz",
"integrity": "sha512-pCvohwOCspk3ZFn6eJzrrX3g4n2JY73H6MmYC87XfGPyTty4YsCjYTMArRZm/zOI8dIt3+EcrLHAFPe5A4bgtw==",
"license": "MIT",
"dependencies": {
"@tailwindcss/node": "4.2.4",
"@tailwindcss/oxide": "4.2.4",
"tailwindcss": "4.2.4"
},
"peerDependencies": {
"vite": "^5.2.0 || ^6 || ^7 || ^8"
}
},
"node_modules/@tanstack/react-virtual": { "node_modules/@tanstack/react-virtual": {
"version": "3.13.18", "version": "3.13.18",
"resolved": "https://registry.npmjs.org/@tanstack/react-virtual/-/react-virtual-3.13.18.tgz", "resolved": "https://registry.npmjs.org/@tanstack/react-virtual/-/react-virtual-3.13.18.tgz",
@@ -5414,6 +5673,15 @@
"node": ">= 6" "node": ">= 6"
} }
}, },
"node_modules/@tinacms/cli/node_modules/jiti": {
"version": "1.21.7",
"resolved": "https://registry.npmjs.org/jiti/-/jiti-1.21.7.tgz",
"integrity": "sha512-/imKNG4EbWNrVjoNC/1H5/9GFy+tqjGBHCaSsN+P2RnPqjsLmv6UD3Ej+Kj8nBWaRAwyk7kK5ZUc+OEatnTR3A==",
"license": "MIT",
"bin": {
"jiti": "bin/jiti.js"
}
},
"node_modules/@tinacms/cli/node_modules/magic-string": { "node_modules/@tinacms/cli/node_modules/magic-string": {
"version": "0.27.0", "version": "0.27.0",
"resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.27.0.tgz", "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.27.0.tgz",
@@ -5438,6 +5706,19 @@
"url": "https://github.com/sponsors/jonschlinkert" "url": "https://github.com/sponsors/jonschlinkert"
} }
}, },
"node_modules/@tinacms/cli/node_modules/postcss-selector-parser": {
"version": "6.1.2",
"resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.1.2.tgz",
"integrity": "sha512-Q8qQfPiZ+THO/3ZrOrO0cJJKfpYCagtMUkXbnEfmgUjwXg6z/WBeOyS9APBBPCTSiDV+s4SwQGu8yFsiMRIudg==",
"license": "MIT",
"dependencies": {
"cssesc": "^3.0.0",
"util-deprecate": "^1.0.2"
},
"engines": {
"node": ">=4"
}
},
"node_modules/@tinacms/cli/node_modules/readdirp": { "node_modules/@tinacms/cli/node_modules/readdirp": {
"version": "3.6.0", "version": "3.6.0",
"resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz", "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz",
@@ -5466,6 +5747,55 @@
"fsevents": "~2.3.2" "fsevents": "~2.3.2"
} }
}, },
"node_modules/@tinacms/cli/node_modules/tailwindcss": {
"version": "3.4.19",
"resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.4.19.tgz",
"integrity": "sha512-3ofp+LL8E+pK/JuPLPggVAIaEuhvIz4qNcf3nA1Xn2o/7fb7s/TYpHhwGDv1ZU3PkBluUVaF8PyCHcm48cKLWQ==",
"license": "MIT",
"dependencies": {
"@alloc/quick-lru": "^5.2.0",
"arg": "^5.0.2",
"chokidar": "^3.6.0",
"didyoumean": "^1.2.2",
"dlv": "^1.1.3",
"fast-glob": "^3.3.2",
"glob-parent": "^6.0.2",
"is-glob": "^4.0.3",
"jiti": "^1.21.7",
"lilconfig": "^3.1.3",
"micromatch": "^4.0.8",
"normalize-path": "^3.0.0",
"object-hash": "^3.0.0",
"picocolors": "^1.1.1",
"postcss": "^8.4.47",
"postcss-import": "^15.1.0",
"postcss-js": "^4.0.1",
"postcss-load-config": "^4.0.2 || ^5.0 || ^6.0",
"postcss-nested": "^6.2.0",
"postcss-selector-parser": "^6.1.2",
"resolve": "^1.22.8",
"sucrase": "^3.35.0"
},
"bin": {
"tailwind": "lib/cli.js",
"tailwindcss": "lib/cli.js"
},
"engines": {
"node": ">=14.0.0"
}
},
"node_modules/@tinacms/cli/node_modules/tailwindcss/node_modules/glob-parent": {
"version": "6.0.2",
"resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-6.0.2.tgz",
"integrity": "sha512-XxwI8EOhVQgWp6iDL+3b0r86f4d6AX6zSU55HfB4ydCEuXLXc5FcYeOu+nnGftS4TEju/11rt4KJPTMgbfmv4A==",
"license": "ISC",
"dependencies": {
"is-glob": "^4.0.3"
},
"engines": {
"node": ">=10.13.0"
}
},
"node_modules/@tinacms/cli/node_modules/vite": { "node_modules/@tinacms/cli/node_modules/vite": {
"version": "4.5.14", "version": "4.5.14",
"resolved": "https://registry.npmjs.org/vite/-/vite-4.5.14.tgz", "resolved": "https://registry.npmjs.org/vite/-/vite-4.5.14.tgz",
@@ -10158,6 +10488,19 @@
"once": "^1.4.0" "once": "^1.4.0"
} }
}, },
"node_modules/enhanced-resolve": {
"version": "5.21.0",
"resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-5.21.0.tgz",
"integrity": "sha512-otxSQPw4lkOZWkHpB3zaEQs6gWYEsmX4xQF68ElXC/TWvGxGMSGOvoNbaLXm6/cS/fSfHtsEdw90y20PCd+sCA==",
"license": "MIT",
"dependencies": {
"graceful-fs": "^4.2.4",
"tapable": "^2.3.3"
},
"engines": {
"node": ">=10.13.0"
}
},
"node_modules/entities": { "node_modules/entities": {
"version": "6.0.1", "version": "6.0.1",
"resolved": "https://registry.npmjs.org/entities/-/entities-6.0.1.tgz", "resolved": "https://registry.npmjs.org/entities/-/entities-6.0.1.tgz",
@@ -12281,12 +12624,12 @@
} }
}, },
"node_modules/jiti": { "node_modules/jiti": {
"version": "1.21.7", "version": "2.6.1",
"resolved": "https://registry.npmjs.org/jiti/-/jiti-1.21.7.tgz", "resolved": "https://registry.npmjs.org/jiti/-/jiti-2.6.1.tgz",
"integrity": "sha512-/imKNG4EbWNrVjoNC/1H5/9GFy+tqjGBHCaSsN+P2RnPqjsLmv6UD3Ej+Kj8nBWaRAwyk7kK5ZUc+OEatnTR3A==", "integrity": "sha512-ekilCSN1jwRvIbgeg/57YFh8qQDNbwDb9xT/qu2DAHbFFZUicIl4ygVaAvzveMhMVr3LnpSKTNnwt8PoOfmKhQ==",
"license": "MIT", "license": "MIT",
"bin": { "bin": {
"jiti": "bin/jiti.js" "jiti": "lib/jiti-cli.mjs"
} }
}, },
"node_modules/jotai": { "node_modules/jotai": {
@@ -12517,6 +12860,255 @@
"node": ">=12" "node": ">=12"
} }
}, },
"node_modules/lightningcss": {
"version": "1.32.0",
"resolved": "https://registry.npmjs.org/lightningcss/-/lightningcss-1.32.0.tgz",
"integrity": "sha512-NXYBzinNrblfraPGyrbPoD19C1h9lfI/1mzgWYvXUTe414Gz/X1FD2XBZSZM7rRTrMA8JL3OtAaGifrIKhQ5yQ==",
"license": "MPL-2.0",
"dependencies": {
"detect-libc": "^2.0.3"
},
"engines": {
"node": ">= 12.0.0"
},
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/parcel"
},
"optionalDependencies": {
"lightningcss-android-arm64": "1.32.0",
"lightningcss-darwin-arm64": "1.32.0",
"lightningcss-darwin-x64": "1.32.0",
"lightningcss-freebsd-x64": "1.32.0",
"lightningcss-linux-arm-gnueabihf": "1.32.0",
"lightningcss-linux-arm64-gnu": "1.32.0",
"lightningcss-linux-arm64-musl": "1.32.0",
"lightningcss-linux-x64-gnu": "1.32.0",
"lightningcss-linux-x64-musl": "1.32.0",
"lightningcss-win32-arm64-msvc": "1.32.0",
"lightningcss-win32-x64-msvc": "1.32.0"
}
},
"node_modules/lightningcss-android-arm64": {
"version": "1.32.0",
"resolved": "https://registry.npmjs.org/lightningcss-android-arm64/-/lightningcss-android-arm64-1.32.0.tgz",
"integrity": "sha512-YK7/ClTt4kAK0vo6w3X+Pnm0D2cf2vPHbhOXdoNti1Ga0al1P4TBZhwjATvjNwLEBCnKvjJc2jQgHXH0NEwlAg==",
"cpu": [
"arm64"
],
"license": "MPL-2.0",
"optional": true,
"os": [
"android"
],
"engines": {
"node": ">= 12.0.0"
},
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/parcel"
}
},
"node_modules/lightningcss-darwin-arm64": {
"version": "1.32.0",
"resolved": "https://registry.npmjs.org/lightningcss-darwin-arm64/-/lightningcss-darwin-arm64-1.32.0.tgz",
"integrity": "sha512-RzeG9Ju5bag2Bv1/lwlVJvBE3q6TtXskdZLLCyfg5pt+HLz9BqlICO7LZM7VHNTTn/5PRhHFBSjk5lc4cmscPQ==",
"cpu": [
"arm64"
],
"license": "MPL-2.0",
"optional": true,
"os": [
"darwin"
],
"engines": {
"node": ">= 12.0.0"
},
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/parcel"
}
},
"node_modules/lightningcss-darwin-x64": {
"version": "1.32.0",
"resolved": "https://registry.npmjs.org/lightningcss-darwin-x64/-/lightningcss-darwin-x64-1.32.0.tgz",
"integrity": "sha512-U+QsBp2m/s2wqpUYT/6wnlagdZbtZdndSmut/NJqlCcMLTWp5muCrID+K5UJ6jqD2BFshejCYXniPDbNh73V8w==",
"cpu": [
"x64"
],
"license": "MPL-2.0",
"optional": true,
"os": [
"darwin"
],
"engines": {
"node": ">= 12.0.0"
},
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/parcel"
}
},
"node_modules/lightningcss-freebsd-x64": {
"version": "1.32.0",
"resolved": "https://registry.npmjs.org/lightningcss-freebsd-x64/-/lightningcss-freebsd-x64-1.32.0.tgz",
"integrity": "sha512-JCTigedEksZk3tHTTthnMdVfGf61Fky8Ji2E4YjUTEQX14xiy/lTzXnu1vwiZe3bYe0q+SpsSH/CTeDXK6WHig==",
"cpu": [
"x64"
],
"license": "MPL-2.0",
"optional": true,
"os": [
"freebsd"
],
"engines": {
"node": ">= 12.0.0"
},
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/parcel"
}
},
"node_modules/lightningcss-linux-arm-gnueabihf": {
"version": "1.32.0",
"resolved": "https://registry.npmjs.org/lightningcss-linux-arm-gnueabihf/-/lightningcss-linux-arm-gnueabihf-1.32.0.tgz",
"integrity": "sha512-x6rnnpRa2GL0zQOkt6rts3YDPzduLpWvwAF6EMhXFVZXD4tPrBkEFqzGowzCsIWsPjqSK+tyNEODUBXeeVHSkw==",
"cpu": [
"arm"
],
"license": "MPL-2.0",
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">= 12.0.0"
},
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/parcel"
}
},
"node_modules/lightningcss-linux-arm64-gnu": {
"version": "1.32.0",
"resolved": "https://registry.npmjs.org/lightningcss-linux-arm64-gnu/-/lightningcss-linux-arm64-gnu-1.32.0.tgz",
"integrity": "sha512-0nnMyoyOLRJXfbMOilaSRcLH3Jw5z9HDNGfT/gwCPgaDjnx0i8w7vBzFLFR1f6CMLKF8gVbebmkUN3fa/kQJpQ==",
"cpu": [
"arm64"
],
"license": "MPL-2.0",
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">= 12.0.0"
},
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/parcel"
}
},
"node_modules/lightningcss-linux-arm64-musl": {
"version": "1.32.0",
"resolved": "https://registry.npmjs.org/lightningcss-linux-arm64-musl/-/lightningcss-linux-arm64-musl-1.32.0.tgz",
"integrity": "sha512-UpQkoenr4UJEzgVIYpI80lDFvRmPVg6oqboNHfoH4CQIfNA+HOrZ7Mo7KZP02dC6LjghPQJeBsvXhJod/wnIBg==",
"cpu": [
"arm64"
],
"license": "MPL-2.0",
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">= 12.0.0"
},
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/parcel"
}
},
"node_modules/lightningcss-linux-x64-gnu": {
"version": "1.32.0",
"resolved": "https://registry.npmjs.org/lightningcss-linux-x64-gnu/-/lightningcss-linux-x64-gnu-1.32.0.tgz",
"integrity": "sha512-V7Qr52IhZmdKPVr+Vtw8o+WLsQJYCTd8loIfpDaMRWGUZfBOYEJeyJIkqGIDMZPwPx24pUMfwSxxI8phr/MbOA==",
"cpu": [
"x64"
],
"license": "MPL-2.0",
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">= 12.0.0"
},
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/parcel"
}
},
"node_modules/lightningcss-linux-x64-musl": {
"version": "1.32.0",
"resolved": "https://registry.npmjs.org/lightningcss-linux-x64-musl/-/lightningcss-linux-x64-musl-1.32.0.tgz",
"integrity": "sha512-bYcLp+Vb0awsiXg/80uCRezCYHNg1/l3mt0gzHnWV9XP1W5sKa5/TCdGWaR/zBM2PeF/HbsQv/j2URNOiVuxWg==",
"cpu": [
"x64"
],
"license": "MPL-2.0",
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">= 12.0.0"
},
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/parcel"
}
},
"node_modules/lightningcss-win32-arm64-msvc": {
"version": "1.32.0",
"resolved": "https://registry.npmjs.org/lightningcss-win32-arm64-msvc/-/lightningcss-win32-arm64-msvc-1.32.0.tgz",
"integrity": "sha512-8SbC8BR40pS6baCM8sbtYDSwEVQd4JlFTOlaD3gWGHfThTcABnNDBda6eTZeqbofalIJhFx0qKzgHJmcPTnGdw==",
"cpu": [
"arm64"
],
"license": "MPL-2.0",
"optional": true,
"os": [
"win32"
],
"engines": {
"node": ">= 12.0.0"
},
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/parcel"
}
},
"node_modules/lightningcss-win32-x64-msvc": {
"version": "1.32.0",
"resolved": "https://registry.npmjs.org/lightningcss-win32-x64-msvc/-/lightningcss-win32-x64-msvc-1.32.0.tgz",
"integrity": "sha512-Amq9B/SoZYdDi1kFrojnoqPLxYhQ4Wo5XiL8EVJrVsB8ARoC1PWW6VGtT0WKCemjy8aC+louJnjS7U18x3b06Q==",
"cpu": [
"x64"
],
"license": "MPL-2.0",
"optional": true,
"os": [
"win32"
],
"engines": {
"node": ">= 12.0.0"
},
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/parcel"
}
},
"node_modules/lilconfig": { "node_modules/lilconfig": {
"version": "3.1.3", "version": "3.1.3",
"resolved": "https://registry.npmjs.org/lilconfig/-/lilconfig-3.1.3.tgz", "resolved": "https://registry.npmjs.org/lilconfig/-/lilconfig-3.1.3.tgz",
@@ -20265,11 +20857,12 @@
"license": "MIT" "license": "MIT"
}, },
"node_modules/resolve": { "node_modules/resolve": {
"version": "1.22.11", "version": "1.22.12",
"resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.11.tgz", "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.12.tgz",
"integrity": "sha512-RfqAvLnMl313r7c9oclB1HhUEAezcpLjz95wFH4LVuhk9JF/r22qmVP9AMmOU4vMX7Q8pN8jwNg/CSpdFnMjTQ==", "integrity": "sha512-TyeJ1zif53BPfHootBGwPRYT1RUt6oGWsaQr8UyZW/eAm9bKoijtvruSDEmZHm92CwS9nj7/fWttqPCgzep8CA==",
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"es-errors": "^1.3.0",
"is-core-module": "^2.16.1", "is-core-module": "^2.16.1",
"path-parse": "^1.0.7", "path-parse": "^1.0.7",
"supports-preserve-symlinks-flag": "^1.0.0" "supports-preserve-symlinks-flag": "^1.0.0"
@@ -21487,113 +22080,22 @@
} }
}, },
"node_modules/tailwindcss": { "node_modules/tailwindcss": {
"version": "3.4.19", "version": "4.2.4",
"resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.4.19.tgz", "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-4.2.4.tgz",
"integrity": "sha512-3ofp+LL8E+pK/JuPLPggVAIaEuhvIz4qNcf3nA1Xn2o/7fb7s/TYpHhwGDv1ZU3PkBluUVaF8PyCHcm48cKLWQ==", "integrity": "sha512-HhKppgO81FQof5m6TEnuBWCZGgfRAWbaeOaGT00KOy/Pf/j6oUihdvBpA7ltCeAvZpFhW3j0PTclkxsd4IXYDA==",
"license": "MIT", "license": "MIT"
"dependencies": {
"@alloc/quick-lru": "^5.2.0",
"arg": "^5.0.2",
"chokidar": "^3.6.0",
"didyoumean": "^1.2.2",
"dlv": "^1.1.3",
"fast-glob": "^3.3.2",
"glob-parent": "^6.0.2",
"is-glob": "^4.0.3",
"jiti": "^1.21.7",
"lilconfig": "^3.1.3",
"micromatch": "^4.0.8",
"normalize-path": "^3.0.0",
"object-hash": "^3.0.0",
"picocolors": "^1.1.1",
"postcss": "^8.4.47",
"postcss-import": "^15.1.0",
"postcss-js": "^4.0.1",
"postcss-load-config": "^4.0.2 || ^5.0 || ^6.0",
"postcss-nested": "^6.2.0",
"postcss-selector-parser": "^6.1.2",
"resolve": "^1.22.8",
"sucrase": "^3.35.0"
},
"bin": {
"tailwind": "lib/cli.js",
"tailwindcss": "lib/cli.js"
},
"engines": {
"node": ">=14.0.0"
}
}, },
"node_modules/tailwindcss/node_modules/chokidar": { "node_modules/tapable": {
"version": "3.6.0", "version": "2.3.3",
"resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.6.0.tgz", "resolved": "https://registry.npmjs.org/tapable/-/tapable-2.3.3.tgz",
"integrity": "sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==", "integrity": "sha512-uxc/zpqFg6x7C8vOE7lh6Lbda8eEL9zmVm/PLeTPBRhh1xCgdWaQ+J1CUieGpIfm2HdtsUpRv+HshiasBMcc6A==",
"license": "MIT", "license": "MIT",
"dependencies": {
"anymatch": "~3.1.2",
"braces": "~3.0.2",
"glob-parent": "~5.1.2",
"is-binary-path": "~2.1.0",
"is-glob": "~4.0.1",
"normalize-path": "~3.0.0",
"readdirp": "~3.6.0"
},
"engines": { "engines": {
"node": ">= 8.10.0" "node": ">=6"
}, },
"funding": { "funding": {
"url": "https://paulmillr.com/funding/" "type": "opencollective",
}, "url": "https://opencollective.com/webpack"
"optionalDependencies": {
"fsevents": "~2.3.2"
}
},
"node_modules/tailwindcss/node_modules/chokidar/node_modules/glob-parent": {
"version": "5.1.2",
"resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
"integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
"license": "ISC",
"dependencies": {
"is-glob": "^4.0.1"
},
"engines": {
"node": ">= 6"
}
},
"node_modules/tailwindcss/node_modules/picomatch": {
"version": "2.3.1",
"resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz",
"integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==",
"license": "MIT",
"engines": {
"node": ">=8.6"
},
"funding": {
"url": "https://github.com/sponsors/jonschlinkert"
}
},
"node_modules/tailwindcss/node_modules/postcss-selector-parser": {
"version": "6.1.2",
"resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.1.2.tgz",
"integrity": "sha512-Q8qQfPiZ+THO/3ZrOrO0cJJKfpYCagtMUkXbnEfmgUjwXg6z/WBeOyS9APBBPCTSiDV+s4SwQGu8yFsiMRIudg==",
"license": "MIT",
"dependencies": {
"cssesc": "^3.0.0",
"util-deprecate": "^1.0.2"
},
"engines": {
"node": ">=4"
}
},
"node_modules/tailwindcss/node_modules/readdirp": {
"version": "3.6.0",
"resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz",
"integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==",
"license": "MIT",
"dependencies": {
"picomatch": "^2.2.1"
},
"engines": {
"node": ">=8.10.0"
} }
}, },
"node_modules/tar-fs": { "node_modules/tar-fs": {
+2
View File
@@ -11,8 +11,10 @@
}, },
"dependencies": { "dependencies": {
"@astrojs/mdx": "^4.3.13", "@astrojs/mdx": "^4.3.13",
"@tailwindcss/vite": "^4.2.4",
"@tinacms/cli": "^2.1.2", "@tinacms/cli": "^2.1.2",
"astro": "^5.16.16", "astro": "^5.16.16",
"tailwindcss": "^4.2.4",
"tinacms": "^3.3.2" "tinacms": "^3.3.2"
} }
} }
+5 -89
View File
@@ -12,14 +12,14 @@ const navItems = [
]; ];
--- ---
<nav class="anchor-nav" id="anchor-nav"> <nav class="anchor-nav bg-[#2b2b56] py-4 md:py-3 transition-all duration-300 z-[100] shadow-[0_2px_5px_rgba(0,0,0,0.1)] [&.sticky]:sticky [&.sticky]:top-0 [&.sticky]:shadow-[0_2px_10px_rgba(0,0,0,0.3)]" id="anchor-nav">
<div class="nav-container"> <div class="max-w-[--max-width-container] mx-auto px-[--spacing-md]">
<ul class="nav-list"> <ul class="list-none m-0 p-0 flex flex-wrap justify-center gap-2 md:gap-1">
{navItems.map((item) => ( {navItems.map((item) => (
<li class="nav-item"> <li class="m-0">
<a <a
href={`#${item.id}`} href={`#${item.id}`}
class="nav-link" class="nav-link block text-white no-underline py-2 px-4 md:py-1.5 md:px-3 rounded transition-all duration-300 text-sm md:text-[0.85rem] font-medium whitespace-nowrap hover:bg-white/20 hover:-translate-y-0.5 [&.active]:bg-white/30 [&.active]:font-bold"
data-section={item.id} data-section={item.id}
> >
<span class="nav-label-de" data-lang="de">{item.label_de}</span> <span class="nav-label-de" data-lang="de">{item.label_de}</span>
@@ -93,87 +93,3 @@ const navItems = [
lastScroll = currentScroll; lastScroll = currentScroll;
}); });
</script> </script>
<style>
.anchor-nav {
background: #2b2b56;
padding: 1rem 0;
transition: all 0.3s ease;
z-index: 100;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}
.anchor-nav.sticky {
position: sticky;
top: 0;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
}
.nav-container {
max-width: var(--max-width);
margin: 0 auto;
padding: 0 var(--spacing-md);
}
.nav-list {
list-style: none;
margin: 0;
padding: 0;
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 0.5rem;
}
.nav-item {
margin: 0;
}
.nav-link {
display: block;
color: white;
text-decoration: none;
padding: 0.5rem 1rem;
border-radius: 4px;
transition: all 0.3s ease;
font-size: 0.95rem;
font-weight: 500;
white-space: nowrap;
}
.nav-link:hover {
background: rgba(255, 255, 255, 0.2);
transform: translateY(-2px);
}
.nav-link.active {
background: rgba(255, 255, 255, 0.3);
font-weight: 700;
}
/* Language-specific labels */
:global([data-language="de"]) .nav-label-en,
:global([data-language="en"]) .nav-label-de {
display: none;
}
:global([data-language="de"]) .nav-label-de,
:global([data-language="en"]) .nav-label-en {
display: inline;
}
@media (max-width: 768px) {
.nav-list {
gap: 0.25rem;
}
.nav-link {
padding: 0.4rem 0.75rem;
font-size: 0.85rem;
}
.anchor-nav {
padding: 0.75rem 0;
}
}
</style>
+4 -46
View File
@@ -6,17 +6,17 @@ interface Props {
const { currentLang } = Astro.props; const { currentLang } = Astro.props;
--- ---
<div class="language-switcher"> <div class="flex items-center gap-2">
<button <button
class="lang-btn" class="lang-btn bg-transparent border-none text-white text-base md:text-sm font-medium cursor-pointer p-2 transition-all duration-300 opacity-60 hover:opacity-100 hover:scale-110 data-[active=true]:opacity-100 data-[active=true]:font-bold data-[active=true]:underline"
data-lang="de" data-lang="de"
data-active={currentLang === 'de'} data-active={currentLang === 'de'}
> >
DE DE
</button> </button>
<span class="separator">|</span> <span class="text-white opacity-40">|</span>
<button <button
class="lang-btn" class="lang-btn bg-transparent border-none text-white text-base md:text-sm font-medium cursor-pointer p-2 transition-all duration-300 opacity-60 hover:opacity-100 hover:scale-110 data-[active=true]:opacity-100 data-[active=true]:font-bold data-[active=true]:underline"
data-lang="en" data-lang="en"
data-active={currentLang === 'en'} data-active={currentLang === 'en'}
> >
@@ -53,45 +53,3 @@ const { currentLang } = Astro.props;
}); });
} }
</script> </script>
<style>
.language-switcher {
display: flex;
align-items: center;
gap: 0.5rem;
}
.lang-btn {
background: none;
border: none;
color: white;
font-size: 1rem;
font-weight: 500;
cursor: pointer;
padding: 0.5rem;
transition: all 0.3s ease;
opacity: 0.6;
}
.lang-btn:hover {
opacity: 1;
transform: scale(1.1);
}
.lang-btn[data-active="true"] {
opacity: 1;
font-weight: 700;
text-decoration: underline;
}
.separator {
color: white;
opacity: 0.4;
}
@media (max-width: 768px) {
.lang-btn {
font-size: 0.9rem;
}
}
</style>
+6 -71
View File
@@ -7,81 +7,16 @@ const { images } = Astro.props;
--- ---
{images && images.length > 0 ? ( {images && images.length > 0 ? (
<div class="photo-gallery"> <div class="grid grid-cols-[repeat(auto-fill,minmax(300px,1fr))] md:grid-cols-[repeat(auto-fill,minmax(200px,1fr))] gap-[--spacing-md] md:gap-[--spacing-sm] mt-[--spacing-lg]">
{images.map((image) => ( {images.map((image) => (
<div class="gallery-item"> <div class="relative overflow-hidden rounded-lg shadow-[0_4px_10px_rgba(0,0,0,0.2)] transition-all duration-300 aspect-[4/3] hover:-translate-y-1 hover:shadow-[0_8px_20px_rgba(0,0,0,0.3)] group">
<img src={image} alt="Theater photo" loading="lazy" /> <img src={image} alt="Theater photo" loading="lazy" class="w-full h-full object-cover transition-transform duration-300 group-hover:scale-105" />
</div> </div>
))} ))}
</div> </div>
) : ( ) : (
<div class="placeholder"> <div class="text-center p-[--spacing-xl] bg-white/10 rounded-lg italic">
<p class="placeholder-de" data-lang="de">Fotos werden bald hinzugefügt. Besuchen Sie uns später wieder!</p> <p class="placeholder-de m-0 text-lg" data-lang="de">Fotos werden bald hinzugefügt. Besuchen Sie uns später wieder!</p>
<p class="placeholder-en" data-lang="en">Photos will be added soon. Check back later!</p> <p class="placeholder-en m-0 text-lg" data-lang="en">Photos will be added soon. Check back later!</p>
</div> </div>
)} )}
<style>
.photo-gallery {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
gap: var(--spacing-md);
margin-top: var(--spacing-lg);
}
.gallery-item {
position: relative;
overflow: hidden;
border-radius: 8px;
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
transition: transform 0.3s ease, box-shadow 0.3s ease;
aspect-ratio: 4 / 3;
}
.gallery-item:hover {
transform: translateY(-5px);
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3);
}
.gallery-item img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.3s ease;
}
.gallery-item:hover img {
transform: scale(1.05);
}
.placeholder {
text-align: center;
padding: var(--spacing-xl);
background: rgba(255, 255, 255, 0.1);
border-radius: 8px;
font-style: italic;
}
.placeholder p {
margin: 0;
font-size: 1.1rem;
}
/* Language-specific placeholders */
:global([data-language="de"]) .placeholder-en,
:global([data-language="en"]) .placeholder-de {
display: none;
}
:global([data-language="de"]) .placeholder-de,
:global([data-language="en"]) .placeholder-en {
display: block;
}
@media (max-width: 768px) {
.photo-gallery {
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
gap: var(--spacing-sm);
}
}
</style>
+4 -66
View File
@@ -9,76 +9,14 @@ interface Props {
const { id, titleDe, titleEn, variant = 'light' } = Astro.props; const { id, titleDe, titleEn, variant = 'light' } = Astro.props;
--- ---
<section class={`theater-section ${variant}`} id={id}> <section class={`theater-section py-12 px-4 md:py-20 md:px-16 scroll-mt-[100px] ${variant === 'light' ? 'bg-[#3d3d6f]' : 'bg-primary'} text-white`} id={id}>
<div class="container"> <div class="max-w-7xl mx-auto">
<h2 class="section-title"> <h2 class="font-heading text-4xl md:text-6xl mb-8 text-center font-normal text-white [text-shadow:2px_2px_4px_rgba(0,0,0,0.3)]">
<span class="title-de" data-lang="de">{titleDe}</span> <span class="title-de" data-lang="de">{titleDe}</span>
<span class="title-en" data-lang="en">{titleEn}</span> <span class="title-en" data-lang="en">{titleEn}</span>
</h2> </h2>
<div class="section-content"> <div class="section-content text-lg md:text-base leading-relaxed">
<slot /> <slot />
</div> </div>
</div> </div>
</section> </section>
<style>
.theater-section {
padding: var(--spacing-xl) var(--spacing-md);
scroll-margin-top: 100px;
}
.theater-section.light {
background: #3d3d6f;
color: white;
}
.theater-section.dark {
background: #2b2b56;
color: white;
}
.container {
max-width: var(--max-width);
margin: 0 auto;
}
.section-title {
font-family: 'Great Vibes', cursive;
font-size: 3.5rem;
margin-bottom: var(--spacing-lg);
text-align: center;
font-weight: 400;
color: white;
text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
}
.section-content {
font-size: 1.1rem;
line-height: 1.8;
}
/* Language-specific titles */
:global([data-language="de"]) .title-en,
:global([data-language="en"]) .title-de {
display: none;
}
:global([data-language="de"]) .title-de,
:global([data-language="en"]) .title-en {
display: inline;
}
@media (max-width: 768px) {
.theater-section {
padding: var(--spacing-lg) var(--spacing-sm);
}
.section-title {
font-size: 2.5rem;
}
.section-content {
font-size: 1rem;
}
}
</style>
+6 -79
View File
@@ -1,4 +1,6 @@
--- ---
import '../styles/global.css';
interface Props { interface Props {
title: string; title: string;
description?: string; description?: string;
@@ -28,90 +30,15 @@ const { title, description = "Theater Ziefen - Coming 2029" } = Astro.props;
</script> </script>
</head> </head>
<body> <body>
<main class="main"> <main class="min-h-[calc(100vh-200px)]">
<slot /> <slot />
</main> </main>
<footer class="footer"> <footer class="bg-[#2b2b56] text-white py-[--spacing-md] text-center mt-[--spacing-xl] border-t-2 border-white/10">
<div class="container"> <div class="max-w-[--max-width-container] mx-auto px-[--spacing-md] md:px-[--spacing-md] px-[--spacing-sm]">
<p>&copy; {new Date().getFullYear()} Theater Ziefen. All rights reserved.</p> <p>&copy; {new Date().getFullYear()} Theater Ziefen. All rights reserved.</p>
<p class="footer-tagline">Coming 2029</p> <p class="mt-[--spacing-xs] text-[--color-accent] font-semibold opacity-90">Coming 2029</p>
</div> </div>
</footer> </footer>
<style>
:root {
--color-primary: #2b2b56;
--color-secondary: #2d4a54;
--color-accent: #f9f871;
--color-text: #333;
--color-text-light: #666;
--color-bg: #ffffff;
--color-bg-alt: #fafaf5;
--spacing-xs: 0.5rem;
--spacing-sm: 1rem;
--spacing-md: 2rem;
--spacing-lg: 3rem;
--spacing-xl: 4rem;
--max-width: 1200px;
}
* {
box-sizing: border-box;
margin: 0;
padding: 0;
}
html {
scroll-behavior: smooth;
}
body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
color: white;
line-height: 1.6;
background-color: #2b2b56;
}
h1, h2, h3, h4, h5, h6 {
font-family: 'Great Vibes', cursive;
font-weight: 400;
}
.container {
max-width: var(--max-width);
margin: 0 auto;
padding: 0 var(--spacing-md);
}
/* Main Content */
.main {
min-height: calc(100vh - 200px);
}
/* Footer Styles */
.footer {
background-color: #2b2b56;
color: white;
padding: var(--spacing-md) 0;
text-align: center;
margin-top: var(--spacing-xl);
border-top: 2px solid rgba(255, 255, 255, 0.1);
}
.footer-tagline {
margin-top: var(--spacing-xs);
color: var(--color-accent);
font-weight: 600;
opacity: 0.9;
}
/* Responsive Design */
@media (max-width: 768px) {
.container {
padding: 0 var(--spacing-sm);
}
}
</style>
</body> </body>
</html> </html>
+57 -466
View File
@@ -1,6 +1,5 @@
--- ---
import BaseLayout from '../layouts/BaseLayout.astro'; import BaseLayout from '../layouts/BaseLayout.astro';
import LanguageSwitcher from '../components/LanguageSwitcher.astro';
import AnchorNav from '../components/AnchorNav.astro'; import AnchorNav from '../components/AnchorNav.astro';
import TheaterSection from '../components/TheaterSection.astro'; import TheaterSection from '../components/TheaterSection.astro';
import PhotoGallery from '../components/PhotoGallery.astro'; import PhotoGallery from '../components/PhotoGallery.astro';
@@ -40,34 +39,29 @@ function renderRichText(richText: any, lang: 'de' | 'en'): string {
--- ---
<BaseLayout title={content.title || 'Freilichttheater Ziefen 2028'}> <BaseLayout title={content.title || 'Freilichttheater Ziefen 2028'}>
<!-- Anchor Navigation -->
<AnchorNav />
<!-- Hero Section --> <!-- Hero Section -->
<div class="hero"> <div class="bg-[#2b2b56] text-white py-12 pb-24 md:py-8 md:pb-16 relative overflow-hidden min-h-[500px] md:min-h-[400px]">
<div class="container"> <div class="max-w-[--max-width-container] mx-auto px-[--spacing-md] md:px-[--spacing-sm]">
<div class="hero-wrapper"> <div class="relative min-96 md:min-h-80">
<div class="hero-language"> <img src="/logo.svg" alt="Theater Ziefen Logo" class="absolute h-full right-2 md:right-10 opacity-95 z-[5] md:opacity-70" />
<LanguageSwitcher currentLang="de" /> <div class="relative z-8 pt-16 pl-12 md:pt-24 md:pl-16 text-left md:max-w-full">
</div> <h1 class="text-8xl md:text-5xl font-normal mb-6 md:mb-4 leading-[1.3] [text-shadow:2px_2px_4px_rgba(0,0,0,0.3)]">
<img src="/logo.svg" alt="Theater Ziefen Logo" class="hero-logo" />
<div class="hero-content">
<h1 class="hero-title">
<span class="title-de" data-lang="de">{content.hero?.title_de || 'Freilichttheater in Ziefen'}</span> <span class="title-de" data-lang="de">{content.hero?.title_de || 'Freilichttheater in Ziefen'}</span>
<span class="title-en" data-lang="en">{content.hero?.title_en || 'Open-Air Theater in Ziefen'}</span> <span class="title-en" data-lang="en">{content.hero?.title_en || 'Open-Air Theater in Ziefen'}</span>
</h1> </h1>
<p class="hero-subtitle"> <p class="text-xl md:text-lg leading-relaxed mb-8 md:mb-6 opacity-95 max-w-2xl">
<span class="subtitle-de" data-lang="de">{content.hero?.subtitle_de || ''}</span> <span class="subtitle-de" data-lang="de">{content.hero?.subtitle_de || ''}</span>
<span class="subtitle-en" data-lang="en">{content.hero?.subtitle_en || ''}</span> <span class="subtitle-en" data-lang="en">{content.hero?.subtitle_en || ''}</span>
</p> </p>
<div class="hero-year">2028</div> <div class="font-heading text-8xl md:text-6xl font-normal text-accent [text-shadow:3px_3px_6px_rgba(0,0,0,0.4)] mt-4">2028</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<!-- Anchor Navigation -->
<AnchorNav />
<!-- Section 1: Das Projekt --> <!-- Section 1: Das Projekt -->
<TheaterSection <TheaterSection
id="projekt" id="projekt"
@@ -90,14 +84,36 @@ function renderRichText(richText: any, lang: 'de' | 'en'): string {
<div class="content-en" data-lang="en" set:html={renderRichText(content.team?.content_en, 'en')} /> <div class="content-en" data-lang="en" set:html={renderRichText(content.team?.content_en, 'en')} />
{content.team?.organizations && content.team.organizations.length > 0 && ( {content.team?.organizations && content.team.organizations.length > 0 && (
<div class="organizations"> <div class="grid grid-cols-1 md:grid-cols-[repeat(auto-fit,minmax(250px,1fr))] gap-12 mt-16">
{content.team.organizations.map((org: any) => ( {content.team.organizations.map((org: any) => {
<div class="org-card"> const CardContent = () => (
<h3>{org.name}</h3> <>
<p class="org-role-de" data-lang="de">{org.role_de}</p> {org.logo && (
<p class="org-role-en" data-lang="en">{org.role_en}</p> <div class="mb-4 flex justify-center">
</div> <img src={org.logo} alt={`${org.name} logo`} class="h-20 w-auto object-contain" />
))} </div>
)}
<h3 class="text-3xl mb-2 text-white">{org.name}</h3>
<p class="org-role-de m-0 opacity-90" data-lang="de">{org.role_de}</p>
<p class="org-role-en m-0 opacity-90" data-lang="en">{org.role_en}</p>
</>
);
return org.url ? (
<a
href={org.url}
target="_blank"
rel="noopener noreferrer"
class="block bg-white/10 p-12 rounded-lg text-center transition-all duration-300 hover:-translate-y-1 hover:bg-white/15 no-underline text-white hover:shadow-lg"
>
<CardContent />
</a>
) : (
<div class="bg-white/10 p-12 rounded-lg text-center transition-all duration-300 hover:-translate-y-1 hover:bg-white/15">
<CardContent />
</div>
);
})}
</div> </div>
)} )}
</TheaterSection> </TheaterSection>
@@ -124,8 +140,8 @@ function renderRichText(richText: any, lang: 'de' | 'en'): string {
<div class="content-en" data-lang="en" set:html={renderRichText(content.mitwirkung?.content_en, 'en')} /> <div class="content-en" data-lang="en" set:html={renderRichText(content.mitwirkung?.content_en, 'en')} />
{content.mitwirkung?.director_name && ( {content.mitwirkung?.director_name && (
<div class="director-contact"> <div class="mt-16 p-12 bg-white/10 rounded-lg text-center">
<h3> <h3 class="text-3xl text-white mb-4">
<span data-lang="de">Kontakt Regisseur:</span> <span data-lang="de">Kontakt Regisseur:</span>
<span data-lang="en">Contact Director:</span> <span data-lang="en">Contact Director:</span>
</h3> </h3>
@@ -135,7 +151,7 @@ function renderRichText(richText: any, lang: 'de' | 'en'): string {
<span data-lang="de">E-Mail:</span> <span data-lang="de">E-Mail:</span>
<span data-lang="en">Email:</span> <span data-lang="en">Email:</span>
{' '} {' '}
<a href={`mailto:${content.mitwirkung.director_email}`}>{content.mitwirkung.director_email}</a> <a href={`mailto:${content.mitwirkung.director_email}`} class="text-accent no-underline hover:underline">{content.mitwirkung.director_email}</a>
</p> </p>
)} )}
{content.mitwirkung.director_phone && ( {content.mitwirkung.director_phone && (
@@ -143,7 +159,7 @@ function renderRichText(richText: any, lang: 'de' | 'en'): string {
<span data-lang="de">Telefon:</span> <span data-lang="de">Telefon:</span>
<span data-lang="en">Phone:</span> <span data-lang="en">Phone:</span>
{' '} {' '}
<a href={`tel:${content.mitwirkung.director_phone}`}>{content.mitwirkung.director_phone}</a> <a href={`tel:${content.mitwirkung.director_phone}`} class="text-accent no-underline hover:underline">{content.mitwirkung.director_phone}</a>
</p> </p>
)} )}
</div> </div>
@@ -157,13 +173,9 @@ function renderRichText(richText: any, lang: 'de' | 'en'): string {
titleEn={content.termine?.title_en || 'Schedule'} titleEn={content.termine?.title_en || 'Schedule'}
variant="light" variant="light"
> >
<div class="map-subtitle">
<span data-lang="de">Weite Wege mit Breitenstein</span>
<span data-lang="en">Long Paths with Breitenstein</span>
</div>
{content.termine?.events && content.termine.events.length > 0 && ( {content.termine?.events && content.termine.events.length > 0 && (
<div class="journey-map"> <div class="relative min-h-auto flex flex-col gap-16">
<svg class="journey-path" viewBox="0 0 1000 1000" preserveAspectRatio="xMidYMid meet"> <svg class="hidden md:flex absolute top-0 left-0 w-full h-full z-1 pointer-events-none" viewBox="0 0 1000 1000" preserveAspectRatio="xMidYMid meet">
<path <path
d="M 50,30 C 150,80 350,150 550,200 S 350,290 100,380 S 300,470 600,560 S 350,670 150,740 S 350,850 550,920" d="M 50,30 C 150,80 350,150 550,200 S 350,290 100,380 S 300,470 600,560 S 350,670 150,740 S 350,850 550,920"
fill="none" fill="none"
@@ -174,18 +186,18 @@ function renderRichText(richText: any, lang: 'de' | 'en'): string {
/> />
</svg> </svg>
{content.termine.events.map((event: any, index: number) => ( {content.termine.events.map((event: any, index: number) => (
<div class="journey-stop" style={`--stop-index: ${index}`} data-stop={index + 1}> <div class={`relative z-2 flex items-center gap-12 text-left ${(index + 1) % 2 === 0 ? 'flex-row-reverse text-right right-0' : 'left-0'}`}>
<div class="journey-marker"> <div class="flex flex-col items-center min-w-30 max-w-60 md:min-w-auto md:self-start">
<div class="marker-pin"></div> <div class="relative w-8 h-8 bg-accent rounded-full border-4 border-white shadow-[0_4px_10px_rgba(0,0,0,0.3)] after:content-[''] after:absolute after:-bottom-4 after:left-1/2 after:-translate-x-1/2 after:w-0 after:h-0 after:border-l-[10px] after:border-l-transparent after:border-r-[10px] after:border-r-transparent after:border-t-[15px] after:border-t-[--color-accent]"></div>
<div class="marker-label">{event.date}</div> <div class="mt-6 text-lg font-bold text-accent text-center whitespace-nowrap md:text-base">{event.date}</div>
</div> </div>
<div class="journey-card"> <div class="flex-1 bg-white/10 p-12 rounded-xl backdrop-blur-[10px] border-2 border-white/20 transition-all duration-300 hover:-translate-y-1 hover:bg-white/15 hover:shadow-[0_8px_20px_rgba(0,0,0,0.3)] max-w-full md:max-w-2xl">
<h3 class="event-title"> <h3 class="text-3xl mb-2 text-white md:text-2xl">
<span class="event-title-de" data-lang="de">{event.title_de}</span> <span class="event-title-de" data-lang="de">{event.title_de}</span>
<span class="event-title-en" data-lang="en">{event.title_en}</span> <span class="event-title-en" data-lang="en">{event.title_en}</span>
</h3> </h3>
<p class="event-desc-de" data-lang="de">{event.description_de}</p> <p class="event-desc-de m-0 text-white/90 leading-relaxed" data-lang="de">{event.description_de}</p>
<p class="event-desc-en" data-lang="en">{event.description_en}</p> <p class="event-desc-en m-0 text-white/90 leading-relaxed" data-lang="en">{event.description_en}</p>
</div> </div>
</div> </div>
))} ))}
@@ -225,8 +237,8 @@ function renderRichText(richText: any, lang: 'de' | 'en'): string {
<div class="content-en" data-lang="en" set:html={renderRichText(content.tickets?.content_en, 'en')} /> <div class="content-en" data-lang="en" set:html={renderRichText(content.tickets?.content_en, 'en')} />
{content.tickets?.ticket_url && ( {content.tickets?.ticket_url && (
<div class="ticket-cta"> <div class="mt-[--spacing-lg] text-center">
<a href={content.tickets.ticket_url} class="btn btn-primary" target="_blank" rel="noopener noreferrer"> <a href={content.tickets.ticket_url} class="inline-block py-4 px-10 bg-accent text-secondary no-underline font-bold text-xl rounded-lg transition-all duration-300 shadow-[0_4px_10px_rgba(0,0,0,0.2)] hover:-translate-y-1 hover:shadow-[0_6px_15px_rgba(0,0,0,0.3)] hover:bg-[#fbfa9a]" target="_blank" rel="noopener noreferrer">
<span data-lang="de">Tickets kaufen</span> <span data-lang="de">Tickets kaufen</span>
<span data-lang="en">Buy Tickets</span> <span data-lang="en">Buy Tickets</span>
</a> </a>
@@ -234,424 +246,3 @@ function renderRichText(richText: any, lang: 'de' | 'en'): string {
)} )}
</TheaterSection> </TheaterSection>
</BaseLayout> </BaseLayout>
<style>
/* Hero Section */
.hero {
background: #2b2b56;
color: white;
padding: 3rem 0 6rem;
position: relative;
overflow: hidden;
min-height: 500px;
}
.hero-wrapper {
position: relative;
min-height: 400px;
}
.hero-language {
position: absolute;
top: 0;
left: 0;
z-index: 10;
}
.hero-logo {
position: absolute;
top: -40px;
right: -60px;
height: 500px;
width: auto;
opacity: 0.95;
z-index: 5;
}
.hero-content {
position: relative;
z-index: 8;
max-width: 850px;
padding-top: 4rem;
padding-left: 3rem;
text-align: left;
}
.hero-title {
font-size: 4.5rem;
font-weight: 400;
margin-bottom: 1.5rem;
text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
line-height: 1.3;
}
.hero-subtitle {
font-size: 1.3rem;
line-height: 1.6;
margin-bottom: 2rem;
opacity: 0.95;
}
.hero-year {
font-family: 'Great Vibes', cursive;
font-size: 6rem;
font-weight: 400;
color: var(--color-accent);
text-shadow: 3px 3px 6px rgba(0, 0, 0, 0.4);
margin-top: 1rem;
}
/* Language-specific content */
:global([data-language="de"]) .title-en,
:global([data-language="de"]) .subtitle-en,
:global([data-language="de"]) .content-en,
:global([data-language="de"]) .org-role-en,
:global([data-language="de"]) .event-title-en,
:global([data-language="de"]) .event-desc-en,
:global([data-language="de"]) [data-lang="en"] {
display: none !important;
}
:global([data-language="en"]) .title-de,
:global([data-language="en"]) .subtitle-de,
:global([data-language="en"]) .content-de,
:global([data-language="en"]) .org-role-de,
:global([data-language="en"]) .event-title-de,
:global([data-language="en"]) .event-desc-de,
:global([data-language="en"]) [data-lang="de"] {
display: none !important;
}
/* Organizations Grid */
.organizations {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
gap: var(--spacing-md);
margin-top: var(--spacing-lg);
}
.org-card {
background: rgba(255, 255, 255, 0.1);
padding: var(--spacing-md);
border-radius: 8px;
text-align: center;
transition: transform 0.3s ease, background 0.3s ease;
}
.org-card:hover {
transform: translateY(-5px);
background: rgba(255, 255, 255, 0.15);
}
.org-card h3 {
font-family: 'Great Vibes', cursive;
font-size: 2rem;
margin-bottom: 0.5rem;
color: white;
font-weight: 400;
}
.org-card p {
margin: 0;
opacity: 0.9;
}
/* Director Contact */
.director-contact {
margin-top: var(--spacing-lg);
padding: var(--spacing-md);
background: rgba(255, 255, 255, 0.1);
border-radius: 8px;
text-align: center;
}
.director-contact h3 {
font-family: 'Great Vibes', cursive;
font-size: 2rem;
color: white;
margin-bottom: 1rem;
font-weight: 400;
}
.director-contact a {
color: var(--color-accent);
text-decoration: none;
}
.director-contact a:hover {
text-decoration: underline;
}
/* Journey Map */
.map-subtitle {
font-family: 'Great Vibes', cursive;
font-size: 2.5rem;
text-align: center;
color: var(--color-accent);
margin-bottom: var(--spacing-lg);
font-weight: 400;
}
.journey-map {
position: relative;
margin-top: var(--spacing-xl);
padding: 2rem 0;
min-height: 1400px;
}
.journey-path {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1;
pointer-events: none;
}
.journey-stop {
position: absolute;
z-index: 2;
display: flex;
align-items: flex-start;
gap: 3rem;
text-align: left;
}
.journey-stop[data-stop="2"],
.journey-stop[data-stop="3"],
.journey-stop[data-stop="5"],
.journey-stop[data-stop="6"] {
text-align: right;
}
/* Position stops in structured layout - path will follow these */
.journey-stop[data-stop="1"] {
top: 3%;
left: 5%;
}
.journey-stop[data-stop="2"] {
top: 20%;
left: 55%;
flex-direction: row-reverse;
}
.journey-stop[data-stop="3"] {
top: 38%;
left: 10%;
}
.journey-stop[data-stop="4"] {
top: 56%;
left: 60%;
flex-direction: row-reverse;
}
.journey-stop[data-stop="5"] {
top: 74%;
left: 15%;
}
.journey-stop[data-stop="6"] {
top: 92%;
left: 55%;
flex-direction: row-reverse;
}
.journey-marker {
display: flex;
flex-direction: column;
align-items: center;
min-width: 120px;
}
.marker-pin {
width: 30px;
height: 30px;
background: var(--color-accent);
border-radius: 50%;
border: 4px solid white;
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
position: relative;
}
.marker-pin::after {
content: '';
position: absolute;
bottom: -15px;
left: 50%;
transform: translateX(-50%);
width: 0;
height: 0;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-top: 15px solid var(--color-accent);
}
.marker-label {
margin-top: 1.5rem;
font-size: 1.1rem;
font-weight: 700;
color: var(--color-accent);
text-align: center;
white-space: nowrap;
}
.journey-card {
flex: 1;
background: rgba(255, 255, 255, 0.1);
padding: var(--spacing-md);
border-radius: 12px;
backdrop-filter: blur(10px);
border: 2px solid rgba(255, 255, 255, 0.2);
transition: all 0.3s ease;
max-width: 500px;
}
.journey-card:hover {
transform: translateY(-5px);
background: rgba(255, 255, 255, 0.15);
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3);
}
.journey-card h3 {
font-family: 'Great Vibes', cursive;
font-size: 2rem;
margin-bottom: 0.5rem;
color: white;
font-weight: 400;
}
.journey-card p {
margin: 0;
color: rgba(255, 255, 255, 0.9);
line-height: 1.6;
}
/* Ticket CTA */
.ticket-cta {
margin-top: var(--spacing-lg);
text-align: center;
}
.btn {
display: inline-block;
padding: 1rem 2.5rem;
background: var(--color-accent);
color: var(--color-secondary);
text-decoration: none;
font-weight: 700;
font-size: 1.2rem;
border-radius: 8px;
transition: all 0.3s ease;
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
}
.btn:hover {
transform: translateY(-3px);
box-shadow: 0 6px 15px rgba(0, 0, 0, 0.3);
background: #fbfa9a;
}
/* Content Styling */
:global(.section-content p) {
margin-bottom: 1rem;
}
:global(.section-content h3) {
font-size: 1.8rem;
margin: 1.5rem 0 1rem;
}
/* Mobile Responsiveness */
@media (max-width: 768px) {
.hero {
padding: 2rem 0 4rem;
min-height: 400px;
}
.hero-wrapper {
min-height: 350px;
}
.hero-language {
position: static;
margin-bottom: 1rem;
}
.hero-logo {
position: absolute;
top: 0;
right: -30px;
height: 200px;
opacity: 0.7;
}
.hero-content {
padding-top: 3rem;
padding-left: 1rem;
max-width: 100%;
text-align: left;
}
.hero-title {
font-size: 2.8rem;
margin-bottom: 1rem;
}
.hero-subtitle {
font-size: 1.1rem;
margin-bottom: 1.5rem;
}
.hero-year {
font-size: 4rem;
}
.organizations {
grid-template-columns: 1fr;
}
/* Journey Map Mobile */
.map-subtitle {
font-size: 2rem;
}
.journey-map {
min-height: auto;
display: flex;
flex-direction: column;
gap: var(--spacing-lg);
}
.journey-path {
display: none;
}
.journey-stop {
position: relative !important;
top: auto !important;
left: auto !important;
flex-direction: column !important;
text-align: left !important;
}
.journey-marker {
min-width: auto;
align-self: flex-start;
}
.marker-label {
font-size: 0.95rem;
}
.journey-card {
max-width: 100%;
}
.journey-card h3 {
font-size: 1.6rem;
}
}
</style>
+1 -1
View File
File diff suppressed because one or more lines are too long
+1 -1
View File
File diff suppressed because one or more lines are too long
+12
View File
@@ -231,6 +231,18 @@ var config_default = defineConfig({
type: "string", type: "string",
name: "role_en", name: "role_en",
label: "Role (English)" label: "Role (English)"
},
{
type: "image",
name: "logo",
label: "Logo",
description: "Organization logo image"
},
{
type: "string",
name: "url",
label: "Website URL",
description: "Organization website link"
} }
] ]
} }
+2
View File
@@ -42,6 +42,8 @@ fragment TheaterHomepageParts on TheaterHomepage {
name name
role_de role_de
role_en role_en
logo
url
} }
} }
stueck { stueck {
+6
View File
@@ -195,6 +195,8 @@ type TheaterHomepageTeamOrganizations {
name: String name: String
role_de: String role_de: String
role_en: String role_en: String
logo: String
url: String
} }
type TheaterHomepageTeam { type TheaterHomepageTeam {
@@ -291,6 +293,8 @@ input TheaterHomepageTeamOrganizationsFilter {
name: StringFilter name: StringFilter
role_de: StringFilter role_de: StringFilter
role_en: StringFilter role_en: StringFilter
logo: ImageFilter
url: StringFilter
} }
input TheaterHomepageTeamFilter { input TheaterHomepageTeamFilter {
@@ -436,6 +440,8 @@ input TheaterHomepageTeamOrganizationsMutation {
name: String name: String
role_de: String role_de: String
role_en: String role_en: String
logo: String
url: String
} }
input TheaterHomepageTeamMutation { input TheaterHomepageTeamMutation {
+11 -3
View File
@@ -312,6 +312,8 @@ export type TheaterHomepageTeamOrganizations = {
name?: Maybe<Scalars['String']['output']>; name?: Maybe<Scalars['String']['output']>;
role_de?: Maybe<Scalars['String']['output']>; role_de?: Maybe<Scalars['String']['output']>;
role_en?: Maybe<Scalars['String']['output']>; role_en?: Maybe<Scalars['String']['output']>;
logo?: Maybe<Scalars['String']['output']>;
url?: Maybe<Scalars['String']['output']>;
}; };
export type TheaterHomepageTeam = { export type TheaterHomepageTeam = {
@@ -417,6 +419,8 @@ export type TheaterHomepageTeamOrganizationsFilter = {
name?: InputMaybe<StringFilter>; name?: InputMaybe<StringFilter>;
role_de?: InputMaybe<StringFilter>; role_de?: InputMaybe<StringFilter>;
role_en?: InputMaybe<StringFilter>; role_en?: InputMaybe<StringFilter>;
logo?: InputMaybe<ImageFilter>;
url?: InputMaybe<StringFilter>;
}; };
export type TheaterHomepageTeamFilter = { export type TheaterHomepageTeamFilter = {
@@ -634,6 +638,8 @@ export type TheaterHomepageTeamOrganizationsMutation = {
name?: InputMaybe<Scalars['String']['input']>; name?: InputMaybe<Scalars['String']['input']>;
role_de?: InputMaybe<Scalars['String']['input']>; role_de?: InputMaybe<Scalars['String']['input']>;
role_en?: InputMaybe<Scalars['String']['input']>; role_en?: InputMaybe<Scalars['String']['input']>;
logo?: InputMaybe<Scalars['String']['input']>;
url?: InputMaybe<Scalars['String']['input']>;
}; };
export type TheaterHomepageTeamMutation = { export type TheaterHomepageTeamMutation = {
@@ -713,7 +719,7 @@ export type PostPartsFragment = { __typename: 'Post', title: string, date: strin
export type PagePartsFragment = { __typename: 'Page', title: string, description?: string | null, body: any }; export type PagePartsFragment = { __typename: 'Page', title: string, description?: string | null, body: any };
export type TheaterHomepagePartsFragment = { __typename: 'TheaterHomepage', title: string, hero?: { __typename: 'TheaterHomepageHero', title_de: string, title_en: string, subtitle_de: string, subtitle_en: string } | null, projekt?: { __typename: 'TheaterHomepageProjekt', title_de: string, title_en: string, content_de: any, content_en: any } | null, team?: { __typename: 'TheaterHomepageTeam', title_de: string, title_en: string, content_de: any, content_en: any, organizations?: Array<{ __typename: 'TheaterHomepageTeamOrganizations', name?: string | null, role_de?: string | null, role_en?: string | null } | null> | null } | null, stueck?: { __typename: 'TheaterHomepageStueck', title_de: string, title_en: string, content_de: any, content_en: any } | null, mitwirkung?: { __typename: 'TheaterHomepageMitwirkung', title_de: string, title_en: string, content_de: any, content_en: any, director_name?: string | null, director_email?: string | null, director_phone?: string | null } | null, termine?: { __typename: 'TheaterHomepageTermine', title_de: string, title_en: string, events?: Array<{ __typename: 'TheaterHomepageTermineEvents', title_de?: string | null, title_en?: string | null, date?: string | null, description_de?: string | null, description_en?: string | null } | null> | null } | null, presse?: { __typename: 'TheaterHomepagePresse', title_de: string, title_en: string, content_de: any, content_en: any } | null, gallery?: { __typename: 'TheaterHomepageGallery', title_de: string, title_en: string, images?: Array<string | null> | null } | null, tickets?: { __typename: 'TheaterHomepageTickets', title_de: string, title_en: string, content_de: any, content_en: any, ticket_url?: string | null } | null }; export type TheaterHomepagePartsFragment = { __typename: 'TheaterHomepage', title: string, hero?: { __typename: 'TheaterHomepageHero', title_de: string, title_en: string, subtitle_de: string, subtitle_en: string } | null, projekt?: { __typename: 'TheaterHomepageProjekt', title_de: string, title_en: string, content_de: any, content_en: any } | null, team?: { __typename: 'TheaterHomepageTeam', title_de: string, title_en: string, content_de: any, content_en: any, organizations?: Array<{ __typename: 'TheaterHomepageTeamOrganizations', name?: string | null, role_de?: string | null, role_en?: string | null, logo?: string | null, url?: string | null } | null> | null } | null, stueck?: { __typename: 'TheaterHomepageStueck', title_de: string, title_en: string, content_de: any, content_en: any } | null, mitwirkung?: { __typename: 'TheaterHomepageMitwirkung', title_de: string, title_en: string, content_de: any, content_en: any, director_name?: string | null, director_email?: string | null, director_phone?: string | null } | null, termine?: { __typename: 'TheaterHomepageTermine', title_de: string, title_en: string, events?: Array<{ __typename: 'TheaterHomepageTermineEvents', title_de?: string | null, title_en?: string | null, date?: string | null, description_de?: string | null, description_en?: string | null } | null> | null } | null, presse?: { __typename: 'TheaterHomepagePresse', title_de: string, title_en: string, content_de: any, content_en: any } | null, gallery?: { __typename: 'TheaterHomepageGallery', title_de: string, title_en: string, images?: Array<string | null> | null } | null, tickets?: { __typename: 'TheaterHomepageTickets', title_de: string, title_en: string, content_de: any, content_en: any, ticket_url?: string | null } | null };
export type PostQueryVariables = Exact<{ export type PostQueryVariables = Exact<{
relativePath: Scalars['String']['input']; relativePath: Scalars['String']['input'];
@@ -758,7 +764,7 @@ export type TheaterHomepageQueryVariables = Exact<{
}>; }>;
export type TheaterHomepageQuery = { __typename?: 'Query', theaterHomepage: { __typename: 'TheaterHomepage', id: string, title: string, _sys: { __typename?: 'SystemInfo', filename: string, basename: string, hasReferences?: boolean | null, breadcrumbs: Array<string>, path: string, relativePath: string, extension: string }, hero?: { __typename: 'TheaterHomepageHero', title_de: string, title_en: string, subtitle_de: string, subtitle_en: string } | null, projekt?: { __typename: 'TheaterHomepageProjekt', title_de: string, title_en: string, content_de: any, content_en: any } | null, team?: { __typename: 'TheaterHomepageTeam', title_de: string, title_en: string, content_de: any, content_en: any, organizations?: Array<{ __typename: 'TheaterHomepageTeamOrganizations', name?: string | null, role_de?: string | null, role_en?: string | null } | null> | null } | null, stueck?: { __typename: 'TheaterHomepageStueck', title_de: string, title_en: string, content_de: any, content_en: any } | null, mitwirkung?: { __typename: 'TheaterHomepageMitwirkung', title_de: string, title_en: string, content_de: any, content_en: any, director_name?: string | null, director_email?: string | null, director_phone?: string | null } | null, termine?: { __typename: 'TheaterHomepageTermine', title_de: string, title_en: string, events?: Array<{ __typename: 'TheaterHomepageTermineEvents', title_de?: string | null, title_en?: string | null, date?: string | null, description_de?: string | null, description_en?: string | null } | null> | null } | null, presse?: { __typename: 'TheaterHomepagePresse', title_de: string, title_en: string, content_de: any, content_en: any } | null, gallery?: { __typename: 'TheaterHomepageGallery', title_de: string, title_en: string, images?: Array<string | null> | null } | null, tickets?: { __typename: 'TheaterHomepageTickets', title_de: string, title_en: string, content_de: any, content_en: any, ticket_url?: string | null } | null } }; export type TheaterHomepageQuery = { __typename?: 'Query', theaterHomepage: { __typename: 'TheaterHomepage', id: string, title: string, _sys: { __typename?: 'SystemInfo', filename: string, basename: string, hasReferences?: boolean | null, breadcrumbs: Array<string>, path: string, relativePath: string, extension: string }, hero?: { __typename: 'TheaterHomepageHero', title_de: string, title_en: string, subtitle_de: string, subtitle_en: string } | null, projekt?: { __typename: 'TheaterHomepageProjekt', title_de: string, title_en: string, content_de: any, content_en: any } | null, team?: { __typename: 'TheaterHomepageTeam', title_de: string, title_en: string, content_de: any, content_en: any, organizations?: Array<{ __typename: 'TheaterHomepageTeamOrganizations', name?: string | null, role_de?: string | null, role_en?: string | null, logo?: string | null, url?: string | null } | null> | null } | null, stueck?: { __typename: 'TheaterHomepageStueck', title_de: string, title_en: string, content_de: any, content_en: any } | null, mitwirkung?: { __typename: 'TheaterHomepageMitwirkung', title_de: string, title_en: string, content_de: any, content_en: any, director_name?: string | null, director_email?: string | null, director_phone?: string | null } | null, termine?: { __typename: 'TheaterHomepageTermine', title_de: string, title_en: string, events?: Array<{ __typename: 'TheaterHomepageTermineEvents', title_de?: string | null, title_en?: string | null, date?: string | null, description_de?: string | null, description_en?: string | null } | null> | null } | null, presse?: { __typename: 'TheaterHomepagePresse', title_de: string, title_en: string, content_de: any, content_en: any } | null, gallery?: { __typename: 'TheaterHomepageGallery', title_de: string, title_en: string, images?: Array<string | null> | null } | null, tickets?: { __typename: 'TheaterHomepageTickets', title_de: string, title_en: string, content_de: any, content_en: any, ticket_url?: string | null } | null } };
export type TheaterHomepageConnectionQueryVariables = Exact<{ export type TheaterHomepageConnectionQueryVariables = Exact<{
before?: InputMaybe<Scalars['String']['input']>; before?: InputMaybe<Scalars['String']['input']>;
@@ -770,7 +776,7 @@ export type TheaterHomepageConnectionQueryVariables = Exact<{
}>; }>;
export type TheaterHomepageConnectionQuery = { __typename?: 'Query', theaterHomepageConnection: { __typename?: 'TheaterHomepageConnection', totalCount: number, pageInfo: { __typename?: 'PageInfo', hasPreviousPage: boolean, hasNextPage: boolean, startCursor: string, endCursor: string }, edges?: Array<{ __typename?: 'TheaterHomepageConnectionEdges', cursor: string, node?: { __typename: 'TheaterHomepage', id: string, title: string, _sys: { __typename?: 'SystemInfo', filename: string, basename: string, hasReferences?: boolean | null, breadcrumbs: Array<string>, path: string, relativePath: string, extension: string }, hero?: { __typename: 'TheaterHomepageHero', title_de: string, title_en: string, subtitle_de: string, subtitle_en: string } | null, projekt?: { __typename: 'TheaterHomepageProjekt', title_de: string, title_en: string, content_de: any, content_en: any } | null, team?: { __typename: 'TheaterHomepageTeam', title_de: string, title_en: string, content_de: any, content_en: any, organizations?: Array<{ __typename: 'TheaterHomepageTeamOrganizations', name?: string | null, role_de?: string | null, role_en?: string | null } | null> | null } | null, stueck?: { __typename: 'TheaterHomepageStueck', title_de: string, title_en: string, content_de: any, content_en: any } | null, mitwirkung?: { __typename: 'TheaterHomepageMitwirkung', title_de: string, title_en: string, content_de: any, content_en: any, director_name?: string | null, director_email?: string | null, director_phone?: string | null } | null, termine?: { __typename: 'TheaterHomepageTermine', title_de: string, title_en: string, events?: Array<{ __typename: 'TheaterHomepageTermineEvents', title_de?: string | null, title_en?: string | null, date?: string | null, description_de?: string | null, description_en?: string | null } | null> | null } | null, presse?: { __typename: 'TheaterHomepagePresse', title_de: string, title_en: string, content_de: any, content_en: any } | null, gallery?: { __typename: 'TheaterHomepageGallery', title_de: string, title_en: string, images?: Array<string | null> | null } | null, tickets?: { __typename: 'TheaterHomepageTickets', title_de: string, title_en: string, content_de: any, content_en: any, ticket_url?: string | null } | null } | null } | null> | null } }; export type TheaterHomepageConnectionQuery = { __typename?: 'Query', theaterHomepageConnection: { __typename?: 'TheaterHomepageConnection', totalCount: number, pageInfo: { __typename?: 'PageInfo', hasPreviousPage: boolean, hasNextPage: boolean, startCursor: string, endCursor: string }, edges?: Array<{ __typename?: 'TheaterHomepageConnectionEdges', cursor: string, node?: { __typename: 'TheaterHomepage', id: string, title: string, _sys: { __typename?: 'SystemInfo', filename: string, basename: string, hasReferences?: boolean | null, breadcrumbs: Array<string>, path: string, relativePath: string, extension: string }, hero?: { __typename: 'TheaterHomepageHero', title_de: string, title_en: string, subtitle_de: string, subtitle_en: string } | null, projekt?: { __typename: 'TheaterHomepageProjekt', title_de: string, title_en: string, content_de: any, content_en: any } | null, team?: { __typename: 'TheaterHomepageTeam', title_de: string, title_en: string, content_de: any, content_en: any, organizations?: Array<{ __typename: 'TheaterHomepageTeamOrganizations', name?: string | null, role_de?: string | null, role_en?: string | null, logo?: string | null, url?: string | null } | null> | null } | null, stueck?: { __typename: 'TheaterHomepageStueck', title_de: string, title_en: string, content_de: any, content_en: any } | null, mitwirkung?: { __typename: 'TheaterHomepageMitwirkung', title_de: string, title_en: string, content_de: any, content_en: any, director_name?: string | null, director_email?: string | null, director_phone?: string | null } | null, termine?: { __typename: 'TheaterHomepageTermine', title_de: string, title_en: string, events?: Array<{ __typename: 'TheaterHomepageTermineEvents', title_de?: string | null, title_en?: string | null, date?: string | null, description_de?: string | null, description_en?: string | null } | null> | null } | null, presse?: { __typename: 'TheaterHomepagePresse', title_de: string, title_en: string, content_de: any, content_en: any } | null, gallery?: { __typename: 'TheaterHomepageGallery', title_de: string, title_en: string, images?: Array<string | null> | null } | null, tickets?: { __typename: 'TheaterHomepageTickets', title_de: string, title_en: string, content_de: any, content_en: any, ticket_url?: string | null } | null } | null } | null> | null } };
export const PostPartsFragmentDoc = gql` export const PostPartsFragmentDoc = gql`
fragment PostParts on Post { fragment PostParts on Post {
@@ -819,6 +825,8 @@ export const TheaterHomepagePartsFragmentDoc = gql`
name name
role_de role_de
role_en role_en
logo
url
} }
} }
stueck { stueck {
+12
View File
@@ -234,6 +234,18 @@ export default defineConfig({
name: "role_en", name: "role_en",
label: "Role (English)", label: "Role (English)",
}, },
{
type: "image",
name: "logo",
label: "Logo",
description: "Organization logo image",
},
{
type: "string",
name: "url",
label: "Website URL",
description: "Organization website link",
},
], ],
}, },
], ],
+1 -1
View File
File diff suppressed because one or more lines are too long