jackfiled/YaeBlog
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add: 标签页面

Browse Source
This commit is contained in:
jackfiled 2024-01-26 20:54:35 +08:00
parent 28537f0e7a
commit e033aac662
5 changed files with 136 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
YaeBlog.Core/Models/BlogEssay.cs
View File

@ -1,6 +1,6 @@
namespace YaeBlog.Core.Models;
public class BlogEssay
public class BlogEssay : IComparable<BlogEssay>
{
public required string Title { get; init; }
@ -32,6 +32,16 @@ public class BlogEssay
return essay;
}
public int CompareTo(BlogEssay? other)
{
if (other is null)
{
return 1;
}
return PublishTime.CompareTo(other.PublishTime);
}
public override string ToString()
{
return $"{Title}-{PublishTime}";

5
YaeBlog.Core/Services/EssayContentService.cs
View File

@ -34,6 +34,11 @@ public class EssayContentService
}
}
}
foreach (KeyValuePair<string,List<BlogEssay>> pair in _tags)
{
pair.Value.Sort();
}
}
public IEnumerable<KeyValuePair<string, int>> Tags => from item in _tags

2
YaeBlog.Theme.FluentUI/Pages/Archives.razor.css
View File

@ -1,6 +1,6 @@
.archive-background {
position: relative;
height: 80%;
height: 60%;
overflow: hidden;
background-repeat: no-repeat;
background-size: cover;

92
YaeBlog.Theme.FluentUI/Pages/Tags.razor Normal file
View File

@ -0,0 +1,92 @@
@page "/tags"
@using YaeBlog.Core.Models
@using YaeBlog.Core.Services
@inject BlogOptions BlogOptionsInstance
@inject EssayContentService EssayContentInstance
<div style="height: 100%">
<div class="tag-background" style="background-image: url('@(BlogOptionsInstance.EssayImage)')">
<div class="tag-title">
<FluentStack Orientation="@Orientation.Vertical"
HorizontalAlignment="@HorizontalAlignment.Center">
<FluentLabel Typo="@Typography.H1" Color="@Color.Fill">
@(TagName ?? "标 签")
</FluentLabel>
</FluentStack>
</div>
</div>
<div style="height: 2rem"></div>
<div style="margin: 0 8% 0 8%">
<FluentCard>
<div style="margin: 0 8%">
@if (TagName is null)
{
<FluentStack Orientation="@Orientation.Horizontal"
Wrap="true" Style="margin: 2rem 0">
@foreach (KeyValuePair<string, int> pair in EssayContentInstance.Tags)
{
<div class="tag-item">
<a href="/tags?TagName=@(pair.Key)">
<span style="font-size: @(14 + pair.Value)px; color: @(RandomColor())">
@pair.Key
</span>
</a>
</div>
}
</FluentStack>
}
else
{
<FluentLabel Typo="@Typography.H2" Style="margin: 3rem 0 2rem 0; color: #404853">
共计@(EssayContentInstance.GetTag(TagName).Count())篇文章
</FluentLabel>
@foreach (BlogEssay essay in EssayContentInstance.GetTag(TagName))
{
<div style="margin: 0 4% 0 4%">
<div class="tag-essay-item">
<a href="/essays/@(essay.FileName)" target="_blank">
<FluentStack Orientation="@Orientation.Horizontal">
<FluentLabel Typo="@Typography.H5" Style="width: 120px">
@(essay.PublishTime.ToString("yyyy-MM-dd"))
</FluentLabel>
<FluentLabel Typo="@Typography.H5">
@(essay.Title)
</FluentLabel>
</FluentStack>
</a>
</div>
</div>
}
}
</div>
</FluentCard>
</div>
<BlogFooter/>
</div>
@code {
[SupplyParameterFromQuery]
private string? TagName { get; set; }
private static string[] s_colors =
[
"#337ab7",
"#bbe",
"#4e87c2",
"#a0aee3",
"#6994cd",
"#85a1d8"
];
private static string RandomColor()
{
return Random.Shared.GetItems(s_colors, 1)[0];
}
}

27
YaeBlog.Theme.FluentUI/Pages/Tags.razor.css Normal file
View File

@ -0,0 +1,27 @@
.tag-background {
position: relative;
height: 60%;
overflow: hidden;
background-repeat: no-repeat;
background-size: cover;
}
.tag-title {
top: 43%;
position: absolute;
width: 100%;
}
.tag-item {
margin: 0.25rem auto;
}
.tag-essay-item {
padding: 0.5rem 0.5rem 0.5rem 0.5rem;
margin: 0.5rem 0 0.5rem 0;
border-radius: 4px;
}
.tag-essay-item:hover {
background-color: rgba(169, 169, 169, 0.22);
}