Compare commits
37 Commits
feature/is
...
feature/is
| Author | SHA1 | Date | |
|---|---|---|---|
| 127faaffaf | |||
| c6eda36750 | |||
| 336fbc12a6 | |||
|
8b73603293 | ||
| d609175b3c | |||
|
|
1fcdca95b7 | ||
| 88ef7aa6ac | |||
| bf53da13be | |||
| 2307c379dc | |||
| 2c6ed749d5 | |||
| c2f2709790 | |||
| 69ca8efa47 | |||
| 40001adbce | |||
| 158f07e374 | |||
| 76b1ec58c2 | |||
| 565c8b304d | |||
| 51d4f96b20 | |||
| 5167634ee6 | |||
| 0995684989 | |||
| 7706f11106 | |||
| 143962a0fa | |||
| 04d570cb91 | |||
|
|
8706cb2b70 | ||
|
|
3df40952c1 | ||
|
|
c467f8cc1e | ||
|
|
d4a59ee306 | ||
|
|
7be0a2e9d5 | ||
|
|
10bc7c1d77 | ||
|
|
e24db23888 | ||
| 48df09df6c | |||
|
|
3bbbe85599 | ||
| 88780c300a | |||
|
|
cc7b2d8d70 | ||
| ea85280cde | |||
| 958f52fd5d | |||
| 9c68365ab8 | |||
| 5b304730fa |
71
.gitea/workflows/deploy-test.yml
Normal file
71
.gitea/workflows/deploy-test.yml
Normal file
@@ -0,0 +1,71 @@
|
||||
name: Deploy Feature Branch to Test
|
||||
|
||||
on:
|
||||
push:
|
||||
branches:
|
||||
- "feature/**"
|
||||
|
||||
jobs:
|
||||
deploy:
|
||||
runs-on: ubuntu-latest
|
||||
container:
|
||||
volumes:
|
||||
- /var/www/test/html:/deploy
|
||||
steps:
|
||||
- name: Checkout
|
||||
uses: actions/checkout@v4
|
||||
|
||||
- name: Show branch info
|
||||
run: |
|
||||
echo "=== Deploying branch: ${{ gitea.ref_name }} ==="
|
||||
echo "=== Commit: ${{ gitea.sha }} ==="
|
||||
echo "=== By: ${{ gitea.actor }} ==="
|
||||
date
|
||||
|
||||
- name: Deploy to test environment
|
||||
run: |
|
||||
echo "Syncing files to test environment..."
|
||||
apt-get update -qq && apt-get install -y -qq rsync > /dev/null 2>&1 || true
|
||||
|
||||
rsync -av --delete \
|
||||
--exclude='.git' \
|
||||
--exclude='.gitea' \
|
||||
--exclude='.husky' \
|
||||
--exclude='.prettierrc' \
|
||||
--exclude='.prettierignore' \
|
||||
--exclude='.stylelintrc.json' \
|
||||
--exclude='.htmlhintrc' \
|
||||
--exclude='.gitignore' \
|
||||
--exclude='.dockerignore' \
|
||||
--exclude='Dockerfile' \
|
||||
--exclude='nginx.conf' \
|
||||
--exclude='eslint.config.js' \
|
||||
--exclude='package.json' \
|
||||
--exclude='docker-preview.png' \
|
||||
--exclude='page-preview.png' \
|
||||
--exclude='screenshot-landingpage*' \
|
||||
--exclude='AGENTS.md' \
|
||||
--exclude='README.md' \
|
||||
./ /deploy/
|
||||
|
||||
# Set haus-schleusingen.html as index
|
||||
cp /deploy/haus-schleusingen.html /deploy/index.html 2>/dev/null || true
|
||||
|
||||
echo "✅ Deployment complete!"
|
||||
|
||||
- name: Set permissions
|
||||
run: |
|
||||
chown -R 33:33 /deploy/ 2>/dev/null || true
|
||||
chmod -R 755 /deploy/ 2>/dev/null || true
|
||||
echo "✅ Permissions set"
|
||||
|
||||
- name: Deployment summary
|
||||
run: |
|
||||
echo "=========================================="
|
||||
echo " 🚀 Deployment Summary"
|
||||
echo "=========================================="
|
||||
echo " Branch: ${{ gitea.ref_name }}"
|
||||
echo " Commit: ${{ gitea.sha }}"
|
||||
echo " Target: http://178.104.150.0/"
|
||||
echo " Time: $(date)"
|
||||
echo "=========================================="
|
||||
BIN
bilder/favicon/apple-touch-icon.png
Normal file
BIN
bilder/favicon/apple-touch-icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 54 KiB |
BIN
bilder/favicon/favicon-16x16.png
Normal file
BIN
bilder/favicon/favicon-16x16.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 851 B |
BIN
bilder/favicon/favicon-32x32.png
Normal file
BIN
bilder/favicon/favicon-32x32.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.4 KiB |
BIN
bilder/favicon/favicon.ico
Normal file
BIN
bilder/favicon/favicon.ico
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.3 KiB |
10
bilder/favicon/site.webmanifest
Normal file
10
bilder/favicon/site.webmanifest
Normal file
@@ -0,0 +1,10 @@
|
||||
{
|
||||
"name": "Haus Schleusingen",
|
||||
"short_name": "HS",
|
||||
"icons": [
|
||||
{ "src": "/bilder/favicon/favicon-32x32.png", "sizes": "32x32", "type": "image/png" },
|
||||
{ "src": "/bilder/favicon/favicon-16x16.png", "sizes": "16x16", "type": "image/png" }
|
||||
],
|
||||
"theme_color": "#1c1917",
|
||||
"background_color": "#fafaf9"
|
||||
}
|
||||
@@ -1,7 +1,55 @@
|
||||
/* SKIP LINK */
|
||||
.skip-link {
|
||||
position: absolute;
|
||||
left: -9999px;
|
||||
top: 0;
|
||||
background: var(--accent);
|
||||
color: var(--white);
|
||||
padding: 0.75rem 1.5rem;
|
||||
font-size: 0.85rem;
|
||||
font-weight: 500;
|
||||
z-index: 200;
|
||||
text-decoration: none;
|
||||
transition: none;
|
||||
}
|
||||
|
||||
.skip-link:focus {
|
||||
left: 0;
|
||||
outline: 2px solid var(--white);
|
||||
outline-offset: 2px;
|
||||
}
|
||||
|
||||
/* FOCUS VISIBLE */
|
||||
*:focus-visible {
|
||||
outline: 2px solid var(--accent);
|
||||
outline-offset: 2px;
|
||||
}
|
||||
|
||||
.lightbox-close:focus-visible {
|
||||
outline: 2px solid var(--white);
|
||||
outline-offset: 2px;
|
||||
}
|
||||
|
||||
button:focus-visible,
|
||||
a:focus-visible {
|
||||
outline: 2px solid var(--accent);
|
||||
outline-offset: 2px;
|
||||
}
|
||||
|
||||
.grid-item:focus-visible {
|
||||
outline: 2px solid var(--accent);
|
||||
outline-offset: 2px;
|
||||
}
|
||||
|
||||
.floor-header:focus-visible {
|
||||
outline: 2px solid var(--accent);
|
||||
outline-offset: -2px;
|
||||
}
|
||||
|
||||
:root {
|
||||
--cream: #f5f0e8;
|
||||
--warm: #e8dfd0;
|
||||
--stone: #9e9485;
|
||||
--stone: #7a7062;
|
||||
--dark: #1c1a17;
|
||||
--charcoal: #2e2b26;
|
||||
--accent: #8b6914;
|
||||
@@ -92,23 +140,105 @@ nav.scrolled .nav-links a:hover {
|
||||
|
||||
.nav-cta {
|
||||
font-family: "DM Sans", sans-serif;
|
||||
font-size: 0.78rem;
|
||||
font-weight: 500;
|
||||
letter-spacing: 0.1em;
|
||||
font-size: 0.82rem;
|
||||
font-weight: 600;
|
||||
letter-spacing: 0.12em;
|
||||
text-transform: uppercase;
|
||||
background: var(--accent);
|
||||
color: var(--white);
|
||||
border: none;
|
||||
padding: 0.65rem 1.5rem;
|
||||
padding: 0.8rem 2rem;
|
||||
cursor: pointer;
|
||||
border-radius: 2px;
|
||||
box-shadow: 0 2px 12px rgb(139 105 20 / 35%);
|
||||
transition:
|
||||
background 0.3s,
|
||||
transform 0.2s;
|
||||
transform 0.2s,
|
||||
box-shadow 0.3s;
|
||||
}
|
||||
|
||||
.nav-cta:hover {
|
||||
background: var(--accent-light);
|
||||
transform: translateY(-1px);
|
||||
transform: translateY(-2px);
|
||||
box-shadow: 0 4px 20px rgb(139 105 20 / 50%);
|
||||
}
|
||||
|
||||
/* HAMBURGER */
|
||||
.nav-hamburger {
|
||||
display: none;
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
background: none;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
z-index: 110;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.nav-hamburger span,
|
||||
.nav-hamburger span::before,
|
||||
.nav-hamburger span::after {
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 2px;
|
||||
background: var(--white);
|
||||
border-radius: 1px;
|
||||
transition:
|
||||
transform 0.3s ease,
|
||||
opacity 0.3s ease,
|
||||
background 0.4s;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.nav-hamburger span::before,
|
||||
.nav-hamburger span::after {
|
||||
content: "";
|
||||
}
|
||||
|
||||
.nav-hamburger span::before {
|
||||
transform: translateY(-7px);
|
||||
}
|
||||
|
||||
.nav-hamburger span::after {
|
||||
transform: translateY(7px);
|
||||
}
|
||||
|
||||
nav.scrolled .nav-hamburger span,
|
||||
nav.scrolled .nav-hamburger span::before,
|
||||
nav.scrolled .nav-hamburger span::after {
|
||||
background: var(--dark);
|
||||
}
|
||||
|
||||
.nav-hamburger.active span {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.nav-hamburger.active span::before {
|
||||
transform: rotate(45deg);
|
||||
background: var(--dark);
|
||||
}
|
||||
|
||||
.nav-hamburger.active span::after {
|
||||
transform: rotate(-45deg);
|
||||
background: var(--dark);
|
||||
}
|
||||
|
||||
.nav-mobile-overlay {
|
||||
display: none;
|
||||
position: fixed;
|
||||
inset: 0;
|
||||
background: rgb(28 26 23 / 50%);
|
||||
z-index: 90;
|
||||
opacity: 0;
|
||||
transition: opacity 0.3s ease;
|
||||
}
|
||||
|
||||
.nav-mobile-overlay.active {
|
||||
display: block;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* HERO */
|
||||
@@ -909,6 +1039,36 @@ nav.scrolled .nav-links a:hover {
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.form-errors {
|
||||
background: #fdf2f2;
|
||||
border: 1px solid #e8a0a0;
|
||||
padding: 1rem 1.2rem;
|
||||
margin-bottom: 1.2rem;
|
||||
}
|
||||
|
||||
.form-errors ul {
|
||||
margin: 0;
|
||||
padding: 0 0 0 1.2rem;
|
||||
list-style: disc;
|
||||
}
|
||||
|
||||
.form-errors li {
|
||||
font-size: 0.85rem;
|
||||
color: #9e2c2c;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.hp-field {
|
||||
position: absolute;
|
||||
left: -9999px;
|
||||
top: -9999px;
|
||||
width: 0;
|
||||
height: 0;
|
||||
overflow: hidden;
|
||||
opacity: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.form-success {
|
||||
display: none;
|
||||
text-align: center;
|
||||
@@ -928,6 +1088,29 @@ nav.scrolled .nav-links a:hover {
|
||||
color: var(--stone);
|
||||
}
|
||||
|
||||
.contact-details {
|
||||
text-align: center;
|
||||
margin-top: 2rem;
|
||||
padding-top: 1.5rem;
|
||||
border-top: 1px solid var(--warm);
|
||||
}
|
||||
|
||||
.contact-details p {
|
||||
font-size: 0.95rem;
|
||||
color: var(--stone);
|
||||
}
|
||||
|
||||
.contact-details a {
|
||||
color: var(--accent);
|
||||
text-decoration: none;
|
||||
font-weight: 600;
|
||||
transition: color 0.2s;
|
||||
}
|
||||
|
||||
.contact-details a:hover {
|
||||
color: var(--accent-light);
|
||||
}
|
||||
|
||||
/* FOOTER */
|
||||
footer {
|
||||
background: var(--dark);
|
||||
@@ -1015,6 +1198,58 @@ footer {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.nav-hamburger {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
/* Mobile slide-down nav */
|
||||
nav.mobile-open .nav-links {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
background: rgb(253 252 250 / 98%);
|
||||
backdrop-filter: blur(12px);
|
||||
padding: 5rem 1.5rem 2rem;
|
||||
gap: 0;
|
||||
z-index: 95;
|
||||
border-bottom: 1px solid var(--warm);
|
||||
animation: slideDown 0.3s ease;
|
||||
}
|
||||
|
||||
nav.mobile-open .nav-links a {
|
||||
color: var(--charcoal);
|
||||
font-size: 1rem;
|
||||
padding: 1rem 0;
|
||||
border-bottom: 1px solid var(--warm);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
min-height: 44px;
|
||||
}
|
||||
|
||||
nav.mobile-open .nav-hamburger span,
|
||||
nav.mobile-open .nav-hamburger span::before,
|
||||
nav.mobile-open .nav-hamburger span::after {
|
||||
background: var(--dark);
|
||||
}
|
||||
|
||||
nav.mobile-open .nav-hamburger.active span {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
@keyframes slideDown {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: translateY(-10px);
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
|
||||
.hero-content {
|
||||
padding: 0 1.5rem 4rem;
|
||||
}
|
||||
|
||||
223
datenschutz.html
Normal file
223
datenschutz.html
Normal file
@@ -0,0 +1,223 @@
|
||||
<!doctype html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Datenschutzerklärung – Haus Schleusingen</title>
|
||||
<meta name="description" content="Datenschutzerklärung der Website haus-schleusingen.de" />
|
||||
<meta name="robots" content="noindex" />
|
||||
<link rel="canonical" href="https://haus-schleusingen.de/datenschutz.html" />
|
||||
<link rel="stylesheet" href="fonts/fonts.css" />
|
||||
<link rel="stylesheet" href="css/haus-schleusingen.css" />
|
||||
<style>
|
||||
.legal-page {
|
||||
max-width: 800px;
|
||||
margin: 0 auto;
|
||||
padding: 8rem 3rem 6rem;
|
||||
min-height: 70vh;
|
||||
}
|
||||
.legal-page .section-eyebrow { margin-bottom: 0.75rem; }
|
||||
.legal-page h1 {
|
||||
font-family: "Cormorant Garamond", serif;
|
||||
font-size: clamp(2rem, 4vw, 3rem);
|
||||
font-weight: 300;
|
||||
color: var(--charcoal);
|
||||
margin-bottom: 2.5rem;
|
||||
line-height: 1.2;
|
||||
}
|
||||
.legal-page h2 {
|
||||
font-family: "Cormorant Garamond", serif;
|
||||
font-size: 1.5rem;
|
||||
font-weight: 400;
|
||||
color: var(--charcoal);
|
||||
margin-top: 2.5rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
.legal-page h3 {
|
||||
font-size: 0.95rem;
|
||||
font-weight: 600;
|
||||
color: var(--dark);
|
||||
margin-top: 1.5rem;
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
.legal-page p, .legal-page ul {
|
||||
font-size: 0.9rem;
|
||||
line-height: 1.85;
|
||||
color: var(--stone);
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
.legal-page ul { padding-left: 1.25rem; }
|
||||
.legal-page ul li { margin-bottom: 0.4rem; }
|
||||
.legal-page a {
|
||||
color: var(--accent);
|
||||
text-decoration: none;
|
||||
font-weight: 500;
|
||||
transition: color 0.2s;
|
||||
}
|
||||
.legal-page a:hover { color: var(--accent-light); }
|
||||
.legal-page address {
|
||||
font-style: normal;
|
||||
line-height: 1.85;
|
||||
color: var(--stone);
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
.legal-back {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
margin-top: 3rem;
|
||||
padding: 0.8rem 2rem;
|
||||
font-family: "DM Sans", sans-serif;
|
||||
font-size: 0.78rem;
|
||||
font-weight: 500;
|
||||
letter-spacing: 0.12em;
|
||||
text-transform: uppercase;
|
||||
background: var(--accent);
|
||||
color: var(--white);
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
text-decoration: none;
|
||||
border-radius: 2px;
|
||||
transition: background 0.3s, transform 0.2s;
|
||||
}
|
||||
.legal-back:hover {
|
||||
background: var(--accent-light);
|
||||
transform: translateY(-1px);
|
||||
color: var(--white);
|
||||
}
|
||||
.legal-divider {
|
||||
border: none;
|
||||
border-top: 1px solid var(--warm);
|
||||
margin: 2rem 0;
|
||||
}
|
||||
@media (width <= 768px) {
|
||||
.legal-page { padding: 6rem 1.5rem 4rem; }
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<nav id="navbar" class="scrolled">
|
||||
<div class="nav-logo">Bahnhofstraße 10</div>
|
||||
<ul class="nav-links">
|
||||
<li><a href="haus-schleusingen.html#galerie">Galerie</a></li>
|
||||
<li><a href="haus-schleusingen.html#grundriss">Grundriss</a></li>
|
||||
<li><a href="haus-schleusingen.html#miete">Miete</a></li>
|
||||
<li><a href="haus-schleusingen.html#lage">Lage</a></li>
|
||||
</ul>
|
||||
<a href="haus-schleusingen.html#kontakt" class="nav-cta" style="text-decoration:none;">Jetzt anfragen</a>
|
||||
</nav>
|
||||
|
||||
<main class="legal-page">
|
||||
<div class="section-eyebrow">Datenschutz</div>
|
||||
<h1>Datenschutzerklärung</h1>
|
||||
|
||||
<h2>1. Verantwortliche Stelle</h2>
|
||||
<address>
|
||||
Martin Kiesewetter<br />
|
||||
Am Schaftalsgraben 4<br />
|
||||
98529 Suhl<br />
|
||||
Telefon: 0176 – 45853923<br />
|
||||
E-Mail: <a href="mailto:mki@kies-media.de">mki@kies-media.de</a>
|
||||
</address>
|
||||
<p>
|
||||
Diese Datenschutzerklärung informiert Sie über die Art, den Umfang und den Zweck der Erhebung und Verwendung personenbezogener Daten auf dieser Website.
|
||||
</p>
|
||||
|
||||
<hr class="legal-divider" />
|
||||
|
||||
<h2>2. Erhebung und Speicherung personenbezogener Daten</h2>
|
||||
|
||||
<h3>a) Beim Besuch der Website</h3>
|
||||
<p>
|
||||
Beim Aufrufen dieser Website werden durch den Hosting-Anbieter automatisch Informationen allgemeiner Natur erfasst. Diese Informationen (Server-Logfiles) beinhalten etwa die Art des Webbrowsers, das verwendete Betriebssystem, den Domainnamen Ihres Internet-Service-Providers, Ihre IP-Adresse und Ähnliches. Sie werden insbesondere zu einem sicheren und reibungslosen Betrieb der Website benötigt.
|
||||
</p>
|
||||
<ul>
|
||||
<li>IP-Adresse</li>
|
||||
<li>Datum und Uhrzeit der Anfrage</li>
|
||||
<li>Zeitzonenunterschied zur Greenwich Mean Time (GMT)</li>
|
||||
<li>Inhalt der Anforderung (konkrete Seite)</li>
|
||||
<li>Zugriffsstatus/HTTP-Statuscode</li>
|
||||
<li>Jeweils übertragene Datenmenge</li>
|
||||
<li>Website, von der die Anforderung kommt (Referrer-URL)</li>
|
||||
<li>Verwendeter Browser</li>
|
||||
<li>Verwendetes Betriebssystem</li>
|
||||
</ul>
|
||||
<p>
|
||||
Die Verarbeitung dieser Daten erfolgt auf Grundlage von Art. 6 Abs. 1 lit. f DSGVO. Die Daten werden nicht mit anderen Datenquellen zusammengeführt und nach 30 Tagen automatisch gelöscht.
|
||||
</p>
|
||||
|
||||
<h3>b) Kontakt per E-Mail</h3>
|
||||
<p>
|
||||
Auf dieser Website wird die Kontaktaufnahme über einen E-Mail-Link (mailto:) angeboten. Wenn Sie uns per E-Mail kontaktieren, werden Ihre Angaben (E-Mail-Adresse, ggf. Name und Nachricht) zwecks Bearbeitung Ihrer Anfrage gespeichert. Die Daten werden ausschließlich zur Beantwortung Ihrer Anfrage verwendet und nach Abschluss der Kommunikation gelöscht.
|
||||
</p>
|
||||
<p>
|
||||
Rechtsgrundlage ist Art. 6 Abs. 1 lit. a DSGVO (Ihre Einwilligung) oder Art. 6 Abs. 1 lit. b DSGVO (zur Erfüllung eines Vertrags bzw. vorvertraglicher Maßnahmen).
|
||||
</p>
|
||||
|
||||
<hr class="legal-divider" />
|
||||
|
||||
<h2>3. Cookies</h2>
|
||||
<p>
|
||||
Diese Website verwendet <strong>keine Cookies</strong>. Es werden keine Tracking-Cookies, Werbe-Cookies oder sonstige Cookies gesetzt.
|
||||
</p>
|
||||
|
||||
<h2>4. Tracking & Analyse</h2>
|
||||
<p>
|
||||
Diese Website setzt <strong>keine Tracking- oder Analyse-Tools</strong> ein. Es werden keine Besucherstatistiken erstellt, kein Google Analytics, kein Facebook Pixel und keine ähnlichen Dienste verwendet.
|
||||
</p>
|
||||
|
||||
<h2>5. Social-Media-Plugins</h2>
|
||||
<p>
|
||||
Diese Website verwendet <strong>keine Social-Media-Plugins</strong> (Facebook, Twitter, Instagram etc.).
|
||||
</p>
|
||||
|
||||
<hr class="legal-divider" />
|
||||
|
||||
<h2>6. Google Maps</h2>
|
||||
<p>
|
||||
Auf dieser Website wird ein Google Maps-Embed (Kartenansicht) eingebunden. Beim Laden der Karte werden Daten an Google übertragen, darunter möglicherweise Ihre IP-Adresse. Google Maps wird ausschließlich genutzt, um Ihnen die Lage des Mietobjekts anzuzeigen.
|
||||
</p>
|
||||
<p>
|
||||
Weitere Informationen zum Datenschutz bei Google finden Sie unter: <a href="https://policies.google.com/privacy" target="_blank" rel="noopener">https://policies.google.com/privacy</a>
|
||||
</p>
|
||||
<p>
|
||||
Rechtsgrundlage: Art. 6 Abs. 1 lit. f DSGVO (berechtigte Interessen an der Darstellung des Objektstandorts).
|
||||
</p>
|
||||
|
||||
<hr class="legal-divider" />
|
||||
|
||||
<h2>7. SSL-Verschlüsselung</h2>
|
||||
<p>
|
||||
Diese Seite nutzt aus Sicherheitsgründen eine SSL-Verschlüsselung. Eine verschlüsselte Verbindung erkennen Sie daran, dass die Adresszeile des Browsers von „http://" auf „https://" wechselt und an dem Schloss-Symbol in Ihrer Browserzeile.
|
||||
</p>
|
||||
|
||||
<hr class="legal-divider" />
|
||||
|
||||
<h2>8. Ihre Rechte</h2>
|
||||
<p>Sie haben gegenüber uns folgende Rechte hinsichtlich der Sie betreffenden personenbezogenen Daten:</p>
|
||||
<ul>
|
||||
<li><strong>Recht auf Auskunft</strong> (Art. 15 DSGVO)</li>
|
||||
<li><strong>Recht auf Berichtigung</strong> (Art. 16 DSGVO)</li>
|
||||
<li><strong>Recht auf Löschung</strong> (Art. 17 DSGVO)</li>
|
||||
<li><strong>Recht auf Einschränkung der Verarbeitung</strong> (Art. 18 DSGVO)</li>
|
||||
<li><strong>Recht auf Datenübertragbarkeit</strong> (Art. 20 DSGVO)</li>
|
||||
<li><strong>Widerspruchsrecht</strong> (Art. 21 DSGVO)</li>
|
||||
<li><strong>Recht auf Widerruf der Einwilligung</strong> (Art. 7 Abs. 3 DSGVO)</li>
|
||||
<li><strong>Beschwerderecht bei einer Aufsichtsbehörde</strong> (Art. 77 DSGVO)</li>
|
||||
</ul>
|
||||
<p>
|
||||
Zur Ausübung Ihrer Rechte wenden Sie sich bitte an: <a href="mailto:mki@kies-media.de">mki@kies-media.de</a>
|
||||
</p>
|
||||
|
||||
<a href="haus-schleusingen.html" class="legal-back">← Zurück zum Objekt</a>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
<div class="footer-logo">Bahnhofstraße 10 · Schleusingen</div>
|
||||
<div class="footer-links">
|
||||
<a href="impressum.html">Impressum</a>
|
||||
<a href="datenschutz.html">Datenschutz</a>
|
||||
</div>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
@@ -13,7 +13,6 @@ module.exports = [
|
||||
sourceType: "script",
|
||||
globals: {
|
||||
...globals.browser,
|
||||
...globals.jquery,
|
||||
},
|
||||
},
|
||||
plugins: {
|
||||
|
||||
185
impressum.html
Normal file
185
impressum.html
Normal file
@@ -0,0 +1,185 @@
|
||||
<!doctype html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Impressum – Haus Schleusingen</title>
|
||||
<meta name="description" content="Impressum der Website haus-schleusingen.de" />
|
||||
<meta name="robots" content="noindex" />
|
||||
<link rel="canonical" href="https://haus-schleusingen.de/impressum.html" />
|
||||
<link rel="stylesheet" href="fonts/fonts.css" />
|
||||
<link rel="stylesheet" href="css/haus-schleusingen.css" />
|
||||
<style>
|
||||
.legal-page {
|
||||
max-width: 800px;
|
||||
margin: 0 auto;
|
||||
padding: 8rem 3rem 6rem;
|
||||
min-height: 70vh;
|
||||
}
|
||||
.legal-page .section-eyebrow { margin-bottom: 0.75rem; }
|
||||
.legal-page h1 {
|
||||
font-family: "Cormorant Garamond", serif;
|
||||
font-size: clamp(2rem, 4vw, 3rem);
|
||||
font-weight: 300;
|
||||
color: var(--charcoal);
|
||||
margin-bottom: 2.5rem;
|
||||
line-height: 1.2;
|
||||
}
|
||||
.legal-page h2 {
|
||||
font-family: "Cormorant Garamond", serif;
|
||||
font-size: 1.5rem;
|
||||
font-weight: 400;
|
||||
color: var(--charcoal);
|
||||
margin-top: 2.5rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
.legal-page h3 {
|
||||
font-size: 0.95rem;
|
||||
font-weight: 600;
|
||||
color: var(--dark);
|
||||
margin-top: 1.5rem;
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
.legal-page p, .legal-page ul {
|
||||
font-size: 0.9rem;
|
||||
line-height: 1.85;
|
||||
color: var(--stone);
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
.legal-page ul { padding-left: 1.25rem; }
|
||||
.legal-page ul li { margin-bottom: 0.4rem; }
|
||||
.legal-page a {
|
||||
color: var(--accent);
|
||||
text-decoration: none;
|
||||
font-weight: 500;
|
||||
transition: color 0.2s;
|
||||
}
|
||||
.legal-page a:hover { color: var(--accent-light); }
|
||||
.legal-page address {
|
||||
font-style: normal;
|
||||
line-height: 1.85;
|
||||
color: var(--stone);
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
.legal-back {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
margin-top: 3rem;
|
||||
padding: 0.8rem 2rem;
|
||||
font-family: "DM Sans", sans-serif;
|
||||
font-size: 0.78rem;
|
||||
font-weight: 500;
|
||||
letter-spacing: 0.12em;
|
||||
text-transform: uppercase;
|
||||
background: var(--accent);
|
||||
color: var(--white);
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
text-decoration: none;
|
||||
border-radius: 2px;
|
||||
transition: background 0.3s, transform 0.2s;
|
||||
}
|
||||
.legal-back:hover {
|
||||
background: var(--accent-light);
|
||||
transform: translateY(-1px);
|
||||
color: var(--white);
|
||||
}
|
||||
.legal-divider {
|
||||
border: none;
|
||||
border-top: 1px solid var(--warm);
|
||||
margin: 2rem 0;
|
||||
}
|
||||
@media (width <= 768px) {
|
||||
.legal-page { padding: 6rem 1.5rem 4rem; }
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<nav id="navbar" class="scrolled">
|
||||
<div class="nav-logo">Bahnhofstraße 10</div>
|
||||
<ul class="nav-links">
|
||||
<li><a href="haus-schleusingen.html#galerie">Galerie</a></li>
|
||||
<li><a href="haus-schleusingen.html#grundriss">Grundriss</a></li>
|
||||
<li><a href="haus-schleusingen.html#miete">Miete</a></li>
|
||||
<li><a href="haus-schleusingen.html#lage">Lage</a></li>
|
||||
</ul>
|
||||
<a href="haus-schleusingen.html#kontakt" class="nav-cta" style="text-decoration:none;">Jetzt anfragen</a>
|
||||
</nav>
|
||||
|
||||
<main class="legal-page">
|
||||
<div class="section-eyebrow">Pflichtangaben</div>
|
||||
<h1>Impressum</h1>
|
||||
|
||||
<h2>Angaben gemäß § 5 TMG</h2>
|
||||
<address>
|
||||
Martin Kiesewetter<br />
|
||||
Am Schaftalsgraben 4<br />
|
||||
98529 Suhl<br />
|
||||
Deutschland
|
||||
</address>
|
||||
|
||||
<h3>Kontakt</h3>
|
||||
<ul>
|
||||
<li>Telefon: 0176 – 45853923</li>
|
||||
<li>E-Mail: <a href="mailto:mki@kies-media.de">mki@kies-media.de</a></li>
|
||||
</ul>
|
||||
|
||||
<hr class="legal-divider" />
|
||||
|
||||
<h2>Verantwortlich für den Inhalt nach § 55 Abs. 2 RStV</h2>
|
||||
<p>
|
||||
Martin Kiesewetter<br />
|
||||
Am Schaftalsgraben 4<br />
|
||||
98529 Suhl
|
||||
</p>
|
||||
|
||||
<hr class="legal-divider" />
|
||||
|
||||
<h2>Streitschlichtung</h2>
|
||||
<p>
|
||||
Die Europäische Kommission stellt eine Plattform zur Online-Streitbeilegung (OS) bereit:
|
||||
<a href="https://ec.europa.eu/consumers/odr/" target="_blank" rel="noopener">https://ec.europa.eu/consumers/odr/</a>
|
||||
</p>
|
||||
<p>
|
||||
Wir sind nicht bereit oder verpflichtet, an Streitbeilegungsverfahren vor einer Verbraucherschlichtungsstelle teilzunehmen.
|
||||
</p>
|
||||
|
||||
<hr class="legal-divider" />
|
||||
|
||||
<h2>Haftung für Inhalte</h2>
|
||||
<p>
|
||||
Als Diensteanbieter sind wir gemäß § 7 Abs.1 TMG für eigene Inhalte auf diesen Seiten nach den allgemeinen Gesetzen verantwortlich. Nach §§ 8 bis 10 TMG sind wir als Diensteanbieter jedoch nicht verpflichtet, übermittelte oder gespeicherte fremde Informationen zu überwachen oder nach Umständen zu forschen, die auf eine rechtswidrige Tätigkeit hinweisen.
|
||||
</p>
|
||||
<p>
|
||||
Verpflichtungen zur Entfernung oder Sperrung der Nutzung von Informationen nach den allgemeinen Gesetzen bleiben hiervon unberührt. Eine diesbezügliche Haftung ist jedoch erst ab dem Zeitpunkt der Kenntnis einer konkreten Rechtsverletzung möglich. Bei Bekanntwerden von entsprechenden Rechtsverletzungen werden wir diese Inhalte umgehend entfernen.
|
||||
</p>
|
||||
|
||||
<h2>Haftung für Links</h2>
|
||||
<p>
|
||||
Unser Angebot enthält Links zu externen Websites Dritter, auf deren Inhalte wir keinen Einfluss haben. Deshalb können wir für diese fremden Inhalte auch keine Gewähr übernehmen. Für die Inhalte der verlinkten Seiten ist stets der jeweilige Anbieter oder Betreiber der Seiten verantwortlich.
|
||||
</p>
|
||||
<p>
|
||||
Die verlinkten Seiten wurden zum Zeitpunkt der Verlinkung auf mögliche Rechtsverstöße überprüft. Rechtswidrige Inhalte waren zum Zeitpunkt der Verlinkung nicht erkennbar. Eine permanente inhaltliche Kontrolle der verlinkten Seiten ist jedoch ohne konkrete Anhaltspunkte einer Rechtsverletzung nicht zumutbar. Bei Bekanntwerden von Rechtsverletzungen werden wir derartige Links umgehend entfernen.
|
||||
</p>
|
||||
|
||||
<h2>Urheberrecht</h2>
|
||||
<p>
|
||||
Die durch die Seitenbetreiber erstellten Inhalte und Werke auf diesen Seiten unterliegen dem deutschen 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.
|
||||
</p>
|
||||
<p>
|
||||
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.
|
||||
</p>
|
||||
|
||||
<a href="haus-schleusingen.html" class="legal-back">← Zurück zum Objekt</a>
|
||||
</main>
|
||||
|
||||
<footer>
|
||||
<div class="footer-logo">Bahnhofstraße 10 · Schleusingen</div>
|
||||
<div class="footer-links">
|
||||
<a href="impressum.html">Impressum</a>
|
||||
<a href="datenschutz.html">Datenschutz</a>
|
||||
</div>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
@@ -1,16 +1,201 @@
|
||||
<?php
|
||||
session_start();
|
||||
|
||||
// --- Helper functions ---
|
||||
function normalizeContactValue(string $value): string
|
||||
{
|
||||
return trim($value);
|
||||
}
|
||||
|
||||
function escapeContactValue(string $value): string
|
||||
{
|
||||
return htmlspecialchars($value, ENT_QUOTES, 'UTF-8');
|
||||
}
|
||||
|
||||
function containsHeaderInjection(string $value): bool
|
||||
{
|
||||
return (bool) preg_match('/[\r\n]/', $value);
|
||||
}
|
||||
|
||||
|
||||
|
||||
// --- Form processing ---
|
||||
$formErrors = [];
|
||||
$formSuccess = false;
|
||||
if (!empty($_SESSION['form_success'])) {
|
||||
$formSuccess = true;
|
||||
unset($_SESSION['form_success']);
|
||||
}
|
||||
if (!empty($_SESSION['form_errors'])) {
|
||||
$formErrors = $_SESSION['form_errors'];
|
||||
unset($_SESSION['form_errors']);
|
||||
}
|
||||
if (!empty($_SESSION['form_data'])) {
|
||||
$formData = $_SESSION['form_data'];
|
||||
unset($_SESSION['form_data']);
|
||||
} else {
|
||||
$formData = ['fname' => '', 'lname' => '', 'email' => '', 'phone' => '', 'interest' => 'Besichtigung anfragen', 'message' => ''];
|
||||
}
|
||||
|
||||
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
|
||||
// Collect and normalize input
|
||||
$formData['fname'] = normalizeContactValue((string) ($_POST['fname'] ?? ''));
|
||||
$formData['lname'] = normalizeContactValue((string) ($_POST['lname'] ?? ''));
|
||||
$formData['email'] = normalizeContactValue((string) ($_POST['email'] ?? ''));
|
||||
$formData['phone'] = normalizeContactValue((string) ($_POST['phone'] ?? ''));
|
||||
$formData['interest'] = normalizeContactValue((string) ($_POST['interest'] ?? ''));
|
||||
$formData['message'] = normalizeContactValue((string) ($_POST['message'] ?? ''));
|
||||
|
||||
// Honeypot check – hidden field must be empty
|
||||
$honeypot = normalizeContactValue((string) ($_POST['website'] ?? ''));
|
||||
if ($honeypot !== '') {
|
||||
// Bot detected – pretend success
|
||||
header('Location: ' . $_SERVER['REQUEST_URI'] . '#form-result');
|
||||
$_SESSION['form_success'] = true;
|
||||
exit;
|
||||
} else {
|
||||
// Server-side validation
|
||||
if ($formData['fname'] === '') {
|
||||
$formErrors[] = 'Bitte geben Sie Ihren Vornamen an.';
|
||||
}
|
||||
if ($formData['lname'] === '') {
|
||||
$formErrors[] = 'Bitte geben Sie Ihren Nachnamen an.';
|
||||
}
|
||||
if ($formData['email'] === '' || !filter_var($formData['email'], FILTER_VALIDATE_EMAIL)) {
|
||||
$formErrors[] = 'Bitte geben Sie eine gültige E-Mail-Adresse an.';
|
||||
}
|
||||
if ($formData['message'] === '') {
|
||||
$formErrors[] = 'Bitte geben Sie eine Nachricht ein.';
|
||||
}
|
||||
|
||||
// Header injection check
|
||||
if (containsHeaderInjection($formData['email']) || containsHeaderInjection($formData['fname'] . ' ' . $formData['lname'])) {
|
||||
$formErrors[] = 'Ungültige Zeichen in den Eingabefeldern.';
|
||||
}
|
||||
|
||||
// Minimum time check – form submitted too fast (< 3 seconds)
|
||||
$formTime = isset($_POST['form_time']) ? (int) $_POST['form_time'] : 0;
|
||||
if ($formTime > 0 && (time() - $formTime) < 3) {
|
||||
$formErrors[] = 'Das Formular wurde zu schnell abgeschickt. Bitte versuchen Sie es erneut.';
|
||||
}
|
||||
|
||||
// Session rate limit – max 1 submission per 60 seconds
|
||||
$lastSubmit = $_SESSION['last_contact_submit'] ?? 0;
|
||||
if ($lastSubmit && (time() - $lastSubmit) < 60) {
|
||||
$formErrors[] = 'Bitte warten Sie einen Moment vor der nächsten Anfrage.';
|
||||
}
|
||||
|
||||
// Send email if no errors
|
||||
if (empty($formErrors)) {
|
||||
$to = 'mki@kies-media.de';
|
||||
$subject = 'Kontaktanfrage: ' . $formData['interest'];
|
||||
$body = "Von: {$formData['fname']} {$formData['lname']}\n"
|
||||
. "E-Mail: {$formData['email']}\n";
|
||||
if ($formData['phone'] !== '') {
|
||||
$body .= "Telefon: {$formData['phone']}\n";
|
||||
}
|
||||
$body .= "Anliegen: {$formData['interest']}\n\n"
|
||||
. $formData['message'];
|
||||
|
||||
$headers = "From: {$formData['email']}\r\n";
|
||||
$headers .= "Reply-To: {$formData['email']}\r\n";
|
||||
$headers .= "Content-Type: text/plain; charset=UTF-8\r\n";
|
||||
$headers .= "X-Mailer: PHP/" . phpversion();
|
||||
|
||||
$mailSent = mail($to, $subject, $body, $headers);
|
||||
|
||||
if ($mailSent) {
|
||||
$_SESSION['last_contact_submit'] = time();
|
||||
header('Location: ' . $_SERVER['REQUEST_URI'] . '#form-result');
|
||||
$_SESSION['form_success'] = true;
|
||||
exit;
|
||||
} else {
|
||||
$formErrors[] = 'Leider konnte die E-Mail nicht gesendet werden. Bitte versuchen Sie es später erneut oder schreiben Sie uns direkt an mki@kies-media.de.';
|
||||
}
|
||||
}
|
||||
}
|
||||
if (!empty($formErrors)) {
|
||||
header('Location: ' . $_SERVER['REQUEST_URI'] . '#form-result');
|
||||
$_SESSION['form_errors'] = $formErrors;
|
||||
$_SESSION['form_data'] = $formData;
|
||||
exit;
|
||||
}
|
||||
}
|
||||
?>
|
||||
<!doctype html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<link rel="icon" type="image/png" sizes="32x32" href="/bilder/favicon/favicon-32x32.png">
|
||||
<link rel="icon" type="image/png" sizes="16x16" href="/bilder/favicon/favicon-16x16.png">
|
||||
<link rel="icon" type="image/x-icon" href="/bilder/favicon/favicon.ico">
|
||||
<link rel="apple-touch-icon" sizes="180x180" href="/bilder/favicon/apple-touch-icon.png">
|
||||
<link rel="manifest" href="/bilder/favicon/site.webmanifest">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Einfamilienhaus zur Miete - Schleusingen</title>
|
||||
<title>Einfamilienhaus mieten Schleusingen | 227 m², 6 Zimmer | 1.300 € Kaltmiete</title>
|
||||
<meta name="description" content="Einfamilienhaus zur Langzeitmiete in Schleusingen: 227 m² Wohnfläche, 6 Zimmer, 3 Etagen mit Dachterrasse. Kaltmiete 1.300 €. Bahnhofstraße 10, 98553 Schleusingen. Ab sofort verfügbar." />
|
||||
<link rel="canonical" href="https://haus-schleusingen.de/haus-schleusingen.html" />
|
||||
|
||||
<!-- Open Graph -->
|
||||
<meta property="og:type" content="website" />
|
||||
<meta property="og:title" content="Einfamilienhaus zur Miete in Schleusingen – 227 m², 6 Zimmer" />
|
||||
<meta property="og:description" content="Großzügiges Einfamilienhaus zur Langzeitmiete: 227 m², 6 Zimmer, 3 Etagen + Dachterrasse. Kaltmiete 1.300 €. Ab sofort verfügbar in Schleusingen." />
|
||||
<meta property="og:image" content="https://haus-schleusingen.de/bilder/Außenansicht-2.png" />
|
||||
<meta property="og:url" content="https://haus-schleusingen.de/haus-schleusingen.html" />
|
||||
<meta property="og:locale" content="de_DE" />
|
||||
<meta property="og:site_name" content="Haus Schleusingen" />
|
||||
|
||||
<!-- Schema.org Structured Data -->
|
||||
<script type="application/ld+json">
|
||||
{
|
||||
"@context": "https://schema.org",
|
||||
"@type": "RealEstateListing",
|
||||
"name": "Einfamilienhaus zur Miete in Schleusingen",
|
||||
"description": "Großzügiges Einfamilienhaus zur Langzeitmiete: 227 m² Wohnfläche, 6 Zimmer, 3 Etagen mit Dachterrasse. Kaltmiete 1.300 €.",
|
||||
"url": "https://haus-schleusingen.de/haus-schleusingen.html",
|
||||
"image": "https://haus-schleusingen.de/bilder/Außenansicht-2.png",
|
||||
"datePosted": "2026-05-14",
|
||||
"address": {
|
||||
"@type": "PostalAddress",
|
||||
"streetAddress": "Bahnhofstraße 10",
|
||||
"addressLocality": "Schleusingen",
|
||||
"postalCode": "98553",
|
||||
"addressCountry": "DE"
|
||||
},
|
||||
"offers": {
|
||||
"@type": "Offer",
|
||||
"price": "1300",
|
||||
"priceCurrency": "EUR",
|
||||
"priceSpecification": {
|
||||
"@type": "UnitPriceSpecification",
|
||||
"price": "1300",
|
||||
"priceCurrency": "EUR",
|
||||
"unitCode": "MON",
|
||||
"description": "Kaltmiete pro Monat"
|
||||
}
|
||||
},
|
||||
"floorSize": {
|
||||
"@type": "QuantitativeValue",
|
||||
"value": "227",
|
||||
"unitCode": "MTK"
|
||||
},
|
||||
"numberOfRooms": {
|
||||
"@type": "QuantitativeValue",
|
||||
"value": "6"
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<link rel="stylesheet" href="fonts/fonts.css" />
|
||||
<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
|
||||
<link rel="stylesheet" href="css/haus-schleusingen.css" />
|
||||
</head>
|
||||
<body>
|
||||
<nav id="navbar">
|
||||
<a href="#main-content" class="skip-link">Zum Inhalt springen</a>
|
||||
<nav id="navbar" role="navigation" aria-label="Hauptnavigation">
|
||||
<div class="nav-logo">Bahnhofstraße 10</div>
|
||||
<button class="nav-hamburger" aria-label="Navigation öffnen" aria-expanded="false">
|
||||
<span></span>
|
||||
</button>
|
||||
<ul class="nav-links">
|
||||
<li><a href="#galerie">Galerie</a></li>
|
||||
<li><a href="#grundriss">Grundriss</a></li>
|
||||
@@ -24,6 +209,7 @@
|
||||
Jetzt anfragen
|
||||
</button>
|
||||
</nav>
|
||||
<div class="nav-mobile-overlay" aria-hidden="true"></div>
|
||||
|
||||
<section class="hero" id="hero">
|
||||
<div
|
||||
@@ -54,6 +240,7 @@
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<main id="main-content">
|
||||
<div class="facts-strip">
|
||||
<div class="fact">
|
||||
<div class="fact-val">227</div>
|
||||
@@ -107,7 +294,7 @@
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="galerie" class="gallery-section">
|
||||
<section id="galerie" class="gallery-section" aria-label="Fotogalerie">
|
||||
<div class="gallery-header">
|
||||
<div>
|
||||
<div class="section-eyebrow">Fotogalerie</div>
|
||||
@@ -117,54 +304,54 @@
|
||||
<div class="masonry-grid">
|
||||
<div class="grid-sizer"></div>
|
||||
|
||||
<div class="grid-item" data-img="bilder/Außenansicht-2.png">
|
||||
<img src="bilder/Außenansicht-2-small.png" alt="Außenansicht" />
|
||||
<div class="grid-item" data-img="bilder/Außenansicht-2.png" role="button" tabindex="0" aria-label="Außenansicht – Großansicht öffnen">
|
||||
<img src="bilder/Außenansicht-2-small.png" alt="Außenansicht des Einfamilienhauses" />
|
||||
<span class="grid-item-label">Außenansicht</span>
|
||||
</div>
|
||||
<div class="grid-item" data-img="bilder/wohnzimmer2.png">
|
||||
<img src="bilder/wohnzimmer2-small.png" alt="Wohnzimmer" />
|
||||
<div class="grid-item" data-img="bilder/wohnzimmer2.png" role="button" tabindex="0" aria-label="Wohnzimmer – Großansicht öffnen">
|
||||
<img src="bilder/wohnzimmer2-small.png" alt="Wohnzimmer mit 42,6 m² Wohnfläche" />
|
||||
<span class="grid-item-label">Wohnzimmer · 42,6 m²</span>
|
||||
</div>
|
||||
<div class="grid-item" data-img="bilder/Küche 1.jpg">
|
||||
<img src="bilder/Küche 1.jpg" alt="Küche" />
|
||||
<div class="grid-item" data-img="bilder/Küche 1.jpg" role="button" tabindex="0" aria-label="Küche – Großansicht öffnen">
|
||||
<img src="bilder/Küche 1.jpg" alt="Küche mit 18,4 m²" />
|
||||
<span class="grid-item-label">Küche · 18,4 m²</span>
|
||||
</div>
|
||||
<div class="grid-item" data-img="bilder/schlafzimmer.png">
|
||||
<img src="bilder/schlafzimmer-small.png" alt="Schlafzimmer" />
|
||||
<div class="grid-item" data-img="bilder/schlafzimmer.png" role="button" tabindex="0" aria-label="Schlafzimmer – Großansicht öffnen">
|
||||
<img src="bilder/schlafzimmer-small.png" alt="Schlafzimmer mit 18 m²" />
|
||||
<span class="grid-item-label">Schlafzimmer · 18 m²</span>
|
||||
</div>
|
||||
<div class="grid-item" data-img="bilder/Bad.jpg">
|
||||
<img src="bilder/Bad.jpg" alt="Badezimmer" />
|
||||
<div class="grid-item" data-img="bilder/Bad.jpg" role="button" tabindex="0" aria-label="Badezimmer – Großansicht öffnen">
|
||||
<img src="bilder/Bad.jpg" alt="Badezimmer mit 9,8 m²" />
|
||||
<span class="grid-item-label">Badezimmer · 9,8 m²</span>
|
||||
</div>
|
||||
<div class="grid-item" data-img="bilder/Kinderzimmer.png">
|
||||
<img src="bilder/Kinderzimmer-small.png" alt="Kinderzimmer 1" />
|
||||
<div class="grid-item" data-img="bilder/Kinderzimmer.png" role="button" tabindex="0" aria-label="Kinderzimmer 1 – Großansicht öffnen">
|
||||
<img src="bilder/Kinderzimmer-small.png" alt="Kinderzimmer 1 mit 21,7 m²" />
|
||||
<span class="grid-item-label">Kinderzimmer 1 · 21,7 m²</span>
|
||||
</div>
|
||||
<div class="grid-item" data-img="bilder/Kinderzimmer 2.jpg">
|
||||
<img src="bilder/Kinderzimmer 2-small.png" alt="Kinderzimmer 2" />
|
||||
<div class="grid-item" data-img="bilder/Kinderzimmer 2.jpg" role="button" tabindex="0" aria-label="Kinderzimmer 2 – Großansicht öffnen">
|
||||
<img src="bilder/Kinderzimmer 2-small.png" alt="Kinderzimmer 2 mit 15,7 m²" />
|
||||
<span class="grid-item-label">Kinderzimmer 2 · 15,7 m²</span>
|
||||
</div>
|
||||
<div class="grid-item" data-img="bilder/kinderzimmer 2 2.jpeg">
|
||||
<img src="bilder/kinderzimmer 2 2-small.png" alt="Kinderzimmer Detail" />
|
||||
<div class="grid-item" data-img="bilder/kinderzimmer 2 2.jpeg" role="button" tabindex="0" aria-label="Kinderzimmer Detail – Großansicht öffnen">
|
||||
<img src="bilder/kinderzimmer 2 2-small.png" alt="Detailansicht Kinderzimmer" />
|
||||
<span class="grid-item-label">Kinderzimmer Detail</span>
|
||||
</div>
|
||||
<div class="grid-item" data-img="bilder/Kinderzimmer 3.jpg">
|
||||
<img src="bilder/Kinderzimmer 3-small.png" alt="Kinderzimmer 3" />
|
||||
<div class="grid-item" data-img="bilder/Kinderzimmer 3.jpg" role="button" tabindex="0" aria-label="Gästezimmer – Großansicht öffnen">
|
||||
<img src="bilder/Kinderzimmer 3-small.png" alt="Gästezimmer mit 11,5 m²" />
|
||||
<span class="grid-item-label">Gästezimmer · 11,5 m²</span>
|
||||
</div>
|
||||
<div class="grid-item" data-img="bilder/Bad-2.jpg">
|
||||
<img src="bilder/Bad-2-small.jpg" alt="Wohnbereich Detail 1" />
|
||||
<div class="grid-item" data-img="bilder/Bad-2.jpg" role="button" tabindex="0" aria-label="Zweites Bad – Großansicht öffnen">
|
||||
<img src="bilder/Bad-2-small.jpg" alt="Zweites Badezimmer im Haus" />
|
||||
<span class="grid-item-label">Wohnbereich</span>
|
||||
</div>
|
||||
<div class="grid-item" data-img="bilder/bad3.jpg">
|
||||
<img src="bilder/Bad-3-small.jpg" alt="Wohnbereich Detail 2" />
|
||||
<div class="grid-item" data-img="bilder/bad3.jpg" role="button" tabindex="0" aria-label="Drittes Bad – Großansicht öffnen">
|
||||
<img src="bilder/Bad-3-small.jpg" alt="Drittes Badezimmer im Haus" />
|
||||
<span class="grid-item-label">Wohnbereich Detail</span>
|
||||
</div>
|
||||
<div class="grid-item" data-img="bilder/WhatsApp Image 2026-03-30 at 07.50.42 (2).jpeg">
|
||||
<div class="grid-item" data-img="bilder/WhatsApp Image 2026-03-30 at 07.50.42 (2).jpeg" role="button" tabindex="0" aria-label="Hausansicht – Großansicht öffnen">
|
||||
<img
|
||||
src="bilder/WhatsApp Image 2026-03-30 at 07.50.42 (2).jpeg"
|
||||
alt="Wohnbereich Detail 3"
|
||||
alt="Weitere Außenansicht des Einfamilienhauses"
|
||||
/>
|
||||
<span class="grid-item-label">Hausansicht</span>
|
||||
</div>
|
||||
@@ -176,14 +363,14 @@
|
||||
<h2>Großzügig auf allen Etagen</h2>
|
||||
<div class="floor-accordion">
|
||||
<div class="floor-item">
|
||||
<div class="floor-header">
|
||||
<div class="floor-header" role="button" tabindex="0" aria-expanded="false" aria-controls="floor-body-0" id="floor-title-0">
|
||||
<span class="floor-title">Erdgeschoss</span>
|
||||
<div class="floor-size">
|
||||
<span>99,5 m²</span>
|
||||
<div class="floor-icon">+</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="floor-body">
|
||||
<div class="floor-body" id="floor-body-0" role="region" aria-labelledby="floor-title-0">
|
||||
<div class="floor-rooms-grid">
|
||||
<div class="room-chip">
|
||||
Flur
|
||||
@@ -225,14 +412,14 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="floor-item">
|
||||
<div class="floor-header">
|
||||
<div class="floor-header" role="button" tabindex="0" aria-expanded="false" aria-controls="floor-body-1" id="floor-title-1">
|
||||
<span class="floor-title">1. Obergeschoss</span>
|
||||
<div class="floor-size">
|
||||
<span>120,4 m²</span>
|
||||
<div class="floor-icon">+</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="floor-body">
|
||||
<div class="floor-body" id="floor-body-1" role="region" aria-labelledby="floor-title-1">
|
||||
<div class="floor-rooms-grid">
|
||||
<div class="room-chip">
|
||||
Flur
|
||||
@@ -274,14 +461,14 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="floor-item">
|
||||
<div class="floor-header">
|
||||
<div class="floor-header" role="button" tabindex="0" aria-expanded="false" aria-controls="floor-body-2" id="floor-title-2">
|
||||
<span class="floor-title">2. Obergeschoss</span>
|
||||
<div class="floor-size">
|
||||
<span>68 m²</span>
|
||||
<div class="floor-icon">+</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="floor-body">
|
||||
<div class="floor-body" id="floor-body-2" role="region" aria-labelledby="floor-title-2">
|
||||
<div class="floor-rooms-grid">
|
||||
<div class="room-chip">
|
||||
Flur
|
||||
@@ -323,14 +510,14 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="floor-item">
|
||||
<div class="floor-header">
|
||||
<div class="floor-header" role="button" tabindex="0" aria-expanded="false" aria-controls="floor-body-3" id="floor-title-3">
|
||||
<span class="floor-title">Dachboden</span>
|
||||
<div class="floor-size">
|
||||
<span>94 m² Nutzfläche</span>
|
||||
<div class="floor-icon">+</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="floor-body">
|
||||
<div class="floor-body" id="floor-body-3" role="region" aria-labelledby="floor-title-3">
|
||||
<div class="floor-rooms-grid">
|
||||
<div class="room-chip">
|
||||
Dachboden unten (ungeheizt)
|
||||
@@ -362,7 +549,7 @@
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="pricing-section" id="miete">
|
||||
<section class="pricing-section" id="miete" aria-label="Mietkonditionen">
|
||||
<div class="pricing-inner">
|
||||
<div class="section-eyebrow">Mietkonditionen</div>
|
||||
<h2>Transparente Preisgestaltung</h2>
|
||||
@@ -460,7 +647,7 @@
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="contact-section" id="kontakt">
|
||||
<section class="contact-section" id="kontakt" aria-label="Kontaktformular">
|
||||
<div class="contact-inner">
|
||||
<div class="section-eyebrow">Kontakt</div>
|
||||
<h2>
|
||||
@@ -474,15 +661,31 @@
|
||||
paar Terminvorschläge an.
|
||||
</p>
|
||||
<div class="contact-form">
|
||||
<form id="contactForm">
|
||||
<?php if ($formSuccess): ?>
|
||||
<div id="form-result" class="form-success" style="display: block">
|
||||
<p>Vielen Dank für Ihre Anfrage!</p>
|
||||
<br />
|
||||
<small>Wir haben Ihre Nachricht erhalten und melden uns innerhalb von 24 Stunden bei Ihnen.</small>
|
||||
</div>
|
||||
<?php else: ?>
|
||||
<?php if (!empty($formErrors)): ?>
|
||||
<div id="form-result" class="form-errors">
|
||||
<ul>
|
||||
<?php foreach ($formErrors as $error): ?>
|
||||
<li><?= escapeContactValue($error) ?></li>
|
||||
<?php endforeach; ?>
|
||||
</ul>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
<form id="contactForm" method="post">
|
||||
<div class="form-row">
|
||||
<div class="form-field">
|
||||
<label for="fname">Vorname</label>
|
||||
<input type="text" id="fname" name="fname" placeholder="Max" required />
|
||||
<input type="text" id="fname" name="fname" placeholder="Max" required value="<?= escapeContactValue($formData['fname']) ?>" />
|
||||
</div>
|
||||
<div class="form-field">
|
||||
<label for="lname">Nachname</label>
|
||||
<input type="text" id="lname" name="lname" placeholder="Mustermann" required />
|
||||
<input type="text" id="lname" name="lname" placeholder="Mustermann" required value="<?= escapeContactValue($formData['lname']) ?>" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
@@ -494,20 +697,25 @@
|
||||
name="email"
|
||||
placeholder="max@beispiel.de"
|
||||
required
|
||||
value="<?= escapeContactValue($formData['email']) ?>"
|
||||
/>
|
||||
</div>
|
||||
<div class="form-field">
|
||||
<label for="phone">Telefon</label>
|
||||
<input type="tel" id="phone" name="phone" placeholder="+49 ..." />
|
||||
<input type="tel" id="phone" name="phone" placeholder="+49 ..." value="<?= escapeContactValue($formData['phone']) ?>" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<div class="form-field full">
|
||||
<label for="interest">Anliegen</label>
|
||||
<select id="interest" name="interest">
|
||||
<option>Besichtigung anfragen</option>
|
||||
<option>Allgemeine Informationen</option>
|
||||
<option>Mietbewerbung einreichen</option>
|
||||
<?php
|
||||
$interestOptions = ['Besichtigung anfragen', 'Allgemeine Informationen', 'Mietbewerbung einreichen'];
|
||||
foreach ($interestOptions as $opt):
|
||||
$selected = ($formData['interest'] === $opt) ? ' selected' : '';
|
||||
?>
|
||||
<option<?= $selected ?>><?= escapeContactValue($opt) ?></option>
|
||||
<?php endforeach; ?>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
@@ -519,31 +727,39 @@
|
||||
name="message"
|
||||
rows="4"
|
||||
placeholder="Ihre Nachricht ..."
|
||||
></textarea>
|
||||
required
|
||||
><?= escapeContactValue($formData['message']) ?></textarea>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Honeypot: hidden field for spam bots -->
|
||||
<div class="hp-field" aria-hidden="true">
|
||||
<label for="website">Website</label>
|
||||
<input type="text" id="website" name="website" tabindex="-1" autocomplete="off" />
|
||||
</div>
|
||||
<!-- Form load timestamp for minimum-submit-time check -->
|
||||
<input type="hidden" name="form_time" value="<?= time() ?>" />
|
||||
<button type="submit" class="btn-submit">Anfrage absenden</button>
|
||||
</form>
|
||||
<div class="form-success" id="formSuccess">
|
||||
<p>Vielen Dank für Ihre Anfrage!</p>
|
||||
<br />
|
||||
<small>Wir melden uns schnellstmöglich bei Ihnen.</small>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
<div class="contact-details">
|
||||
<p>Oder schreiben Sie uns direkt: <a href="mailto:mki@kies-media.de">mki@kies-media.de</a></p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<footer>
|
||||
</main>
|
||||
<footer role="contentinfo">
|
||||
<div class="footer-logo">Bahnhofstraße 10 · Schleusingen</div>
|
||||
<div class="footer-links">
|
||||
<a href="#">Impressum</a>
|
||||
<a href="#">Datenschutz</a>
|
||||
<a href="impressum.html">Impressum</a>
|
||||
<a href="datenschutz.html">Datenschutz</a>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<div class="lightbox" id="lightbox">
|
||||
<button class="lightbox-close" id="lightboxClose">×</button>
|
||||
<img src="" id="lightboxImg" alt="Vollbild" />
|
||||
<div class="lightbox" id="lightbox" role="dialog" aria-modal="true" aria-label="Bildansicht">
|
||||
<button class="lightbox-close" id="lightboxClose" aria-label="Bildansicht schließen">×</button>
|
||||
<img src="" id="lightboxImg" alt="" />
|
||||
</div>
|
||||
|
||||
<script src="js/haus-schleusingen.js"></script>
|
||||
@@ -1,84 +1,276 @@
|
||||
$(function () {
|
||||
document.addEventListener("DOMContentLoaded", function () {
|
||||
// Navbar scroll
|
||||
$(window).on("scroll", function () {
|
||||
if ($(this).scrollTop() > 60) $("#navbar").addClass("scrolled");
|
||||
else $("#navbar").removeClass("scrolled");
|
||||
var navbar = document.getElementById("navbar");
|
||||
window.addEventListener("scroll", function () {
|
||||
if (window.scrollY > 60) navbar.classList.add("scrolled");
|
||||
else navbar.classList.remove("scrolled");
|
||||
});
|
||||
|
||||
// Hero animation on load
|
||||
setTimeout(function () {
|
||||
$("#heroContent").addClass("visible");
|
||||
$("#heroBg").addClass("loaded");
|
||||
document.getElementById("heroContent").classList.add("visible");
|
||||
document.getElementById("heroBg").classList.add("loaded");
|
||||
}, 200);
|
||||
|
||||
// Scroll animations
|
||||
function checkVisible() {
|
||||
$(".fact, [data-animate]").each(function () {
|
||||
var el = $(this);
|
||||
var top = el.offset().top;
|
||||
var windowBottom = $(window).scrollTop() + $(window).height();
|
||||
if (windowBottom > top + 60) {
|
||||
el.addClass("visible");
|
||||
el.css({ opacity: 1, transform: "translateY(0)" });
|
||||
// Scroll animations via IntersectionObserver
|
||||
var animElements = document.querySelectorAll(".fact, [data-animate]");
|
||||
animElements.forEach(function (el) {
|
||||
el.style.opacity = "0";
|
||||
el.style.transform = "translateY(30px)";
|
||||
el.style.transition = "opacity 0.8s ease, transform 0.8s ease";
|
||||
});
|
||||
|
||||
if ("IntersectionObserver" in window) {
|
||||
var observer = new IntersectionObserver(
|
||||
function (entries) {
|
||||
entries.forEach(function (entry) {
|
||||
if (entry.isIntersecting) {
|
||||
entry.target.classList.add("visible");
|
||||
entry.target.style.opacity = "1";
|
||||
entry.target.style.transform = "translateY(0)";
|
||||
observer.unobserve(entry.target);
|
||||
}
|
||||
});
|
||||
}
|
||||
$("[data-animate]").css({
|
||||
opacity: 0,
|
||||
transform: "translateY(30px)",
|
||||
transition: "opacity 0.8s ease, transform 0.8s ease",
|
||||
},
|
||||
{ rootMargin: "0px 0px -60px 0px" }
|
||||
);
|
||||
animElements.forEach(function (el) {
|
||||
observer.observe(el);
|
||||
});
|
||||
$(window).on("scroll", checkVisible);
|
||||
checkVisible();
|
||||
} else {
|
||||
// Fallback: show all immediately
|
||||
animElements.forEach(function (el) {
|
||||
el.classList.add("visible");
|
||||
el.style.opacity = "1";
|
||||
el.style.transform = "translateY(0)";
|
||||
});
|
||||
}
|
||||
|
||||
// Floor accordion
|
||||
$(".floor-header").on("click", function () {
|
||||
var item = $(this).closest(".floor-item");
|
||||
var isOpen = item.hasClass("open");
|
||||
$(".floor-item").removeClass("open");
|
||||
$(".floor-body").slideUp(300);
|
||||
// Floor accordion (vanilla JS + a11y)
|
||||
document.querySelectorAll(".floor-header").forEach(function (header) {
|
||||
header.addEventListener("click", function () {
|
||||
var item = this.closest(".floor-item");
|
||||
var isOpen = item.classList.contains("open");
|
||||
var allItems = document.querySelectorAll(".floor-item");
|
||||
|
||||
// Close all
|
||||
allItems.forEach(function (fi) {
|
||||
fi.classList.remove("open");
|
||||
var hdr = fi.querySelector(".floor-header");
|
||||
if (hdr) hdr.setAttribute("aria-expanded", "false");
|
||||
var body = fi.querySelector(".floor-body");
|
||||
if (body) body.style.display = "none";
|
||||
});
|
||||
|
||||
// Open clicked if it was closed
|
||||
if (!isOpen) {
|
||||
item.addClass("open");
|
||||
item.find(".floor-body").slideDown(300);
|
||||
item.classList.add("open");
|
||||
this.setAttribute("aria-expanded", "true");
|
||||
var body = item.querySelector(".floor-body");
|
||||
if (body) body.style.display = "block";
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// Accordion keyboard handler (Enter/Space)
|
||||
document.querySelectorAll(".floor-header").forEach(function (header) {
|
||||
header.addEventListener("keydown", function (e) {
|
||||
if (e.key === "Enter" || e.key === " ") {
|
||||
e.preventDefault();
|
||||
this.click();
|
||||
}
|
||||
});
|
||||
if (e.key === "Enter" || e.key === " ") {
|
||||
e.preventDefault();
|
||||
$(this).trigger("click");
|
||||
}
|
||||
});
|
||||
|
||||
// Lightbox – gallery grid items
|
||||
$(document).on("click", ".grid-item", function () {
|
||||
var src = $(this).data("img") || $(this).find("img").attr("src");
|
||||
$("#lightboxImg").attr("src", src);
|
||||
// Lightbox – track last focused element for focus return
|
||||
var lightboxTrigger = null;
|
||||
|
||||
function openLightbox(src) {
|
||||
lightboxTrigger = document.activeElement;
|
||||
$("#lightboxImg").attr("src", src).attr("alt", "");
|
||||
$("#lightbox").addClass("open");
|
||||
$("body").css("overflow", "hidden");
|
||||
// Set focus to close button
|
||||
setTimeout(function () {
|
||||
$("#lightboxClose").focus();
|
||||
}, 50);
|
||||
}
|
||||
|
||||
function closeLightbox() {
|
||||
$("#lightbox").removeClass("open");
|
||||
$("body").css("overflow", "");
|
||||
// Return focus to trigger
|
||||
if (lightboxTrigger) {
|
||||
$(lightboxTrigger).focus();
|
||||
lightboxTrigger = null;
|
||||
}
|
||||
}
|
||||
|
||||
// Lightbox – gallery grid items
|
||||
|
||||
// Lightbox – gallery grid items
|
||||
document.querySelectorAll(".grid-item").forEach(function (item) {
|
||||
item.addEventListener("click", function () {
|
||||
var src = this.dataset.img || this.querySelector("img").getAttribute("src");
|
||||
openLightbox(src);
|
||||
});
|
||||
});
|
||||
|
||||
// Gallery keyboard handler (Enter/Space)
|
||||
document.querySelectorAll(".grid-item").forEach(function (item) {
|
||||
item.setAttribute("tabindex", "0");
|
||||
item.addEventListener("keydown", function (e) {
|
||||
if (e.key === "Enter" || e.key === " ") {
|
||||
e.preventDefault();
|
||||
this.click();
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// Lightbox – floor plan images in Raumaufteilung
|
||||
$(document).on("click", ".floor-plan img[data-img]", function () {
|
||||
var src = $(this).data("img");
|
||||
$("#lightboxImg").attr("src", src);
|
||||
$("#lightbox").addClass("open");
|
||||
$("body").css("overflow", "hidden");
|
||||
document.querySelectorAll(".floor-plan img[data-img]").forEach(function (img) {
|
||||
img.addEventListener("click", function () {
|
||||
openLightbox(this.dataset.img);
|
||||
});
|
||||
$("#lightboxClose, #lightbox").on("click", function (e) {
|
||||
if (e.target === this) {
|
||||
$("#lightbox").removeClass("open");
|
||||
$("body").css("overflow", "");
|
||||
});
|
||||
|
||||
function openLightbox(src) {
|
||||
lightboxTrigger = document.activeElement;
|
||||
document.getElementById("lightboxImg").setAttribute("src", src);
|
||||
document.getElementById("lightbox").classList.add("open");
|
||||
document.body.style.overflow = "hidden";
|
||||
// Focus close button
|
||||
setTimeout(function () {
|
||||
document.getElementById("lightboxClose").focus();
|
||||
}, 100);
|
||||
}
|
||||
|
||||
function closeLightbox() {
|
||||
document.getElementById("lightbox").classList.remove("open");
|
||||
document.body.style.overflow = "";
|
||||
// Return focus to trigger
|
||||
if (lightboxTrigger) {
|
||||
lightboxTrigger.focus();
|
||||
lightboxTrigger = null;
|
||||
}
|
||||
}
|
||||
|
||||
document.getElementById("lightboxClose").addEventListener("click", closeLightbox);
|
||||
document.getElementById("lightbox").addEventListener("click", function (e) {
|
||||
if (e.target === this) closeLightbox();
|
||||
});
|
||||
$(document).on("keydown", function (e) {
|
||||
if (e.key === "Escape") {
|
||||
$("#lightbox").removeClass("open");
|
||||
$("body").css("overflow", "");
|
||||
document.addEventListener("keydown", function (e) {
|
||||
if (e.key === "Escape") closeLightbox();
|
||||
});
|
||||
|
||||
// Focus trap for lightbox
|
||||
document.getElementById("lightbox").addEventListener("keydown", function (e) {
|
||||
if (e.key !== "Tab") return;
|
||||
|
||||
var focusable = this.querySelectorAll("button, [href], input, select, textarea, [tabindex]:not([tabindex='-1'])");
|
||||
focusable = Array.from(focusable).filter(function (el) { return el.offsetParent !== null; });
|
||||
if (focusable.length === 0) return;
|
||||
|
||||
var first = focusable[0];
|
||||
var last = focusable[focusable.length - 1];
|
||||
|
||||
if (e.shiftKey) {
|
||||
if (document.activeElement === first) {
|
||||
e.preventDefault();
|
||||
last.focus();
|
||||
}
|
||||
} else {
|
||||
if (document.activeElement === last) {
|
||||
e.preventDefault();
|
||||
first.focus();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// Form submit
|
||||
$("#contactForm").on("submit", function (e) {
|
||||
// Form submit is handled server-side by PHP – no JS intervention needed.
|
||||
// Form submit – opens email client with pre-filled mailto: link
|
||||
document.getElementById("contactForm").addEventListener("submit", function (e) {
|
||||
e.preventDefault();
|
||||
var btn = $(this).find(".btn-submit");
|
||||
btn.text("Wird gesendet...").prop("disabled", true);
|
||||
setTimeout(function () {
|
||||
$("#contactForm").hide();
|
||||
$("#formSuccess").fadeIn(400);
|
||||
}, 1200);
|
||||
|
||||
var fname = document.getElementById("fname").value.trim();
|
||||
var lname = document.getElementById("lname").value.trim();
|
||||
var email = document.getElementById("email").value.trim();
|
||||
var phone = document.getElementById("phone").value.trim();
|
||||
var interest = document.getElementById("interest").value;
|
||||
var message = document.getElementById("message").value.trim();
|
||||
|
||||
var subject = "Kontaktanfrage: " + interest;
|
||||
var body = "Von: " + fname + " " + lname + "\n";
|
||||
body += "E-Mail: " + email + "\n";
|
||||
if (phone) body += "Telefon: " + phone + "\n";
|
||||
body += "Anliegen: " + interest + "\n\n";
|
||||
body += message;
|
||||
|
||||
var mailto =
|
||||
"mailto:mki@kies-media.de" +
|
||||
"?subject=" + encodeURIComponent(subject) +
|
||||
"&body=" + encodeURIComponent(body);
|
||||
|
||||
window.location.href = mailto;
|
||||
|
||||
// Show success message
|
||||
this.style.display = "none";
|
||||
var success = document.getElementById("formSuccess");
|
||||
success.style.display = "block";
|
||||
success.style.opacity = "0";
|
||||
success.style.transition = "opacity 0.4s ease";
|
||||
requestAnimationFrame(function () {
|
||||
success.style.opacity = "1";
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
// Mobile hamburger menu (vanilla JS)
|
||||
(function () {
|
||||
var hamburger = document.querySelector(".nav-hamburger");
|
||||
var nav = document.getElementById("navbar");
|
||||
var overlay = document.querySelector(".nav-mobile-overlay");
|
||||
var links = nav ? nav.querySelectorAll(".nav-links a") : [];
|
||||
|
||||
function toggleMenu() {
|
||||
var isOpen = hamburger.classList.toggle("active");
|
||||
nav.classList.toggle("mobile-open", isOpen);
|
||||
if (overlay) overlay.classList.toggle("active", isOpen);
|
||||
hamburger.setAttribute("aria-expanded", isOpen);
|
||||
document.body.style.overflow = isOpen ? "hidden" : "";
|
||||
}
|
||||
|
||||
function closeMenu() {
|
||||
hamburger.classList.remove("active");
|
||||
nav.classList.remove("mobile-open");
|
||||
if (overlay) overlay.classList.remove("active");
|
||||
hamburger.setAttribute("aria-expanded", "false");
|
||||
document.body.style.overflow = "";
|
||||
}
|
||||
|
||||
if (hamburger) {
|
||||
hamburger.addEventListener("click", toggleMenu);
|
||||
}
|
||||
|
||||
if (overlay) {
|
||||
overlay.addEventListener("click", closeMenu);
|
||||
}
|
||||
|
||||
links.forEach(function (link) {
|
||||
link.addEventListener("click", closeMenu);
|
||||
});
|
||||
|
||||
document.addEventListener("keydown", function (e) {
|
||||
if (e.key === "Escape") closeMenu();
|
||||
});
|
||||
|
||||
// Close on resize to desktop
|
||||
window.addEventListener("resize", function () {
|
||||
if (window.innerWidth > 900) closeMenu();
|
||||
});
|
||||
})();
|
||||
|
||||
9
js/masonry.pkgd.min.js
vendored
9
js/masonry.pkgd.min.js
vendored
File diff suppressed because one or more lines are too long
3
robots.txt
Normal file
3
robots.txt
Normal file
@@ -0,0 +1,3 @@
|
||||
User-agent: *
|
||||
Allow: /
|
||||
Sitemap: https://haus-schleusingen.de/haus-schleusingen.html
|
||||
Reference in New Issue
Block a user