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

feat: 使用Bootstrap重写前端页面 #2

Merged
jackfiled merged 6 commits from feat-bootstrap into master 2024-07-22 16:59:43 +08:00
Conversation 0 Commits 6 Files Changed 48 +82 -72
11 changed files with 82 additions and 72 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 15469ebc8f - Show all commits

14
YaeBlog/Components/Foonter.razor Normal file
View File

@ -0,0 +1,14 @@
<div class="row align-items-end text-center">
<div class="row">
<p class="fs-6">
2021 - @(DateTimeOffset.Now.Year) © <a href="https://rrricardo.top" target="_blank">Ricardo Ren</a>，
由 <a href="https://dotnet.microsoft.com/zh-cn/" target="_blank">.NET @(Environment.Version)</a> 驱动。
</p>
</div>
<div class="row">
<p class="fs-6">
<a href="https://beian.miit.gov.cn" target="_blank">蜀ICP备2022004429号-1</a>
</p>
</div>
</div>

0
YaeBlog/Components/Foonter.razor.css Normal file
View File

48
YaeBlog/Layout/BlogLayout.razor
View File

@ -1,9 +1,47 @@
@inherits LayoutComponentBase
<main>
@Body
</main>
<div class="container">
<div class="row" style="height: 80px">
<div class="px-2 col-8">
<a href="/" class="p-2">
<h4>Ricardo's Blog</h4>
</a>
</div>
@code {
<div class="col-4 d-flex justify-content-around align-items-center">
<a href="/blog/" class="p-2" target="_blank">
<div class="d-inline-flex" style="text-align: center">
<Icon Name="@IconName.House" Color="@IconColor.Primary" class="px-2" Size="@IconSize.x5"/>
<h5>首页</h5>
</div>
</a>
}
<a href="/blog/archives/" class="p-2" target="_blank">
<div class="d-inline-flex">
<Icon Name="@IconName.Archive" Color="@IconColor.Primary" class="px-2" Size="IconSize.x5"/>
<h5>归档</h5>
</div>
</a>
<a href="/blog/tags/" class="p-2" target="_blank">
<div class="d-inline-flex">
<Icon Name="@IconName.Tags" Color="@IconColor.Primary" class="px-2" Size="@IconSize.x5"/>
<h5>标签</h5>
</div>
</a>
<a href="/blog/about/" class="p-2" target="_blank">
<div class="d-inline-flex">
<Icon Name="@IconName.Person" Color="@IconColor.Primary" class="px-2" Size="@IconSize.x5"/>
<h5>关于</h5>
</div>
</a>
</div>
</div>
<main class="row px-4 py-2">
@Body
</main>
<Foonter/>
</div>

54
YaeBlog/Layout/MainLayout.razor
View File

@ -1,45 +1,25 @@
@inherits LayoutComponentBase
<main class="center">
<div class="container" style="height: 100%">
<div class="row" style="height: 80px">
<div class="px-2 col-8">
<a href="https://rrricardo.top" class="p-2">
<h4>Ricardo's Index</h4>
</a>
</div>
<div class="col-4 d-flex justify-content-around align-items-center">
<a href="https://github.com/jackfiled" class="p-2" target="_blank">
<h5>Github</h5>
</a>
<a href="mailto://shicangjuner@outlook.com" class="p-2" target="_blank">
<h5>E-mail</h5>
</a>
</div>
<div class="container">
<div class="row" style="height: 80px">
<div class="px-2 col-8">
<a href="/" class="p-2">
<h4>Ricardo's Index</h4>
</a>
</div>
<article class="row px-4">
<div class="py-2">
@Body
</div>
</article>
<div class="row align-items-end text-center">
<div class="row">
<p class="fs-6"> 2021 - 2024 By <a href="https://rrricardo.top" target="_blank">Ricardo Ren</a></p>
</div>
<div class="row">
<p class="fs-6">
<a href="https://beian.miit.gov.cn">蜀ICP备2022004429号-1</a>
</p>
</div>
<div class="col-4 d-flex justify-content-around align-items-center">
<a href="mailto://shicangjuner@outlook.com" class="p-2" target="_blank">
<h5>E-mail</h5>
</a>
</div>
</div>
</main>
@code {
<main class="row px-4 center">
<div class="py-2">
@Body
</div>
</main>
}
<Foonter/>
</div>

1
YaeBlog/Layout/MainLayout.razor.css
View File

@ -1,6 +1,5 @@
.center {
margin: 0 auto;
min-height: 100vh;
max-width: 48em;
position: relative;
display: flex;

3
YaeBlog/Pages/BlogIndex.razor Normal file
View File

@ -0,0 +1,3 @@
@page "/blog"

0
YaeBlog/Pages/BlogIndex.razor.css Normal file
View File

4
YaeBlog/Pages/Index.razor
View File

@ -34,12 +34,12 @@
<div class="row">
<p class="fs-5">
如果您想四处看看，了解一下屏幕对面的人，可以在我的 <a href="https://rrricardo.top/blog/">博客</a> 看看。
如果您想四处看看，了解一下屏幕对面的人，可以在我的 <a href="/blog/">博客</a> 看看。
如果您对于明光村幼儿园某附属技校的计算机教学感兴趣，您可以移步到
<a href="https://jackfiled.github.io/wiki/">我的学习笔记</a>，
<span class="fs-5 text-decoration-line-through">虽然这笔记我自己也木有看过。</span>
如果您想批判一下我的代码，在 <a href="https://github.com/jackfiled" target="_blank">Github</a> 和
<a href="https://git.rrricardo.top/jackfiled/" target="_blank">Gitea</a> 都可以看见。
<a href="https://git.rrricardo.top/jackfiled/" target="_blank">Gitea</a> 都可以找到。
</p>
<p class="fs-5">
如果您真的很闲，也可以四处搜寻一下，也许存在着一些不为人知的彩蛋。

BIN
YaeBlog/wwwroot/fonts/bootstrap-icons.woff Normal file
View File

Binary file not shown.

BIN
YaeBlog/wwwroot/fonts/bootstrap-icons.woff2 (Stored with Git LFS) Normal file
View File

Binary file not shown.

27
YaeBlog/wwwroot/globals.css
View File

@ -2,33 +2,6 @@ body a {
text-decoration: none;
}
html, body {
height: 100%;
}
p {
font-size: 1rem;
line-height: 1.6;
}
*::-webkit-scrollbar {
width: 8px;
height: 8px;
}
*::-webkit-scrollbar-thumb {
background-color: #80c8f8;
}
*::-webkit-scrollbar-track {
background-color: transparent;
}
* {
scrollbar-width: thin;
scrollbar-color: #80c8f8 transparent;
}
@font-face {
font-family: "Font Awesome 6 Free";
font-style: normal;