Kenzo/Gallus_Pub
2
1
Fork 0
Code Issues Pull Requests 1 Packages Projects Releases Wiki Activity

event hinzugefügt und erste anpassungen am nav für onePager

Browse Source
This commit is contained in:
Selina Erci
2025-07-23 16:39:01 +02:00
parent f0afa677a0
commit 77c5d5df82
4 changed files with 24 additions and 71 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
public/images/kevin_mcflannigan.jpeg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 384 KiB

30
src/components/Header.astro
View File

@ -1,44 +1,28 @@
--- ---
// src/components/Header.astro // src/components/Header.astro
const { url } = Astro; const { url } = Astro;
import "../../styles/components/Header.css" import "../../styles/components/Header.css";
--- ---
<header class="header"> <header class="header">
<div class="logo-container"> <div class="logo-container">
<a href="/"> <a href="/">
<img src="/images/Logo.png" alt="Logo" class="logo"> <img src="/images/Logo.png" alt="Logo" class="logo" />
</a> </a>
</div> </div>
<!-- Hauptnavigation: immer Home, About, Contact --> <!-- Hauptnavigation: immer Home, About, Contact -->
<nav class="nav-main"> <nav class="nav-main">
<div>
<div class="dropdown">
<a href="/" class="dropdbtn">Home</a>
<div class="dropdown-content">
<!-- Section navigation links -->
<a href="/#hero">Home</a> <a href="/#hero">Home</a>
<a href="/#welcome">Willkommen</a>
<a href="/#events">Events</a> <a href="/#events">Events</a>
<a href="/#gallery">Galerie</a> <a href="/#gallery">Galerie</a>
<a href="/#drinks">Drinks</a> <a href="/#drinks">Drinks</a>
<a href="/#openings">Openings</a>
<!-- Page navigation links --> <a href="/#about">About</a>
<a href="/events">Events Page</a> <a href="/#contact">Contact</a>
<a href="/gallery">Gallery Page</a>
<a href="/openings">Openings</a>
</div> </div>
</div>
<a href="/About">About</a>
<a href="/Contact">Contact</a>
</nav> </nav>
</header> </header>
<div class="header-spacer"></div> <div class="header-spacer"></div>

10
src/pages/index.astro
View File

@ -39,6 +39,16 @@ const events = [
Erlebt einen musikalischen Abend mit der Band <b>Crepes Sucette</b> <br> Erlebt einen musikalischen Abend mit der Band <b>Crepes Sucette</b> <br>
Jetzt reservieren: <a href="tel:+41772322770">077 232 27 70</a>`, Jetzt reservieren: <a href="tel:+41772322770">077 232 27 70</a>`,
}, },
{
image: "/images/kevin_mcflannigan.jpeg",
title: "Kevin McFlannigan <br> Live Music im Gallus Pub!",
date: "Sa, 27. September 2025",
description: `
<b>ab 20:00 Uhr</b> <br>
Singer & Songwriter Kevin McFlannigan <br>
Eintritt ist Frei / Hutkollekte <br>
`,
},
]; ];
const images = [ const images = [

47
styles/components/Header.css
View File

@ -43,8 +43,7 @@
align-items: center; align-items: center;
} }
.nav-main a, .nav-main a {
.dropdbtn {
margin: 0 1rem; margin: 0 1rem;
color: white; color: white;
text-decoration: none; text-decoration: none;
@ -52,45 +51,10 @@
cursor: pointer; cursor: pointer;
} }
.nav-main a:hover, .nav-main a:hover {
.dropdbtn:hover {
color: #ffa500; color: #ffa500;
} }
/* Dropdown für Home */
.dropdown {
position: relative;
display: inline-block;
}
.dropdown-content {
display: none;
position: absolute;
background-color: #0e0c0c;
min-width: 200px;
z-index: 1;
border: 1px solid #444;
border-radius: 4px;
max-height: 400px;
overflow-y: auto;
}
.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) { @media (max-width: 768px) {
.header { .header {
height: 65px; height: 65px;
@ -101,10 +65,6 @@
height: 3em; height: 3em;
} }
.dropdown-content {
right: 0;
}
.header-spacer { .header-spacer {
height: 65px; height: 65px;
} }
@ -121,8 +81,7 @@
height: 2.5em; height: 2.5em;
} }
.nav-main a, .nav-main a {
.dropdbtn {
margin: 0 0.5rem; margin: 0 0.5rem;
font-size: 0.9rem; font-size: 0.9rem;
} }