From b1ed91366f8abddcfb5f2834dba2d9b276a07127 Mon Sep 17 00:00:00 2001 From: Steven Giesel Date: Sat, 15 Mar 2025 20:26:25 +0100 Subject: [PATCH] feat: Smaller ui adjustments for short card --- .../Features/Components/ShortBlogPost.razor | 4 ++-- .../Components/ShortBlogPost.razor.css | 18 +++++++++--------- .../DraftBlogPost/DraftBlogPostPageTests.cs | 2 +- .../Web/Features/Bookmarks/BookmarksTests.cs | 2 +- .../Web/Features/Home/IndexTests.cs | 6 +++--- .../Web/Features/Search/SearchPageTests.cs | 6 +++--- 6 files changed, 19 insertions(+), 19 deletions(-) diff --git a/src/LinkDotNet.Blog.Web/Features/Components/ShortBlogPost.razor b/src/LinkDotNet.Blog.Web/Features/Components/ShortBlogPost.razor index e1345977..0be7b840 100644 --- a/src/LinkDotNet.Blog.Web/Features/Components/ShortBlogPost.razor +++ b/src/LinkDotNet.Blog.Web/Features/Components/ShortBlogPost.razor @@ -37,10 +37,10 @@
-

@BlogPost.Title

+

@BlogPost.Title

-

@MarkdownConverter.ToMarkupString(BlogPost.ShortDescription)

+

@MarkdownConverter.ToMarkupString(BlogPost.ShortDescription)

Read the whole article

diff --git a/src/LinkDotNet.Blog.Web/Features/Components/ShortBlogPost.razor.css b/src/LinkDotNet.Blog.Web/Features/Components/ShortBlogPost.razor.css index b0bb87ea..23158dea 100644 --- a/src/LinkDotNet.Blog.Web/Features/Components/ShortBlogPost.razor.css +++ b/src/LinkDotNet.Blog.Web/Features/Components/ShortBlogPost.razor.css @@ -85,11 +85,6 @@ justify-content: space-between; } -.blog-card .description h1 { - line-height: 1; - margin: 0 0 5px 0; - font-size: 1.7rem; -} .blog-card .description .read-more { text-align: right; } @@ -155,11 +150,16 @@ background-color: #ff8700; } -@media (max-width: 400px) { - .blog-card .description h1 { - font-size: 1.25rem; - } +.card-title { + font-weight: 600; + line-height: 1.3; + margin-right: 1rem; } + +.card-content { + font-weight: 300; +} + @media (min-width: 640px) { .blog-card { flex-direction: row; diff --git a/tests/LinkDotNet.Blog.IntegrationTests/Web/Features/Admin/DraftBlogPost/DraftBlogPostPageTests.cs b/tests/LinkDotNet.Blog.IntegrationTests/Web/Features/Admin/DraftBlogPost/DraftBlogPostPageTests.cs index b932a383..84c1cedb 100644 --- a/tests/LinkDotNet.Blog.IntegrationTests/Web/Features/Admin/DraftBlogPost/DraftBlogPostPageTests.cs +++ b/tests/LinkDotNet.Blog.IntegrationTests/Web/Features/Admin/DraftBlogPost/DraftBlogPostPageTests.cs @@ -27,6 +27,6 @@ public async Task ShouldOnlyShowPublishedPosts() var blogPosts = cut.FindComponents(); blogPosts.ShouldHaveSingleItem(); - blogPosts[0].Find(".description h1").InnerHtml.ShouldBe("Not published"); + blogPosts[0].Find(".description h4").InnerHtml.ShouldBe("Not published"); } } diff --git a/tests/LinkDotNet.Blog.IntegrationTests/Web/Features/Bookmarks/BookmarksTests.cs b/tests/LinkDotNet.Blog.IntegrationTests/Web/Features/Bookmarks/BookmarksTests.cs index aac491c1..667b9567 100644 --- a/tests/LinkDotNet.Blog.IntegrationTests/Web/Features/Bookmarks/BookmarksTests.cs +++ b/tests/LinkDotNet.Blog.IntegrationTests/Web/Features/Bookmarks/BookmarksTests.cs @@ -33,7 +33,7 @@ public async Task ShouldOnlyDisplayBookmarkedPosts() var blogPosts = cut.FindComponents(); blogPosts.ShouldHaveSingleItem(); - blogPosts[0].Find(".description h1").TextContent.ShouldBe("Bookmarked Post"); + blogPosts[0].Find(".description h4").TextContent.ShouldBe("Bookmarked Post"); } [Fact] diff --git a/tests/LinkDotNet.Blog.IntegrationTests/Web/Features/Home/IndexTests.cs b/tests/LinkDotNet.Blog.IntegrationTests/Web/Features/Home/IndexTests.cs index a5a64d29..3dbb7f5d 100644 --- a/tests/LinkDotNet.Blog.IntegrationTests/Web/Features/Home/IndexTests.cs +++ b/tests/LinkDotNet.Blog.IntegrationTests/Web/Features/Home/IndexTests.cs @@ -30,8 +30,8 @@ public async Task ShouldShowAllBlogPostsWithLatestOneFirst() var blogPosts = cut.FindComponents(); blogPosts.Count.ShouldBe(2); - blogPosts[0].Find(".description h1").InnerHtml.ShouldBe("New"); - blogPosts[1].Find(".description h1").InnerHtml.ShouldBe("Old"); + blogPosts[0].Find(".description h4").InnerHtml.ShouldBe("New"); + blogPosts[1].Find(".description h4").InnerHtml.ShouldBe("Old"); } [Fact] @@ -50,7 +50,7 @@ public async Task ShouldOnlyShowPublishedPosts() var blogPosts = cut.FindComponents(); blogPosts.ShouldHaveSingleItem(); - blogPosts[0].Find(".description h1").InnerHtml.ShouldBe("Published"); + blogPosts[0].Find(".description h4").InnerHtml.ShouldBe("Published"); } [Fact] diff --git a/tests/LinkDotNet.Blog.IntegrationTests/Web/Features/Search/SearchPageTests.cs b/tests/LinkDotNet.Blog.IntegrationTests/Web/Features/Search/SearchPageTests.cs index 8813ba5f..1d085f13 100644 --- a/tests/LinkDotNet.Blog.IntegrationTests/Web/Features/Search/SearchPageTests.cs +++ b/tests/LinkDotNet.Blog.IntegrationTests/Web/Features/Search/SearchPageTests.cs @@ -23,7 +23,7 @@ public async Task ShouldFindBlogPostWhenTitleMatches() var cut = ctx.Render(p => p.Add(s => s.SearchTerm, "Title 1")); var blogPosts = cut.WaitForComponent(); - blogPosts.Find(".description h1").TextContent.ShouldBe("Title 1"); + blogPosts.Find(".description h4").TextContent.ShouldBe("Title 1"); } [Fact] @@ -39,7 +39,7 @@ public async Task ShouldFindBlogPostWhenTagMatches() var cut = ctx.Render(p => p.Add(s => s.SearchTerm, "Cat")); var blogPost = cut.WaitForComponent(); - blogPost.Find(".description h1").TextContent.ShouldBe("Title 1"); + blogPost.Find(".description h4").TextContent.ShouldBe("Title 1"); } [Fact] @@ -53,7 +53,7 @@ public async Task ShouldUnescapeQuery() var cut = ctx.Render(p => p.Add(s => s.SearchTerm, "Title%201")); var blogPosts = cut.WaitForComponent(); - blogPosts.Find(".description h1").TextContent.ShouldBe("Title 1"); + blogPosts.Find(".description h4").TextContent.ShouldBe("Title 1"); } private void RegisterServices(BunitContext ctx)