AdrianoDev
510d7ca4ec
Primo passo della separazione sito / piattaforme decisa da Adriano il 03/09: due applicazioni autosufficienti, senza workspace di root, cosi' che ognuna resti un progetto Astro completo ed estraibile. Qui non cambia niente del codice: solo la radice. I pattern del .gitignore che avevano una barra erano ancorati alla radice e dopo lo spostamento non avrebbero piu' coperto niente (data/*.db*, uploads/*): resi validi a qualunque profondita'. Suite: 45 file, 347 test verdi prima e dopo lo spostamento. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01EndnceRA5WnA6rvA5iV9WL
35 lines
1.6 KiB
Plaintext
35 lines
1.6 KiB
Plaintext
---
|
|
import featPerformance from '../../assets/img/feature-performance.jpg';
|
|
import featBalance from '../../assets/img/feature-balance.jpg';
|
|
import featLongevity from '../../assets/img/feature-longevity.jpg';
|
|
import T from '../content/T.astro';
|
|
import TImg from '../content/TImg.astro';
|
|
import { t } from '../../lib/content';
|
|
const blocks = [
|
|
{ key: 'performance', image: featPerformance, reverse: false },
|
|
{ key: 'balance', image: featBalance, reverse: true },
|
|
{ key: 'longevity', image: featLongevity, reverse: false },
|
|
];
|
|
---
|
|
<section class="section">
|
|
<div class="container">
|
|
{blocks.map((b) => (
|
|
<div class:list={['feat', { 'feat--reverse': b.reverse }]}>
|
|
<TImg tag={`home.feature.${b.key}.image`} src={b.image} alt={t(`home.feature.${b.key}.title`)} class="feat__img" widths={[500, 900]} sizes="(max-width: 767px) 100vw, 45vw" data-reveal={b.reverse ? 'right' : 'left'} />
|
|
<div class="feat__text" data-reveal={b.reverse ? 'left' : 'right'}>
|
|
<T tag={`home.feature.${b.key}.title`} as="h2" />
|
|
<T tag={`home.feature.${b.key}.body`} as="p" />
|
|
<a class="btn" href="/services">{t(`home.feature.${b.key}.cta`)}</a>
|
|
</div>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</section>
|
|
|
|
<style>
|
|
.feat { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; padding-block: 40px; }
|
|
.feat--reverse .feat__img { order: 2; }
|
|
.feat__text h2 { text-transform: uppercase; letter-spacing: .1em; }
|
|
@media (max-width: 767px) { .feat { grid-template-columns: 1fr; gap: 24px; } .feat--reverse .feat__img { order: 0; } }
|
|
</style>
|