From 6b59b58082cf6299ac879ea68bdca1b805838bc3 Mon Sep 17 00:00:00 2001 From: kgva CMS Date: Fri, 14 Aug 2026 23:50:54 +0000 Subject: [PATCH] feat: category tags (design/film/photo/text) on the portfolio index new categories taxonomy, multi-value per project. shown inline in each ls row as [tag] after the slug, muted like the other row metadata and inverting with it on hover/select. reuses the existing shared taxonomy template, so /categories/ and /categories// come for free as browsable archives in the same shell style already used for schools/degrees/semesters.\n\nassigned by medium: design for anything with plans/models, film for the two video projects, photo for the trieste study trip, text alongside design for translation (collage + accompanying theoretical text). --- assets/css/custom.css | 7 +++++-- content/portfolio/dojo.de.md | 1 + content/portfolio/dojo.md | 1 + content/portfolio/hotel-national.de.md | 1 + content/portfolio/hotel-national.md | 1 + content/portfolio/museo.de.md | 1 + content/portfolio/museo.md | 1 + content/portfolio/object-oriented-ontology.de.md | 1 + content/portfolio/object-oriented-ontology.md | 1 + content/portfolio/studytrip-trieste.de.md | 1 + content/portfolio/studytrip-trieste.md | 1 + content/portfolio/textilsteinwerk.de.md | 1 + content/portfolio/textilsteinwerk.md | 1 + content/portfolio/the-shadow-over-emmen.de.md | 1 + content/portfolio/the-shadow-over-emmen.md | 1 + content/portfolio/translation.de.md | 1 + content/portfolio/translation.md | 1 + content/portfolio/utopie-der-koexistenz.de.md | 1 + content/portfolio/utopie-der-koexistenz.md | 1 + hugo.toml | 1 + layouts/portfolio/list.html | 2 +- 21 files changed, 25 insertions(+), 3 deletions(-) diff --git a/assets/css/custom.css b/assets/css/custom.css index e9922c6..c5e7b45 100644 --- a/assets/css/custom.css +++ b/assets/css/custom.css @@ -148,7 +148,8 @@ body:not(.home) .menu { display: none; } white-space: nowrap; } .tui__perm, -.tui__date { color: var(--color-text-muted); } +.tui__date, +.tui__tags { color: var(--color-text-muted); } .tui__ls a:hover, .tui__ls a.is-selected { background: var(--color-text-primary); @@ -157,9 +158,11 @@ body:not(.home) .menu { display: none; } .tui__ls a:hover .tui__perm, .tui__ls a:hover .tui__date, .tui__ls a:hover .tui__name, +.tui__ls a:hover .tui__tags, .tui__ls a.is-selected .tui__perm, .tui__ls a.is-selected .tui__date, -.tui__ls a.is-selected .tui__name { color: var(--color-bg-primary); } +.tui__ls a.is-selected .tui__name, +.tui__ls a.is-selected .tui__tags { color: var(--color-bg-primary); } /* preview pane (ranger-style) below the listing */ .tui__preview { margin: 1.25rem 0 0; } diff --git a/content/portfolio/dojo.de.md b/content/portfolio/dojo.de.md index 2b5cf23..9796a5a 100644 --- a/content/portfolio/dojo.de.md +++ b/content/portfolio/dojo.de.md @@ -14,6 +14,7 @@ images: - { src: "/img/sem02/04.webp", name: "front-elevation.webp" } - { src: "/img/sem02/05.webp", name: "side-elevation.webp" } - { src: "/img/sem02/06.webp", name: "joint-axonometric.webp" } +categories: ["design"] --- im zentrum dieses entwurfs steht die konstruktive auseinandersetzung mit dem holzknoten – nicht als statisches detail, sondern als räumlich wirksames system. ausgehend von einem grundknoten, der ohne diagonale aussteifungen auskommt und ausschliesslich mit horizontalen und vertikalen balken funktioniert, wurde ein räumliches prinzip entwickelt, das zugleich rational und atmosphärisch ist. diff --git a/content/portfolio/dojo.md b/content/portfolio/dojo.md index ae18d29..d10733c 100644 --- a/content/portfolio/dojo.md +++ b/content/portfolio/dojo.md @@ -14,6 +14,7 @@ images: - { src: "/img/sem02/04.webp", name: "front-elevation.webp" } - { src: "/img/sem02/05.webp", name: "side-elevation.webp" } - { src: "/img/sem02/06.webp", name: "joint-axonometric.webp" } +categories: ["design"] --- at the centre of this design is the constructive exploration of the timber joint — not as a static detail, but as a spatially effective system. starting from a basic joint that works without diagonal bracing, relying solely on horizontal and vertical beams, a spatial principle was developed that is both rational and atmospheric. diff --git a/content/portfolio/hotel-national.de.md b/content/portfolio/hotel-national.de.md index 77c570f..a06b8c5 100644 --- a/content/portfolio/hotel-national.de.md +++ b/content/portfolio/hotel-national.de.md @@ -12,6 +12,7 @@ images: - { src: "/img/hotel-national/plan-full-ground-floor.webp", name: "plan-full-ground-floor.webp" } - { src: "/img/hotel-national/plan-intervention-near.webp", name: "plan-intervention-near.webp" } - { src: "/img/hotel-national/plan-intervention-detail.webp", name: "plan-intervention-detail.webp" } +categories: ["design"] --- in zusammenarbeit mit tamara grabovska basiert die zusammenführung des hotel national mit der lotte bibliothek auf einem bewusst gesetzten widerspruch. ein grandhotel mit klassischer repräsentationsarchitektur trifft auf eine linksautonome bibliothek. statt diesen gegensatz zu nivellieren, wird er räumlich inszeniert – als produktive koexistenz zweier haltungen innerhalb desselben gebäudes. diff --git a/content/portfolio/hotel-national.md b/content/portfolio/hotel-national.md index b0d757c..17586a2 100644 --- a/content/portfolio/hotel-national.md +++ b/content/portfolio/hotel-national.md @@ -12,6 +12,7 @@ images: - { src: "/img/hotel-national/plan-full-ground-floor.webp", name: "plan-full-ground-floor.webp" } - { src: "/img/hotel-national/plan-intervention-near.webp", name: "plan-intervention-near.webp" } - { src: "/img/hotel-national/plan-intervention-detail.webp", name: "plan-intervention-detail.webp" } +categories: ["design"] --- in collaboration with tamara grabovska, merging the hotel national with the lotte library is based on a deliberately set contradiction. a grand hotel with classical representational architecture meets a left-autonomous library. rather than levelling this opposition, it is staged spatially — as a productive coexistence of two attitudes within the same building. diff --git a/content/portfolio/museo.de.md b/content/portfolio/museo.de.md index 546f328..8de3a41 100644 --- a/content/portfolio/museo.de.md +++ b/content/portfolio/museo.de.md @@ -16,6 +16,7 @@ images: - { src: "/img/sem01/05.webp", name: "cutaway-model-angle.webp" } - { src: "/img/sem01/06.webp", name: "site-plan.webp" } - { src: "/img/sem01/07.webp", name: "street-linocut.webp" } +categories: ["design"] --- tonhalle museo ist ein spekulativer entwurf an der schnittstelle von architektur, klang und theorie. zwei scheinbar gegensätzliche programme – konzertsaal und museum – treffen in einem gemeinsamen baukörper aufeinander. dieses aufeinandertreffen wird nicht harmonisiert, sondern bewusst zugespitzt. diff --git a/content/portfolio/museo.md b/content/portfolio/museo.md index 69cb2b1..e5cce6c 100644 --- a/content/portfolio/museo.md +++ b/content/portfolio/museo.md @@ -16,6 +16,7 @@ images: - { src: "/img/sem01/05.webp", name: "cutaway-model-angle.webp" } - { src: "/img/sem01/06.webp", name: "site-plan.webp" } - { src: "/img/sem01/07.webp", name: "street-linocut.webp" } +categories: ["design"] --- tonhalle museo is a speculative design at the intersection of architecture, sound, and theory. two seemingly contradictory programmes — concert hall and museum — meet within a single building. this convergence is not harmonised but deliberately sharpened. diff --git a/content/portfolio/object-oriented-ontology.de.md b/content/portfolio/object-oriented-ontology.de.md index 08e9dc6..ee70646 100644 --- a/content/portfolio/object-oriented-ontology.de.md +++ b/content/portfolio/object-oriented-ontology.de.md @@ -4,4 +4,5 @@ slug: "object-oriented-ontology" date: 2026-01-15 thumbnail: "/img/ooo/thumbnail.webp" video: "/media/ooo.mp4" +categories: ["film"] --- diff --git a/content/portfolio/object-oriented-ontology.md b/content/portfolio/object-oriented-ontology.md index 08e9dc6..ee70646 100644 --- a/content/portfolio/object-oriented-ontology.md +++ b/content/portfolio/object-oriented-ontology.md @@ -4,4 +4,5 @@ slug: "object-oriented-ontology" date: 2026-01-15 thumbnail: "/img/ooo/thumbnail.webp" video: "/media/ooo.mp4" +categories: ["film"] --- diff --git a/content/portfolio/studytrip-trieste.de.md b/content/portfolio/studytrip-trieste.de.md index 2ba3c41..6588406 100644 --- a/content/portfolio/studytrip-trieste.de.md +++ b/content/portfolio/studytrip-trieste.de.md @@ -26,4 +26,5 @@ images: - { src: "/img/studytrip-trieste/Triest_Rozzol_Melara-04.webp", name: "rozzol-melara-04.webp" } - { src: "/img/studytrip-trieste/Triest_Rozzol_Melara-05.webp", name: "rozzol-melara-05.webp" } - { src: "/img/studytrip-trieste/Triest_Stanjel-01.webp", name: "stanjel.webp" } +categories: ["photo"] --- diff --git a/content/portfolio/studytrip-trieste.md b/content/portfolio/studytrip-trieste.md index 05b18fa..fd1526f 100644 --- a/content/portfolio/studytrip-trieste.md +++ b/content/portfolio/studytrip-trieste.md @@ -26,4 +26,5 @@ images: - { src: "/img/studytrip-trieste/Triest_Rozzol_Melara-04.webp", name: "rozzol-melara-04.webp" } - { src: "/img/studytrip-trieste/Triest_Rozzol_Melara-05.webp", name: "rozzol-melara-05.webp" } - { src: "/img/studytrip-trieste/Triest_Stanjel-01.webp", name: "stanjel.webp" } +categories: ["photo"] --- diff --git a/content/portfolio/textilsteinwerk.de.md b/content/portfolio/textilsteinwerk.de.md index 920d5f1..23ac0e5 100644 --- a/content/portfolio/textilsteinwerk.de.md +++ b/content/portfolio/textilsteinwerk.de.md @@ -15,6 +15,7 @@ images: - { src: "/img/sem05/05.webp", name: "dwelling-interior.webp" } - { src: "/img/sem05/section01.webp", name: "long-section.webp" } - { src: "/img/sem05/section02.webp", name: "hall-section.webp" } +categories: ["design"] --- die séchoir-halle, ein ehemaliger industriebau mit ursprung in der lokalen textilgeschichte, wurde in ihrer identität bewahrt und zugleich neu programmiert. wo früher viskosestoffe zum trocknen aufgehängt wurden, entstehen heute neue bausteine aus recycelten textilien. aus alten stoffen werden im stampfverfahren tragende elemente gefertigt – ein konstruktives system auf basis von kreislaufprinzipien. diff --git a/content/portfolio/textilsteinwerk.md b/content/portfolio/textilsteinwerk.md index 115dfea..a06ea36 100644 --- a/content/portfolio/textilsteinwerk.md +++ b/content/portfolio/textilsteinwerk.md @@ -15,6 +15,7 @@ images: - { src: "/img/sem05/05.webp", name: "dwelling-interior.webp" } - { src: "/img/sem05/section01.webp", name: "long-section.webp" } - { src: "/img/sem05/section02.webp", name: "hall-section.webp" } +categories: ["design"] --- the séchoir-halle, a former industrial building rooted in the local textile history, was preserved in its identity while being given a new programme. where viscose fabrics were once hung to dry, new building blocks made from recycled textiles are produced today — load-bearing elements crafted from old fabrics through a ramming process, a constructive system based on circular principles. diff --git a/content/portfolio/the-shadow-over-emmen.de.md b/content/portfolio/the-shadow-over-emmen.de.md index 5316f19..dc64df6 100644 --- a/content/portfolio/the-shadow-over-emmen.de.md +++ b/content/portfolio/the-shadow-over-emmen.de.md @@ -4,4 +4,5 @@ slug: "the-shadow-over-emmen" date: 2025-01-10T09:00:00 thumbnail: "/img/shadowofemmen/thumbnail.webp" video: "/media/shadow.mp4" +categories: ["film"] --- diff --git a/content/portfolio/the-shadow-over-emmen.md b/content/portfolio/the-shadow-over-emmen.md index 12978e0..81870e1 100644 --- a/content/portfolio/the-shadow-over-emmen.md +++ b/content/portfolio/the-shadow-over-emmen.md @@ -4,4 +4,5 @@ slug: "the-shadow-over-emmen" date: 2025-01-10T09:00:00 thumbnail: "/img/shadowofemmen/thumbnail.webp" video: "/media/shadow.mp4" +categories: ["film"] --- diff --git a/content/portfolio/translation.de.md b/content/portfolio/translation.de.md index ee3f3cb..77b328f 100644 --- a/content/portfolio/translation.de.md +++ b/content/portfolio/translation.de.md @@ -7,6 +7,7 @@ schools: ["hslu"] degrees: ["ma"] images: - { src: "/img/translation/grid-collage.webp", name: "grid-collage.webp" } +categories: ["design", "text"] --- in der zusammenarbeit mit tim schwander und jérôme arnold entsteht eine auseinandersetzung mit architektonischen denkweisen, die weniger zitiert als vielmehr übersetzt werden. die arbeit versteht sich als experimentierfeld, in dem ordnungssysteme, landschaft und fragment sich gegenseitig verschieben. diff --git a/content/portfolio/translation.md b/content/portfolio/translation.md index 35e021d..6ab3b60 100644 --- a/content/portfolio/translation.md +++ b/content/portfolio/translation.md @@ -7,6 +7,7 @@ schools: ["hslu"] degrees: ["ma"] images: - { src: "/img/translation/grid-collage.webp", name: "grid-collage.webp" } +categories: ["design", "text"] --- in collaboration with tim schwander and jérôme arnold, this work engages with architectural ways of thinking that are less quoted than translated. it understands itself as a field of experimentation in which systems of order, landscape, and fragment shift against one another. diff --git a/content/portfolio/utopie-der-koexistenz.de.md b/content/portfolio/utopie-der-koexistenz.de.md index 6d67c7e..68b0633 100644 --- a/content/portfolio/utopie-der-koexistenz.de.md +++ b/content/portfolio/utopie-der-koexistenz.de.md @@ -14,6 +14,7 @@ images: - { src: "/img/utopie-der-koexistenz/facade-detail-model.webp", name: "facade-detail-model.webp" } - { src: "/img/utopie-der-koexistenz/courtyard-overview-render.webp", name: "courtyard-overview-render.webp" } - { src: "/img/utopie-der-koexistenz/site-plan-ground-floor.webp", name: "site-plan-ground-floor.webp" } +categories: ["design"] --- vor dem hintergrund der funktionalen krise vieler spitäler aus den 1960er- und 70er-jahren setzt diese bachelorarbeit auf eine weiterentwicklung des bestehenden kantonsspitals baden anstelle eines radikalen abrisses. der ursprünglich vorgesehene komplettneubau wird infrage gestellt – zugunsten einer strategie, die brüche, übergänge und reibungen nicht glättet, sondern produktiv macht. diff --git a/content/portfolio/utopie-der-koexistenz.md b/content/portfolio/utopie-der-koexistenz.md index 5e238ff..b7905ce 100644 --- a/content/portfolio/utopie-der-koexistenz.md +++ b/content/portfolio/utopie-der-koexistenz.md @@ -14,6 +14,7 @@ images: - { src: "/img/utopie-der-koexistenz/facade-detail-model.webp", name: "facade-detail-model.webp" } - { src: "/img/utopie-der-koexistenz/courtyard-overview-render.webp", name: "courtyard-overview-render.webp" } - { src: "/img/utopie-der-koexistenz/site-plan-ground-floor.webp", name: "site-plan-ground-floor.webp" } +categories: ["design"] --- against the backdrop of the functional crisis affecting many hospitals built in the 1960s and 70s, this bachelor thesis pursues a development of the existing kantonsspital baden rather than a radical demolition. the originally planned complete new build is called into question — in favour of a strategy that does not smooth over ruptures, transitions, and frictions, but makes them productive. diff --git a/hugo.toml b/hugo.toml index cf48b78..f05e194 100644 --- a/hugo.toml +++ b/hugo.toml @@ -8,6 +8,7 @@ enableRobotsTXT = true school = "schools" degree = "degrees" semester = "semesters" + category = "categories" [params] description = "architecture studio" diff --git a/layouts/portfolio/list.html b/layouts/portfolio/list.html index 04f43f7..b296de8 100644 --- a/layouts/portfolio/list.html +++ b/layouts/portfolio/list.html @@ -16,7 +16,7 @@ data-img="{{ with $p.Params.thumbnail }}{{ . | relURL }}{{ end }}" data-name="{{ $p.Slug }}" {{ if eq $i 0 }}class="is-selected"{{ end }}> - drwxr-xr-x{{ $p.Date.Format "2006" }}{{ $p.Slug }}/ + drwxr-xr-x{{ $p.Date.Format "2006" }}{{ $p.Slug }}/{{ with $p.Params.categories }} {{ range . }}[{{ . }}]{{ end }}{{ end }} {{ end }}