From a0b227e8bef4c20366842c82d7d3da1e643f24ef Mon Sep 17 00:00:00 2001 From: Alexander Alemayhu Date: Wed, 20 May 2026 15:28:46 +0200 Subject: [PATCH] fix: card fills template preview iframe and starter section moves up Two gallery fixes in the same surface. 1. notion.css ships with `body { margin: 2em auto; max-width: 900px }` which made every Notion-flavoured starter render with a band of the gallery card background showing through top and bottom of the iframe, and "Raw Note (no style)" had no background at all because the wrapper left both html and body transparent. The wrapper now sets a default white background and re-asserts margin/padding/width on html and body *after* the template CSS so the card always fills the iframe edge to edge. Templates that set their own .card background (Quote, Alex Deluxe, etc.) still win because that selector is more specific than the body reset. 2. Reorder the gallery sections so the polished `defaultStarters` (Clean Basic, Modern Cloze, Vocabulary Card, Medical Term, Code Card, Minimal, Quote, Math & Science) lead the page, with the rougher `officialStarters` (Default/Notion/Abhiyan/Alex variants) below them. `Your note types` stays at the very top so a user's own work is the first thing they see. Co-Authored-By: Claude Opus 4.7 (1M context) --- web/src/pages/TemplatesPage/TemplatesPage.tsx | 20 +++++++++---------- .../TemplatesPage/renderNoteTypePreview.ts | 4 +++- 2 files changed, 13 insertions(+), 11 deletions(-) diff --git a/web/src/pages/TemplatesPage/TemplatesPage.tsx b/web/src/pages/TemplatesPage/TemplatesPage.tsx index a2d889bc5..72cb49254 100644 --- a/web/src/pages/TemplatesPage/TemplatesPage.tsx +++ b/web/src/pages/TemplatesPage/TemplatesPage.tsx @@ -359,19 +359,19 @@ export function TemplatesPage() { )} - {officialStarters.length > 0 && ( + {defaultStarters.length > 0 && (

- Official 2anki templates + Starter note types

- {officialStarters.map((starter) => ( + {defaultStarters.map((starter) => (
)} - {defaultStarters.length > 0 && ( + {officialStarters.length > 0 && (

- Starter note types + Official 2anki templates

- {defaultStarters.map((starter) => ( + {officialStarters.map((starter) => (
${body}
`; }