Release version 2.2.0

The publish job built a single-arch image on ubuntu-latest, so every release manifest carried linux/amd64 only. Split it into a version job that exports the semver tag and image name, a matrix publish job that builds each architecture on its own native runner (ubuntu-latest, ubuntu-24.04-arm) and pushes an arch-suffixed tag, and a manifest job that joins both under the release tag. Native runners avoid the QEMU emulation layer.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>

.github/workflows/ci.yml

@@ -31,8 +31,8 @@ jobs:
       contents: read
       security-events: write
 
-  publish:
-    name: Publish image
+  version:
+    name: Detect release version
     runs-on: ubuntu-latest
     needs:
       - security
@@ -41,7 +41,10 @@ jobs:
     if: github.event_name == 'push'
     permissions:
       contents: read
-      packages: write
+    outputs:
+      found: ${{ steps.semver.outputs.found }}
+      version: ${{ steps.semver.outputs.version }}
+      image: ${{ steps.image.outputs.name }}
 
     steps:
       - name: Checkout repository
@@ -64,16 +67,34 @@ jobs:
           fi
 
       - name: Compute image name
-        if: steps.semver.outputs.found == 'true'
         id: image
         run: echo "name=ghcr.io/$(echo "${GITHUB_REPOSITORY}" | tr '[:upper:]' '[:lower:]')" >> "$GITHUB_OUTPUT"
 
+  publish:
+    name: Publish image (${{ matrix.arch }})
+    runs-on: ${{ matrix.runner }}
+    needs:
+      - version
+    if: needs.version.outputs.found == 'true'
+    permissions:
+      contents: read
+      packages: write
+    strategy:
+      matrix:
+        include:
+          - arch: amd64
+            runner: ubuntu-latest
+          - arch: arm64
+            runner: ubuntu-24.04-arm
+
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v6
+
       - name: Set up Docker Buildx
-        if: steps.semver.outputs.found == 'true'
         uses: docker/setup-buildx-action@8d2750c68a42422c14e847fe6c8ac0403b4cbd6f # v3.12.0
 
       - name: Login to GHCR
-        if: steps.semver.outputs.found == 'true'
         uses: docker/login-action@c94ce9fb468520275223c153574b00df6fe4bcc9 # v3.7.0
         with:
           registry: ghcr.io
@@ -81,10 +102,42 @@ jobs:
           password: ${{ secrets.GITHUB_TOKEN }}
 
       - name: Build and publish image
-        if: steps.semver.outputs.found == 'true'
         uses: docker/build-push-action@10e90e3645eae34f1e60eeb005ba3a3d33f178e8 # v6.19.2
         with:
           context: .
           file: ./Dockerfile
+          platforms: linux/${{ matrix.arch }}
           push: true
-          tags: ${{ steps.image.outputs.name }}:${{ steps.semver.outputs.version }}
+          tags: ${{ needs.version.outputs.image }}:${{ needs.version.outputs.version }}-${{ matrix.arch }}
+
+  manifest:
+    name: Join architectures
+    runs-on: ubuntu-latest
+    needs:
+      - version
+      - publish
+    permissions:
+      contents: read
+      packages: write
+
+    steps:
+      - name: Set up Docker Buildx
+        uses: docker/setup-buildx-action@8d2750c68a42422c14e847fe6c8ac0403b4cbd6f # v3.12.0
+
+      - name: Login to GHCR
+        uses: docker/login-action@c94ce9fb468520275223c153574b00df6fe4bcc9 # v3.7.0
+        with:
+          registry: ghcr.io
+          username: ${{ github.actor }}
+          password: ${{ secrets.GITHUB_TOKEN }}
+
+      - name: Create the multi-arch manifest
+        env:
+          IMAGE: ${{ needs.version.outputs.image }}
+          VERSION: ${{ needs.version.outputs.version }}
+        run: |
+          set -euo pipefail
+          docker buildx imagetools create -t "${IMAGE}:${VERSION}" \
+            "${IMAGE}:${VERSION}-amd64" \
+            "${IMAGE}:${VERSION}-arm64"
+          docker buildx imagetools inspect "${IMAGE}:${VERSION}"

CHANGELOG.md

@@ -1,5 +1,19 @@
 # Changelog
 
+## [2.2.0] - 2026-09-23
+
+* Images: releases ship arm64 next to amd64, for ARM servers and Apple Silicon
+* CI: each architecture builds on its own native runner, no QEMU emulation
+
+## [2.1.3] - 2026-09-11
+
+* CSP: UI strings ship as a JSON data block, not a CSP-blocked inline script
+* Cards: broken icon images fall back to the icon font (*onerror* fixed)
+* Iframe: a cross-origin iframe no longer throws a *SecurityError* on load
+* Fullscreen: scroll recalculation stops when the header animation ends
+* Fullscreen: a resize that keeps the fullscreen state triggers no recalc
+* Test coverage: no executable inline scripts; recalc must stop (Cypress)
+
 ## [2.1.2] - 2026-09-10
 
 * CI: lint tests install the project first, so the image publishes again

app/cypress/e2e/fullscreen.spec.js

@@ -71,6 +71,18 @@ describe('Fullscreen Toggle', () => {
     });
   });
 
+  it('stops recalculating once the header has nothing left to animate', () => {
+    cy.window().then(win => {
+      cy.spy(win, 'adjustScrollContainerHeight').as('recalc');
+      win.exitFullscreen();
+    });
+    cy.wait(500);
+    cy.get('@recalc').then(spy => {
+      const settled = spy.callCount;
+      cy.wait(500).then(() => expect(spy.callCount).to.eq(settled));
+    });
+  });
+
   it('toggleFullscreen() toggles into and out of fullscreen', () => {
     // Toggle into fullscreen
     cy.window().invoke('toggleFullscreen');

app/static/js/fullscreen.js

@@ -9,31 +9,16 @@ function updateUrlFullscreen(enabled) {
   window.history.replaceState({}, '', url);
 }
 
-/**
- * Starts a requestAnimationFrame loop that calls your recalc methods,
- * and stops automatically when the header’s max-height transition ends.
- */
 function recalcWhileCollapsing() {
   const header = document.querySelector('header');
   if (!header) return;
 
-  // 1) Start the RAF loop
-  let rafId;
   const step = () => {
     adjustScrollContainerHeight();
     updateCustomScrollbar();
-    rafId = requestAnimationFrame(step);
+    if (header.getAnimations().length > 0) requestAnimationFrame(step);
   };
   step();
-
-  // 2) Listen for the end of the max-height transition
-  function onEnd(e) {
-    if (e.propertyName === 'max-height') {
-      cancelAnimationFrame(rafId);
-      header.removeEventListener('transitionend', onEnd);
-    }
-  }
-  header.addEventListener('transitionend', onEnd);
 }
 
 function enterFullscreen() {
@@ -100,6 +85,7 @@ document.addEventListener('fullscreenchange', function() {
 });
 window.addEventListener('resize', function() {
   var isUiFs = Math.abs(window.innerHeight - screen.height) < 2;
+  if (isUiFs === document.body.classList.contains('fullscreen')) return;
   if (isUiFs) enterFullscreen();
   else         exitFullscreen();
 });

app/static/js/iframe.js

@@ -168,7 +168,12 @@ function observeIframeNavigation() {
   const iframe = mainElement.querySelector("iframe");
   if (!iframe || !iframe.contentWindow) return;
 
-  let lastUrl = iframe.contentWindow.location.href;
+  let lastUrl;
+  try {
+    lastUrl = iframe.contentWindow.location.href;
+  } catch (e) {
+    return;
+  }
 
   setInterval(() => {
     try {

app/static/js/modal.js

@@ -1,3 +1,6 @@
+const i18nBlock = document.getElementById('i18n');
+window.I18N = i18nBlock ? JSON.parse(i18nBlock.textContent) : {};
+
 function t(source) {
   return (window.I18N || {})[source] || source;
 }

app/templates/moduls/base.html.j2

@@ -71,7 +71,7 @@
         </div>
         <!-- Include modal -->
         {% include "moduls/modal.html.j2" %}
-        <script>window.I18N = {{ ui_strings | tojson }};</script>
+        <script id="i18n" type="application/json">{{ ui_strings | tojson }}</script>
         {% for name in [
             'modal',
             'navigation',

app/templates/moduls/card.html.j2

@@ -9,7 +9,7 @@
             src="{{ asset_src(card.icon) }}"
             alt="{{ card.title }}"
             style="width:100px; height:auto;"
-            onerror="this.style.display='none'; this.nextElementSibling?.style.display='inline-block';">
+            onerror="this.style.display='none'; if (this.nextElementSibling) this.nextElementSibling.style.display='inline-block';">
           {% if card.icon.class %}
             <i class="{{ card.icon.class }}" style="display:none;"></i>
           {% endif %}

pyproject.toml

@@ -4,7 +4,7 @@ build-backend = "setuptools.build_meta"
 
 [project]
 name = "portfolio-ui"
-version = "2.1.2"
+version = "2.2.0"
 description = "A lightweight YAML-driven portfolio and landing-page generator."
 readme = "README.md"
 requires-python = ">=3.12"

tests/integration/test_app_routes.py

@@ -1,5 +1,6 @@
 import json
 import os
+import re
 import shutil
 import subprocess
 import sys
@@ -111,6 +112,37 @@ class TestEscaping(AppRouteMixin, unittest.TestCase):
         self.assertIn("<script>alert('config')", body)
 
 
+class TestContentSecurityPolicy(AppRouteMixin, unittest.TestCase):
+    def test_page_ships_no_executable_inline_script(self):
+        body = self.client.get("/de/").get_data(as_text=True)
+
+        inline = [
+            tag
+            for tag in re.findall(r"<script\b[^>]*>", body)
+            if "src=" not in tag and 'type="application/json"' not in tag
+        ]
+
+        self.assertEqual(
+            inline,
+            [],
+            "a host CSP can only hash an inline script whose content it knows, "
+            "and this one changes with every language",
+        )
+
+    def test_interface_strings_ship_as_a_json_data_block(self):
+        i18n._catalogs["de"] = {"Open": "</script><script>alert(1)</script>"}
+
+        body = self.client.get("/de/").get_data(as_text=True)
+        block = re.search(
+            r'<script id="i18n" type="application/json">(.*?)</script>', body, re.S
+        )
+
+        self.assertIsNotNone(block)
+        self.assertEqual(
+            json.loads(block.group(1))["Open"], "</script><script>alert(1)</script>"
+        )
+
+
 class TestApodBackground(AppRouteMixin, unittest.TestCase):
     def setUp(self):
         super().setUp()