From 5f9ce311274b9df9e86ce052e4b0a7ef6e689ead Mon Sep 17 00:00:00 2001
From: Michael Winter <mwinter@unboundedpress.org>
Date: Sat, 7 Mar 2026 17:39:14 +0100
Subject: [PATCH] Fix title and date wrapping on mobile

---
 pages/works/[slug].vue | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/pages/works/[slug].vue b/pages/works/[slug].vue
index 9e75000..c000e9b 100644
--- a/pages/works/[slug].vue
+++ b/pages/works/[slug].vue
@@ -4,9 +4,9 @@
       <div class="sticky top-12 bg-white z-30 border-b border-gray-200">
         <div class="max-w-3xl mx-auto px-4">
           <div class="flex items-center justify-between py-1">
-            <div class="flex items-baseline gap-1">
-              <h1 class="text-xl italic" v-html="work.title"></h1>
-              <span class="text-sm text-gray-500">({{ year }})</span>
+            <div class="flex flex-wrap items-baseline gap-1">
+              <h1 class="inline-block text-xl italic" v-html="work.title"></h1>
+              <span class="inline-block text-sm text-gray-500">({{ year }})</span>
             </div>
             <nav class="flex items-center gap-4 text-sm">
               <a 
@@ -35,6 +35,7 @@
             scrolling="no" 
             frameborder="no" 
             allow="autoplay"
+            class="w-full h-auto"
           ></iframe>
         </div>
 
@@ -43,12 +44,11 @@
           <iframe 
             :src="'https://player.vimeo.com/video/' + work.vimeo_trackid" 
             width="100%" 
-            height="400" 
             frameborder="0" 
             webkitallowfullscreen 
             mozallowfullscreen 
             allowfullscreen 
-            class="w-full aspect-video"
+            class="w-full aspect-video h-auto"
           ></iframe>
         </div>