diff --git a/Gallus_Pub_v1/.woodpecker.yml b/Gallus_Pub_v1/.woodpecker.yml new file mode 100644 index 0000000..b4cae4f --- /dev/null +++ b/Gallus_Pub_v1/.woodpecker.yml @@ -0,0 +1,26 @@ +pipeline: + build: + image: node:20-alpine + commands: + - npm ci + - npm run build + when: + branch: main + event: [push, pull_request] + deploy: + depends_on: [build] + image: flyio/flyctl:latest + secrets: [fly_api_token] + commands: + - flyctl deploy --remote-only + when: + branch: main + event: push + +branches: + include: [main, dev] + +cache: + mount: + - node_modules + - .npm \ No newline at end of file diff --git a/Gallus_Pub_v1/Dockerfile b/Gallus_Pub_v1/Dockerfile new file mode 100644 index 0000000..e521d68 --- /dev/null +++ b/Gallus_Pub_v1/Dockerfile @@ -0,0 +1,25 @@ +FROM node:20-alpine AS build + +WORKDIR /app + +COPY package*.json ./ +RUN npm ci + +COPY . . + +RUN npm run build + +FROM node:20-alpine AS production + +WORKDIR /app + +RUN npm install -g serve + +COPY --from=build /app/dist /app + +EXPOSE 3000 + +CMD ["serve", "-s", ".", "-l", "3000"] + +HEALTHCHECK --interval=30s --timeout=3s --start-period=5s --retries=3 \ + CMD wget -qO- http://localhost:3000/ || exit 1 \ No newline at end of file diff --git a/Gallus_Pub_v1/fly.toml b/Gallus_Pub_v1/fly.toml new file mode 100644 index 0000000..a139256 --- /dev/null +++ b/Gallus_Pub_v1/fly.toml @@ -0,0 +1,42 @@ +app = "gallus-pub" +primary_region = "fra" # Frankfurt region, change if needed +kill_signal = "SIGINT" +kill_timeout = 5 + +[build] + dockerfile = "Dockerfile" + +[env] + PORT = "3000" + NODE_ENV = "production" + +[http_service] + internal_port = 3000 + force_https = true + auto_stop_machines = true + auto_start_machines = true + min_machines_running = 0 + processes = ["app"] + + [http_service.concurrency] + type = "connections" + hard_limit = 1000 + soft_limit = 500 + + [[http_service.checks]] + interval = "30s" + timeout = "5s" + grace_period = "10s" + method = "GET" + path = "/" + protocol = "http" + tls_skip_verify = false + +[metrics] + port = 9091 + path = "/metrics" + +[[vm]] + memory = "512MB" + cpu_kind = "shared" + cpus = 1 \ No newline at end of file diff --git a/Gallus_Pub_v1/public/images/Welcome.png b/Gallus_Pub_v1/public/images/Welcome.png new file mode 100644 index 0000000..e8af216 Binary files /dev/null and b/Gallus_Pub_v1/public/images/Welcome.png differ diff --git a/Gallus_Pub_v1/public/pdf/Menu.pdf b/Gallus_Pub_v1/public/pdf/Menu.pdf new file mode 100644 index 0000000..b11da1c Binary files /dev/null and b/Gallus_Pub_v1/public/pdf/Menu.pdf differ diff --git a/Gallus_Pub_v1/src/components/Drinks.astro b/Gallus_Pub_v1/src/components/Drinks.astro new file mode 100644 index 0000000..6534194 --- /dev/null +++ b/Gallus_Pub_v1/src/components/Drinks.astro @@ -0,0 +1,25 @@ +--- +import "../../styles/components/Drinks.css" +--- +
+
Drinks
+ + Getränkekarte + +
Monats Hit
+ +
+
+
Mate Vodka
+
+ +
+
+
+
+
+ +
+ Wir bieten eine Auswahl... +
+
\ No newline at end of file diff --git a/Gallus_Pub_v1/src/components/EventsGrid.astro b/Gallus_Pub_v1/src/components/EventsGrid.astro index cd4dcbc..3f88357 100644 --- a/Gallus_Pub_v1/src/components/EventsGrid.astro +++ b/Gallus_Pub_v1/src/components/EventsGrid.astro @@ -6,6 +6,7 @@ interface Event { description: string; } const { events = [] }: { events?: Event[] } = Astro.props as { events?: Event[] }; +import '/styles/components/EventsGrid.css'; ---
@@ -23,4 +24,4 @@ const { events = [] }: { events?: Event[] } = Astro.props as { events?: Event[] ))} -
\ No newline at end of file + diff --git a/Gallus_Pub_v1/src/components/Footer.astro b/Gallus_Pub_v1/src/components/Footer.astro index 5bb9241..6303767 100644 --- a/Gallus_Pub_v1/src/components/Footer.astro +++ b/Gallus_Pub_v1/src/components/Footer.astro @@ -1,9 +1,44 @@ --- // src/components/Footer.astro +import "/styles/components/Footer.css" +const currentYear = new Date().getFullYear(); --- + diff --git a/Gallus_Pub_v1/src/components/Header.astro b/Gallus_Pub_v1/src/components/Header.astro index 8970a75..af177c3 100644 --- a/Gallus_Pub_v1/src/components/Header.astro +++ b/Gallus_Pub_v1/src/components/Header.astro @@ -1,14 +1,15 @@ --- // src/components/Header.astro const { url } = Astro; +import "../../styles/components/Header.css" ---
-
- - Gallus Pub Logo - + @@ -35,3 +36,4 @@ const { url } = Astro;
+
diff --git a/Gallus_Pub_v1/src/components/Hero.astro b/Gallus_Pub_v1/src/components/Hero.astro index ecd059a..d18d991 100644 --- a/Gallus_Pub_v1/src/components/Hero.astro +++ b/Gallus_Pub_v1/src/components/Hero.astro @@ -1,5 +1,6 @@ --- // src/components/Hero.astro +import "../../styles/components/Hero.css" ---
@@ -18,3 +19,18 @@
+ + + diff --git a/Gallus_Pub_v1/src/components/Layout.astro b/Gallus_Pub_v1/src/components/Layout.astro index 88e0f7e..8f0c69f 100644 --- a/Gallus_Pub_v1/src/components/Layout.astro +++ b/Gallus_Pub_v1/src/components/Layout.astro @@ -13,7 +13,7 @@ import Footer from "./Footer.astro"; Gallus Pub - + diff --git a/Gallus_Pub_v1/src/components/Welcome.astro b/Gallus_Pub_v1/src/components/Welcome.astro index a55eaf0..41734ee 100644 --- a/Gallus_Pub_v1/src/components/Welcome.astro +++ b/Gallus_Pub_v1/src/components/Welcome.astro @@ -1,5 +1,6 @@ --- // src/components/Welcome.astro +import "../../styles/components/Welcome.css" ---
@@ -48,9 +49,7 @@
- - Welcome backgrount image - + Welcome backgrount image
diff --git a/Gallus_Pub_v1/src/pages/Drinks.astro b/Gallus_Pub_v1/src/pages/Drinks.astro deleted file mode 100644 index bb3d861..0000000 --- a/Gallus_Pub_v1/src/pages/Drinks.astro +++ /dev/null @@ -1,11 +0,0 @@ ---- -import Layout from "../components/Layout.astro"; ---- - - - -

Drinks

- -

Hier findest du alle aktuellen und kommenden Drinks im Gallus Pub.

- -
diff --git a/Gallus_Pub_v1/src/pages/index.astro b/Gallus_Pub_v1/src/pages/index.astro index 75176f7..5fa03ef 100644 --- a/Gallus_Pub_v1/src/pages/index.astro +++ b/Gallus_Pub_v1/src/pages/index.astro @@ -1,9 +1,11 @@ --- // src/pages/index.astro +import "../../styles/index.css" import Layout from "../components/Layout.astro"; import Hero from "../components/Hero.astro"; import Welcome from "../components/Welcome.astro"; import EventsGrid from '../components/EventsGrid.astro'; +import Drinks from "../components/Drinks.astro"; const events = [ { title: 'Karaoke Night', date: 'Mi, 23. Juli 2025', description: 'Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua' }, @@ -18,5 +20,5 @@ const events = [ - + diff --git a/Gallus_Pub_v1/styles/components/Drinks.css b/Gallus_Pub_v1/styles/components/Drinks.css new file mode 100644 index 0000000..6915f0d --- /dev/null +++ b/Gallus_Pub_v1/styles/components/Drinks.css @@ -0,0 +1,57 @@ +.Drinks { + font-family: sans-serif; + display: flex; + flex-direction: column; + align-items: center; + margin-top: 2rem; + text-align: center; + background-color: #fff; + color: #ceb39b; + padding: 2rem; + width: 100%; +} + +.title { + font-size: 1.5rem; + margin-bottom: 1rem; +} + +.card-link { + border: 1px solid #000; + padding: 0.5rem 1rem; + margin-bottom: 2rem; + color: #fff; + background: linear-gradient(45deg, #ffa500, #ff7f00); +} + +.monats-hit { + margin-bottom: 1rem; +} + +.mate-vodka { + display: flex; + flex-direction: column; + align-items: center; + margin-bottom: 1rem; +} + +.circle { + height: 6em; + width: 6em; + border: 2px solid #000; + border-radius: 50%; + margin: 1rem; +} + +.circle-row { + display: flex; + justify-content: center; + gap: 2rem; + margin: 1rem 0; +} + +.note { + margin-top: 2rem; + font-style: italic; + text-align: center; +} \ No newline at end of file diff --git a/Gallus_Pub_v1/styles/components/EventsGrid.css b/Gallus_Pub_v1/styles/components/EventsGrid.css new file mode 100644 index 0000000..f3f6edf --- /dev/null +++ b/Gallus_Pub_v1/styles/components/EventsGrid.css @@ -0,0 +1,32 @@ +article { + margin-bottom: 1em; +} + +.events-grid { + display: grid; + grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); + gap: 2rem; + margin: 3rem 0; +} +.event-card { + background-color: #2a2a2a; + padding: 1.5rem; + border-radius: 8px; + transition: transform 0.2s; +} +.event-card:hover { + transform: translateY(-5px); +} +.event-card h3 { + margin-bottom: 0.5rem; + color: #ffa500; +} +.event-card .date { + font-size: 0.9rem; + color: #ccc; + margin-bottom: 1rem; +} +.event-card .description { + font-size: 1rem; + color: #eee; +} \ No newline at end of file diff --git a/Gallus_Pub_v1/styles/components/Footer.css b/Gallus_Pub_v1/styles/components/Footer.css new file mode 100644 index 0000000..96073ec --- /dev/null +++ b/Gallus_Pub_v1/styles/components/Footer.css @@ -0,0 +1,62 @@ +.footer { + background-color: #213b28; + color: white; + padding: 3rem 0; + margin-top: 4rem; +} + +.footer-content { + max-width: 1200px; + margin: 0 auto; + padding: 0 1rem; +} + +.copyright { + text-align: center; + margin-bottom: 2rem; + padding-bottom: 1rem; + border-bottom: 1px solid rgba(255, 255, 255, 0.1); +} + +.footer-sections { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); + gap: 2rem; + justify-content: center; +} + +.footer-section { + text-align: center; +} + +.footer-section h3 { + color: #ffffff; + margin-bottom: 1rem; + font-size: 1.2rem; +} + +.footer-section p { + margin: 0.5rem 0; + color: #cccccc; + font-size: 0.9rem; +} + +.footer-section a { + color: #ffffff; + text-decoration: none; +} + +.footer-section a:hover { + text-decoration: underline; +} + +@media (max-width: 768px) { + .footer-sections { + grid-template-columns: 1fr; + gap: 2rem; + } + + .footer-section { + padding: 0 1rem; + } +} diff --git a/Gallus_Pub_v1/styles/components/Header.css b/Gallus_Pub_v1/styles/components/Header.css new file mode 100644 index 0000000..fd00881 --- /dev/null +++ b/Gallus_Pub_v1/styles/components/Header.css @@ -0,0 +1,94 @@ +.header { + position: fixed; + top: 0; + left: 0; + right: 0; + background-color: rgba(26, 26, 26, 0.95); + z-index: 1000; + box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); + backdrop-filter: blur(5px); +} + + +.header-spacer { + height: 70px; /* Should match the header height */ +} + + +.logo-container { + display: flex; + align-items: center; +} + +.logo { + margin-left: 2em; + height: 4em; + width: auto; + transition: transform 0.3s ease; +} + +.logo:hover { + transform: scale(1.05); +} + +.nav-main { + display: flex; + align-items: center; + margin-right: 377px; +} + +.nav-main a, +.dropdbtn { + margin: 0 1rem; + color: white; + text-decoration: none; + font-size: 1rem; + cursor: pointer; +} + +.nav-main a:hover, +.dropdbtn:hover { + color: #ffa500; +} + +/* Dropdown für Home */ +.dropdown { + position: relative; + display: inline-block; +} + +.dropdown-content { + display: none; + position: absolute; + background-color: #0e0c0c; + min-width: 160px; + z-index: 1; + border: 1px solid #444; + border-radius: 4px; +} + +.dropdown-content a { + color: #f5f5f5; + padding: 0.5rem 1rem; + text-decoration: none; + display: block; +} + +.dropdown-content a:hover { + background-color: #1f1a1a; + color: #ffa500; +} + +.dropdown:hover .dropdown-content { + display: block; +} + +@media (max-width: 768px) { + .nav-container { + padding: 1rem; + } + + .nav-links { + gap: 1rem; + } +} diff --git a/Gallus_Pub_v1/styles/components/Hero.css b/Gallus_Pub_v1/styles/components/Hero.css new file mode 100644 index 0000000..c500c97 --- /dev/null +++ b/Gallus_Pub_v1/styles/components/Hero.css @@ -0,0 +1,115 @@ +/* === Header & Nav === */ +.header { + background-color: #0e0c0c; + display: flex; + align-items: center; + justify-content: space-between; + padding: 1rem 2rem; + border-bottom: 1px solid #444; +} + +.nav-main { + display: flex; + align-items: center; + margin-right: 377px; +} + +.nav-main a, +.dropdbtn { + margin: 0 1rem; + color: white; + text-decoration: none; + font-size: 1rem; + cursor: pointer; +} + +.nav-main a:hover, +.dropdbtn:hover { + color: #ffa500; +} + +/* Dropdown für Home */ +.dropdown { + position: relative; + display: inline-block; +} + +.dropdown-content { + display: none; + position: absolute; + background-color: #0e0c0c; + min-width: 160px; + z-index: 1; + border: 1px solid #444; + border-radius: 4px; +} + +.dropdown-content a { + color: #f5f5f5; + padding: 0.5rem 1rem; + text-decoration: none; + display: block; +} + +.dropdown-content a:hover { + background-color: #1f1a1a; + color: #ffa500; +} + +.dropdown:hover .dropdown-content { + display: block; +} + +.hero { + position: relative; + height: 70vh; + display: flex; + align-items: center; + justify-content: center; + color: white; + margin-bottom: 2rem; +} + +.hero-overlay { + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: rgba(0, 0, 0, 0.5); +} + +.hero-content { + position: relative; + text-align: center; + z-index: 1; +} + +.hero-content h1 { + font-size: 4rem; + font-weight: bold; +} + +.hero-content p { + margin: 0.5rem 0 1rem 0; + font-size: 1.2rem; +} + +.button { + margin-top: 2rem; + padding: 0.8rem 2rem; + background: linear-gradient(45deg, #ffa500, #ff7f00); + color: white; + border: none; + border-radius: 30px; + font-size: 1rem; + font-weight: bold; + text-decoration: none; + box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3); + transition: transform 0.2s, box-shadow 0.2s; +} + +.button:hover { + transform: translateY(-3px); + box-shadow: 0 6px 20px rgba(0, 0, 0, 0.4); +} \ No newline at end of file diff --git a/Gallus_Pub_v1/styles/components/Welcome.css b/Gallus_Pub_v1/styles/components/Welcome.css new file mode 100644 index 0000000..034e9c5 --- /dev/null +++ b/Gallus_Pub_v1/styles/components/Welcome.css @@ -0,0 +1,41 @@ +/* === Welcome === */ +.welcome { + display: flex; + flex-wrap: wrap; + align-items: center; + background-color: #1f3a2d; + padding: 3rem 0; + margin-bottom: 2rem; + gap: 2rem; +} + +.welcome-text { + order: 1; + flex: 2 1 400px; + padding: 0 1.6rem 0 2rem; + color: #fff3e0; +} + +.welcome-text h2 { + font-size: 2.5rem; + margin-bottom: 1rem; + color: #e8c6a7; +} + +.welcome-text ul { + margin: 1rem 0; + padding-left: 1.2rem; +} + +.welcome-image { + order: 2; + height: 100%; + flex: 1 1 300px; + margin-right: 2em; +} + +.welcome-image img { + width: 100%; + height: auto; + border-radius: 8px; +} \ No newline at end of file diff --git a/Gallus_Pub_v1/styles/index.css b/Gallus_Pub_v1/styles/index.css index b697be6..3555b8a 100644 --- a/Gallus_Pub_v1/styles/index.css +++ b/Gallus_Pub_v1/styles/index.css @@ -17,200 +17,4 @@ body { max-width: 1140px; margin: 0 auto; padding: 0 1rem; -} - -/* === Header & Nav === */ -.header { - background-color: #0e0c0c; - display: flex; - align-items: center; - justify-content: space-between; - padding: 1rem 2rem; - border-bottom: 1px solid #444; -} - -.nav-main { - display: flex; - align-items: center; - margin-right: 377px; -} - -.nav-main a, -.dropdbtn { - margin: 0 1rem; - color: white; - text-decoration: none; - font-size: 1rem; - cursor: pointer; -} - -.nav-main a:hover, -.dropdbtn:hover { - color: #ffa500; -} - -/* Dropdown für Home */ -.dropdown { - position: relative; - display: inline-block; -} - -.dropdown-content { - display: none; - position: absolute; - background-color: #0e0c0c; - min-width: 160px; - z-index: 1; - border: 1px solid #444; - border-radius: 4px; -} - -.dropdown-content a { - color: #f5f5f5; - padding: 0.5rem 1rem; - text-decoration: none; - display: block; -} - -.dropdown-content a:hover { - background-color: #1f1a1a; - color: #ffa500; -} - -.dropdown:hover .dropdown-content { - display: block; -} - -/* === Hero === */ -.hero { - position: relative; - height: 70vh; - display: flex; - align-items: center; - justify-content: center; - color: white; - margin-bottom: 2rem; -} - -.hero-overlay { - position: absolute; - top: 0; - left: 0; - right: 0; - bottom: 0; - background: rgba(0, 0, 0, 0.5); -} - -.hero-content { - position: relative; - text-align: center; - z-index: 1; -} - -.hero-content h1 { - font-size: 4rem; - font-weight: bold; -} - -.hero-content p { - margin: 0.5rem 0 1rem 0; - font-size: 1.2rem; -} - -.button { - margin-top: 2rem; - padding: 0.8rem 2rem; - background: linear-gradient(45deg, #ffa500, #ff7f00); - color: white; - border: none; - border-radius: 30px; - font-size: 1rem; - font-weight: bold; - text-decoration: none; - box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3); - transition: transform 0.2s, box-shadow 0.2s; -} - -.button:hover { - transform: translateY(-3px); - box-shadow: 0 6px 20px rgba(0, 0, 0, 0.4); -} - -/* === Welcome === */ -.welcome { - display: flex; - flex-wrap: wrap; - align-items: center; - background-color: #1f3a2d; - padding: 3rem 0; - margin-bottom: 2rem; - gap: 2rem; -} - -.welcome-text { - order: 1; - flex: 2 1 400px; - padding: 0 1.6rem 0 2rem; - color: #fff3e0; -} - -.welcome-text h2 { - font-size: 2.5rem; - margin-bottom: 1rem; - color: #e8c6a7; -} - -.welcome-text ul { - margin: 1rem 0; - padding-left: 1.2rem; -} - -.welcome-image { - order: 2; - flex: 1 1 300px; -} - -.welcome-image img { - width: 100%; - height: auto; - border-radius: 8px; -} - -/* === Events Grid === */ -.events-grid { - display: grid; - grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); - gap: 2rem; - margin: 3rem 0; -} -.event-card { - background-color: #2a2a2a; - padding: 1.5rem; - border-radius: 8px; - transition: transform 0.2s; -} -.event-card:hover { - transform: translateY(-5px); -} -.event-card h3 { - margin-bottom: 0.5rem; - color: #ffa500; -} -.event-card .date { - font-size: 0.9rem; - color: #ccc; - margin-bottom: 1rem; -} -.event-card .description { - font-size: 1rem; - color: #eee; -} - -/* === Footer === */ -.footer { - text-align: center; - padding: 1.5rem 0; - background-color: #0e0c0c; - color: #aaa; - margin-top: 4rem; } \ No newline at end of file