Added posts and possibility to like post

src/app/components/post/post.component.html

@@ -1,3 +1,32 @@
-@for (post of posts(); track post.id) {
-    <img [src]="'data:image/jpeg;base64,' + post.proof" alt=""/>
+@for (post of localPosts(); track post.id) {
+    <ion-item lines="full">
+        <div class="mt-2">
+            <div class="flex items-center gap-2 p-3">
+                <div class="w-8 h-8 rounded-full flex items-center justify-center text-xs bg-teal-100 text-teal-700 max-w-xs">
+                    {{ post.username.substring(0, 2) }}
+                </div>
+                <span class="text-lg font-mono ml-2">{{ post.username }}</span>
+            </div>
+
+            <div class="aspect-square overflow-hidden p-1">
+                <img [src]="'data:image/jpeg;base64,' + post.proof"
+                     alt=""
+                     class="w-full h-full object-cover"/>
+            </div>
+
+            <div class="px-3 py-3">
+                <div class="flex items-center gap-2 mb-1">
+                    <button class="flex items-center p-0 bg-transparent border-none cursor-pointer" (click)="likePost(post.id)">
+                        @if (post.isLiked) {
+                            <ion-icon name="heart" class="text-red-700 text-2xl"></ion-icon>
+                        } @else {
+                            <ion-icon name="heart-outline" class="text-gray-500 text-2xl"></ion-icon>
+                        }
+                    </button>
+                    <span class="text-xs text-gray-400">{{ post.likes }} Likes</span>
+                </div>
+                <p class="text-sm text-gray-500 leading-snug italic">{{ post.libelle }}</p>
+            </div>
+        </div>
+    </ion-item>
 }