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) {
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; }
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" >
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 >
2026-08-04 09:57:09 +02:00
< ul class = "summary" > < li > < a href = "saalbach/region.html" > Saalbach< / a > < br > < span class = "budget" > < strong > Budżet grupy:< / strong > ~16 200– < / span > < p > Saalbach traci przewagę cenową noclegów w Fasching — wchodzi w budżet 16– < / p > < / li > < li > < a href = "ischgl/region.html" > Ischgl/Paznaun< / a > < br > < span class = "budget" > < strong > Budżet grupy:< / strong > ~14 200– < / span > < p > Ischgl paradoksalnie konkurencyjny cenowo (mieszkając w Kappl): skipass bez dopłaty sezonowej — ale pilnować rocznika 17-latków (❌ zniżka tylko do < 17, +194 € za każdego 17-latka) i liczyć się z maksymalnym tłokiem.< / p > < / li > < li > < a href = "kronplatz/region.html" > Kronplatz< / a > < br > < span class = "budget" > < strong > Budżet grupy:< / strong > ~14 500– < / span > < p > Kronplatz najlepiej znosi ten termin: mniejszy nacisk karnawałowy niż Austria, budżet w środku stawki, junior do 18 lat.< / p > < / li > < li > < a href = "sfl/region.html" > SFL< / a > < br > < span class = "budget" > < strong > Budżet grupy:< / strong > ~14 500– < / span > < p > SFL w lutym bez styczniowej przewagi cenowej — nadal najlepszy funkcjonalnie dla dzieci, ale już nie najtańszy (u nich luty to pełny wysoki sezon).< / p > < / li > < / ul >
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
< h2 > Wszystkie oferty< / h2 >
2026-08-04 09:57:09 +02:00
< 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 = "saalbach/oferty/alpenparks-rehrenberg.html" > < img src = "img/alpenparks-rehrenberg/01.jpg" alt = "AlpenParks Apartments Rehrenberg" loading = "lazy" > < / a > < / td > < td class = "name" data-key = "AlpenParks Apartments Rehrenberg" > < a href = "saalbach/oferty/alpenparks-rehrenberg.html" > AlpenParks Apartments Rehrenberg< / a > < / td > < td data-key = "ARCHIWALNA (poza paczką 08.2026)" title = "ARCHIWALNA (poza paczką 08.2026)" > ARCHIWALNA< / td > < td data-key = "Saalbach" > < a href = "saalbach/region.html" > Saalbach< / a > < / td > < td data-key = "Viehhofen" > Viehhofen< / td > < td data-num = "1100" title = "~1 100– > ~1 100– < / td > < td data-num = "1100" > ~1 100– < / td > < td data-num = "950" > ~950– < / td > < td data-key = "SZACUNEK — silnik online na alpenparks.at" title = "SZACUNEK — silnik online na alpenparks.at" > SZACUNEK< / td > < td data-key = "5– > 5– < / td > < td data-key = "alpenparks.at" > < a href = "https://www.alpenparks.at" target = "_blank" rel = "noopener" class = "ext" > alpenparks.at< / a > < / td > < / tr > < 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 = "1100" title = "~1 100– > ~1 100– < / td > < td data-num = "1100" > ~1 100– < / td > < td data-num = "900" > ~900– < / td > < td data-key = "SZACUNEK — wycena mailowo" title = "SZACUNEK — wycena mailowo" > SZACUNEK< / td > < td data-key = "skibus przy domu → Kappl / Ischgl ~10 min" > skibus przy 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 = "1100" title = "~1 100– > ~1 100– < / td > < td data-num = "1100" > ~1 100– < / td > < td data-num = "900" > ~900– < / 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.j
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
< p class = "legend" > < span class = "box v" > < / span > cena zweryfikowana < span class = "box e" > < / span > szacunek do potwierdzenia< / p >
< footer > Wygenerowane z bundle'a OKF przez < code > gen_pages.py< / code > — nie edytuj
2026-08-03 17:52:23 +02:00
tych plików, edytuj < code > .md< / code > i przegeneruj.< br >
powered by < a href = "https://gethumanai.pl" target = "_blank" rel = "noopener" > gethumanai.pl< / a > < / footer >
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
< 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 >
