Adriano
11fc2b3e54
Servizi: - Personal Training rinominato "One to One" (slug /services/one-to-one) con redirect 301 dal vecchio URL e migrazione DB idempotente dei contenuti taggati - Nuova pagina "Small Group" (slug /services/small-group, fuori dalla griglia) - Rimossi i titoli intro di /training e /services e le liste feature di One to One, Small Group, Rehab e Osteopatia; la lista feature ora è condizionale - Fix elenco puntato nel long-description (white-space: pre-line, selettore ancorato al container per gli elementi resi dal componente <T>) - Immagine di Performance Class aggiornata - Nella griglia Servizi i riquadri "One to One" e "Performance Class" rimandano a /training; nella pagina Training i riquadri One to One e Small Group aprono le rispettive schede servizio Landing: - Pagina "Promo ed eventi" (slug /promo-eventi) integrata nel sito con header e footer condivisi, basata sul nuovo mockup di lancio - Card a 5 incontri con prezzi edizione apertura, FAQ ad accordion e acquisto tramite gestionale bsport - Nuova voce di menu "Promo ed eventi" Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
60 lines
3.3 KiB
Plaintext
60 lines
3.3 KiB
Plaintext
---
|
|
import Base from '../../layouts/Base.astro';
|
|
import PageHero from '../../components/PageHero.astro';
|
|
import type { ImageMetadata } from 'astro';
|
|
import { services } from '../../data/services';
|
|
import T from '../../components/content/T.astro';
|
|
import TImg from '../../components/content/TImg.astro';
|
|
import { t } from '../../lib/content';
|
|
const images = import.meta.glob<{ default: ImageMetadata }>('../../assets/img/program-*.jpg', { eager: true });
|
|
const imgOf = (slug: string) => Object.entries(images).find(([p]) => p.includes(`program-${slug}.`))?.[1]?.default;
|
|
const gridServices = services.filter((p) => p.grid !== false);
|
|
// Questi servizi rimandano alla pagina Training invece che alla scheda di dettaglio
|
|
const TRAINING_LINK = new Set(['one-to-one', 'performance-class']);
|
|
const moreHref = (slug: string) => (TRAINING_LINK.has(slug) ? '/training' : `/services/${slug}`);
|
|
export const prerender = false;
|
|
---
|
|
<Base title={t('services.meta.title')} description={t('services.meta.description')}>
|
|
<PageHero title={t('services.hero.title')} />
|
|
<section class="section">
|
|
<div class="container">
|
|
<div class="section-heading">
|
|
<T tag="services.intro.body" as="p" />
|
|
</div>
|
|
<div class="plist">
|
|
{gridServices.map((p, i) => (
|
|
<article class="plist__card" data-reveal style={`--reveal-delay:${((i % 3) * 0.15).toFixed(2)}s`}>
|
|
{imgOf(p.slug) && (
|
|
<a class="plist__photo" href={`/services/${p.slug}`}>
|
|
<TImg tag={`service.${p.slug}.image`} src={imgOf(p.slug)!} alt={t(`service.${p.slug}.title`)} widths={[400, 700]} sizes="(max-width:767px) 100vw, 33vw" />
|
|
</a>
|
|
)}
|
|
<div class="plist__body">
|
|
<T tag={`service.${p.slug}.title`} as="h3" />
|
|
<T tag={`service.${p.slug}.subtitle`} as="p" class="plist__sub" />
|
|
<T tag={`service.${p.slug}.excerpt`} as="p" />
|
|
<a class="plist__more" href={moreHref(p.slug)}>{t('services.card.more-label')}</a>
|
|
</div>
|
|
</article>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</Base>
|
|
|
|
<style>
|
|
.plist { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px 30px; }
|
|
.plist__card { background: #fff; box-shadow: 0 6px 24px rgba(0,0,0,.08); display: flex; flex-direction: column; }
|
|
.plist__photo { display: block; overflow: hidden; }
|
|
.plist__photo img { aspect-ratio: 4/3; object-fit: cover; width: 100%; transition: transform .5s ease; }
|
|
.plist__card:hover .plist__photo img { transform: scale(1.05); }
|
|
.plist__body { padding: 26px 24px 30px; display: flex; flex-direction: column; align-items: flex-start; flex: 1; }
|
|
.plist__card h3 { font-size: 1rem; text-transform: uppercase; letter-spacing: .1em; margin-bottom: .3em; }
|
|
.plist__sub { font-size: .78rem; text-transform: uppercase; letter-spacing: .12em; color: var(--c-accent-dark); }
|
|
.plist__body > p:not(.plist__sub) { font-size: .9rem; }
|
|
.plist__more { font-family: var(--font-heading); font-size: .72rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; text-decoration: none; color: var(--c-heading); margin-top: auto; }
|
|
.plist__more:hover { color: var(--c-accent-dark); }
|
|
@media (max-width: 991px) { .plist { grid-template-columns: 1fr 1fr; } }
|
|
@media (max-width: 600px) { .plist { grid-template-columns: 1fr; } }
|
|
</style>
|