From c98aff0bae52df84af2bd63c9418242724d08725 Mon Sep 17 00:00:00 2001
From: thomas <toma.laforge@gmail.com>
Date: Sun, 4 Feb 2024 13:52:19 +0100
Subject: [PATCH] feat: save

---
 .../src/app/blog/blog.component.ts                |  4 ++--
 .../src/app/post/post.component.ts                | 15 +++++++++++++--
 2 files changed, 15 insertions(+), 4 deletions(-)

diff --git a/apps/angular/view-transition/src/app/blog/blog.component.ts b/apps/angular/view-transition/src/app/blog/blog.component.ts
index 6826644..68ffcde 100644
--- a/apps/angular/view-transition/src/app/blog/blog.component.ts
+++ b/apps/angular/view-transition/src/app/blog/blog.component.ts
@@ -8,10 +8,10 @@ import { ThumbnailComponent } from './thumbnail.component';
   imports: [ThumbnailComponent],
   template: `
     <div
-      class="flex h-20  items-center justify-center border-b-2 text-4xl shadow-md">
+      class="fixed left-0  right-0 top-0 z-50 flex h-20 items-center justify-center border-b-2 bg-white text-4xl shadow-md">
       Blog List
     </div>
-    <div class="flex h-screen flex-col items-center gap-10 border p-10">
+    <div class="my-20 flex h-screen flex-col items-center gap-10 border p-10">
       @for (post of posts; track post.id) {
         <blog-thumbnail [post]="post" />
       }
diff --git a/apps/angular/view-transition/src/app/post/post.component.ts b/apps/angular/view-transition/src/app/post/post.component.ts
index 09bfed8..1e1c6fd 100644
--- a/apps/angular/view-transition/src/app/post/post.component.ts
+++ b/apps/angular/view-transition/src/app/post/post.component.ts
@@ -5,6 +5,7 @@ import {
   computed,
   input,
 } from '@angular/core';
+import { RouterLink } from '@angular/router';
 import { ThumbnailHeaderComponent } from '../blog/thumbnail-header.component';
 import { fakeTextChapters, posts } from '../data';
 import { PostHeaderComponent } from './post-header.component';
@@ -12,9 +13,19 @@ import { PostHeaderComponent } from './post-header.component';
 @Component({
   selector: 'post',
   standalone: true,
-  imports: [ThumbnailHeaderComponent, NgOptimizedImage, PostHeaderComponent],
+  imports: [
+    ThumbnailHeaderComponent,
+    NgOptimizedImage,
+    PostHeaderComponent,
+    RouterLink,
+  ],
   template: `
-    <div class="w-full max-w-[800px]">
+    <div class="relative w-full max-w-[800px]">
+      <button
+        routerLink="/"
+        class="absolute left-2 top-2 z-20 rounded-md border bg-white p-2">
+        Back
+      </button>
       <img [ngSrc]="post().image" alt="" width="960" height="540" />
       <h2 class="p-7 text-center text-5xl">{{ post().title }}</h2>
       <post-header [date]="post().date" class="mb-20" />