From daeaea54880b4ac510342cd9b9158e84ba6acd45 Mon Sep 17 00:00:00 2001 From: Kuba Orlik Date: Tue, 18 Aug 2026 08:01:39 +0200 Subject: [PATCH 01/29] Dynamic Grid V2 --- .../dynamic-grid-v2/dynamic-grid-v2.css | 251 ++++++++++++++++++ .../dynamic-grid-v2/dynamic-grid-v2.jdd.tsx | 112 ++++++++ 2 files changed, 363 insertions(+) create mode 100644 src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.css create mode 100644 src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.jdd.tsx diff --git a/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.css b/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.css new file mode 100644 index 0000000..bc2341f --- /dev/null +++ b/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.css @@ -0,0 +1,251 @@ +.dynamic-grid { + &.dynamic-grid--bleed-bleed { + grid-column: bleed !important; + } + + &.dynamic-grid--bleed-screen { + grid-column: screen !important; + } + + .dynamic-grid-title { + text-align: center; + margin-top: 0; + } + + .tiles-container { + display: grid; + grid-gap: 24px; + grid-template-columns: repeat(3, 1fr); + grid-auto-rows: min-content; + grid-auto-flow: row dense; + + @container (min-width: 900px) { + grid-template-columns: repeat(4, 1fr); + } + + .tile { + overflow: hidden; + display: grid; + gap: 0; + + grid-template-columns: subgrid; + grid-template-rows: subgrid; + + color: var(--color-brand-text-fg); + text-decoration: none; + + .tile-content { + grid-row: 2/3; + background-color: var(--tile-bg-color); + color: var(--tile-fg-color); + width: 100%; + opacity: 0.9; + padding: 8px; + z-index: 1; + overflow: hidden; + bottom: 0; + box-sizing: border-box; + + .tile-content-wrapper { + display: -webkit-box; + -webkit-box-orient: vertical; + -webkit-line-clamp: 4; + line-height: 20px; + overflow: hidden; + + .tile-title { + font-weight: bold; + line-height: 20px; + margin: 10px 0; + } + + .tile-subtitle { + line-height: 20px; + margin: 0; + } + } + } + + .tile-image { + z-index: 0; + width: 100%; + height: 100%; + grid-row: 1/2; + + picture { + height: 100%; + width: 100% !important; + } + } + } + + .tile.square { + grid-column: span 1; + grid-row: span 2; + + .tile-content { + grid-row: 2/3; + } + + .tile-image--horizontal { + display: none; + } + + .tile-image--vertical { + display: none; + } + + .tile-image--square { + grid-row: 1/2; + picture img { + display: block !important; + } + } + } + + .tile.horizontal { + grid-column: span 2; + grid-row: span 2; + + .tile-content { + grid-column: 1/3; + } + + .tile-image--vertical { + display: none; + } + + .tile-image--square { + display: none; + } + + .tile-image--horizontal { + grid-column: 1/3; + picture img { + display: block !important; + } + } + } + + .tile.vertical { + grid-row: span 4; + grid-column: span 1; + + .tile-content { + grid-row: 4/5; + } + + .tile-image--horizontal { + display: none; + } + + .tile-image--square { + display: none; + } + + .tile-image--vertical { + grid-row: 1/4; + picture img { + display: block !important; + } + } + } + + .buttons-container { + margin-top: 36px; + display: flex; + justify-content: center; + flex-flow: row wrap; + column-gap: 18px; + row-gap: 16px; + + .button { + display: inline-block; + text-align: center; + padding: 8px 24px; + border: 1px solid var(--color-brand-text-fg); + color: var(--text-color); + min-width: 240px; + line-height: 23px; + font-size: 16px; + + &.accent { + background-color: var(--color-brand-accent); + --text-color: var(--color-brand-text-on-accent); + } + + &.accent2 { + background-color: var(--color-brand-accent2); + --text-color: var(--color-brand-text-on-accent2); + } + } + } + } + + @container (max-width: 950px) { + .tab-container { + .tiles-container { + grid-template-columns: repeat(2, 1fr); + + .tile.vertical { + grid-row: span 1; + grid-column: span 1; + + .tile-image--vertical { + display: none; + } + + .tile-image--horizontal { + display: none; + } + + .tile-image--square { + display: block; + + picture img { + display: block !important; + } + } + } + + .tile.horizontal { + grid-column: span 1; + } + } + } + } + + @container (max-width: 700px) { + .tiles-container { + grid-template-columns: 1fr; + max-width: 700px; + margin: 0 auto; + + .tile { + grid-column: span 1 !important; + grid-row: span 2 !important; + + .tile-content { + grid-row: 2/3 !important; + } + + .tile-image--vertical { + display: none; + } + + .tile-image--horizontal { + display: none; + } + + .tile-image--square { + display: block !important; + grid-row: 1/2 !important; + + picture img { + display: block !important; + } + } + } + } + } +} diff --git a/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.jdd.tsx b/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.jdd.tsx new file mode 100644 index 0000000..4f4e465 --- /dev/null +++ b/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.jdd.tsx @@ -0,0 +1,112 @@ +import type { FlatTemplatable } from "tempstream"; +import { TempstreamJSX } from "tempstream"; +import type { ComponentToHTMLArgs, ExtractParsed, JDDContext } from "@sealcode/jdd"; +import { Component, ComponentArguments } from "@sealcode/jdd"; +import { getFgColorVariable } from "src/back/colors.js"; + +type ExtractArray = T extends Array ? X : never; + +const generate_id = (function* () { + while (true) { + for (let i = 1; i <= 10000; i++) { + yield i; + } + } +})(); + +const component_arguments = { + bleed: new ComponentArguments.Enum(["none", "bleed", "screen"]).setDefaultValue( + "none" + ), + tiles: new ComponentArguments.List( + new ComponentArguments.Structured({ + title: new ComponentArguments.ShortText(), + subtitle: new ComponentArguments.ShortText(), + url: new ComponentArguments.ShortText(), + photo: new ComponentArguments.Structured({ + image: new ComponentArguments.Image(), + alt: new ComponentArguments.ShortText(), + }), + shape: new ComponentArguments.Enum(["square", "horizontal", "vertical"]), + background: new ComponentArguments.Enum(["accent", "accent2", "text-bg"]), + }) + ), +} as const; + +export class DynamicGridV2 extends Component { + getArguments() { + return component_arguments; + } + + public image_sizes = { + square: { width: 700, height: 700 }, + horizontal: { width: 824, height: 400 }, + vertical: { width: 400, height: 824 }, + }; + + renderTile( + jdd_context: JDDContext, + tile: ExtractArray> + ) { + return ( + +
+
+

{tile.title}

+

{tile.subtitle}

+
+
+ + {(["square", "horizontal", "vertical"] as const).map((shape) => ( +
+ {!tile.photo + ? "" + : jdd_context.render_image(tile.photo.image, { + sizesAttr: + "(max-width: 730px) 100vw, (max-width: 980px) 50vw, 810px", + alt: tile.photo.alt, + container: { + ...this.image_sizes[shape], + objectFit: "cover", + }, + crop: this.image_sizes[shape], + imgStyle: "display: none;", + })} +
+ ))} + + ); + } + + toHTML( + { + args: { tiles, bleed }, + jdd_context, + classes, + index, + }: ComponentToHTMLArgs, + tab_style_when_active = `border-bottom-color: var(--color-brand-canvas); + border-top-color: var(--color-brand-accent-04); + background: var(--color-brand-canvas); + color: var(--color-brand-text-fg);` + ): FlatTemplatable { + const { value: id } = generate_id.next(); + return ( +
+
+ {tiles.map((tile) => this.renderTile(jdd_context, tile))} +
+
+ ); + } +} From 67554b020d5b124a9f7b44b05093d5de27f2d182 Mon Sep 17 00:00:00 2001 From: Kuba Orlik Date: Tue, 18 Aug 2026 08:12:39 +0200 Subject: [PATCH 02/29] Reponsive fixes for dynamic grid v2 --- .../dynamic-grid-v2/dynamic-grid-v2.css | 82 ++++++++++++------- 1 file changed, 52 insertions(+), 30 deletions(-) diff --git a/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.css b/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.css index bc2341f..af18ab4 100644 --- a/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.css +++ b/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.css @@ -1,4 +1,6 @@ .dynamic-grid { + container-type: inline-size; + &.dynamic-grid--bleed-bleed { grid-column: bleed !important; } @@ -47,12 +49,6 @@ box-sizing: border-box; .tile-content-wrapper { - display: -webkit-box; - -webkit-box-orient: vertical; - -webkit-line-clamp: 4; - line-height: 20px; - overflow: hidden; - .tile-title { font-weight: bold; line-height: 20px; @@ -182,40 +178,66 @@ } } - @container (max-width: 950px) { - .tab-container { - .tiles-container { - grid-template-columns: repeat(2, 1fr); + @container (max-width: 900px) { + .tiles-container { + grid-template-columns: repeat(3, 1fr); - .tile.vertical { - grid-row: span 1; - grid-column: span 1; + .tile.vertical { + grid-row: span 1; + grid-column: span 1; - .tile-image--vertical { - display: none; - } - - .tile-image--horizontal { - display: none; - } - - .tile-image--square { - display: block; - - picture img { - display: block !important; - } - } + .tile-image--vertical { + display: none; } - .tile.horizontal { - grid-column: span 1; + .tile-image--horizontal { + display: none; + } + + .tile-image--square { + display: block; + + picture img { + display: block !important; + } } } } } @container (max-width: 700px) { + .tiles-container { + grid-template-columns: repeat(2, 1fr); + + .tile.vertical { + grid-row: span 1; + grid-column: span 1; + + .tile-image--vertical { + display: none; + } + + .tile-image--horizontal { + display: none; + } + + .tile-image--square { + display: block; + + picture img { + display: block !important; + } + } + } + + .tile.vertical { + grid-row: span 2; + grid-column: span 1; + } + } + } + + @container (max-width: 500px) { .tiles-container { grid-template-columns: 1fr; max-width: 700px; From 83fe4c48721e3b7a4574c05852f66b68c235a8bb Mon Sep 17 00:00:00 2001 From: Kuba Orlik Date: Tue, 18 Aug 2026 20:32:14 +0200 Subject: [PATCH 03/29] Fix vertical tile in dynamic grid vs --- .../dynamic-grid-v2/dynamic-grid-v2.css | 21 ------------------- 1 file changed, 21 deletions(-) diff --git a/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.css b/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.css index af18ab4..fa15837 100644 --- a/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.css +++ b/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.css @@ -181,27 +181,6 @@ @container (max-width: 900px) { .tiles-container { grid-template-columns: repeat(3, 1fr); - - .tile.vertical { - grid-row: span 1; - grid-column: span 1; - - .tile-image--vertical { - display: none; - } - - .tile-image--horizontal { - display: none; - } - - .tile-image--square { - display: block; - - picture img { - display: block !important; - } - } - } } } From f844ca660f1afe7d2ff007aed781d29cbccd4c7f Mon Sep 17 00:00:00 2001 From: Kuba Orlik Date: Tue, 18 Aug 2026 20:38:11 +0200 Subject: [PATCH 04/29] Fix unnecessary clickable links in dynamic grid --- .../dynamic-grid-v2/dynamic-grid-v2.jdd.tsx | 16 ++++++++++++---- 1 file changed, 12 insertions(+), 4 deletions(-) diff --git a/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.jdd.tsx b/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.jdd.tsx index 4f4e465..5086afb 100644 --- a/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.jdd.tsx +++ b/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.jdd.tsx @@ -22,13 +22,21 @@ const component_arguments = { new ComponentArguments.Structured({ title: new ComponentArguments.ShortText(), subtitle: new ComponentArguments.ShortText(), - url: new ComponentArguments.ShortText(), + url: new ComponentArguments.ShortText().setDefaultValue(""), photo: new ComponentArguments.Structured({ image: new ComponentArguments.Image(), alt: new ComponentArguments.ShortText(), }), - shape: new ComponentArguments.Enum(["square", "horizontal", "vertical"]), - background: new ComponentArguments.Enum(["accent", "accent2", "text-bg"]), + shape: new ComponentArguments.Enum([ + "square", + "horizontal", + "vertical", + ]).setDefaultValue("square"), + background: new ComponentArguments.Enum([ + "accent", + "accent2", + "text-bg", + ]).setDefaultValue("accent"), }) ), } as const; @@ -50,7 +58,7 @@ export class DynamicGridV2 extends Component { ) { return ( Date: Wed, 19 Aug 2026 22:04:44 +0200 Subject: [PATCH 05/29] Add anchor component --- src/back/jdd-components/anchor/anchor.jdd.tsx | 20 +++++++++++++++++++ 1 file changed, 20 insertions(+) create mode 100644 src/back/jdd-components/anchor/anchor.jdd.tsx diff --git a/src/back/jdd-components/anchor/anchor.jdd.tsx b/src/back/jdd-components/anchor/anchor.jdd.tsx new file mode 100644 index 0000000..0c81c80 --- /dev/null +++ b/src/back/jdd-components/anchor/anchor.jdd.tsx @@ -0,0 +1,20 @@ +import { TempstreamJSX } from "tempstream"; +import type { ComponentToHTMLArgs } from "@sealcode/jdd"; +import { Component, ComponentArguments } from "@sealcode/jdd"; + +const component_arguments = { + id: new ComponentArguments.ShortText(), +} as const; + +export class Anchor extends Component { + getArguments() { + return component_arguments; + } + + async toHTML({ + args: { id }, + classes, + }: ComponentToHTMLArgs): Promise { + return
; + } +} From cffeb98914d4d9649be8674ad0c7d28cd6bb2a6a Mon Sep 17 00:00:00 2001 From: Kuba Orlik Date: Wed, 19 Aug 2026 22:22:57 +0200 Subject: [PATCH 06/29] More flexible bleeds in tekst and subtree --- src/back/jdd-components/subtree/subtree.css | 9 +++++++++ src/back/jdd-components/tekst/tekst.css | 8 ++++++++ src/back/jdd-components/tekst/tekst.jdd.tsx | 4 +++- 3 files changed, 20 insertions(+), 1 deletion(-) diff --git a/src/back/jdd-components/subtree/subtree.css b/src/back/jdd-components/subtree/subtree.css index 75b7c43..40d1e04 100644 --- a/src/back/jdd-components/subtree/subtree.css +++ b/src/back/jdd-components/subtree/subtree.css @@ -115,3 +115,12 @@ } } } + +.grid-layout-main > .subtree:not(.subtree--bleed-none) { + display: grid !important; + grid-template-columns: subgrid; + + & > * { + grid-column: content; + } +} diff --git a/src/back/jdd-components/tekst/tekst.css b/src/back/jdd-components/tekst/tekst.css index 77abfb3..c8e8373 100644 --- a/src/back/jdd-components/tekst/tekst.css +++ b/src/back/jdd-components/tekst/tekst.css @@ -11,6 +11,14 @@ font-size: 20px; } + &.tekst--bleed-none { + grid-column: content !important; + } + + &.tekst--bleed-bleed { + grid-column: bleed !important; + } + p { margin: 0; } diff --git a/src/back/jdd-components/tekst/tekst.jdd.tsx b/src/back/jdd-components/tekst/tekst.jdd.tsx index 3e16258..6352b88 100644 --- a/src/back/jdd-components/tekst/tekst.jdd.tsx +++ b/src/back/jdd-components/tekst/tekst.jdd.tsx @@ -17,6 +17,7 @@ const component_arguments = { size: new ComponentArguments.Enum(["small", "normal", "large"]).setDefaultValue( "normal" ), + bleed: new ComponentArguments.Enum(["none", "bleed"]).setDefaultValue("none"), content: new ComponentArguments.Markdown(), side_content: new ComponentArguments.NestedComponent(), } as const; @@ -42,7 +43,7 @@ export class Tekst extends Component { } toHTML({ - args: { color, content, side_content, size }, + args: { color, content, side_content, size, bleed }, classes, jdd_context, index, @@ -55,6 +56,7 @@ export class Tekst extends Component { ...classes, `tekst--color-${color}`, `tekst--size-${size}`, + `tekst--bleed-${bleed}`, ]} style={`--jdd-index: ${index}`} > From b0ed7171a672fdbccd3a8e4aebe0ff5fe2acf827 Mon Sep 17 00:00:00 2001 From: Kuba Orlik Date: Wed, 19 Aug 2026 22:28:18 +0200 Subject: [PATCH 07/29] Add heading alignment --- src/back/jdd-components/heading/heading.css | 14 ++++++++++++++ src/back/jdd-components/heading/heading.jdd.tsx | 6 +++++- 2 files changed, 19 insertions(+), 1 deletion(-) diff --git a/src/back/jdd-components/heading/heading.css b/src/back/jdd-components/heading/heading.css index 9c4dbc5..0156d4c 100644 --- a/src/back/jdd-components/heading/heading.css +++ b/src/back/jdd-components/heading/heading.css @@ -1,4 +1,6 @@ .heading { + text-wrap: pretty; + text-wrap: balance; & > * { margin-top: 0; margin-bottom: 0; @@ -24,6 +26,18 @@ font-size: 64px; } + &.heading--align-left { + text-align: left; + } + + &.heading--align-right { + text-align: right; + } + + &.heading--align-center { + text-align: center; + } + &.heading--color-normal { color: var(--color-brand-text-fg); } diff --git a/src/back/jdd-components/heading/heading.jdd.tsx b/src/back/jdd-components/heading/heading.jdd.tsx index 93e3daa..db4a611 100644 --- a/src/back/jdd-components/heading/heading.jdd.tsx +++ b/src/back/jdd-components/heading/heading.jdd.tsx @@ -18,6 +18,9 @@ const component_arguments = { "large", "extra_large", ]).setDefaultValue("medium"), + align: new ComponentArguments.Enum(["left", "right", "center"]).setDefaultValue( + "left" + ), color: new ComponentArguments.Enum(["normal", "accent1", "accent2"]).setDefaultValue( "normal" ), @@ -30,7 +33,7 @@ export class Heading extends Component { } async toHTML({ - args: { title, level, font_size, color }, + args: { title, level, font_size, color, align }, classes, }: ComponentToHTMLArgs): Promise { return ( @@ -39,6 +42,7 @@ export class Heading extends Component { "heading", `heading--font-size-${font_size}`, `heading--color-${color}`, + `heading--align-${align}`, ...classes, ]} > From 750ee35ef40f0969f06454e53c334f51af93f9bb Mon Sep 17 00:00:00 2001 From: Kuba Orlik Date: Wed, 19 Aug 2026 22:36:49 +0200 Subject: [PATCH 08/29] Fix split-view inside subtree --- src/back/jdd-components/split-view/split-view.css | 2 +- src/back/jdd-components/subtree/subtree.css | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/back/jdd-components/split-view/split-view.css b/src/back/jdd-components/split-view/split-view.css index 48a8ced..07b3552 100644 --- a/src/back/jdd-components/split-view/split-view.css +++ b/src/back/jdd-components/split-view/split-view.css @@ -3,7 +3,7 @@ display: grid; grid-template-columns: subgrid; - grid-column: screen !important; + grid-column: 1/-1 !important; .split-view__half { flex-basis: 50%; diff --git a/src/back/jdd-components/subtree/subtree.css b/src/back/jdd-components/subtree/subtree.css index 40d1e04..deb32e3 100644 --- a/src/back/jdd-components/subtree/subtree.css +++ b/src/back/jdd-components/subtree/subtree.css @@ -116,7 +116,7 @@ } } -.grid-layout-main > .subtree:not(.subtree--bleed-none) { +.grid-layout-main > .subtree { display: grid !important; grid-template-columns: subgrid; From b462cbb31055f100f49e329291671ec5a506a458 Mon Sep 17 00:00:00 2001 From: Kuba Orlik Date: Wed, 19 Aug 2026 22:53:27 +0200 Subject: [PATCH 09/29] Add crooked and frame variants to background wrapper --- .../background-wrapper/background-wrapper.css | 36 +++++++++++++++++++ .../background-wrapper.jdd.tsx | 19 ++++++++-- 2 files changed, 53 insertions(+), 2 deletions(-) diff --git a/src/back/jdd-components/background-wrapper/background-wrapper.css b/src/back/jdd-components/background-wrapper/background-wrapper.css index accd43a..503a4c3 100644 --- a/src/back/jdd-components/background-wrapper/background-wrapper.css +++ b/src/back/jdd-components/background-wrapper/background-wrapper.css @@ -7,6 +7,18 @@ padding: var(--vertical-padding) 0; + &.background-wrapper--bleed-none { + grid-column: content !important; + } + + &.background-wrapper--bleed-bleed { + grid-column: bleed !important; + } + + &.background-wrapper--bleed-screen { + grid-column: 1/-1 !important; + } + &.background-wrapper--padding-no { padding: 0; } @@ -37,4 +49,28 @@ color: var(--color-brand-text-on-accent2); --color-brand-text-fg: var(--color-brand-text-on-accent2); } + + &.background-wrapper--frame1 { + border: 16px dashed var(--color-brand-accent); + background-color: color-mix( + in srgb, + var(--color-brand-accent) 20%, + transparent 80% + ); + --color-brand-text-bg: transparent; + } + + &.background-wrapper--frame2 { + border: 16px dashed var(--color-brand-accent2); + background-color: color-mix( + in srgb, + var(--color-brand-accent2) 20%, + transparent 80% + ); + --color-brand-text-bg: transparent; + } + + &.background-wrapper--crooked { + transform: scale(1.05) rotate(-2deg); + } } diff --git a/src/back/jdd-components/background-wrapper/background-wrapper.jdd.tsx b/src/back/jdd-components/background-wrapper/background-wrapper.jdd.tsx index 2e68af2..53d328e 100644 --- a/src/back/jdd-components/background-wrapper/background-wrapper.jdd.tsx +++ b/src/back/jdd-components/background-wrapper/background-wrapper.jdd.tsx @@ -6,7 +6,7 @@ import type { } from "@sealcode/jdd"; import { Component, ComponentArguments } from "@sealcode/jdd"; -export const background_variants = ["variant1", "variant2"]; +export const background_variants = ["variant1", "variant2", "frame1", "frame2"]; const component_arguments = { variant: new ComponentArguments.Enum(background_variants), @@ -14,6 +14,10 @@ const component_arguments = { padding: new ComponentArguments.Boolean(), big_padding: new ComponentArguments.Boolean(), margin: new ComponentArguments.Boolean(), + bleed: new ComponentArguments.Enum(["none", "bleed", "screen"]).setDefaultValue( + "screen" + ), + crooked: new ComponentArguments.Boolean().setDefaultValue(false), content: new ComponentArguments.NestedComponent(), } as const; @@ -31,7 +35,16 @@ export class BackgroundWrapper extends Component { } async toHTML({ - args: { variant, content, grow_to_screen_height, padding, margin, big_padding }, + args: { + variant, + content, + grow_to_screen_height, + padding, + margin, + big_padding, + bleed, + crooked, + }, classes, jdd_context, }: ComponentToHTMLArgs): Promise { @@ -40,10 +53,12 @@ export class BackgroundWrapper extends Component { class={[ "background-wrapper", `background-wrapper--${variant}`, + `background-wrapper--bleed-${bleed}`, `background-wrapper--padding-${padding ? "yes" : "no"}`, `background-wrapper--big-padding-${big_padding ? "yes" : "no"}`, { "background-wrapper--grow-height": grow_to_screen_height, + "background-wrapper--crooked": crooked, "jdd-no-gap": !margin, }, ...classes, From ca8e4438bc7c09bca75c8e7492cc7a74496ddda0 Mon Sep 17 00:00:00 2001 From: Kuba Orlik Date: Wed, 19 Aug 2026 22:59:39 +0200 Subject: [PATCH 10/29] Configurable bleed for buttons --- src/back/jdd-components/buttons/buttons.css | 12 ++++++++++++ src/back/jdd-components/buttons/buttons.jdd.tsx | 6 +++++- 2 files changed, 17 insertions(+), 1 deletion(-) diff --git a/src/back/jdd-components/buttons/buttons.css b/src/back/jdd-components/buttons/buttons.css index 8b2029e..5199169 100644 --- a/src/back/jdd-components/buttons/buttons.css +++ b/src/back/jdd-components/buttons/buttons.css @@ -25,6 +25,18 @@ gap: 24px; } + &.buttons--bleed-none { + grid-column: content !important; + } + + &.buttons--bleed-bleed { + grid-column: bleed !important; + } + + &.buttons--bleed-screen { + grid-column: 1/-1 !important; + } + .button { margin: 0; } diff --git a/src/back/jdd-components/buttons/buttons.jdd.tsx b/src/back/jdd-components/buttons/buttons.jdd.tsx index 6672541..a34c057 100644 --- a/src/back/jdd-components/buttons/buttons.jdd.tsx +++ b/src/back/jdd-components/buttons/buttons.jdd.tsx @@ -6,6 +6,9 @@ import { button, button_variants } from "src/back/elements/button.js"; const component_arguments = { mode: new ComponentArguments.Enum(["column", "row"]), gap: new ComponentArguments.Enum(["none", "narrow", "medium", "wide"]), + bleed: new ComponentArguments.Enum(["none", "bleed", "screen"]).setDefaultValue( + "none" + ), buttons: new ComponentArguments.List( new ComponentArguments.Structured({ variant: new ComponentArguments.Enum(button_variants), @@ -21,7 +24,7 @@ export class Buttons extends Component { } async toHTML({ - args: { buttons, mode, gap }, + args: { buttons, mode, gap, bleed }, classes, }: ComponentToHTMLArgs): Promise { return ( @@ -30,6 +33,7 @@ export class Buttons extends Component { "buttons", `buttons--mode-${mode}`, `buttons--gap-${gap}`, + `buttons--bleed-${bleed}`, ...classes, ]} > From 1bb3f373c324615ede4b2a6446b5b27f4f06b0cf Mon Sep 17 00:00:00 2001 From: Kuba Orlik Date: Wed, 19 Aug 2026 23:14:06 +0200 Subject: [PATCH 11/29] Add sizez to buttons --- src/back/jdd-components/buttons/buttons.css | 32 +++++++++++++++++++ .../jdd-components/buttons/buttons.jdd.tsx | 15 ++++++++- 2 files changed, 46 insertions(+), 1 deletion(-) diff --git a/src/back/jdd-components/buttons/buttons.css b/src/back/jdd-components/buttons/buttons.css index 5199169..dbb6758 100644 --- a/src/back/jdd-components/buttons/buttons.css +++ b/src/back/jdd-components/buttons/buttons.css @@ -39,5 +39,37 @@ .button { margin: 0; + + &.button--size-tiny { + font-size: 10px; + } + + &.button--size-small { + font-size: 14px; + } + + &.button--size-medium { + font-size: 16px; + + @container (max-width: 500px) { + font-size: 15px; + } + } + + &.button--size-large { + font-size: 24px; + + @container (max-width: 500px) { + font-size: 18px; + } + } + + &.button--size-extra-large { + font-size: 32px; + + @container (max-width: 500px) { + font-size: 24px; + } + } } } diff --git a/src/back/jdd-components/buttons/buttons.jdd.tsx b/src/back/jdd-components/buttons/buttons.jdd.tsx index a34c057..06c9378 100644 --- a/src/back/jdd-components/buttons/buttons.jdd.tsx +++ b/src/back/jdd-components/buttons/buttons.jdd.tsx @@ -14,6 +14,13 @@ const component_arguments = { variant: new ComponentArguments.Enum(button_variants), text: new ComponentArguments.ShortText(), href: new ComponentArguments.ShortText(), + size: new ComponentArguments.Enum([ + "tiny", + "small", + "medium", + "large", + "extra-large", + ]).setDefaultValue("medium"), }) ), } as const; @@ -37,7 +44,13 @@ export class Buttons extends Component { ...classes, ]} > - {buttons.map((b) => button({ ...b, text: insert_nbsp(b.text) }))} + {buttons.map((b) => + button({ + ...b, + text: insert_nbsp(b.text), + classes: [`button--size-${b.size}`], + }) + )} ); } From 75083f28aa3bb38e135ada1f66e3d26f023ebeea Mon Sep 17 00:00:00 2001 From: Kuba Orlik Date: Wed, 19 Aug 2026 23:17:20 +0200 Subject: [PATCH 12/29] Add missing button code --- src/back/elements/button.tsx | 3 +++ 1 file changed, 3 insertions(+) diff --git a/src/back/elements/button.tsx b/src/back/elements/button.tsx index e1f333f..09577e7 100644 --- a/src/back/elements/button.tsx +++ b/src/back/elements/button.tsx @@ -12,6 +12,7 @@ export function button({ submit = false, icon, centered = false, + classes = [], }: { text: string; href: string; @@ -20,6 +21,7 @@ export function button({ submit?: boolean; icon?: string; centered?: boolean; + classes?: string[]; }): JSX.Element { const classstr = `button button--color-${variant}`; if (submit) { @@ -33,6 +35,7 @@ export function button({ "button", `button--color-${variant}`, { "button--centered": centered }, + ...classes, ]} href={disabled ? false : href} disabled={disabled} From 12de366f3a47083fb7085a48507083ef3a5362fb Mon Sep 17 00:00:00 2001 From: Kuba Orlik Date: Wed, 19 Aug 2026 23:18:09 +0200 Subject: [PATCH 13/29] Make headings smaller on mobile --- src/back/jdd-components/heading/heading.css | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) diff --git a/src/back/jdd-components/heading/heading.css b/src/back/jdd-components/heading/heading.css index 0156d4c..e73a627 100644 --- a/src/back/jdd-components/heading/heading.css +++ b/src/back/jdd-components/heading/heading.css @@ -12,18 +12,34 @@ &.heading--font-size-small > * { font-size: 24px; + + @container (max-width: 600px) { + font-size: 22px; + } } &.heading--font-size-medium > * { font-size: 32px; + + @container (max-width: 600px) { + font-size: 24px; + } } &.heading--font-size-large > * { font-size: 48px; + + @container (max-width: 600px) { + font-size: 32px; + } } &.heading--font-size-extra_large > * { font-size: 64px; + + @container (max-width: 600px) { + font-size: 56px; + } } &.heading--align-left { From 1ecea82a61b55cac0fda4e8149c3413b2797a202 Mon Sep 17 00:00:00 2001 From: Kuba Orlik Date: Wed, 19 Aug 2026 23:20:26 +0200 Subject: [PATCH 14/29] Sizing and spacing in FAQ --- src/back/jdd-components/faq-component/faq-component.css | 2 -- src/back/jdd-components/faq-component/faq-component.jdd.tsx | 2 +- 2 files changed, 1 insertion(+), 3 deletions(-) diff --git a/src/back/jdd-components/faq-component/faq-component.css b/src/back/jdd-components/faq-component/faq-component.css index f3f7f56..4529390 100644 --- a/src/back/jdd-components/faq-component/faq-component.css +++ b/src/back/jdd-components/faq-component/faq-component.css @@ -139,13 +139,11 @@ } .question { - font-size: 14px; line-height: 21px; padding: 10px 0; } .answer p { - font-size: 14px; line-height: 21px; } diff --git a/src/back/jdd-components/faq-component/faq-component.jdd.tsx b/src/back/jdd-components/faq-component/faq-component.jdd.tsx index 7f11597..dd38356 100644 --- a/src/back/jdd-components/faq-component/faq-component.jdd.tsx +++ b/src/back/jdd-components/faq-component/faq-component.jdd.tsx @@ -41,7 +41,7 @@ export class FaqComponent extends Component {
-
{title}
+ {title ?
{title}
: ""}
{render_markdown(language, content.text)}{" "}
From f7e4060686f2016c916b772ff28a94bd3f087cc5 Mon Sep 17 00:00:00 2001 From: Kuba Orlik Date: Wed, 19 Aug 2026 23:25:34 +0200 Subject: [PATCH 15/29] Use horizontal images on mobile dynamic grid --- .../jdd-components/dynamic-grid-v2/dynamic-grid-v2.css | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.css b/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.css index fa15837..7c46959 100644 --- a/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.css +++ b/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.css @@ -231,14 +231,14 @@ } .tile-image--vertical { - display: none; - } - - .tile-image--horizontal { - display: none; + display: none !important; } .tile-image--square { + display: none !important; + } + + .tile-image--horizontal { display: block !important; grid-row: 1/2 !important; From d08817c729ba7a88f5e8eb2d408e125564f8c585 Mon Sep 17 00:00:00 2001 From: Kuba Orlik Date: Wed, 19 Aug 2026 23:27:48 +0200 Subject: [PATCH 16/29] Spacing adjustments in icon tiles --- src/back/jdd-components/icon-tiles-grid/icon-tiles-grid.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/back/jdd-components/icon-tiles-grid/icon-tiles-grid.css b/src/back/jdd-components/icon-tiles-grid/icon-tiles-grid.css index bd82528..206ea08 100644 --- a/src/back/jdd-components/icon-tiles-grid/icon-tiles-grid.css +++ b/src/back/jdd-components/icon-tiles-grid/icon-tiles-grid.css @@ -29,7 +29,7 @@ grid-template-rows: subgrid; grid-row: span 2; flex-flow: column; - gap: 32px; + gap: 16px; min-height: 320px; max-width: 400px; text-decoration: none; /* in case it's an a href */ From d1da6d7dc79ef29651ad4cebbb6197c924da089b Mon Sep 17 00:00:00 2001 From: Kuba Orlik Date: Wed, 19 Aug 2026 23:35:06 +0200 Subject: [PATCH 17/29] Icon tiles option to always show CTA --- .../icon-tiles-grid/icon-tiles-grid.css | 16 +++++++--------- .../icon-tiles-grid/icon-tiles-grid.jdd.tsx | 10 +++++++++- 2 files changed, 16 insertions(+), 10 deletions(-) diff --git a/src/back/jdd-components/icon-tiles-grid/icon-tiles-grid.css b/src/back/jdd-components/icon-tiles-grid/icon-tiles-grid.css index 206ea08..dead306 100644 --- a/src/back/jdd-components/icon-tiles-grid/icon-tiles-grid.css +++ b/src/back/jdd-components/icon-tiles-grid/icon-tiles-grid.css @@ -27,9 +27,9 @@ background-color: var(--tile-bg-color); display: grid; grid-template-rows: subgrid; - grid-row: span 2; + grid-row: span 4; flex-flow: column; - gap: 16px; + --gap: 16px; min-height: 320px; max-width: 400px; text-decoration: none; /* in case it's an a href */ @@ -39,13 +39,8 @@ color: var(--tile-fg-color); } - &:has(.icon), - &:has(.icon-tiles__tile__cta) { - grid-row: span 3; - } - - &:has(.icon):has(.icon-tiles__tile__cta) { - grid-row: span 4; + & > * + * { + margin-top: var(--gap); } svg { @@ -80,7 +75,10 @@ &:hover { transform: scale(1.05); + } + &:hover, + &.icon-tiles-grid__tile--force-cta { .icon-tiles__tile__cta { text-align: right; opacity: 1; diff --git a/src/back/jdd-components/icon-tiles-grid/icon-tiles-grid.jdd.tsx b/src/back/jdd-components/icon-tiles-grid/icon-tiles-grid.jdd.tsx index c932a0c..07034cd 100644 --- a/src/back/jdd-components/icon-tiles-grid/icon-tiles-grid.jdd.tsx +++ b/src/back/jdd-components/icon-tiles-grid/icon-tiles-grid.jdd.tsx @@ -23,6 +23,7 @@ const component_arguments = { description: new Args.ShortText(), url: new Args.ShortText().setExampleValues([""]), cta: new Args.ShortText().setExampleValues([""]), + always_show_cta: new Args.Boolean().setDefaultValue(false), }) ), } as const; @@ -42,6 +43,7 @@ export class IconTilesGrid extends Component { class={[ "icon-tiles-grid", { "icon-tiles-grid--bleed": bleed }, + ...classes, ]} > @@ -50,7 +52,13 @@ export class IconTilesGrid extends Component {
{tiles.map((tile) => ( From f5327dfe7c002003a7abb0823b769b2f1ad7745e Mon Sep 17 00:00:00 2001 From: Kuba Orlik Date: Wed, 19 Aug 2026 23:53:55 +0200 Subject: [PATCH 18/29] More padding in dynamic grid --- .../jdd-components/dynamic-grid-v2/dynamic-grid-v2.css | 8 +++++--- .../dynamic-grid-v2/dynamic-grid-v2.jdd.tsx | 8 ++++++-- 2 files changed, 11 insertions(+), 5 deletions(-) diff --git a/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.css b/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.css index 7c46959..3929816 100644 --- a/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.css +++ b/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.css @@ -41,18 +41,20 @@ background-color: var(--tile-bg-color); color: var(--tile-fg-color); width: 100%; - opacity: 0.9; - padding: 8px; + padding: 16px; z-index: 1; overflow: hidden; bottom: 0; box-sizing: border-box; .tile-content-wrapper { + display: flex; + flex-flow: column; + gap: 16px; .tile-title { font-weight: bold; line-height: 20px; - margin: 10px 0; + margin: 0; } .tile-subtitle { diff --git a/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.jdd.tsx b/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.jdd.tsx index 5086afb..76700ba 100644 --- a/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.jdd.tsx +++ b/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.jdd.tsx @@ -67,8 +67,12 @@ export class DynamicGridV2 extends Component { >
-

{tile.title}

-

{tile.subtitle}

+ {tile.title ?

{tile.title}

: ""} + {tile.subtitle ? ( +

{tile.subtitle}

+ ) : ( + "" + )}
From 9a36e7f65559c2a339d521dd5009cd9e2b4976a3 Mon Sep 17 00:00:00 2001 From: Kuba Orlik Date: Thu, 20 Aug 2026 11:54:38 +0200 Subject: [PATCH 19/29] Subtree fix on nested subgrid --- src/back/jdd-components/subtree/subtree.css | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/back/jdd-components/subtree/subtree.css b/src/back/jdd-components/subtree/subtree.css index deb32e3..914035c 100644 --- a/src/back/jdd-components/subtree/subtree.css +++ b/src/back/jdd-components/subtree/subtree.css @@ -116,7 +116,8 @@ } } -.grid-layout-main > .subtree { +.grid-layout-main > .subtree, +.subgrid-layout > .subtree { display: grid !important; grid-template-columns: subgrid; From a3fe0e684477512d3e216987554a37116d716d88 Mon Sep 17 00:00:00 2001 From: Kuba Orlik Date: Thu, 20 Aug 2026 11:58:57 +0200 Subject: [PATCH 20/29] Frame variants padding --- .../jdd-components/background-wrapper/background-wrapper.css | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/back/jdd-components/background-wrapper/background-wrapper.css b/src/back/jdd-components/background-wrapper/background-wrapper.css index 503a4c3..5103a00 100644 --- a/src/back/jdd-components/background-wrapper/background-wrapper.css +++ b/src/back/jdd-components/background-wrapper/background-wrapper.css @@ -51,6 +51,7 @@ } &.background-wrapper--frame1 { + padding: 16px; border: 16px dashed var(--color-brand-accent); background-color: color-mix( in srgb, @@ -61,6 +62,7 @@ } &.background-wrapper--frame2 { + padding: 16px; border: 16px dashed var(--color-brand-accent2); background-color: color-mix( in srgb, From 99172bb852da42bddc9ee0b26e40fb1ef51ed083 Mon Sep 17 00:00:00 2001 From: Kuba Orlik Date: Thu, 20 Aug 2026 15:14:11 +0200 Subject: [PATCH 21/29] Balanced icons in footer --- src/back/routes/common/footer.css | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/src/back/routes/common/footer.css b/src/back/routes/common/footer.css index c0b6997..f1df3c1 100644 --- a/src/back/routes/common/footer.css +++ b/src/back/routes/common/footer.css @@ -51,11 +51,19 @@ footer { .footer__social_media_icons { display: flex; flex-flow: row wrap; + flex-wrap: row balance; flex-grow: 1; justify-content: space-between; + row-gap: 16px; + column-gap: 8px; + + @media (max-width: 600px) { + justify-content: center; + } a { padding: 2px 8px; + display: inline-flex; svg { width: 24px; From d16076af92af05d1cb619a6bac3d45ade307aa5c Mon Sep 17 00:00:00 2001 From: Kuba Orlik Date: Thu, 20 Aug 2026 15:21:04 +0200 Subject: [PATCH 22/29] Fix footer icons balance --- src/back/routes/common/footer.css | 16 ++++++++++++---- 1 file changed, 12 insertions(+), 4 deletions(-) diff --git a/src/back/routes/common/footer.css b/src/back/routes/common/footer.css index f1df3c1..06f6949 100644 --- a/src/back/routes/common/footer.css +++ b/src/back/routes/common/footer.css @@ -57,10 +57,6 @@ footer { row-gap: 16px; column-gap: 8px; - @media (max-width: 600px) { - justify-content: center; - } - a { padding: 2px 8px; display: inline-flex; @@ -74,6 +70,18 @@ footer { } } } + + @media (max-width: 800px) { + display: block; + text-align: center; + text-wrap: balance; + line-height: 40px; + + & > a { + display: inline; + text-decoration: none; + } + } } .footer__attribution { From af82fa80c44529ef865944940766c58e4798b41e Mon Sep 17 00:00:00 2001 From: Kuba Orlik Date: Thu, 20 Aug 2026 17:55:58 +0200 Subject: [PATCH 23/29] Fix lint issues --- .../dynamic-grid-v2/dynamic-grid-v2.css | 11 ++++---- .../dynamic-grid-v2/dynamic-grid-v2.jdd.tsx | 27 +++++-------------- src/back/jdd-components/heading/heading.css | 1 + 3 files changed, 12 insertions(+), 27 deletions(-) diff --git a/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.css b/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.css index 3929816..87743f3 100644 --- a/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.css +++ b/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.css @@ -51,6 +51,7 @@ display: flex; flex-flow: column; gap: 16px; + .tile-title { font-weight: bold; line-height: 20px; @@ -95,6 +96,7 @@ .tile-image--square { grid-row: 1/2; + picture img { display: block !important; } @@ -119,6 +121,7 @@ .tile-image--horizontal { grid-column: 1/3; + picture img { display: block !important; } @@ -143,6 +146,7 @@ .tile-image--vertical { grid-row: 1/4; + picture img { display: block !important; } @@ -191,7 +195,7 @@ grid-template-columns: repeat(2, 1fr); .tile.vertical { - grid-row: span 1; + grid-row: span 2; grid-column: span 1; .tile-image--vertical { @@ -210,11 +214,6 @@ } } } - - .tile.vertical { - grid-row: span 2; - grid-column: span 1; - } } } diff --git a/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.jdd.tsx b/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.jdd.tsx index 76700ba..af88cdf 100644 --- a/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.jdd.tsx +++ b/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.jdd.tsx @@ -6,14 +6,6 @@ import { getFgColorVariable } from "src/back/colors.js"; type ExtractArray = T extends Array ? X : never; -const generate_id = (function* () { - while (true) { - for (let i = 1; i <= 10000; i++) { - yield i; - } - } -})(); - const component_arguments = { bleed: new ComponentArguments.Enum(["none", "bleed", "screen"]).setDefaultValue( "none" @@ -97,19 +89,12 @@ export class DynamicGridV2 extends Component { ); } - toHTML( - { - args: { tiles, bleed }, - jdd_context, - classes, - index, - }: ComponentToHTMLArgs, - tab_style_when_active = `border-bottom-color: var(--color-brand-canvas); - border-top-color: var(--color-brand-accent-04); - background: var(--color-brand-canvas); - color: var(--color-brand-text-fg);` - ): FlatTemplatable { - const { value: id } = generate_id.next(); + toHTML({ + args: { tiles, bleed }, + jdd_context, + classes, + index, + }: ComponentToHTMLArgs): FlatTemplatable { return (
* { margin-top: 0; margin-bottom: 0; From 2be25d59be04ed6cf2ce05130ccce89783cdcb8e Mon Sep 17 00:00:00 2001 From: Kuba Orlik Date: Thu, 20 Aug 2026 18:36:26 +0200 Subject: [PATCH 24/29] Update sealgen to fix endless loop of building in macos --- package-lock.json | 14 +++++++------- package.json | 2 +- 2 files changed, 8 insertions(+), 8 deletions(-) diff --git a/package-lock.json b/package-lock.json index 4ca44ca..933b03e 100644 --- a/package-lock.json +++ b/package-lock.json @@ -17,7 +17,7 @@ "@sealcode/jdd": "^0.8.13", "@sealcode/jdd-editor": "^0.2.37", "@sealcode/monaco-wrapper": "^0.0.12", - "@sealcode/sealgen": "^0.19.23", + "@sealcode/sealgen": "^0.19.25", "@sealcode/show-first-row": "^0.1.0", "@sealcode/simplemde": "^1.12.1", "@sealcode/sortable": "^0.0.1", @@ -1462,9 +1462,9 @@ "integrity": "sha512-N4BuMuantv2A63PbFwLg53AJbDZ2/BzKxpgBIRd7jDWyZLw58en6FFZgcbXMLDU7gwKNYfyLOJMLwXyn6aEsnQ==" }, "node_modules/@sealcode/sealgen": { - "version": "0.19.23", - "resolved": "https://registry.npmjs.org/@sealcode/sealgen/-/sealgen-0.19.23.tgz", - "integrity": "sha512-jKMp4LdOWC5lwOzHC6bT9y98NxZ5U6CpzdjoqtghwBIZZQh9Z58FX5+wgLO+u6Vzec7+7Gyt3097x6r4L18DdA==", + "version": "0.19.25", + "resolved": "https://registry.npmjs.org/@sealcode/sealgen/-/sealgen-0.19.25.tgz", + "integrity": "sha512-ryWLuKn9S53XDsSEmttWjM57Wa/thrOEaMvM2uy5xOYkBVo9saTTBFmInm53In1nnrh44kNkuYogBLG4dXhNfw==", "dependencies": { "@koa/router": "^12.0.1", "@sealcode/file-manager": "^1.0.2", @@ -16377,9 +16377,9 @@ "integrity": "sha512-N4BuMuantv2A63PbFwLg53AJbDZ2/BzKxpgBIRd7jDWyZLw58en6FFZgcbXMLDU7gwKNYfyLOJMLwXyn6aEsnQ==" }, "@sealcode/sealgen": { - "version": "0.19.23", - "resolved": "https://registry.npmjs.org/@sealcode/sealgen/-/sealgen-0.19.23.tgz", - "integrity": "sha512-jKMp4LdOWC5lwOzHC6bT9y98NxZ5U6CpzdjoqtghwBIZZQh9Z58FX5+wgLO+u6Vzec7+7Gyt3097x6r4L18DdA==", + "version": "0.19.25", + "resolved": "https://registry.npmjs.org/@sealcode/sealgen/-/sealgen-0.19.25.tgz", + "integrity": "sha512-ryWLuKn9S53XDsSEmttWjM57Wa/thrOEaMvM2uy5xOYkBVo9saTTBFmInm53In1nnrh44kNkuYogBLG4dXhNfw==", "requires": { "@koa/router": "^12.0.1", "@sealcode/file-manager": "^1.0.2", diff --git a/package.json b/package.json index 2c7eafc..665a9a1 100644 --- a/package.json +++ b/package.json @@ -100,7 +100,7 @@ "@sealcode/jdd": "^0.8.13", "@sealcode/jdd-editor": "^0.2.37", "@sealcode/monaco-wrapper": "^0.0.12", - "@sealcode/sealgen": "^0.19.23", + "@sealcode/sealgen": "^0.19.25", "@sealcode/show-first-row": "^0.1.0", "@sealcode/simplemde": "^1.12.1", "@sealcode/sortable": "^0.0.1", From 4b92ec1153a89648aefadb612d166962e82f19e1 Mon Sep 17 00:00:00 2001 From: Kuba Orlik Date: Fri, 21 Aug 2026 16:57:49 +0200 Subject: [PATCH 25/29] Fix Horizontal scroller not working on mobile --- src/back/jdd-components/subtree/subtree.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/back/jdd-components/subtree/subtree.css b/src/back/jdd-components/subtree/subtree.css index 914035c..fb9e7fa 100644 --- a/src/back/jdd-components/subtree/subtree.css +++ b/src/back/jdd-components/subtree/subtree.css @@ -104,7 +104,7 @@ .horizontal-scroller__element { width: var(--horizontal-scroller-item-width) !important; - max-width: calc(100cqw - 80px); + max-width: calc(100cqw - 110px); flex-shrink: 0; container-type: inline-size; flex-flow: column; From 970a7892a1334e25dd6238c3ae198abdc93b62b3 Mon Sep 17 00:00:00 2001 From: Kuba Orlik Date: Fri, 21 Aug 2026 19:13:41 +0200 Subject: [PATCH 26/29] sendeml: Don't encode images as base64 data uris because gmail doesn't like that --- src/back/email/send-eml.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/back/email/send-eml.ts b/src/back/email/send-eml.ts index a5a8abf..33ca609 100644 --- a/src/back/email/send-eml.ts +++ b/src/back/email/send-eml.ts @@ -14,7 +14,7 @@ export async function sendEml( for (const [key, value] of Object.entries(template_data)) { eml_content = eml_content.replaceAll(`{{${key}}}`, htmlEscape(value)); } - const parsed = await simpleParser(eml_content); + const parsed = await simpleParser(eml_content, { skipImageLinks: true }); const mailer = context.$app.mailer; From 6631bd798098bcaae7bc2a179ad027040c33bcbd Mon Sep 17 00:00:00 2001 From: Kuba Orlik Date: Mon, 24 Aug 2026 10:06:27 +0200 Subject: [PATCH 27/29] Add pop-out style to dynamic grid --- .../dynamic-grid-v2/dynamic-grid-v2.css | 19 +++++++++++++++++++ .../dynamic-grid-v2/dynamic-grid-v2.jdd.tsx | 10 ++++++++-- 2 files changed, 27 insertions(+), 2 deletions(-) diff --git a/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.css b/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.css index 87743f3..4b2e8ae 100644 --- a/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.css +++ b/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.css @@ -250,4 +250,23 @@ } } } + + &.dynamic-grid--style-pop-out { + .tile { + overflow: visible; + + .tile-content { + transform: translateY(-20px) translateX(20px); + box-shadow: -10px 10px 0px #00000026; + } + + .tile-image { + grid-row: 1/3 !important; + } + + .tile-image--vertical { + grid-row: 1/5 !important; + } + } + } } diff --git a/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.jdd.tsx b/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.jdd.tsx index af88cdf..668c29b 100644 --- a/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.jdd.tsx +++ b/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.jdd.tsx @@ -10,6 +10,7 @@ const component_arguments = { bleed: new ComponentArguments.Enum(["none", "bleed", "screen"]).setDefaultValue( "none" ), + style: new ComponentArguments.Enum(["flat", "pop-out"]), tiles: new ComponentArguments.List( new ComponentArguments.Structured({ title: new ComponentArguments.ShortText(), @@ -90,14 +91,19 @@ export class DynamicGridV2 extends Component { } toHTML({ - args: { tiles, bleed }, + args: { tiles, bleed, style }, jdd_context, classes, index, }: ComponentToHTMLArgs): FlatTemplatable { return (
From e426b0f4d80992ba030e1887e63919dcb508a0e0 Mon Sep 17 00:00:00 2001 From: Kuba Orlik Date: Mon, 24 Aug 2026 10:09:59 +0200 Subject: [PATCH 28/29] nbsp in dynamic grid --- .../dynamic-grid-v2/dynamic-grid-v2.jdd.tsx | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) diff --git a/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.jdd.tsx b/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.jdd.tsx index 668c29b..ca3318c 100644 --- a/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.jdd.tsx +++ b/src/back/jdd-components/dynamic-grid-v2/dynamic-grid-v2.jdd.tsx @@ -1,7 +1,7 @@ import type { FlatTemplatable } from "tempstream"; import { TempstreamJSX } from "tempstream"; import type { ComponentToHTMLArgs, ExtractParsed, JDDContext } from "@sealcode/jdd"; -import { Component, ComponentArguments } from "@sealcode/jdd"; +import { Component, ComponentArguments, insert_nbsp } from "@sealcode/jdd"; import { getFgColorVariable } from "src/back/colors.js"; type ExtractArray = T extends Array ? X : never; @@ -60,9 +60,13 @@ export class DynamicGridV2 extends Component { >
- {tile.title ?

{tile.title}

: ""} + {tile.title ? ( +

{insert_nbsp(tile.title)}

+ ) : ( + "" + )} {tile.subtitle ? ( -

{tile.subtitle}

+

{insert_nbsp(tile.subtitle)}

) : ( "" )} From 61f2b39c6c9a31a43e72c0c0741630eee8f5aae1 Mon Sep 17 00:00:00 2001 From: Kuba Orlik Date: Tue, 25 Aug 2026 14:16:04 +0200 Subject: [PATCH 29/29] Add mobilizon icon --- src/icons/mobilizon.svg | 60 +++++++++++++++++++++++++++++++++++++++++ 1 file changed, 60 insertions(+) create mode 100644 src/icons/mobilizon.svg diff --git a/src/icons/mobilizon.svg b/src/icons/mobilizon.svg new file mode 100644 index 0000000..db5b3ef --- /dev/null +++ b/src/icons/mobilizon.svg @@ -0,0 +1,60 @@ + + + +