Fix Open Space detail view spacing (#245)

Co-authored-by: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

Author: JacobCoffee

src/app/pages/session-detail/session-detail.html

@@ -53,11 +53,14 @@ <h2>{{speaker.name}}</h2>
       </ion-item>
     </div>
 
-    <div *ngIf="session.imageUrl" class="session-image-container">
-      <img [src]="session.imageUrl" class="session-image">
+    <div *ngIf="session.imageUrl" class="session-image-container" [class.open-space-image-container]="isOpenSpace">
+      <img [src]="session.imageUrl" class="session-image" [class.open-space-hero-image]="isOpenSpace">
     </div>
 
-    <div class="session-description" [innerHtml]="session?.description" (click)="onDescriptionClick($event)">
+    <div class="session-description"
+         [class.open-space-description]="isOpenSpace"
+         [innerHtml]="session?.description"
+         (click)="onDescriptionClick($event)">
     </div>
   </div>
 </ion-content>

src/app/pages/session-detail/session-detail.scss

@@ -26,6 +26,13 @@
   gap: 10px;
 }
 
+// When image or description directly follows meta-card (no speakers section),
+// add extra top spacing for visual breathing room
+.session-meta-card + .session-image-container,
+.session-meta-card + .session-description {
+  margin-top: 4px;
+}
+
 :host-context(.dark-theme) .session-meta-card {
   background: var(--ion-color-step-100, #1a1a1a);
 }
@@ -70,15 +77,27 @@
 }
 
 .session-image-container {
-  margin: 16px 0;
+  margin: 16px 0 20px;
   text-align: center;
+
+  &.open-space-image-container {
+    margin: 4px 0 24px;
+  }
 }
 
 .session-image {
   max-width: 100%;
   max-height: 300px;
   border-radius: 12px;
   box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+
+  &.open-space-hero-image {
+    max-height: 220px;
+    width: 100%;
+    object-fit: cover;
+    border-radius: 12px;
+    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.12);
+  }
 }
 
 .session-description {
@@ -94,4 +113,10 @@
     color: var(--ion-color-primary);
     text-decoration: none;
   }
+
+  &.open-space-description {
+    padding-top: 4px;
+    white-space: pre-line;
+    word-wrap: break-word;
+  }
 }

src/app/pages/session-detail/session-detail.ts

@@ -16,6 +16,7 @@ import { environment } from '../../../environments/environment';
 export class SessionDetailPage {
   session: any;
   isFavorite = false;
+  isOpenSpace = false;
   defaultHref = '';
 
   constructor(
@@ -33,7 +34,8 @@ export class SessionDetailPage {
         const foundSession = data.sessions.find(
           (s: any) => String(s.id) === String(sessionId)
         )
-        this.session = foundSession
+        this.session = foundSession;
+        this.isOpenSpace = this.session?.tracks?.includes('open-space');
 
         this.isFavorite = this.userProvider.hasFavorite(
           String(this.session.id)