narty-2027/pages/oferty/alpenparks-rehrenberg.html
oskar 8f1557e736 Przeprojektowanie pod decyzję: start.html, porownanie.html, galerie
Wejściem jest teraz landing pages/start.html (trzy kafle: porównanie ofert,
analiza wariantów, graf + kafle czterech regionów ze zdjęciem najlepszej
oferty w tle), a graf schodzi do roli załącznika. start.html linkuje
root-absolutnie, bo ten sam plik jest serwowany jako /index.html i jako
/pages/start.html.

pages/porownanie.html: jedna tabela wszystkich 12 ofert prosto z
frontmatterów (miniatura, priorytet, region, ceny, status, odległość, www),
sortowanie klikiem w nagłówek (czysty JS, bez zależności), wiersze barwione
statusem ceny. Nad tabelą podsumowanie per region — budżet całkowity i jeden
wniosek parsowane z tabeli i „Wniosków przekrojowych” w wyjazd.md, bez
zaszywania nazw regionów w kodzie.

Karty ofert dostały galerię (duże zdjęcie + miniatury, lazy loading),
a nawigacja na każdej stronie prowadzi do startu i porównania.
Komenda deployu (kopiuje start.html jako /content/index.html) jest
wypisywana przez gen_pages.py. Pliki .md bez zmian, check_okf zielony.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
2026-08-03 17:24:25 +02:00

170 lines
12 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!doctype html>
<html lang="pl">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>AlpenParks Apartments Rehrenberg — Ski 2027 — Skicircus Saalbach</title>
<style>
:root { color-scheme: light dark; --fg:#0f172a; --muted:#64748b; --bg:#ffffff;
--line:#e2e8f0; --accent:#0d9488; --chip:#f1f5f9; --quote:#f8fafc; }
@media (prefers-color-scheme: dark) {
:root { --fg:#e2e8f0; --muted:#94a3b8; --bg:#0f172a; --line:#334155;
--accent:#2dd4bf; --chip:#1e293b; --quote:#1e293b; }
}
* { box-sizing: border-box; }
body { margin: 0 auto; padding: 1.25rem 1rem 4rem; max-width: 46rem;
font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
font-size: 17px; line-height: 1.55; color: var(--fg); background: var(--bg);
-webkit-text-size-adjust: 100%; }
nav { font-size: .85rem; margin-bottom: 1.25rem; }
nav a { color: var(--muted); }
h1 { font-size: 1.55rem; line-height: 1.25; margin: 0 0 .35rem; }
h2 { font-size: 1.2rem; margin: 2rem 0 .5rem; padding-top: .5rem;
border-top: 1px solid var(--line); }
h3 { font-size: 1.02rem; margin: 1.4rem 0 .4rem; }
p, ul, ol { margin: .6rem 0; }
ul, ol { padding-left: 1.3rem; }
li { margin: .25rem 0; }
li.task { list-style: none; margin-left: -1.3rem; }
li.task input { margin-right: .45rem; }
a { color: var(--accent); }
a.ext::after { content: " ↗"; font-size: .8em; color: var(--muted); }
code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .88em;
background: var(--chip); padding: .1em .35em; border-radius: 4px; }
pre { background: var(--chip); padding: .75rem; border-radius: 6px; overflow-x: auto; }
pre code { background: none; padding: 0; }
blockquote { margin: .9rem 0; padding: .6rem .9rem; background: var(--quote);
border-left: 3px solid var(--accent); border-radius: 0 6px 6px 0; }
blockquote p { margin: .2rem 0; }
hr { border: 0; border-top: 1px solid var(--line); margin: 1.5rem 0; }
.table-wrap { overflow-x: auto; margin: .8rem 0; -webkit-overflow-scrolling: touch; }
table { border-collapse: collapse; width: 100%; font-size: .92rem; }
th, td { border: 1px solid var(--line); padding: .4rem .55rem; vertical-align: top; }
th { background: var(--chip); font-weight: 600; }
.chip { display: inline-block; background: var(--chip); color: var(--muted);
font-size: .72rem; text-transform: uppercase; letter-spacing: .04em;
padding: .15rem .5rem; border-radius: 999px; }
.lead { color: var(--muted); margin: .35rem 0 1.25rem; }
.meta { margin: 0 0 1.5rem; }
.meta summary { cursor: pointer; font-size: .85rem; color: var(--muted);
padding: .3rem 0; }
.meta table { font-size: .85rem; }
.meta th { width: 38%; text-align: left; font-weight: 500; word-break: break-word; }
.cards { list-style: none; padding: 0; margin: 0; }
.cards li { border: 1px solid var(--line); border-radius: 8px; padding: .8rem .9rem;
margin: .6rem 0; }
.cards a { font-weight: 600; text-decoration: none; }
.cards p { margin: .3rem 0 0; font-size: .9rem; color: var(--muted); }
footer { margin-top: 3rem; padding-top: 1rem; border-top: 1px solid var(--line);
font-size: .78rem; color: var(--muted); }
/* landing: kafle i lista regionów */
body.wide { max-width: 72rem; }
.tiles, .regions { list-style: none; padding: 0; }
.tiles { margin: 1.25rem 0 2rem; display: grid; gap: .75rem; }
.regions { margin: .6rem 0 0; display: grid; gap: .5rem; }
@media (min-width: 34rem) {
.tiles { grid-template-columns: repeat(3, 1fr); }
.regions { grid-template-columns: repeat(2, 1fr); }
}
.tiles a, .regions a { display: block; border: 1px solid var(--line); border-radius: 10px;
padding: .9rem 1rem; text-decoration: none; color: var(--fg); }
.tiles a { font-size: 1.05rem; font-weight: 600; }
.tiles a:hover, .tiles a:focus, .regions a:hover, .regions a:focus {
border-color: var(--accent); }
.tiles small, .regions small { display: block; margin-top: .3rem; font-weight: 400;
font-size: .85rem; color: var(--muted); }
.regions a { font-weight: 600; }
/* podsumowanie per region na karcie porównania */
.summary { list-style: none; padding: 0; margin: .8rem 0 2rem; display: grid; gap: .6rem; }
@media (min-width: 48rem) { .summary { grid-template-columns: repeat(2, 1fr); } }
.summary li { border: 1px solid var(--line); border-left: 3px solid var(--accent);
border-radius: 8px; padding: .65rem .85rem; }
.summary .budget { font-size: .95rem; }
.summary p { margin: .35rem 0 0; font-size: .88rem; color: var(--muted); }
/* tabela porównawcza: sortowanie klikiem + kolor statusu ceny */
table.sortable th { cursor: pointer; user-select: none; white-space: nowrap; }
table.sortable th::after { content: " ↕"; font-size: .8em; opacity: .35; }
table.sortable th[data-dir="asc"]::after { content: " ↑"; opacity: 1; }
table.sortable th[data-dir="desc"]::after { content: " ↓"; opacity: 1; }
table.sortable td { font-size: .88rem; padding: .35rem .5rem; }
table.sortable td[data-num] { white-space: nowrap; }
table.sortable .name { font-weight: 600; }
tr.verified td { background: rgba(13, 148, 136, .14); }
tr.estimate td { background: rgba(100, 116, 139, .10); color: var(--muted); }
tr.estimate td.name a, tr.verified td.name a { color: var(--accent); }
.legend { font-size: .82rem; color: var(--muted); margin: .5rem 0 0; }
.legend .box { display: inline-block; width: .8em; height: .8em; border-radius: 3px;
border: 1px solid var(--line); vertical-align: -.05em; margin-right: .25em; }
.legend .box.v { background: rgba(13, 148, 136, .35); }
.legend .box.e { background: rgba(100, 116, 139, .25); }
/* miniatury w tabeli */
td.thumb { padding: .25rem; width: 128px; }
td.thumb img { width: 120px; height: 80px; object-fit: cover; border-radius: 6px;
display: block; }
td.thumb .placeholder { display: flex; width: 120px; height: 80px; border-radius: 6px;
align-items: center; justify-content: center; background: var(--chip);
color: var(--muted); font-weight: 700; letter-spacing: .05em;
text-decoration: none; }
/* galeria na karcie oferty */
.gallery { margin: 0 0 1.25rem; }
.gallery-main img { width: 100%; max-height: 24rem; object-fit: cover;
border-radius: 10px; display: block; background: var(--chip); }
.gallery-thumbs { display: flex; gap: .4rem; margin-top: .4rem; overflow-x: auto;
-webkit-overflow-scrolling: touch; padding-bottom: .2rem; }
.gallery-thumbs button { flex: 0 0 auto; padding: 0; border: 2px solid transparent;
border-radius: 6px; background: none; cursor: pointer; }
.gallery-thumbs button[aria-current] { border-color: var(--accent); }
.gallery-thumbs img { width: 5.5rem; height: 3.6rem; object-fit: cover;
border-radius: 4px; display: block; }
/* kafel regionu ze zdjęciem w tle */
.regions a.hero { background-size: cover; background-position: center;
border-color: transparent; color: #f8fafc; min-height: 6.5rem;
display: flex; flex-direction: column; justify-content: flex-end; }
.regions a.hero small { color: #e2e8f0; }
</style>
</head>
<body>
<nav><a href="../start.html">← Start</a> · <a href="../index.html">Wszystkie karty</a> · <a href="../porownanie.html">Porównanie ofert</a> · <a href="../../viz.html">Graf</a></nav>
<span class="chip">oferta</span>
<h1>AlpenParks Rehrenberg Viehhofen — PLAN C</h1>
<p class="lead">Najtańszy nowy obiekt na liście — przestronne apartamenty z prywatnymi saunami w Viehhofen, wariant rezerwowy o mieszanych opiniach, PLAN C.</p>
<figure class="gallery"><div class="gallery-main"><img src="../img/alpenparks-rehrenberg/01.jpg" alt="AlpenParks Apartments Rehrenberg" loading="lazy"></div><div class="gallery-thumbs"><button type="button" aria-current="true"><img src="../img/alpenparks-rehrenberg/01.jpg" alt="AlpenParks Apartments Rehrenberg — zdjęcie 1" loading="lazy"></button><button type="button"><img src="../img/alpenparks-rehrenberg/02.jpg" alt="AlpenParks Apartments Rehrenberg — zdjęcie 2" loading="lazy"></button><button type="button"><img src="../img/alpenparks-rehrenberg/03.jpg" alt="AlpenParks Apartments Rehrenberg — zdjęcie 3" loading="lazy"></button><button type="button"><img src="../img/alpenparks-rehrenberg/04.jpg" alt="AlpenParks Apartments Rehrenberg — zdjęcie 4" loading="lazy"></button><button type="button"><img src="../img/alpenparks-rehrenberg/05.jpg" alt="AlpenParks Apartments Rehrenberg — zdjęcie 5" loading="lazy"></button></div></figure>
<details class="meta" open><summary>Metadane (frontmatter)</summary><div class="table-wrap"><table><tbody><tr><th>type</th><td>oferta</td></tr><tr><th>title</th><td>AlpenParks Apartments Rehrenberg</td></tr><tr><th>description</th><td>Najtańszy nowy obiekt na liście — przestronne apartamenty z prywatnymi saunami w Viehhofen, wariant rezerwowy o mieszanych opiniach, PLAN C.</td></tr><tr><th>timestamp</th><td>2026-07-31T00:00:00Z</td></tr><tr><th>tags</th><td>nocleg, viehhofen, plan-c</td></tr><tr><th>id</th><td>alpenparks-rehrenberg</td></tr><tr><th>nazwa</th><td>AlpenParks Apartments Rehrenberg</td></tr><tr><th>operator</th><td>AlpenParks</td></tr><tr><th>miejscowosc</th><td>Viehhofen</td></tr><tr><th>gps</th><td>47.3662, 12.7317</td></tr><tr><th>odleglosc_od_wyciagu</th><td>510 min pieszo do gondoli zellamseeXpress</td></tr><tr><th>ocena</th><td>4.2/5 (Google) — opinie mieszane</td></tr><tr><th>uklad_dla_grupy</th><td>4 osobne apartamenty</td></tr><tr><th>cena_za_apartament_tydzien</th><td>~1 1001 500 € (szacunek, styczeń poza feriami)</td></tr><tr><th>koszt_rodzina_2p2</th><td>~1 1001 500 €</td></tr><tr><th>koszt_rodzina_2p1</th><td>~9501 250 €</td></tr><tr><th>status_ceny</th><td>SZACUNEK — silnik online na alpenparks.at</td></tr><tr><th>priorytet</th><td>PLAN C (rezerwowy)</td></tr><tr><th>www</th><td><a href="https://www.alpenparks.at" target="_blank" rel="noopener" class="ext">https://www.alpenparks.at</a></td></tr><tr><th>ostatnia_aktualizacja</th><td>2026-07-31</td></tr></tbody></table></div></details>
<h2>W skrócie</h2>
<p>Najtańszy "nowy" obiekt na liście: przestronne, nowoczesne apartamenty z prywatnymi saunami w Viehhofen. Traktowany jako rezerwa — cena kusi, ale opinie są mieszane i logistyka na stok słabsza niż u konkurencji.</p>
<h2>Fakty</h2>
<ul><li>Nowe budownictwo, duże apartamenty, część z własną sauną.</li><li>510 min pieszo do gondoli zellamseeXpress (strona Zell am See); do Skicircusu skibusem.</li><li>Rezerwacja online przez alpenparks.at.</li></ul>
<h2>Układ dla naszej grupy (14 os.)</h2>
<div class="table-wrap"><table><thead><tr><th style="text-align:left">Rodzina</th><th style="text-align:left">Szacunkowy koszt/tydzień</th></tr></thead><tbody><tr><td style="text-align:left">2× rodzina 2+2</td><td style="text-align:left">~1 1001 500 €</td></tr><tr><td style="text-align:left">2× rodzina 2+1</td><td style="text-align:left">~9501 250 €</td></tr></tbody></table></div>
<h2>Plusy / minusy</h2>
<p><strong>+</strong> najniższa cena za nowy standard; prywatne sauny; duża dostępność (spory obiekt); pełna rezerwacja online.</p>
<p><strong></strong> powtarzające się w recenzjach zastrzeżenia do skibusa (mały, zatłoczony rano) i obsługi/organizacji — <strong>przed rezerwacją przeczytać świeże opinie z zimy 25/26</strong>; Viehhofen bez wieczornego życia; sumarycznie gorszy pakiet niż Sportchalet za podobne pieniądze.</p>
<h2>Do zrobienia</h2>
<ul><li class="task"><input type="checkbox" disabled> Tylko jeśli plany A i B nie wypalą: sprawdzić ceny datami 1623.01.2027.</li><li class="task"><input type="checkbox" disabled> Zweryfikować najnowsze opinie (Booking/Google, filtr: zima 2026).</li></ul>
<footer>Wygenerowane z bundle'a OKF przez <code>gen_pages.py</code> — nie edytuj
tych plików, edytuj <code>.md</code> i przegeneruj.</footer>
<script>
document.querySelectorAll('.gallery').forEach(function (gallery) {
var big = gallery.querySelector('.gallery-main img');
gallery.querySelectorAll('.gallery-thumbs button').forEach(function (button) {
button.addEventListener('click', function () {
var img = button.querySelector('img');
big.src = img.dataset.full || img.src;
gallery.querySelectorAll('.gallery-thumbs button').forEach(function (b) {
b.removeAttribute('aria-current');
});
button.setAttribute('aria-current', 'true');
});
});
});
</script>
</body>
</html>