feat: add docker-compose for deployment

This commit is contained in:
2025-07-04 10:50:05 +02:00
parent a86e92d52e
commit 8dc9dfd100
35 changed files with 1106 additions and 130 deletions

View File

@@ -0,0 +1,103 @@
# Task Title
**Task ID:** `quarry-party-landing-page-react-001`
**Date Created:** `2025-07-03`
**Author:** `Gemini`
---
## Task Description
The objective of this task is to create a new React landing page for the "Steinbruch Fest" hosted by the Freiwillige Feuerwehr Friedberg. The landing page will be built using Next.js and styled with Tailwind CSS v4, ensuring a mobile-first design. All information from the provided flyer will be incorporated into the page, including a Google Maps card in the contact section and a cookie information banner.
---
## Instructions
1. **Initialize Next.js Project:**
* Create a new Next.js application using `npx create-next-app@latest`.
* Set up the project with TypeScript and Tailwind CSS.
2. **Project Structure:**
* Organize the project with separate directories for components, styles, and public assets.
* Create individual components for each section of the landing page.
3. **Header Section:**
* Display the main heading: "Steinbruch Fest."
* Include the dates: "16. + 17. Aug."
4. **Program Section:**
* **Saturday:**
* Start time: 19:00.
* Music from 21:00 by "LAUSER."
* **Sunday:**
* Holy Mass at 8:45 with music by "MGV Wechselklang."
* Followed by a "FRÜHSCHOPPEN" with the "Stadtkapelle Friedberg."
5. **Information Section:**
* Ticket prices: VVK €10,- / AK €12,-.
* Ticket sale locations: Trafik Gressenbauer, Der Salon - Monika Krammer, Tapeziermeister Michäler, FF-Mitglieder.
* Charity information: The proceeds will be used to finance vehicles and equipment for the fire department.
6. **Contact Section:**
* Address: Grazerstraße 355, 8240 Friedberg.
* Embed a Google Maps card showing the location.
* Include a note: "Bei Schlechtwetter im Sportzentrum Friedberg."
7. **Footer Section:**
* Impressum: Freiwillige Feuerwehr Friedberg, Grazerstraße 355, 8240 Friedberg, kdo.008@bfvhb.at.
* Sponsor logo: "pfeffer & partner."
8. **Cookie Banner:**
* Implement a cookie information banner to comply with privacy regulations.
9. **Styling:**
* Use Tailwind CSS v4 for all styling.
* Ensure a mobile-first and responsive design.
---
## Input Data
- **Image:** `@ai_docs/images/Flyer.jpeg`
- **Template:** `@ai_docs/templates/task_template.md`
---
## Expected Output
A fully functional and styled Next.js landing page that includes all the information from the flyer, is mobile-friendly, and features a Google Maps card and a cookie banner.
---
## Constraints & Requirements
- **Framework:** Next.js
- **Styling:** Tailwind CSS v4
- **Design:** Mobile-first
---
## System Instructions
> You are an expert assistant. Follow the instructions precisely and provide clear, concise answers.
---
## References
- [Next.js Documentation](https://nextjs.org/docs)
- [Tailwind CSS Documentation](https://tailwindcss.com/docs)
- [Google Maps Embed API](https://developers.google.com/maps/documentation/embed/get-started)
---
## Metadata
| Key | Value |
|-----------------|------------------|
| Priority | High |
| Status | Open |
| Tags | React, Next.js, TailwindCSS, Landing Page |
---

View File

@@ -0,0 +1,60 @@
# Fix Tailwind CSS Import in globals.css
**Task ID:** 002
**Date Created:** 2025-07-03
**Author:** Gemini
---
## Task Description
The current implementation of Tailwind CSS in `src/app/globals.css` uses an older import syntax. This task is to update the import to the new v4 syntax.
---
## Instructions
- Open `src/app/globals.css`.
- Replace the old `@tailwind` directives with the new `@import "tailwindcss";` syntax.
---
## Input Data
`src/app/globals.css`
---
## Expected Output
An updated `src/app/globals.css` file with the correct Tailwind CSS v4 import syntax.
---
## Constraints & Requirements
- Must use Tailwind CSS v4 syntax.
---
## System Instructions (Optional)
> You are an expert assistant. Follow the instructions precisely and provide clear, concise answers.
---
## References (Optional)
- [Tailwind CSS v4 Documentation](https://tailwindcss.com/docs)
---
## Metadata
| Key | Value |
|-----------------|------------------|
| Priority | High |
| Status | Open |
| Tags | CSS, TailwindCSS, Bugfix |
---

View File

@@ -0,0 +1,78 @@
# Responsive Fixes and Image/Color Update
**Task ID:** 003
**Date Created:** 2025-07-03
**Author:** Gemini
---
## Task Description
This task addresses several UI/UX issues to improve the landing page's responsiveness, visual consistency, and user experience. It includes fixing the cut-off footer, ensuring the cookie banner's visibility and proper alignment, making text responsive, updating an image, and applying a specific brand color to the page background.
---
## Instructions
- **Fix Footer:** Adjust CSS to ensure the footer is fully visible and not cut off on any screen size.
- **Fix Cookie Banner:**
- Ensure the 'Accept' button is always visible in desktop mode.
- Center the cookie message and the accept button within the banner.
- **Fix Responsive Text:** Review and apply appropriate responsive Tailwind CSS classes to text elements to ensure they scale correctly across different screen sizes.
- **Update Image:** Replace the existing `public/images/flyer.jpeg` with `public/images/150_image.png`. (Note: `150_image.png` will be moved from `ai_docs/images` to `public/images` first).
- **Apply Brand Color:** Identify the yellow color from `ai_docs/images/150_image.png` and apply it as the background color for the main page layout.
---
## Input Data
- `src/components/layout/Footer.tsx`
- `src/components/CookieBanner.tsx`
- `src/app/globals.css` (or other relevant CSS files)
- `src/app/layout.tsx` (or `src/app/page.tsx`)
- `src/components/sections/Hero.tsx` (or other components using `flyer.jpeg`)
- `ai_docs/images/150_image.png`
- `public/images/flyer.jpeg`
---
## Expected Output
- A fully visible footer.
- A cookie banner with a visible and centered 'Accept' button and centered message.
- Text elements that are responsive and scale appropriately.
- The `150_image.png` displayed where `flyer.jpeg` was previously used.
- The main page background colored with the specified yellow.
- Updated relevant code files.
---
## Constraints & Requirements
- Maintain existing project conventions (Next.js, React, TypeScript, Tailwind CSS).
- Ensure changes are responsive and work across various screen sizes.
- The yellow color must be extracted accurately from `150_image.png`.
---
## System Instructions (Optional)
> You are an expert assistant. Follow the instructions precisely and provide clear, concise answers.
---
## References (Optional)
- `ai_docs/images/failure_footer_cut_off.png`
- `ai_docs/images/failure_responive_view.png`
- `ai_docs/images/150_image.png`
---
## Metadata
| Key | Value |
|-----------------|------------------|
| Priority | High |
| Status | Open |
| Tags | UI/UX, Responsive, CSS, Image, Color |

View File

@@ -0,0 +1,65 @@
# Create Impressum Page
**Task ID:** 004
**Date Created:** 2025-07-03
**Author:** Gemini
---
## Task Description
Create a new "Impressum" page for the website, containing the legally required German impressum text for "Freiwillige Feuerwehr Friedberg" as a public corporation under Austrian law. The page must also include information regarding cookie usage. Additionally, a new menu entry for this Impressum page needs to be added to the website's navigation.
---
## Instructions
- Create a new file `src/app/impressum/page.tsx` for the Impressum page.
- Populate `src/app/impressum/page.tsx` with the necessary German impressum text for "Freiwillige Feuerwehr Friedberg" (Körperschaft öffentlichen Rechts) and cookie information.
- Add a new navigation link to the `src/components/layout/Header.tsx` component that points to the new `/impressum` page.
---
## Input Data
- `ai_docs/templates/task_template.md` (used for this plan)
- Information for "Freiwillige Feuerwehr Friedberg" (Körperschaft öffentlichen Rechts) for generating the Impressum text.
---
## Expected Output
- A new, functional Impressum page at `/impressum`.
- The Impressum page containing legally compliant German text for Austrian law, including cookie information.
- An updated navigation menu in the header with a link to the Impressum page.
---
## Constraints & Requirements
- The Impressum text must comply with Austrian legal requirements for a "Körperschaft öffentlichen Rechts".
- The cookie information must be included.
- The page must be in German.
- Adhere to existing Next.js, React, and TypeScript conventions.
---
## System Instructions (Optional)
> You are an expert assistant. Follow the instructions precisely and provide clear, concise answers.
---
## References (Optional)
- Austrian E-Commerce Law (ECG) for Impressum requirements.
---
## Metadata
| Key | Value |
|-----------------|------------------|
| Priority | High |
| Status | Open |
| Tags | Legal, UI/UX, New Feature |

View File

@@ -0,0 +1,70 @@
# Add Header and Update Content for Impressum Page
**Task ID:** 005
**Date Created:** 2025-07-03
**Author:** Gemini
---
## Task Description
Add a header component to the impressum page (`src/app/impressum/page.tsx`) and update its content with the information provided in `ai_docs/templates/impressum.md`.
---
## Instructions
- Read the content of `ai_docs/templates/impressum.md`.
- Modify `src/app/impressum/page.tsx` to include the `Header` component from `src/components/layout/Header.tsx`.
- Replace the existing content of the impressum page with the content from `ai_docs/templates/impressum.md`, adapting it to JSX format.
- Ensure all links are properly formatted and accessible.
- Run the linter to check for any new issues.
---
## Input Data
- `ai_docs/templates/impressum.md`: Markdown file containing the impressum content.
- `src/app/impressum/page.tsx`: The impressum page component.
- `src/components/layout/Header.tsx`: The header component to be included.
---
## Expected Output
- The impressum page (`src/app/impressum/page.tsx`) should display the content from `ai_docs/templates/impressum.md` and include the `Header` component at the top.
- No linting errors should be introduced.
---
## Constraints & Requirements
- The changes must adhere to the existing code style and structure.
- The `Header` component must be imported and used correctly.
- All content from `ai_docs/templates/impressum.md` must be accurately reflected in the `page.tsx` file.
---
## System Instructions (Optional)
> You are an expert assistant. Follow the instructions precisely and provide clear, concise answers.
---
## References (Optional)
- `ai_docs/templates/impressum.md`
- `src/app/impressum/page.tsx`
- `src/components/layout/Header.tsx`
---
## Metadata
| Key | Value |
|-----------------|------------------|
| Priority | High |
| Status | Completed |
| Tags | impressum, header, content update |
---

View File

@@ -0,0 +1,64 @@
# Fix Menu Navigation on Impressum Page
**Task ID:** 006
**Date Created:** 2025-07-03
**Author:** Gemini
---
## Task Description
When navigating from the impressum page, the menu links for "Programm", "Infos", and "Kontakt" were incorrectly trying to find the anchor on the impressum page itself, leading to a broken navigation experience. This task fixes the navigation to correctly direct to the main page and then scroll to the respective sections.
---
## Instructions
- Modify `src/components/layout/Header.tsx`.
- Prepend a `/` to the `href` attributes for the "Programm", "Infos", and "Kontakt" links to ensure they always navigate to the root path before attempting to scroll to the anchor.
- Run the linter to check for any new issues.
---
## Input Data
- `src/components/layout/Header.tsx`: The header component containing the navigation links.
---
## Expected Output
- Clicking on "Programm", "Infos", or "Kontakt" from the impressum page should navigate to the main page and then scroll to the corresponding section.
- No linting errors should be introduced.
---
## Constraints & Requirements
- The changes must ensure correct navigation behavior from all pages.
- The `Link` component from `next/link` should be used appropriately.
---
## System Instructions (Optional)
> You are an expert assistant. Follow the instructions precisely and provide clear, concise answers.
---
## References (Optional)
- `src/components/layout/Header.tsx`
- `ai_docs/images/failure_navigation.png`
---
## Metadata
| Key | Value |
|-----------------|------------------|
| Priority | High |
| Status | Completed |
| Tags | navigation, bugfix, impressum |
---

View File

@@ -0,0 +1,67 @@
# Add Burger Menu and Fix Hero Section Cut-off
**Task ID:** 007
**Date Created:** 2025-07-03
**Author:** Gemini
---
## Task Description
This task addresses two issues: ensuring the hero section is not cut off in mobile view and confirming the implementation of a burger menu for mobile navigation.
---
## Instructions
- Modified `src/components/sections/Hero.tsx` to use `min-h-screen` instead of `h-screen` to prevent content from being cut off on smaller screens.
- Verified that the burger menu functionality is already implemented in `src/components/layout/Header.tsx` using `useState` and conditional Tailwind CSS classes for responsiveness.
- Run the linter to check for any new issues.
---
## Input Data
- `src/components/sections/Hero.tsx`: The Hero section component.
- `src/components/layout/Header.tsx`: The Header component containing the navigation.
---
## Expected Output
- The Hero section should display correctly on all screen sizes without content being cut off.
- The burger menu in the header should function as expected on mobile devices, toggling the navigation links.
- No linting errors should be introduced.
---
## Constraints & Requirements
- The changes must maintain the existing design and responsiveness.
- The burger menu should be intuitive and functional.
---
## System Instructions (Optional)
> You are an expert assistant. Follow the instructions precisely and provide clear, concise answers.
---
## References (Optional)
- `src/components/sections/Hero.tsx`
- `src/components/layout/Header.tsx`
- `ai_docs/images/failure_cut_off_hero_section.png`
---
## Metadata
| Key | Value |
|-----------------|------------------|
| Priority | High |
| Status | Completed |
| Tags | mobile, responsive, hero section, burger menu |
---

View File

@@ -0,0 +1,58 @@
# Task Title
**Task ID:** 008
**Date Created:** 2025-07-04
**Author:** Gemini
---
## Task Description
This task is to containerize the application using Docker and Docker Compose. The project code will be cloned from a git repository before the build.
---
## Instructions
- A `Dockerfile` is created to define the build steps for the Next.js application.
- A `.dockerignore` file is created to exclude unnecessary files from the Docker build context.
- A `docker-compose.yml` file is created to define the services for the application.
---
## Input Data
- The git repository URL from `git.haider.app`.
---
## Expected Output
- A Docker image that can be run as a container.
- The application will be accessible on port 8150.
---
## Constraints & Requirements
- The project code must be cloned from a git repository.
- The application must run on port 8150.
---
## References (Optional)
- [Docker Documentation](https://docs.docker.com/)
- [Docker Compose Documentation](https://docs.docker.com/compose/)
---
## Metadata
| Key | Value |
|-----------------|------------------|
| Priority | High |
| Status | Done |
| Tags | Docker, Docker Compose, Deployment |
---

BIN
ai_docs/images/Flyer.jpeg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 218 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 89 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 26 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 12 KiB

View File

@@ -0,0 +1,44 @@
## Impressum
**Angaben gemäß § 5 E-Commerce-Gesetz (ECG) und § 25 Mediengesetz (MedienG):**
Freiwillige Feuerwehr Friedberg
Grazerstraße 355
8240 Friedberg
Kommandant: HBI Ing. Bernhard Ehgartner
E-Mail: kdo.008@bfvhb.at
Homepage: htps://feuerwehr-friedberg.at
**Rechtsform:**
Körperschaft öffentlichen Rechts nach dem Steiermärkischen Feuerwehrgesetz.
**Tätigkeiten:**
Erledigung der gesetzlichen Aufgaben nach dem Steiermärkischen Feuerwehrgesetz samt Feuerwehrordnung und Dienstanweisungen des Landesfeuerwehrverbandes.
**Verantwortliche für den Inhalt:**
HBI Ing. Bernhard Ehgartner
OBI Tizian Haider
**Datenschutz:**
Wir nehmen den Schutz Ihrer persönlichen Daten sehr ernst. Wir behandeln Ihre personenbezogenen Daten vertraulich und entsprechend der gesetzlichen Datenschutzvorschriften sowie dieser Datenschutzerklärung.
Unsere Website verwendet Cookies, um die Benutzerfreundlichkeit zu verbessern und bestimmte Funktionen zu ermöglichen. Cookies sind kleine Textdateien, die auf Ihrem Endgerät abgelegt werden und die Ihr Browser speichert. Einige der von uns verwendeten Cookies sind so genannte „Session-Cookies“. Sie werden nach Ende Ihres Besuchs automatisch gelöscht. Andere Cookies bleiben auf Ihrem Endgerät gespeichert, bis Sie diese löschen. Diese Cookies ermöglichen es uns, Ihren Browser beim nächsten Besuch wiederzuerkennen.
Sie können Ihren Browser so einstellen, dass Sie über das Setzen von Cookies informiert werden und Cookies nur im Einzelfall erlauben, die Annahme von Cookies für bestimmte Fälle oder generell ausschließen sowie das automatische Löschen der Cookies beim Schließen des Browsers aktivieren. Bei der Deaktivierung von Cookies kann die Funktionalität dieser Website eingeschränkt sein.
Auf unserer Website ist Google Maps eingebunden, um Ihnen die Anfahrt zu unserem Feuerwehrfest zu erleichtern.
Beim Aufruf der Karte wird eine Verbindung zu Servern von Google hergestellt, wobei personenbezogene Daten (z. B. IP-Adresse) übertragen werden können. Zudem setzt Google Maps Cookies, die teilweise technisch notwendig sind, um die Kartenfunktion bereitzustellen, und teilweise für Analyse- und Werbezwecke genutzt werden.
Technisch notwendige Cookies ermöglichen die grundlegende Funktion der Kartenanzeige und erfordern keine Einwilligung.
**Haftungsausschluss:**
Die Freiwillige Feuerwehr Friedberg übernimmt keine Haftung für die Aktualität, Richtigkeit und Vollständigkeit der bereitgestellten Informationen. Für den Inhalt verlinkter Seiten sind ausschließlich deren Betreiber verantwortlich.
**Urheberrecht**
Die durch die Seitenbetreiber erstellten Inhalte und Werke auf diesen Seiten unterliegen dem österreichischen Urheberrecht. Die Vervielfältigung, Bearbeitung, Verbreitung und jede Art der Verwertung außerhalb der Grenzen des Urheberrechtes bedürfen der schriftlichen Zustimmung des jeweiligen Autors bzw. Erstellers. Downloads und Kopien dieser Seite sind nur für den privaten, nicht kommerziellen Gebrauch gestattet. Soweit die Inhalte auf dieser Seite nicht vom Betreiber erstellt wurden, werden die Urheberrechte Dritter beachtet. Insbesondere werden Inhalte Dritter als solche gekennzeichnet. Sollten Sie trotzdem auf eine Urheberrechtsverletzung aufmerksam werden, bitten wir um einen entsprechenden Hinweis. Bei Bekanntwerden von Rechtsverletzungen werden wir derartige Inhalte umgehend entfernen.
**Notruf:**
Im Notfall wählen Sie bitte den Feuerwehr-Notruf 122.

View File

@@ -0,0 +1,75 @@
# Task Title
**Task ID:** <!-- Unique identifier for the task -->
**Date Created:** <!-- YYYY-MM-DD -->
**Author:** <!-- Name or team -->
---
## Task Description
Provide a concise and clear description of the task.
Explain the objective, background, and any relevant context.
---
## Instructions
- List step-by-step instructions for completing this task.
- Be specific and unambiguous.
- Use bullet points or numbered lists for clarity.
---
## Input Data
Describe the expected input(s) for this task.
You may include:
- Data formats (e.g., text, image, JSON)
- Example input(s)
---
## Expected Output
Describe the desired output(s) for this task.
Include:
- Output format (e.g., Markdown, JSON, plain text)
- Example output(s)
---
## Constraints & Requirements
- List any rules, constraints, or requirements.
- Specify model version if necessary (e.g., gemini-1.5-pro).
---
## System Instructions (Optional)
> You are an expert assistant. Follow the instructions precisely and provide clear, concise answers.
---
## References (Optional)
- List any relevant documents, links, or resources.
---
## Metadata
| Key | Value |
|-----------------|------------------|
| Priority | <!-- e.g., High --> |
| Status | <!-- e.g., Open --> |
| Tags | <!-- e.g., NLP, Summarization --> |
---
<!--
Notes:
- This template is designed for compatibility with Gemini's Markdown file handling and collaborative editing features.
- You can upload, edit, and export this file using Gemini's Markdown tools[6].
-->