narty-2027/pages/porownanie.html

<!doctype html>
<html lang="pl">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Porównanie ofert — 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(auto-fit, minmax(16rem, 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; }

/* spis linków do kopiowania */
.copybar { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center;
           margin: 1rem 0 1.5rem; }
.copybar button { font: inherit; font-size: .9rem; padding: .45rem .9rem;
                  border: 1px solid var(--accent); border-radius: 8px;
                  background: var(--accent); color: #f8fafc; cursor: pointer; }
.copybar button + button { background: none; color: var(--accent); }
.copybar button:hover { filter: brightness(1.08); }
.copy-status { font-size: .85rem; color: var(--muted); }
.links { list-style: none; padding: 0; margin: .5rem 0 0; }
.links li { padding: .55rem 0; border-bottom: 1px solid var(--line); }
.links li:last-child { border-bottom: 0; }
.links a { font-weight: 600; text-decoration: none; }
.links code.url { display: block; margin: .2rem 0; font-size: .82rem;
                  background: none; padding: 0; color: var(--muted);
                  word-break: break-all; user-select: all; }
.links p { margin: 0; font-size: .85rem; color: var(--muted); }

/* 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 class="wide">
<nav><a href="start.html">← Start</a> · <a href="index.html">Wszystkie karty</a> · <a href="porownanie.html">Porównanie ofert</a> · <a href="linki.html">Linki</a> · <a href="../viz.html">Graf</a></nav>
<h1>Porównanie ofert</h1>
<p class="lead">Wszystkie 12 rozważanych noclegów w jednej tabeli — dane prosto z frontmatterów kart. Kliknij nagłówek, żeby posortować; domyślnie od najtańszej rodziny 2+2.</p>
<h2>Regiony w skrócie</h2>
<ul class="summary"><li><a href="region.html">Saalbach (baza)</a><br><span class="budget"><strong>Budżet grupy:</strong> ~14 000–18 000 €</span><p>Saalbach zostaje wariantem bazowym ze względu na najkrótszy dojazd i największy połączony teren; alternatywy biją go budżetem noclegowym.</p></li><li><a href="ischgl/region.html">Ischgl/Paznaun</a><br><span class="budget"><strong>Budżet grupy:</strong> ~13 500–16 000 €</span><p>Ischgl ma pułapkę wiekową: zniżka tylko do &lt;17 lat — policzyć roczniki nastolatków PRZED decyzją; brak zniżki = +388 € na grupę.</p></li><li><a href="kronplatz/region.html">Kronplatz</a><br><span class="budget"><strong>Budżet grupy:</strong> ~13 200–16 300 €</span><p>Dwa obiekty mają konfigurację dokładnie 4 apartamentów (Häuslerhof, Haus Central) — grupa zajmuje cały dom, co daje klimat wspólnego chaletu bez chaletowej ceny.</p></li><li><a href="sfl/region.html">SFL</a><br><span class="budget"><strong>Budżet grupy:</strong> ~12 800–15 700 €</span><p>SFL wygrywa cenowo wśród alternatyw — jedyny region, gdzie 16–23.01 to oficjalnie niski sezon (skipassy i noclegi w dołku).</p></li></ul>
<h2>Wszystkie oferty</h2>
<div class="table-wrap"><table class="sortable"><thead><tr><th data-key="">Zdjęcie</th><th scope="col" aria-sort="none">Oferta</th><th scope="col" aria-sort="none">Priorytet</th><th scope="col" aria-sort="none">Region</th><th scope="col" aria-sort="none">Miejscowość</th><th scope="col" aria-sort="none">€ / apart. / tydzień</th><th scope="col" aria-sort="none">Rodzina 2+2</th><th scope="col" aria-sort="none">Rodzina 2+1</th><th scope="col" aria-sort="none">Status ceny</th><th scope="col" aria-sort="none">Od wyciągu</th><th scope="col" aria-sort="none">WWW</th></tr></thead><tbody><tr class="estimate"><td class="thumb" data-key=""><a href="ischgl/oferty/apartment-brandau-kappl.html"><img src="img/apartment-brandau-kappl/01.jpg" alt="Apartment Brandau" loading="lazy"></a></td><td class="name" data-key="Apartment Brandau"><a href="ischgl/oferty/apartment-brandau-kappl.html">Apartment Brandau</a></td><td data-key="PLAN A dla wariantu Ischgl" title="PLAN A dla wariantu Ischgl">PLAN A</td><td data-key="Ischgl/Paznaun"><a href="ischgl/region.html">Ischgl/Paznaun</a></td><td data-key="Kappl (Paznaun)" title="Kappl (Paznaun)">Kappl</td><td data-num="900" title="~900–1 300 € (szacunek, styczeń)">~900–1 300 €</td><td data-num="900">~900–1 300 €</td><td data-num="750">~750–1 100 €</td><td data-key="SZACUNEK — wycena mailowo" title="SZACUNEK — wycena mailowo">SZACUNEK</td><td data-key="skibus (przystanek blisko domu) → Kappl / Ischgl ~10 min">skibus (przystanek blisko domu) → Kappl / Ischgl ~10 min</td><td data-key="kappl-apartment-brandau.at"><a href="http://www.kappl-apartment-brandau.at" target="_blank" rel="noopener" class="ext">kappl-apartment-brandau.at</a></td></tr><tr class="estimate"><td class="thumb" data-key=""><a href="ischgl/oferty/apartments-kappl.html"><img src="img/apartments-kappl/01.jpg" alt="Apartments Kappl" loading="lazy"></a></td><td class="name" data-key="Apartments Kappl"><a href="ischgl/oferty/apartments-kappl.html">Apartments Kappl</a></td><td data-key="PLAN B dla wariantu Ischgl" title="PLAN B dla wariantu Ischgl">PLAN B</td><td data-key="Ischgl/Paznaun"><a href="ischgl/region.html">Ischgl/Paznaun</a></td><td data-key="Kappl (Paznaun)" title="Kappl (Paznaun)">Kappl</td><td data-num="900" title="~900–1 400 € (szacunek, styczeń)">~900–1 400 €</td><td data-num="900">~900–1 400 €</td><td data-num="750">~750–1 150 €</td><td data-key="SZACUNEK — wycena mailowo" title="SZACUNEK — wycena mailowo">SZACUNEK</td><td data-key="przystanek skibusa 100 m — bez przesiadki do Ischgl, Galtür, See">przystanek skibusa 100 m — bez przesiadki do Ischgl, Galtür, See</td><td data-key="apartments.kappl.at"><a href="https://www.apartments.kappl.at" target="_blank" rel="noopener" class="ext">apartments.kappl.at</a></td></tr><tr class="estimate"><td class="thumb" data-key=""><a href="kronplatz/oferty/haeuslerhof-valdaora.html"><img src="img/haeuslerhof-valdaora/01.jpg" alt="Häuslerhof" loading="lazy"></a></td><td class="name" data-key="Häuslerhof"><a href="kronplatz/oferty/haeuslerhof-valdaora.html">Häuslerhof</a></td><td data-key="PLAN A dla wariantu Kronplatz" title="PLAN A dla wariantu Kronplatz">PLAN A</td><td data-key="Kronplatz"><a href="kronplatz/region.html">Kronplatz</a></td><td data-key="Valdaora/Olang">Valdaora/Olang</td><td data-num="800" title="~800–1 300 € (szacunek, styczeń)">~800–1 300 €</td><td data-num="900">~900–1 300 €</td><td data-num="800">~800–1 100 €</td><td data-key="SZACUNEK — wycena mailowo" title="SZACUNEK — wycena mailowo">SZACUNEK</td><td data-key="skibus do gondoli Olang (Kronplatz)">skibus do gondoli Olang (Kronplatz)</td><td data-key="haeuslerhof.it"><a href="https://www.haeuslerhof.it" target="_blank" rel="noopener" class="ext">haeuslerhof.it</a></td></tr><tr class="estimate"><td class="thumb" data-key=""><a href="kronplatz/oferty/residence-corones-valdaora.html" class="placeholder" title="brak zdjęć">RC</a></td><td class="name" data-key="Residence Corones"><a href="kronplatz/oferty/residence-corones-valdaora.html">Res
<p class="legend"><span class="box v"></span>cena zweryfikowana &nbsp; <span class="box e"></span>szacunek do potwierdzenia</p>
<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('table.sortable').forEach(function (table) {
  var head = table.tHead.rows[0];
  Array.prototype.forEach.call(head.cells, function (th, i) {
    th.tabIndex = 0;
    th.setAttribute('role', 'button');
    th.addEventListener('click', function () { sortTable(table, i, th); });
    th.addEventListener('keydown', function (e) {
      if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); sortTable(table, i, th); }
    });
  });
});

function sortTable(table, index, th) {
  var dir = th.dataset.dir === 'asc' ? 'desc' : 'asc';
  Array.prototype.forEach.call(table.tHead.rows[0].cells, function (h) {
    delete h.dataset.dir;
    h.setAttribute('aria-sort', 'none');
  });
  th.dataset.dir = dir;
  th.setAttribute('aria-sort', dir === 'asc' ? 'ascending' : 'descending');
  var body = table.tBodies[0];
  var rows = Array.prototype.slice.call(body.rows);
  var mul = dir === 'asc' ? 1 : -1;
  rows.sort(function (a, b) {
    var x = a.cells[index], y = b.cells[index];
    var nx = x.dataset.num, ny = y.dataset.num;
    if (nx !== undefined && ny !== undefined) return (parseFloat(nx) - parseFloat(ny)) * mul;
    // Wiersze bez wartości liczbowej zawsze na końcu — w obie strony.
    if (nx !== undefined) return -1;
    if (ny !== undefined) return 1;
    var kx = x.dataset.key !== undefined ? x.dataset.key : x.textContent;
    var ky = y.dataset.key !== undefined ? y.dataset.key : y.textContent;
    if (!kx) return 1;
    if (!ky) return -1;
    return kx.localeCompare(ky, 'pl') * mul;
  });
  rows.forEach(function (row) { body.appendChild(row); });
}
</script>
</body>
</html>
-												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
+								<!doctype html>
 								<html lang="pl">
 								<head>
 								<meta charset="utf-8">
 								<meta name="viewport" content="width=device-width, initial-scale=1">
 								<title>Porównanie ofert — 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) {
-												start.html: kafel "Wszystkie linki" pod własną nazwą, kafle 2×2

Kafel do /pages/linki.html był już czwarty w rzędzie, ale pod etykietą
"Linki do wysłania" — nazwa z ustaleń to "Wszystkie linki". Przy czterech
kaflach siatka auto-fit łamała się 3+1 i czwarty zostawał sam w wierszu;
minimum kolumny podniesione z 13rem do 16rem układa je 2×2, a na telefonie
i tak jest jedna kolumna.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>

											
										
										
											2026-08-03 17:41:16 +02:00
+								  .tiles { grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); }
-												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
+								  .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; }
-												pages/linki.html: spis wszystkich adresów wystawki do wysłania

Nowa strona z pełnymi URL-ami wszystkich 24 stron na https://narty27.kapala.org
(BASE_URL — jedyne miejsce z domeną w kodzie), w sekcjach: Wejście, Regiony,
Oferty per region z priorytetem PLAN A/B z frontmattera, Pozostałe. Każda
pozycja to klikalny link, widoczny adres tekstem do skopiowania i krótki opis.

Lista powstaje z tych samych danych co porownanie.html i start.html —
regiony z wyjazd.md, oferty z katalogów i frontmatterów, "Pozostałe" to
koncepty, których nie złapała żadna wcześniejsza sekcja. Nowa oferta wpada
na listę sama przy regeneracji.

Przyciski "Kopiuj wszystkie" (plain text: nazwa sekcji + adresy) i "Kopiuj
link startowy"; navigator.clipboard z odwrotem na zaznaczenie, bo po http
z adresu IP nie ma bezpiecznego kontekstu. Do nawigacji każdej strony
i na start.html doszła pozycja "Linki".

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>

											
										
										
											2026-08-03 17:37:14 +02:00
+								/* spis linków do kopiowania */
 								.copybar { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center;
 								           margin: 1rem 0 1.5rem; }
 								.copybar button { font: inherit; font-size: .9rem; padding: .45rem .9rem;
 								                  border: 1px solid var(--accent); border-radius: 8px;
 								                  background: var(--accent); color: #f8fafc; cursor: pointer; }
 								.copybar button + button { background: none; color: var(--accent); }
 								.copybar button:hover { filter: brightness(1.08); }
 								.copy-status { font-size: .85rem; color: var(--muted); }
 								.links { list-style: none; padding: 0; margin: .5rem 0 0; }
 								.links li { padding: .55rem 0; border-bottom: 1px solid var(--line); }
 								.links li:last-child { border-bottom: 0; }
 								.links a { font-weight: 600; text-decoration: none; }
 								.links code.url { display: block; margin: .2rem 0; font-size: .82rem;
 								                  background: none; padding: 0; color: var(--muted);
 								                  word-break: break-all; user-select: all; }
 								.links p { margin: 0; font-size: .85rem; color: var(--muted); }
-												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
+								/* 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 class="wide">
-												pages/linki.html: spis wszystkich adresów wystawki do wysłania

Nowa strona z pełnymi URL-ami wszystkich 24 stron na https://narty27.kapala.org
(BASE_URL — jedyne miejsce z domeną w kodzie), w sekcjach: Wejście, Regiony,
Oferty per region z priorytetem PLAN A/B z frontmattera, Pozostałe. Każda
pozycja to klikalny link, widoczny adres tekstem do skopiowania i krótki opis.

Lista powstaje z tych samych danych co porownanie.html i start.html —
regiony z wyjazd.md, oferty z katalogów i frontmatterów, "Pozostałe" to
koncepty, których nie złapała żadna wcześniejsza sekcja. Nowa oferta wpada
na listę sama przy regeneracji.

Przyciski "Kopiuj wszystkie" (plain text: nazwa sekcji + adresy) i "Kopiuj
link startowy"; navigator.clipboard z odwrotem na zaznaczenie, bo po http
z adresu IP nie ma bezpiecznego kontekstu. Do nawigacji każdej strony
i na start.html doszła pozycja "Linki".

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>

											
										
										
											2026-08-03 17:37:14 +02:00
+								<nav><a href="start.html">← Start</a> · <a href="index.html">Wszystkie karty</a> · <a href="porownanie.html">Porównanie ofert</a> · <a href="linki.html">Linki</a> · <a href="../viz.html">Graf</a></nav>
-												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
+								<h1>Porównanie ofert</h1>
 								<p class="lead">Wszystkie 12 rozważanych noclegów w jednej tabeli — dane prosto z frontmatterów kart. Kliknij nagłówek, żeby posortować; domyślnie od najtańszej rodziny 2+2.</p>
 								<h2>Regiony w skrócie</h2>
 								<ul class="summary"><li><a href="region.html">Saalbach (baza)</a><br><span class="budget"><strong>Budżet grupy:</strong> ~14 000–18 000 €</span><p>Saalbach zostaje wariantem bazowym ze względu na najkrótszy dojazd i największy połączony teren; alternatywy biją go budżetem noclegowym.</p></li><li><a href="ischgl/region.html">Ischgl/Paznaun</a><br><span class="budget"><strong>Budżet grupy:</strong> ~13 500–16 000 €</span><p>Ischgl ma pułapkę wiekową: zniżka tylko do &lt;17 lat — policzyć roczniki nastolatków PRZED decyzją; brak zniżki = +388 € na grupę.</p></li><li><a href="kronplatz/region.html">Kronplatz</a><br><span class="budget"><strong>Budżet grupy:</strong> ~13 200–16 300 €</span><p>Dwa obiekty mają konfigurację dokładnie 4 apartamentów (Häuslerhof, Haus Central) — grupa zajmuje cały dom, co daje klimat wspólnego chaletu bez chaletowej ceny.</p></li><li><a href="sfl/region.html">SFL</a><br><span class="budget"><strong>Budżet grupy:</strong> ~12 800–15 700 €</span><p>SFL wygrywa cenowo wśród alternatyw — jedyny region, gdzie 16–23.01 to oficjalnie niski sezon (skipassy i noclegi w dołku).</p></li></ul>
 								<h2>Wszystkie oferty</h2>
 								<div class="table-wrap"><table class="sortable"><thead><tr><th data-key="">Zdjęcie</th><th scope="col" aria-sort="none">Oferta</th><th scope="col" aria-sort="none">Priorytet</th><th scope="col" aria-sort="none">Region</th><th scope="col" aria-sort="none">Miejscowość</th><th scope="col" aria-sort="none">€ / apart. / tydzień</th><th scope="col" aria-sort="none">Rodzina 2+2</th><th scope="col" aria-sort="none">Rodzina 2+1</th><th scope="col" aria-sort="none">Status ceny</th><th scope="col" aria-sort="none">Od wyciągu</th><th scope="col" aria-sort="none">WWW</th></tr></thead><tbody><tr class="estimate"><td class="thumb" data-key=""><a href="ischgl/oferty/apartment-brandau-kappl.html"><img src="img/apartment-brandau-kappl/01.jpg" alt="Apartment Brandau" loading="lazy"></a></td><td class="name" data-key="Apartment Brandau"><a href="ischgl/oferty/apartment-brandau-kappl.html">Apartment Brandau</a></td><td data-key="PLAN A dla wariantu Ischgl" title="PLAN A dla wariantu Ischgl">PLAN A</td><td data-key="Ischgl/Paznaun"><a href="ischgl/region.html">Ischgl/Paznaun</a></td><td data-key="Kappl (Paznaun)" title="Kappl (Paznaun)">Kappl</td><td data-num="900" title="~900–1 300 € (szacunek, styczeń)">~900–1 300 €</td><td data-num="900">~900–1 300 €</td><td data-num="750">~750–1 100 €</td><td data-key="SZACUNEK — wycena mailowo" title="SZACUNEK — wycena mailowo">SZACUNEK</td><td data-key="skibus (przystanek blisko domu) → Kappl / Ischgl ~10 min">skibus (przystanek blisko domu) → Kappl / Ischgl ~10 min</td><td data-key="kappl-apartment-brandau.at"><a href="http://www.kappl-apartment-brandau.at" target="_blank" rel="noopener" class="ext">kappl-apartment-brandau.at</a></td></tr><tr class="estimate"><td class="thumb" data-key=""><a href="ischgl/oferty/apartments-kappl.html"><img src="img/apartments-kappl/01.jpg" alt="Apartments Kappl" loading="lazy"></a></td><td class="name" data-key="Apartments Kappl"><a href="ischgl/oferty/apartments-kappl.html">Apartments Kappl</a></td><td data-key="PLAN B dla wariantu Ischgl" title="PLAN B dla wariantu Ischgl">PLAN B</td><td data-key="Ischgl/Paznaun"><a href="ischgl/region.html">Ischgl/Paznaun</a></td><td data-key="Kappl (Paznaun)" title="Kappl (Paznaun)">Kappl</td><td data-num="900" title="~900–1 400 € (szacunek, styczeń)">~900–1 400 €</td><td data-num="900">~900–1 400 €</td><td data-num="750">~750–1 150 €</td><td data-key="SZACUNEK — wycena mailowo" title="SZACUNEK — wycena mailowo">SZACUNEK</td><td data-key="przystanek skibusa 100 m — bez przesiadki do Ischgl, Galtür, See">przystanek skibusa 100 m — bez przesiadki do Ischgl, Galtür, See</td><td data-key="apartments.kappl.at"><a href="https://www.apartments.kappl.at" target="_blank" rel="noopener" class="ext">apartments.kappl.at</a></td></tr><tr class="estimate"><td class="thumb" data-key=""><a href="kronplatz/oferty/haeuslerhof-valdaora.html"><img src="img/haeuslerhof-valdaora/01.jpg" alt="Häuslerhof" loading="lazy"></a></td><td class="name" data-key="Häuslerhof"><a href="kronplatz/oferty/haeuslerhof-valdaora.html">Häuslerhof</a></td><td data-key="PLAN A dla wariantu Kronplatz" title="PLAN A dla wariantu Kronplatz">PLAN A</td><td data-key="Kronplatz"><a href="kronplatz/region.html">Kronplatz</a></td><td data-key="Valdaora/Olang">Valdaora/Olang</td><td data-num="800" title="~800–1 300 € (szacunek, styczeń)">~800–1 300 €</td><td data-num="900">~900–1 300 €</td><td data-num="800">~800–1 100 €</td><td data-key="SZACUNEK — wycena mailowo" title="SZACUNEK — wycena mailowo">SZACUNEK</td><td data-key="skibus do gondoli Olang (Kronplatz)">skibus do gondoli Olang (Kronplatz)</td><td data-key="haeuslerhof.it"><a href="https://www.haeuslerhof.it" target="_blank" rel="noopener" class="ext">haeuslerhof.it</a></td></tr><tr class="estimate"><td class="thumb" data-key=""><a href="kronplatz/oferty/residence-corones-valdaora.html" class="placeholder" title="brak zdjęć">RC</a></td><td class="name" data-key="Residence Corones"><a href="kronplatz/oferty/residence-corones-valdaora.html">Res
 								<p class="legend"><span class="box v"></span>cena zweryfikowana &nbsp; <span class="box e"></span>szacunek do potwierdzenia</p>
 								<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('table.sortable').forEach(function (table) {
 								  var head = table.tHead.rows[0];
 								  Array.prototype.forEach.call(head.cells, function (th, i) {
 								    th.tabIndex = 0;
 								    th.setAttribute('role', 'button');
 								    th.addEventListener('click', function () { sortTable(table, i, th); });
 								    th.addEventListener('keydown', function (e) {
 								      if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); sortTable(table, i, th); }
 								    });
 								  });
 								});
 								function sortTable(table, index, th) {
 								  var dir = th.dataset.dir === 'asc' ? 'desc' : 'asc';
 								  Array.prototype.forEach.call(table.tHead.rows[0].cells, function (h) {
 								    delete h.dataset.dir;
 								    h.setAttribute('aria-sort', 'none');
 								  });
 								  th.dataset.dir = dir;
 								  th.setAttribute('aria-sort', dir === 'asc' ? 'ascending' : 'descending');
 								  var body = table.tBodies[0];
 								  var rows = Array.prototype.slice.call(body.rows);
 								  var mul = dir === 'asc' ? 1 : -1;
 								  rows.sort(function (a, b) {
 								    var x = a.cells[index], y = b.cells[index];
 								    var nx = x.dataset.num, ny = y.dataset.num;
 								    if (nx !== undefined && ny !== undefined) return (parseFloat(nx) - parseFloat(ny)) * mul;
 								    // Wiersze bez wartości liczbowej zawsze na końcu — w obie strony.
 								    if (nx !== undefined) return -1;
 								    if (ny !== undefined) return 1;
 								    var kx = x.dataset.key !== undefined ? x.dataset.key : x.textContent;
 								    var ky = y.dataset.key !== undefined ? y.dataset.key : y.textContent;
 								    if (!kx) return 1;
 								    if (!ky) return -1;
 								    return kx.localeCompare(ky, 'pl') * mul;
 								  });
 								  rows.forEach(function (row) { body.appendChild(row); });
 								}
 								</script>
 								</body>
 								</html>