This commit is contained in:
lucashahmann committed 2026-10-19 21:01:28 +02:00
1 parent a6019c0440
commit e5869dc6cb
10 files changed
-312

No files matched your search

-103
View File
@@ -1,103 +0,0 @@
+++
title = ""
menu = "main"
url = "/about/"
+++
<section id="team">
<h1 style="text-align:center;">Bandmitglieder</h1>
<!-- Mitglied 1 -->
<div class="team-row">
<div class="team-text">
<h2>Olly</h2>
<p>Lead Gitarrist und Sänger</p>
</div>
<div class="team-image">
<img src="/img/about/Olly_compressed.jpg" alt="Olly">
</div>
</div>
<!-- Mitglied 2 -->
<div class="team-row">
<div class="team-image">
<img src="/img/about/Lucas_compressed.jpg" alt="Lucas">
</div>
<div class="team-text">
<h2>Lucas</h2>
<p>Rhytmusgitarrist</p>
</div>
</div>
<!-- Mitglied 3 -->
<div class="team-row">
<div class="team-text">
<h2>Ahrens</h2>
<p>Schlagzeuger</p>
</div>
<div class="team-image">
<img src="/img/about/Ahrens_compressed.jpg" alt="John Doe">
</div>
</div>
<!-- Mitglied 4 -->
<div class="team-row">
<div class="team-image">
<img src="/img/about/Felix_compressed.jpg" alt="John Doe">
</div>
<div class="team-text">
<h2>Felix</h2>
<p>On the Bass</p>
</div>
</div>
<div id="Gruppenfoto">
<img src="/img/about/Gruppenbild_compressed.jpg" class="responsive-img" alt="Gruppenfoto" width="1200" height="800">
</div>
</section>
<style>
#team {
max-width: 1000px;
margin: 0 auto;
padding: 2rem;
}
.team-row {
display: flex;
align-items: center;
justify-content: space-between;
margin: 2rem 0;
gap: 2rem;
}
.team-text {
flex: 1;
}
.team-image img {
width: 300px;
height: auto;
border-radius: 10px;
}
.responsive-img {
max-width: 100%;
height: auto;
display: block;
margin: 2rem auto 0 auto; /* zentriert auf Mobil */
}
@media (max-width: 768px) {
.team-row {
flex-direction: column-reverse;
text-align: center;
}
.team-image img {
width: 80%;
margin: 0 auto;
}
}
</style>
-7
View File
@@ -1,7 +0,0 @@
---
title: "Galerie"
images:
- "https://picsum.photos/seed/picsum/200/300"
- "https://picsum.photos/200/300?grayscale"
- "https://picsum.photos/200/300/?blur"
---
-15
View File
@@ -1,15 +0,0 @@
{{ define "main" }}
<link rel="stylesheet" href="/css/carousel.css">
<script defer src="/js/carousel.js"></script>
<section class="carousel">
<div class="carousel-inner">
{{ range $index, $img := .Params.images }}
<div class="carousel-item {{ if eq $index 0 }}active{{ end }}">
<img src="{{ $img }}" alt="Slide {{ add $index 1 }}">
</div>
{{ end }}
</div>
<button class="prev">&#10094;</button>
<button class="next">&#10095;</button>
</section>
{{ end }}
-43
View File
@@ -1,43 +0,0 @@
.carousel {
position: relative;
/*max-width: 1000px; */
margin: auto;
overflow: hidden;
}
.carousel-inner {
display: flex;
transition: transform 0.5s ease;
}
.carousel-item {
min-width: 100%;
box-sizing: border-box;
}
.carousel-item img {
width: 100%;
display: block;
border-radius: 8px;
}
button.prev,
button.next {
position: absolute;
top: 50%;
transform: translateY(-50%);
background-color: rgba(0,0,0,0.5);
color: #fff;
border: none;
padding: 10px 15px;
cursor: pointer;
border-radius: 50%;
font-size: 2rem;
}
button.prev { left: 10px; }
button.next { right: 10px; }
button:hover {
background-color: rgba(0,0,0,0.8);
}
-59
View File
@@ -1,59 +0,0 @@
/* Footer Grundlayout */
#site_footer {
background-color: #111;
color: #eee;
padding: 30px 20px;
font-family: 'Montserrat', sans-serif;
border-top: 2px solid #eee;
}
#site_footer a {
color: #eee;
text-decoration: none;
margin-left: 15px;
font-weight: bold;
transition: color 0.3s;
}
#site_footer a:hover {
color: #fff;
}
.footer-container {
display: flex;
justify-content: space-between;
align-items: flex-start;
max-width: 1000px;
margin: auto;
flex-wrap: wrap;
}
.footer-left p {
margin: 5px 0;
font-size: 0.95rem;
}
.footer-right {
margin-top: 10px;
}
.footer-right a:first-child {
margin-left: 0;
}
/* Mobile Responsive */
@media (max-width: 600px) {
.footer-container {
flex-direction: column;
align-items: center;
text-align: center;
}
.footer-right {
margin-top: 15px;
}
#site_footer a {
margin: 0 10px;
}
}
-25
View File
@@ -1,25 +0,0 @@
#logo {
display: flex;
align-items: center;
justify-content: center;
}
#main_navigation {
display: flex; /* Container wird Flexbox */
align-items: center;
justify-content: center;
gap: 40px; /* Abstand zwischen den Links */
}
#main_navigation a {
text-decoration: none !important;
color: #eee;
cursor: pointer;
transition: color 0.3s;
font-size: 2rem;
}
#main_navigation a:hover {
text-decoration: underline; /* nur beim Überfahren */
color: #fff;
}
-29
View File
@@ -1,29 +0,0 @@
#main_image {
display: flex;
align-items: center;
justify-content: center;
}
/* Responsive Schriftgrößen */
@media (max-width: 768px) {
section {
padding: 1rem;
}
h1 {
font-size: 1.5rem;
}
}
@media (max-width: 480px) {
h1 {
font-size: 1.25rem;
}
p {
font-size: 0.95rem;
}
}
#spotify_link {
display: flex;
align-items: center;
justify-content: center;
}
-14
View File
@@ -1,14 +0,0 @@
body {
font-family: 'Montserrat', sans-serif;
background: #111;
color: #eee;
margin: 20;
}
h1, h2, h3 {
font-family: 'Oswald', sans-serif;
}
.spacer {
height: 30px; /* amount of vertical space */
}
-17
View File
@@ -1,17 +0,0 @@
const carousel = document.querySelector('.carousel-inner');
const slides = document.querySelectorAll('.carousel-item');
let index = 0;
document.querySelector('.next').addEventListener('click', () => {
index = (index + 1) % slides.length;
updateCarousel();
});
document.querySelector('.prev').addEventListener('click', () => {
index = (index - 1 + slides.length) % slides.length;
updateCarousel();
});
function updateCarousel() {
carousel.style.transform = `translateX(-${index * 100}%)`;
}
View File
Whitespace-only changes.