create-ginko 0.4.0 → 0.5.0

package/templates/portfolio/app/pages/news/index.vue

@@ -0,0 +1,54 @@
+<!-- Synced from templates/_features/blog/app/pages/news/index.vue by `pnpm templates sync`. Edit the source, not this copy. -->
+<script setup lang="ts">
+import { Rss } from '@lucide/vue'
+import type { BlogPost } from '~/composables/useBlog'
+
+// The news: every post, newest first (content/posts/), grouped by year once they span more than one, with the tags
+// as links to their pages above them. The feed of this language is linked in the head and below the list. The address
+// per language comes from `pages.news` in ginko.config.ts.
+const posts = useBlogPosts()
+const tags = useBlogTags()
+const feed = useFeedPath()
+const route = useRoute()
+const { name, url } = useGinkoSite()
+const { t, language } = useI18n('blog')
+const years = computed(() => {
+  const groups: { year: string, posts: BlogPost[] }[] = []
+  for (const post of posts.value) {
+    const year = post.date.slice(0, 4)
+    if (groups.at(-1)?.year === year) groups.at(-1)!.posts.push(post)
+    else groups.push({ year, posts: [post] })
+  }
+  return groups
+})
+useHead(() => ({ link: [{ rel: 'alternate', type: 'application/rss+xml', title: t('feed'), href: feed.value }] }))
+usePageSeo(() => ({
+  title: t('title'),
+  description: t('lead'),
+  jsonLd: [{ '@context': 'https://schema.org', '@type': 'Blog', name: `${name}: ${t('title')}`, description: t('lead'), url: new URL(route.path, url).href, inLanguage: language.value }],
+}))
+</script>
+
+<template>
+  <div>
+    <BlockPageHeader :title="t('title')" :lead="t('lead')" />
+    <div class="mx-auto max-w-page px-gutter">
+      <div class="max-w-4xl">
+        <nav v-if="tags.length" :aria-label="t('tags')" class="pb-8">
+          <BlogTagList :tags="tags" />
+        </nav>
+        <template v-if="years.length > 1">
+          <section v-for="group in years" :key="group.year" :aria-labelledby="`year-${group.year}`" class="pt-6 first:pt-0">
+            <h2 :id="`year-${group.year}`" class="pb-2 text-h3 tabular-nums">{{ group.year }}</h2>
+            <BlogPostList :items="group.posts" heading-level="h3" />
+          </section>
+        </template>
+        <BlogPostList v-else-if="posts.length" :items="posts" />
+        <BlockEmpty v-else :title="t('empty')" path="content/posts/" />
+        <a :href="feed" class="mt-6 inline-flex min-h-11 items-center gap-2 text-small text-muted-foreground underline-offset-4 hover:text-foreground hover:underline">
+          <Rss class="size-4" aria-hidden="true" />{{ t('feed') }}
+        </a>
+      </div>
+    </div>
+  </div>
+</template>

package/templates/portfolio/app/pages/news/tags/[tag].vue

@@ -0,0 +1,41 @@
+<!-- Synced from templates/_features/blog/app/pages/news/tags/[tag].vue by `pnpm templates sync`. Edit the source, not this copy. -->
+<script setup lang="ts">
+import { ArrowRight } from '@lucide/vue'
+
+// One tag: the posts that carry it, newest first. Tags are free text in each language's files, so a tag has no
+// translation: the page names only its own language as alternate (a link to another language's news page would be a
+// false hreflang), so the switch shows it as not translated. A tag no visible post carries is a 404. The address is
+// the news page's, then the word for `tags` in app/routes.ts (`segments`), then the tag.
+definePageMeta({
+  i18nAlternates: (to, { locale }) => ({ [locale]: to.path }),
+})
+const route = useRoute()
+const posts = useBlogPosts()
+const tags = useBlogTags()
+const path = useGinkoPath()
+const { t } = useI18n('blog')
+const slug = computed(() => String(route.params.tag))
+// Thrown on every read while no post carries the tag, like useGinkoEntry: fatal, so client navigation shows the 404.
+const tag = toRef(() => {
+  const found = tags.value.find((item) => item.slug === slug.value)
+  if (!found) throw createError({ statusCode: 404, statusMessage: 'Not found', fatal: true })
+  return found
+})
+const tagged = computed(() => posts.value.filter((post) => post.tags.some((name) => tagSlug(name) === tag.value.slug)))
+const title = computed(() => t('tagged', { tag: tag.value.name }))
+usePageSeo(() => ({ title: title.value, description: t('count', { count: tag.value.count }) }))
+</script>
+
+<template>
+  <div>
+    <BlockPageHeader :title="title" :meta="t('count', { count: tag.count })" />
+    <div class="mx-auto max-w-page px-gutter">
+      <div class="max-w-4xl">
+        <BlogPostList :items="tagged" />
+        <NuxtLink :to="path('news')" class="mt-6 inline-flex min-h-11 items-center gap-2 font-medium text-primary underline-offset-4 hover:underline">
+          {{ t('all') }}<ArrowRight class="size-4 rtl:-scale-x-100" aria-hidden="true" />
+        </NuxtLink>
+      </div>
+    </div>
+  </div>
+</template>

package/templates/portfolio/app/pages/projects/[slug].vue

@@ -0,0 +1,49 @@
+<!-- Synced from templates/_features/projects/app/pages/projects/[slug].vue by `pnpm templates sync`. Edit the source, not this copy. -->
+<script setup lang="ts">
+import type { Component } from 'vue'
+import { safeHref } from '@lupinum/ginko'
+
+// One project: title, summary, for a campaign its last day, an optional button (`actionLabel`, `actionUrl`), photo
+// (3:2) and text. Two hooks of the template: `app/components/projects/Body.vue` (prop `project`) is shown below the
+// title instead of the photo and the text (for example the facts and every photo of a project); the composable
+// `app/composables/useProjectJsonLd.ts` (`useProjectJsonLd()` returns a function of the project) adds the project's
+// own JSON-LD, such as a CreativeWork, to the page's one `usePageSeo` call.
+const Body = Object.values(import.meta.glob<Component>('~/components/projects/Body.vue', { eager: true, import: 'default' }))[0]
+type ProjectJsonLd = () => (project: GinkoItem<'projects'>) => Record<string, unknown>
+const projectJsonLd = Object.values(import.meta.glob<ProjectJsonLd>('~/composables/useProjectJsonLd.ts', { eager: true, import: 'useProjectJsonLd' }))[0]?.()
+const route = useRoute()
+const project = useGinkoEntry('projects', () => route.params.slug)
+const { t, format } = useI18n('projects')
+const campaign = computed(() => projectCampaign(project.value.data))
+const action = computed(() => {
+  const href = safeHref(campaign.value.actionUrl)
+  return href && campaign.value.actionLabel ? { label: campaign.value.actionLabel, href } : undefined
+})
+usePageSeo(() => ({
+  title: project.value.data.title,
+  description: project.value.data.summary,
+  image: project.value.data.image,
+  jsonLd: projectJsonLd ? [projectJsonLd(project.value)] : undefined,
+}))
+</script>
+
+<template>
+  <article>
+    <BlockPageHeader
+      :title="project.data.title"
+      :lead="project.data.summary"
+      :meta="campaign.ends ? t('until', { date: format.date(campaign.ends) }) : undefined"
+    >
+      <Button v-if="action" as-child size="lg" class="self-start max-sm:self-stretch">
+        <a :href="action.href">{{ action.label }}</a>
+      </Button>
+    </BlockPageHeader>
+    <component :is="Body" v-if="Body" :project="project" />
+    <template v-else>
+      <div v-if="project.data.image" class="mx-auto max-w-page px-gutter pb-10">
+        <GinkoImage :image="project.data.image" eager sizes="(min-width: 1216px) 896px, 100vw" class="aspect-3/2 w-full max-w-4xl rounded-block bg-muted object-cover" />
+      </div>
+      <ProseBody :value="project.data.body" />
+    </template>
+  </article>
+</template>

package/templates/portfolio/app/pages/projects/index.vue

@@ -0,0 +1,24 @@
+<!-- Synced from templates/_features/projects/app/pages/projects/index.vue by `pnpm templates sync`. Edit the source, not this copy. -->
+<script setup lang="ts">
+import type { Component } from 'vue'
+
+// The projects and campaigns in their order (content/projects/). The address per language comes from
+// `pages.projects` in ginko.config.ts. A template may bring `app/components/projects/List.vue` (prop `items`: the
+// visible projects); the page then shows it instead of the cards (for example the work as large photos).
+const List = Object.values(import.meta.glob<Component>('~/components/projects/List.vue', { eager: true, import: 'default' }))[0]
+const projects = useGinko('projects')
+const cards = useProjectCards()
+const { t } = useI18n('projects')
+usePageSeo(() => ({ title: t('title'), description: t('lead') }))
+</script>
+
+<template>
+  <div>
+    <BlockPageHeader :title="t('title')" :lead="t('lead')" />
+    <div class="mx-auto max-w-page px-gutter">
+      <component :is="List" v-if="List && projects.items.length" :items="projects.items" />
+      <BlockCards v-else-if="cards.length" :items="cards" heading-level="h2" />
+      <BlockEmpty v-else :title="t('empty')" path="content/projects/" />
+    </div>
+  </div>
+</template>

package/templates/portfolio/app/pages/team.vue

@@ -0,0 +1,40 @@
+<!-- Synced from templates/_features/people/app/pages/team.vue by `pnpm templates sync`. Edit the source, not this copy. -->
+<script setup lang="ts">
+import type { Component } from 'vue'
+import { personJsonLd } from '@lupinum/ginko/basics'
+
+// The team or board: every entry of content/people/ in its order, with Person JSON-LD. The address per language
+// comes from `pages.team` in ginko.config.ts. A template may bring `app/components/people/TeamContact.vue` (the
+// company: its service line and office); the page then shows it between the header and the people, without a copy
+// of this page per template.
+const contact = Object.values(import.meta.glob<Component>('../components/people/TeamContact.vue', { eager: true, import: 'default' }))[0]
+const people = useGinko('people')
+const locale = useGinkoLocale()
+const { name, url } = useGinkoSite()
+const { t } = useI18n('people')
+usePageSeo(() => ({
+  title: t('title'),
+  description: t('lead'),
+  jsonLd: people.value.items.map((person) => personJsonLd({
+    name: person.data.name,
+    role: person.data.role,
+    bio: person.data.bio,
+    email: person.data.email,
+    phone: person.data.phone,
+    image: person.data.photo ? new URL(person.data.photo.url, url).href : undefined,
+    url: person.urls?.[locale.value] ? new URL(person.urls[locale.value]!, url).href : undefined,
+    worksFor: { name, url },
+  })),
+}))
+</script>
+
+<template>
+  <div>
+    <BlockPageHeader :title="t('title')" :lead="t('lead')" />
+    <div class="mx-auto flex max-w-page flex-col gap-12 px-gutter md:gap-16">
+      <component :is="contact" v-if="contact" />
+      <PeopleList v-if="people.items.length" :items="people.items" />
+      <BlockEmpty v-else :title="t('empty')" path="content/people/" />
+    </div>
+  </div>
+</template>

package/templates/portfolio/app/routes.ts

@@ -0,0 +1,30 @@
+// The languages of this site and the web address of each page per language (TEMPLATES T8). The first language is
+// the main one: its addresses have no prefix, the others start with /<code>. `npm create ginko -- --locales` edits
+// the `locales` list and drops the dropped languages' entries from the maps below.
+export const locales = ['en', 'de'] as const
+export type SiteLocale = (typeof locales)[number]
+
+/**
+ * The words of the addresses, per language: `localized('/projects/[slug]')` gives `/work/[slug]` in English and
+ * `/de/projekte/[slug]` in German. A part of a path that is not listed here stays as it is. Slugs allow only a–z,
+ * 0–9 and `-`. To rename a section, change its word here; the pages and links follow.
+ */
+export const segments: Record<string, Partial<Record<SiteLocale, string>>> = {
+  projects: { en: 'work', de: 'projekte' },
+  team: { en: 'studio', de: 'studio' },
+  news: { en: 'journal', de: 'journal' },
+  legal: { en: 'legal', de: 'rechtliches' },
+}
+
+/** The path prefix of a language: none for the main language, `/de` for German as a second language. */
+export const prefix = (locale: SiteLocale) => (locale === locales[0] ? '' : `/${locale}`)
+
+/** A path of `localized`: a route keeps its `[slug]`, so the result still fits a collection's `route`. */
+type Localized<P extends string> = P extends `${string}[slug]${string}` ? `/${string}[slug]${string}` : `/${string}`
+
+/** One address per language from a path in its English form, with the words of `segments`: `localized('/news')`. */
+export function localized<const P extends `/${string}`>(path: P): Record<SiteLocale, Localized<P>> {
+  const words = (locale: SiteLocale) => path.split('/').map((part) => segments[part]?.[locale] ?? part).join('/')
+  // Object.fromEntries loses the key and value types; the keys are exactly `locales`, and the words never touch `[slug]`.
+  return Object.fromEntries(locales.map((locale) => [locale, String(path) === '/' ? prefix(locale) || '/' : `${prefix(locale)}${words(locale)}`])) as Record<SiteLocale, Localized<P>>
+}

package/templates/portfolio/app/utils/telHref.ts

@@ -0,0 +1,3 @@
+// Synced from templates/_features/site/app/utils/telHref.ts by `pnpm templates sync`. Edit the source, not this copy.
+/** The `tel:` link for a phone number written for people ("+49 30 1234"): only digits and "+" are kept. */
+export const telHref = (phone: string) => `tel:${phone.replace(/[^\d+]/g, '')}`

package/templates/portfolio/components.json

@@ -0,0 +1,21 @@
+{
+  "$schema": "https://shadcn-vue.com/schema.json",
+  "style": "new-york",
+  "typescript": true,
+  "tailwind": {
+    "config": "",
+    "css": "app/assets/css/main.css",
+    "baseColor": "zinc",
+    "cssVariables": true,
+    "prefix": ""
+  },
+  "iconLibrary": "lucide",
+  "aliases": {
+    "components": "@/components",
+    "composables": "@/composables",
+    "utils": "@/lib/utils",
+    "ui": "@/components/ui",
+    "lib": "@/lib"
+  },
+  "registries": {}
+}

package/templates/portfolio/content/home.de.md

@@ -0,0 +1,4 @@
+---
+title: "Räume und Objekte, entworfen in Hamburg."
+lead: "Wir planen Wohnungen, Läden und Arbeitsräume und entwerfen die Möbel und die Keramik dafür, gefertigt mit Werkstätten im Norden Deutschlands."
+---

package/templates/portfolio/content/home.md

@@ -0,0 +1,4 @@
+---
+title: "Interiors and objects, designed in Hamburg."
+lead: "We plan flats, shops and workplaces, and design the furniture and ceramics for them, made with workshops in the north of Germany."
+---

package/templates/portfolio/content/legal/1.privacy.de.md

@@ -0,0 +1,19 @@
+---
+# Ersetzen Sie diesen Text durch Ihre eigene Datenschutzerklärung.
+# Die Platzhalter-Zeile unten entfällt, sobald der Text von Ihnen ist.
+title: "Datenschutzerklärung"
+slug: datenschutz
+description: "Wie diese Website mit personenbezogenen Daten umgeht."
+---
+
+> **Platzhalter:** Text aus der Vorlage, keine Rechtsberatung. Ersetzen Sie ihn, bevor die Website online geht.
+
+Eine Datenschutzerklärung beschreibt in der Regel:
+
+- wer für die Website verantwortlich ist, mit Anschrift und Kontaktdaten
+- welche personenbezogenen Daten die Website verarbeitet und wozu, zum Beispiel Server-Logs bei Ihrem Hoster und Anfragen per E-Mail
+- die Rechtsgrundlage und wie lange Sie die Daten aufbewahren
+- welche Dienste Sie für die Website nutzen (Hosting, E-Mail) und wo diese Daten verarbeiten
+- die Rechte der Besucherinnen und Besucher: Auskunft, Berichtigung, Löschung, Widerspruch und Beschwerde bei der Datenschutzaufsicht Ihres Bundeslandes
+
+So wie sie ausgeliefert wird, nutzt diese Vorlage keine Statistikdienste, setzt keine Tracking-Cookies, lädt nichts von fremden Servern und hat keine Formulare: Eine Anfrage ist eine E-Mail. Wenn Sie einen Dienst ergänzen, der Daten erhebt, beschreiben Sie ihn hier.

package/templates/portfolio/content/legal/1.privacy.md

@@ -0,0 +1,21 @@
+---
+# Replace this text with your own privacy policy.
+# The placeholder line below is removed once the text is yours.
+title: "Privacy policy"
+slug: privacy
+legalType: privacy
+updatedAt: 2026-10-15
+description: "How this website handles personal data."
+---
+
+> **Placeholder:** template text, not legal advice. Replace it before the site goes live.
+
+A privacy policy usually covers:
+
+- who is responsible for the website, with address and contact details
+- which personal data the website processes and why, for example server logs at your host and enquiries by email
+- the legal basis, and how long you keep the data
+- which services you use to run the site (hosting, email) and where they process data
+- the rights of visitors: access, correction, deletion, objection, and a complaint to the data protection authority of your federal state
+
+As shipped, this template uses no analytics, sets no tracking cookies, loads nothing from other servers and has no forms: an enquiry is an email. If you add a service that collects data, describe it here.

package/templates/portfolio/content/legal/2.imprint.de.md

@@ -0,0 +1,15 @@
+---
+# Die Angaben oben kommen aus `content/site.md`.
+# In Deutschland braucht die Website eines Unternehmens ein Impressum nach dem Digitale-Dienste-Gesetz (DDG)
+# und, für das Journal, nach dem Medienstaatsvertrag (MStV).
+# Ersetzen Sie den Abschnitt unten durch Ihre eigenen Angaben.
+title: "Impressum"
+slug: impressum
+description: "Wer diese Website betreibt."
+---
+
+> **Platzhalter:** Text aus der Vorlage, keine Rechtsberatung. Ersetzen Sie ihn, bevor die Website online geht.
+
+## Verantwortlich für das Journal
+
+Nach § 18 Abs. 2 MStV: Maren Holt, Lotsenhof 7, 22765 Hamburg.

package/templates/portfolio/content/legal/2.imprint.md

@@ -0,0 +1,17 @@
+---
+# The details above the text come from `content/site.md`.
+# In Germany, a business website needs an imprint (Impressum) under the Digitale-Dienste-Gesetz (DDG)
+# and, for the journal, the Medienstaatsvertrag (MStV).
+# Replace the part below with your own details.
+title: "Imprint"
+slug: imprint
+legalType: imprint
+updatedAt: 2026-10-15
+description: "Who runs this website."
+---
+
+> **Placeholder:** template text, not legal advice. Replace it before the site goes live.
+
+## Responsible for the journal
+
+Under § 18 (2) MStV: Maren Holt, Lotsenhof 7, 22765 Hamburg.

package/templates/portfolio/content/notices/1.holm-chair.de.md

@@ -0,0 +1,3 @@
+---
+text: "Der Stuhl Holm in Eiche, auf Bestellung gefertigt."
+---

package/templates/portfolio/content/notices/1.holm-chair.md

@@ -0,0 +1,4 @@
+---
+text: "The Holm chair in oak, made to order."
+until: 2027-03-31
+---

package/templates/portfolio/content/pages/1.how-we-work.de.md

@@ -0,0 +1,23 @@
+---
+title: "So arbeiten wir"
+slug: so-arbeiten-wir
+summary: "Vom ersten Besuch bis zur letzten Montage: was in einem Projekt passiert und was wir von Ihnen brauchen."
+---
+
+## Ein erstes Gespräch
+
+Schreiben Sie uns oder rufen Sie an und erzählen Sie von Ihrem Raum und davon, was Sie ändern möchten. Wir treffen Sie vor Ort oder im Studio, sehen uns die Räume gemeinsam an und fragen, wie Sie darin leben oder arbeiten. Das erste Gespräch kostet nichts.
+
+## Konzept und Honorar
+
+Nach dem Besuch schicken wir Ihnen ein kurzes Konzept mit Skizzen und einem festen Honorar für den Entwurf. Dann entscheiden Sie, ob wir weitermachen.
+
+## Zeichnungen und Muster
+
+Wir zeichnen die Räume und jedes Möbelstück, und wir bringen Muster der Materialien mit, damit Sie sie in Ihrem eigenen Licht sehen und anfassen können. Wenn Sie zustimmen, holen wir die Preise der Werkstätten ein.
+
+## Fertigung und Montage
+
+Wir beauftragen Tischlereien, Stuckateure und Töpfereien, die wir kennen, und besuchen sie, während sie fertigen. Bei der Montage sind wir dabei und kommen nach ein paar Wochen noch einmal vorbei, um zu sehen, wie sich alles im Alltag bewährt.
+
+Die [Projekte]($page.projects) zeigen, wie das in der Praxis aussieht.

package/templates/portfolio/content/pages/1.how-we-work.md

@@ -0,0 +1,23 @@
+---
+title: "How we work"
+slug: how-we-work
+summary: "From the first visit to the last fitting: what happens in a project, and what we need from you."
+---
+
+## A first conversation
+
+Write or call us and tell us about your space and what you want to change. We meet you there or in the studio, look at the rooms together and ask about how you live or work in them. The first conversation costs nothing.
+
+## Concept and fee
+
+After the visit we send you a short concept with sketches and a fixed fee for the design. You decide then whether we go on.
+
+## Drawings and samples
+
+We draw the rooms and every piece of furniture, and we bring samples of the materials so you can see and touch them in your own light. Once you agree, we ask the workshops for their prices.
+
+## Making and fitting
+
+We order the work from joiners, plasterers and potters we know, and we visit them while they make it. We are there for the fitting and come back once more after a few weeks to see how it works in daily life.
+
+The [projects]($page.projects) show what this looks like in practice.

package/templates/portfolio/content/people/1.maren-holt.de.md

@@ -0,0 +1,4 @@
+---
+role: "Gründerin, entwirft Räume und Möbel"
+bio: "Maren hat Tischlerin gelernt, bevor sie Innenarchitektur studierte. Sie hat das Studio 2016 gegründet und leitet jedes Projekt vom ersten Besuch bis zur letzten Montage."
+---

package/templates/portfolio/content/people/1.maren-holt.md

@@ -0,0 +1,6 @@
+---
+name: Maren Holt
+role: "Founder, designs interiors and furniture"
+bio: "Maren trained as a carpenter before she studied interior design. She founded the studio in 2016 and leads every project from the first visit to the last fitting."
+email: maren.holt@marenholt.example
+---

package/templates/portfolio/content/people/2.ole-petersen.de.md

@@ -0,0 +1,4 @@
+---
+role: "Gestalter, Objekte und Keramik"
+bio: "Ole entwirft die Objekte des Studios, von Vasen bis zu Türgriffen, und leitet die Werkstatt, in der wir Modelle und Muster bauen. Er arbeitet mit den Töpfereien und Tischlereien, die unsere Stücke fertigen."
+---

package/templates/portfolio/content/people/2.ole-petersen.md

@@ -0,0 +1,6 @@
+---
+name: Ole Petersen
+role: "Designer, objects and ceramics"
+bio: "Ole designs the studio’s objects, from vases to door handles, and runs the workshop where we build models and samples. He works with the potters and joiners who make our pieces."
+email: ole.petersen@marenholt.example
+---

package/templates/portfolio/content/posts/full-size-drawings.de.md

@@ -0,0 +1,11 @@
+---
+title: "Warum wir jeden Stuhl im Maßstab 1:1 zeichnen"
+slug: zeichnungen-im-massstab-1-1
+description: "Eine Zeichnung in Originalgröße zeigt Fehler, die ein Bildschirm verbirgt. Ein paar Notizen aus der Entstehung des Stuhls Holm."
+---
+
+Bevor eine Tischlerei für uns Holz zuschneidet, zeichnen wir das Stück in Originalgröße auf Papier: den Stuhl von der Seite, von vorn und von oben, mit jeder Verbindung.
+
+Auf dem Bildschirm kann eine Kurve in jeder Größe richtig aussehen. Auf Papier im Maßstab 1:1 kann man ein echtes Kissen danebenhalten, sich auf einen Hocker daneben setzen und sehen, ob die Lehne einen dort trifft, wo sie soll. Beim Stuhl Holm zeigte die Zeichnung, dass die Lehne zwei Zentimeter zu hoch war, noch bevor wir den ersten Prototyp gebaut hatten.
+
+Die Zeichnungen gehen mit dem Auftrag in die Werkstatt. Die Tischler schreiben ihre Fragen darauf, wir antworten auf demselben Blatt, und am Ende hält das Papier jede Entscheidung des Projekts fest.

package/templates/portfolio/content/posts/full-size-drawings.md

@@ -0,0 +1,13 @@
+---
+title: "Why we draw every chair at full size"
+slug: full-size-drawings
+description: "A full-size drawing shows mistakes that a screen hides. A few notes from the making of the Holm chair."
+date: 2026-09-17
+authors: [people/maren-holt]
+---
+
+Before a joiner cuts any wood for us, we draw the piece at full size on paper: the chair from the side, from the front and from above, with every joint.
+
+On a screen, a curve can look right at any size. On paper at 1:1 you can hold a real cushion against it, sit on a stool beside it and see whether the back meets you where it should. For the Holm chair, the full-size drawing showed that the back was two centimetres too high before we built the first prototype.
+
+The drawings go with the order to the workshop. The joiners mark them up, we answer on the same sheet, and in the end the paper holds every decision of the project.

package/templates/portfolio/content/posts/lime-plaster.de.md

@@ -0,0 +1,11 @@
+---
+title: "Kalkputz unter dem Dach"
+slug: kalkputz
+description: "Warum wir für die Dachwohnung in Ottensen Kalkputz gewählt haben und was er von den Menschen verlangt, die mit ihm leben."
+---
+
+Unter einem Dach ändert sich die Luft schnell: warm und trocken am Nachmittag, kühl und feucht in der Nacht. Kalkputz nimmt Feuchtigkeit auf und gibt sie langsam wieder ab, so wirken die Räume ruhiger, und Schimmel hat es schwer.
+
+Er nimmt auch das Licht anders auf als Farbe. Die Oberfläche ist nie ganz glatt, deshalb zeichnet die tiefe Sonne aus den hohen Fenstern am Abend weiche Schatten über die Wand.
+
+Kalk braucht ein wenig Pflege. Er bekommt leichter Flecken als Farbe, und einen Fleck reibt man am besten mit einem trockenen Schwamm weg, statt ihn abzuwaschen. Kleine Risse im ersten Jahr sind normal; der Stuckateur kommt einmal wieder und schließt sie.

package/templates/portfolio/content/posts/lime-plaster.md

@@ -0,0 +1,13 @@
+---
+title: "Lime plaster under the roof"
+slug: lime-plaster
+description: "Why we chose lime plaster for the attic flat in Ottensen, and what it asks of the people who live with it."
+date: 2026-04-22
+authors: [people/ole-petersen]
+---
+
+Under a roof, the air changes quickly: warm and dry in the afternoon, cool and damp at night. Lime plaster takes up moisture and gives it back slowly, so the rooms feel calmer, and it does not grow mould easily.
+
+It also takes light in a way paint does not. The surface is never quite even, so the low sun from the high windows draws soft shadows across the wall in the evening.
+
+Lime asks for a little care. It marks more easily than paint, and a mark is best rubbed out with a dry sponge, not washed. Small cracks in the first year are normal; the plasterer comes back once to close them.

package/templates/portfolio/content/projects/1.attic-flat-ottensen.de.md

@@ -0,0 +1,19 @@
+---
+title: "Dachwohnung in Ottensen"
+slug: dachwohnung-ottensen
+summary: "Eine dunkle Dachwohnung in einem Altbau, zum Himmel geöffnet mit einem Band hoher Fenster, Kalkputz und eingebauten Möbeln aus Eiche."
+client: "Privatkundin"
+place: "Hamburg-Ottensen"
+scope: "Planung, Einbaumöbel, Licht, Materialien"
+image:
+  alt: "Sonnenlicht fällt durch ein Band hoher Fenster auf eine warm verputzte Wand"
+photos:
+  - image:
+      alt: "Werkzeichnungen, ein Bleistift und ein Lineal auf einem Holztisch"
+---
+
+Die Wohnung hatte kleine Dachfenster und den ganzen Tag wenig Licht. Wir haben das Schlafzimmer nach hinten gelegt und dem Wohnraum ein Band hoher Fenster nach Südwesten gegeben, so reicht die Nachmittagssonne tief in den Raum.
+
+Die Wände sind mit Kalk in einem warmen Grau verputzt, das das Licht weich aufnimmt. An der niedrigen Seite des Daches haben wir Schränke, einen Schreibtisch und eine Bank aus geölter Eiche eingebaut: Die Schräge nimmt den Stauraum auf, der Raum bleibt offen.
+
+Jedes Einbaumöbel haben wir im Maßstab 1:1 gezeichnet und mit einer Tischlerei in Hamburg gebaut. Die Kundin hat während der Arbeiten in der Wohnung gewohnt; der Umbau dauerte elf Wochen.

package/templates/portfolio/content/projects/1.attic-flat-ottensen.md

@@ -0,0 +1,22 @@
+---
+title: "Attic flat in Ottensen"
+slug: attic-flat-ottensen
+summary: "A dark attic flat under the roof of an old house, opened to the sky with a band of high windows, lime plaster and built-in oak furniture."
+client: "Private client"
+year: 2025
+place: "Hamburg-Ottensen"
+scope: "Planning, built-in furniture, lighting, materials"
+image:
+  src: /media/attic-light.jpg
+  alt: "Sunlight falls through a band of high windows onto a warm plastered wall"
+photos:
+  - image:
+      src: /media/workshop-drawings.jpg
+      alt: "Workshop drawings, a pencil and a ruler on a wooden table"
+---
+
+The flat had small roof windows and low light all day. We moved the bedroom to the back and gave the living room a band of high windows facing south-west, so the afternoon sun reaches deep into the room.
+
+The walls are lime plaster in a warm grey that takes the light softly. Along the low side of the roof we built cupboards, a desk and a bench in oiled oak, so the slope holds the storage and the room stays open.
+
+We drew every built-in piece at full size and made it with joiners in Hamburg. The client lived in the flat during the work; the building work took eleven weeks.

package/templates/portfolio/content/projects/2.elbsand-vases.de.md

@@ -0,0 +1,18 @@
+---
+title: "Vasen Elbsand"
+slug: vasen-elbsand
+summary: "Eine Serie aus neun Vasen aus hellem Steinzeug, von Hand gedreht in einer Töpferei in Lüneburg, mit Glasuren in den Farben von Sand und Schilf an der Elbe."
+place: "Lüneburg"
+scope: "Entwurf, Glasuren, Fertigung mit der Töpferei"
+image:
+  alt: "Vasen aus hellem Steinzeug in verschiedenen Höhen und Formen in einer Reihe auf einem Holzbrett"
+photos:
+  - image:
+      alt: "Muster aus Stein und Stoff und Glasurproben auf einem Tisch"
+---
+
+Die Serie begann mit Spaziergängen an der Elbe im Winter: heller Sand, graues Schilf und der Rost alter Buhnen. Wir wollten Vasen, die einen einzelnen Zweig ebenso halten wie einen vollen Strauß und die zusammen auf einem Regal ruhig wirken.
+
+Ole hat die neun Formen gezeichnet, die Töpferei hat sie auf der Scheibe gedreht. Jede Glasur brauchte mehrere Runden von Proben; wir haben die behalten, die sich mit der Dicke der Glasur verändern, so gleicht keine Vase genau der anderen.
+
+Die Vasen entstehen in kleinen Serien. Läden und Restaurants können sie im Set bestellen.

package/templates/portfolio/content/projects/2.elbsand-vases.md

@@ -0,0 +1,21 @@
+---
+title: "Elbsand vases"
+slug: elbsand-vases
+summary: "A series of nine vases in pale stoneware, thrown by hand in a pottery in Lüneburg, with glazes in the colours of the sand and the reeds on the Elbe."
+year: 2024
+place: "Lüneburg"
+scope: "Design, glazes, production with the pottery"
+image:
+  src: /media/ceramic-vases.jpg
+  alt: "Pale stoneware vases of different heights and shapes in a row on a wooden board"
+photos:
+  - image:
+      src: /media/material-samples.jpg
+      alt: "Samples of stone, fabric and glaze tests laid out on a table"
+---
+
+The series started with walks along the Elbe in winter: pale sand, grey reeds and the rust of old groynes. We wanted vases that hold a single branch as well as a full bunch, and that look calm together on one shelf.
+
+Ole drew the nine shapes, and the pottery threw them on the wheel. Each glaze took several rounds of tests; we kept the ones that change with the thickness of the glaze, so no two vases are quite the same.
+
+The vases are made in small batches. Shops and restaurants can order them in sets.

package/templates/portfolio/content/projects/3.werftblick-entrance-hall.de.md

@@ -0,0 +1,18 @@
+---
+title: "Eingangshalle für Werftblick"
+slug: eingangshalle-werftblick
+summary: "Die Eingangshalle eines Wohnhauses aus Sichtbeton: ein Empfangstresen aus Stein, Filz gegen den Hall und eine Treppe, die die Menschen nach oben führt."
+place: "Hamburg-HafenCity"
+scope: "Eingangshalle, Empfangstresen, Akustik, Beschilderung"
+image:
+  alt: "Eine Treppe aus Sichtbeton führt schräg an einer Betonwand nach oben"
+photos:
+  - image:
+      alt: "Muster aus Stein und Stoff und Glasurproben auf einem Tisch"
+---
+
+Die Architekten hatten eine schöne Betontreppe gebaut, aber die Halle war laut, und Besucher wussten nicht, wohin. Wir haben den Beton gelassen, wie er ist, und nur ergänzt, was der Halle fehlte.
+
+Der Empfangstresen ist ein einziger Block aus dunklem Stein, dort, wo man beim Hereinkommen zuerst hinsieht. Paneele aus Wollfilz an der Rückwand nehmen den Hall aus dem Raum. Die Schilder sind am Fuß der Treppe in den Beton geschnitten, so brauchen sie weder Rahmen noch Bildschirme.
+
+Wir haben vom Beginn des Innenausbaus an mit den Architekten gearbeitet; die Halle wurde mit dem Haus eröffnet.