From 30b509436e3485df41f973d356e57e0913925f6b Mon Sep 17 00:00:00 2001
From: AdrianoDev <adrianodalpastro@gmail.com>
Date: Sun, 12 Jul 2026 23:48:58 +0200
Subject: [PATCH] contenuti: aggiunge size xl/xxl e allineamento (con
 giustificato)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- style-presets: size += xl, xxl; align += justify
- global.css: .cs-size-xl (1.5em), .cs-size-xxl (2em), .cs-align-justify
- content-seed: 'align' nei default styleOptions dei tag testo/html, così il
  picker orientamento (sx/centrato/dx/giustificato) compare nell'editor
- Base.astro: sincronizza la copia hardcoded degli stili nell'editor inline

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 src/data/content-seed.ts | 4 ++--
 src/layouts/Base.astro   | 2 +-
 src/lib/style-presets.ts | 4 ++--
 src/styles/global.css    | 3 +++
 4 files changed, 8 insertions(+), 5 deletions(-)

diff --git a/src/data/content-seed.ts b/src/data/content-seed.ts
index 5075c6d..f831e87 100644
--- a/src/data/content-seed.ts
+++ b/src/data/content-seed.ts
@@ -11,9 +11,9 @@ import { performanceClassPricing } from './pricing';
 export type ContentType = 'text' | 'html' | 'image';
 export interface SeedEntry { tag: string; type: ContentType; value: string; styleOptions?: StyleGroup[] }
 
-const T = (tag: string, value: string, styleOptions: StyleGroup[] = ['size', 'color', 'weight', 'style']): SeedEntry =>
+const T = (tag: string, value: string, styleOptions: StyleGroup[] = ['size', 'color', 'weight', 'style', 'align']): SeedEntry =>
   ({ tag, type: 'text', value, styleOptions });
-const H = (tag: string, value: string, styleOptions: StyleGroup[] = ['size', 'color']): SeedEntry =>
+const H = (tag: string, value: string, styleOptions: StyleGroup[] = ['size', 'color', 'align']): SeedEntry =>
   ({ tag, type: 'html', value, styleOptions });
 const I = (tag: string): SeedEntry => ({ tag, type: 'image', value: '' });
 
diff --git a/src/layouts/Base.astro b/src/layouts/Base.astro
index 4e4263d..0c402c9 100644
--- a/src/layouts/Base.astro
+++ b/src/layouts/Base.astro
@@ -107,7 +107,7 @@ const showTags = canTags && wantTags;
       </div>
       <script is:inline>
         (() => {
-          const STYLE_GROUPS = { size: ['s','m','l'], color: ['accent','accent-dark','dark','heading','text','text-light','white'], weight: ['normal','bold'], style: ['normal','italic'], align: ['left','center','right'] };
+          const STYLE_GROUPS = { size: ['s','m','l','xl','xxl'], color: ['accent','accent-dark','dark','heading','text','text-light','white'], weight: ['normal','bold'], style: ['normal','italic'], align: ['left','center','right','justify'] };
           const modal = document.getElementById('tag-modal');
           const tmTag = document.getElementById('tm-tag');
           const tmGuid = document.getElementById('tm-guid');
diff --git a/src/lib/style-presets.ts b/src/lib/style-presets.ts
index 821ad38..0bfb9fd 100644
--- a/src/lib/style-presets.ts
+++ b/src/lib/style-presets.ts
@@ -1,9 +1,9 @@
 export const STYLE_GROUPS = {
-  size: ['s', 'm', 'l'],
+  size: ['s', 'm', 'l', 'xl', 'xxl'],
   color: ['accent', 'accent-dark', 'dark', 'heading', 'text', 'text-light', 'white'],
   weight: ['normal', 'bold'],
   style: ['normal', 'italic'],
-  align: ['left', 'center', 'right'],
+  align: ['left', 'center', 'right', 'justify'],
 } as const;
 
 export type StyleGroup = keyof typeof STYLE_GROUPS;
diff --git a/src/styles/global.css b/src/styles/global.css
index 2b49c61..600cb73 100644
--- a/src/styles/global.css
+++ b/src/styles/global.css
@@ -73,6 +73,8 @@ html.js [data-reveal].is-inview, html.js .section-heading.is-inview { opacity: 1
 .cs-size-s { font-size: .85em; }
 .cs-size-m { font-size: 1em; }
 .cs-size-l { font-size: 1.25em; }
+.cs-size-xl { font-size: 1.5em; }
+.cs-size-xxl { font-size: 2em; }
 .cs-color-accent { color: var(--c-accent); }
 .cs-color-accent-dark { color: var(--c-accent-dark); }
 .cs-color-dark { color: var(--c-dark); }
@@ -87,3 +89,4 @@ html.js [data-reveal].is-inview, html.js .section-heading.is-inview { opacity: 1
 .cs-align-left { text-align: left; }
 .cs-align-center { text-align: center; }
 .cs-align-right { text-align: right; }
+.cs-align-justify { text-align: justify; }