From 28becb947295d25fd8622c0d37bc7a49ad7933e9 Mon Sep 17 00:00:00 2001 From: Florian <45694132+flo-bit@users.noreply.github.com> Date: Thu, 02 Jul 2026 08:02:23 +0000 Subject: [PATCH] Merge remote-tracking branch 'origin/main' into sources # Conflicts: # apps/web/src/lib/types.ts --- apps/web/src/app.css | 13 +++++++++++++ apps/web/src/lib/types.ts | 4 ++++ apps/web/src/lib/helpers/website.ts | 17 +++++++++++++++++ apps/web/src/lib/sections/SectionChrome.svelte | 2 +- apps/web/src/lib/sections/ColumnsSection/EditingColumnsSection.svelte | 2 +- apps/web/src/lib/sections/GridSection/EditingGridSection.svelte | 2 +- apps/web/src/lib/sections/HeroSection/Decoration.svelte | 6 +++--- apps/web/src/lib/sections/RowsSection/EditingRowsSection.svelte | 2 +- apps/web/src/lib/sections/SingleCardSection/EditingSingleCardSection.svelte | 2 +- apps/web/src/lib/website/view/DevThemeSwitcher.svelte | 116 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ apps/web/src/lib/website/view/Head.svelte | 6 ++++-- apps/web/src/lib/website/view/ThemeScript.svelte | 21 ++++++++++++++++----- apps/web/src/lib/website/view/Website.svelte | 10 +++++++++- apps/web/src/lib/cards/_base/BaseCard/BaseCard.svelte | 4 ++-- 14 file(s) changed, 189 insertion(s)(+), 18 deletion(s)(-) diff --git a/apps/web/src/app.css b/apps/web/src/app.css --- a/apps/web/src/app.css +++ b/apps/web/src/app.css @@ -9,6 +9,19 @@ @source '../node_modules/@atmo-dev/events-ui/dist'; @import '@foxui/core/theme.css'; +/* Blento semantic design tokens. Each Tailwind theme value reads an overridable `--blento-*` CSS + variable with a default that matches today's look, so components use normal utilities (e.g. + `rounded-card`) that resolve through page-overridable tokens (set on by ThemeScript from + page.style). Colors stay on the @foxui accent/base mechanism above. */ +@theme inline { + --radius-card: var(--blento-radius-card, 1.5rem); +} + +/* Body font token — defaults to `inherit` (the current stack), overridden per page/theme. */ +body { + font-family: var(--blento-font-body, inherit); +} + @custom-variant dark (&:where(.dark, .dark *):not(:where(.light, .light *))); @custom-variant accent (&:where(.accent, .accent *)); diff --git a/apps/web/src/lib/types.ts b/apps/web/src/lib/types.ts --- a/apps/web/src/lib/types.ts +++ b/apps/web/src/lib/types.ts @@ -1,5 +1,6 @@ import type { Blob } from '@atcute/lexicons'; import type { AppBskyActorDefs } from '@atcute/bluesky'; +import type { StyleTokens } from '@blento/schema'; import type { ResolvedNode } from '@blento/sources'; export type Item = { @@ -91,6 +92,9 @@ // explicit layout sync mode (overrides editedOn when set) layoutMode?: 'desktop-leads' | 'mobile-leads' | 'independent'; }; + + /** Semantic design tokens (radius/space/font) applied as --blento-* CSS vars by ThemeScript. */ + style?: StyleTokens; }; profile: AppBskyActorDefs.ProfileViewDetailed; pronouns?: string; diff --git a/apps/web/src/lib/helpers/website.ts b/apps/web/src/lib/helpers/website.ts --- a/apps/web/src/lib/helpers/website.ts +++ b/apps/web/src/lib/helpers/website.ts @@ -1,5 +1,22 @@ import type { WebsiteData } from '../types'; +/** + * Flatten the page's `style` tokens into `--blento-` CSS-var pairs for ThemeScript. Colors stay + * on the @foxui accent/base class mechanism; radius/space/font flow through the token vars (e.g. + * `style.radius.card` -> `radius-card` -> `--blento-radius-card`). Empty when no page tokens are set. + */ +export function getStyleTokens(data: WebsiteData): Record { + const style = data.publication?.style; + if (!style) return {}; + const out: Record = {}; + for (const group of ['radius', 'shadow', 'space', 'font'] as const) { + const g = style[group]; + if (!g) continue; + for (const [k, v] of Object.entries(g)) out[`${group}-${k}`] = String(v); + } + return out; +} + export function getName(data: WebsiteData): string { return data.publication?.name || data.profile.displayName || data.handle; } diff --git a/apps/web/src/lib/sections/SectionChrome.svelte b/apps/web/src/lib/sections/SectionChrome.svelte --- a/apps/web/src/lib/sections/SectionChrome.svelte +++ b/apps/web/src/lib/sections/SectionChrome.svelte @@ -23,7 +23,7 @@ {#if enabled && (hovered || isActive)}
diff --git a/apps/web/src/lib/sections/ColumnsSection/EditingColumnsSection.svelte b/apps/web/src/lib/sections/ColumnsSection/EditingColumnsSection.svelte --- a/apps/web/src/lib/sections/ColumnsSection/EditingColumnsSection.svelte +++ b/apps/web/src/lib/sections/ColumnsSection/EditingColumnsSection.svelte @@ -84,7 +84,7 @@
+ + {#if dev} + + {/if} diff --git a/apps/web/src/lib/cards/_base/BaseCard/BaseCard.svelte b/apps/web/src/lib/cards/_base/BaseCard/BaseCard.svelte --- a/apps/web/src/lib/cards/_base/BaseCard/BaseCard.svelte +++ b/apps/web/src/lib/cards/_base/BaseCard/BaseCard.svelte @@ -39,7 +39,7 @@ bind:this={ref} draggable={false} class={[ - 'card group/card selection:bg-accent-600/50 @container/card relative isolate z-0 h-full w-full rounded-3xl outline-offset-2 transition-[outline] duration-200', + 'card group/card selection:bg-accent-600/50 rounded-card @container/card relative isolate z-0 h-full w-full [box-shadow:var(--blento-shadow-card,0_0_#0000)] outline-offset-2 transition-[outline] duration-200', isEditing ? 'transition-all' : '', color ? (colors[color] ?? colors.accent) : colors.base, color !== 'accent' && item.color !== 'base' && item.color !== 'transparent' ? color : '', @@ -50,7 +50,7 @@ >