From fda778614c6322aa91d116918e25b693f0347ea3 Mon Sep 17 00:00:00 2001
From: Steven Giesel <stgiesel35@gmail.com>
Date: Wed, 19 Jun 2024 19:23:20 +0200
Subject: [PATCH] Fixed some UX problems with tags

---
 .../ShowBlogPost/ShowBlogPostPage.razor       | 22 ++++++++++++-------
 1 file changed, 14 insertions(+), 8 deletions(-)

diff --git a/src/LinkDotNet.Blog.Web/Features/ShowBlogPost/ShowBlogPostPage.razor b/src/LinkDotNet.Blog.Web/Features/ShowBlogPost/ShowBlogPostPage.razor
index 1e9d7296..43f95538 100644
--- a/src/LinkDotNet.Blog.Web/Features/ShowBlogPost/ShowBlogPostPage.razor
+++ b/src/LinkDotNet.Blog.Web/Features/ShowBlogPost/ShowBlogPostPage.razor
@@ -43,16 +43,22 @@ else
 			<div class="blog-inner-content">
 				<header class="text-center">
 					<h1 class="fw-bold">@BlogPost.Title</h1></header>
-				<div class="blogpost-metainformation d-flex flex-row flex-wrap gap-2">
-					<div class="me-2"><span class="date"></span><span class="ms-1">@BlogPost.UpdatedDate.ToString("dd/MM/yyyy")</span></div>
+				<div class="blogpost-metainformation d-flex flex-wrap gap-2">
+					<div class="me-2">
+						<span class="date"></span>
+						<span class="ms-1">@BlogPost.UpdatedDate.ToString("dd/MM/yyyy")</span>
+					</div>
 					@if (BlogPost.Tags is not null && BlogPost.Tags.Any())
 					{
-						<span class="blogpost-tag d-inline-flex align-items-center gap-2">
-							@foreach (var tag in BlogPost.Tags)
-							{
-								<a class="goto-tag badge bg-primary rounded-pill text-decoration-none" href="/searchByTag/@(Uri.EscapeDataString(tag))">@tag</a>
-							}
-						</span>
+						<div class="d-flex align-items-center">
+							<span class="blogpost-tag me-2"></span>
+							<div class="d-flex flex-wrap gap-2">
+								@foreach (var tag in BlogPost.Tags)
+								{
+									<a class="goto-tag badge bg-primary rounded-pill text-decoration-none" href="/searchByTag/@(Uri.EscapeDataString(tag))">@tag</a>
+								}
+							</div>
+						</div>
 					}
 				</div>