pages(detail): Completed details on all pages

This commit is contained in:
周中平 2022-01-14 14:49:51 +08:00
parent b3a1567403
commit 62fd4fea9b
No known key found for this signature in database
GPG Key ID: B1DF9DD42D8E00DC
13 changed files with 137 additions and 43 deletions

View File

@ -22,12 +22,12 @@
<div class="pagenav"> <div class="pagenav">
<#if pagination.hasPrev> <#if pagination.hasPrev>
<a href="${pagination.prevPageFullPath!}" class="pre"> <a href="${pagination.prevPageFullPath!}" class="pre">
回上页 退回上页
</a> </a>
</#if> </#if>
<#if pagination.hasNext> <#if pagination.hasNext>
<a href="${pagination.nextPageFullPath!}" class="next"> <a href="${pagination.nextPageFullPath!}" class="next">
更多文章 阅览更多
</a> </a>
</#if> </#if>
</div> </div>

View File

@ -18,12 +18,12 @@
<div class="pagenav"> <div class="pagenav">
<#if pagination.hasPrev> <#if pagination.hasPrev>
<a href="${pagination.prevPageFullPath!}" class="pre"> <a href="${pagination.prevPageFullPath!}" class="pre">
回上页 退回上页
</a> </a>
</#if> </#if>
<#if pagination.hasNext> <#if pagination.hasNext>
<a href="${pagination.nextPageFullPath!}" class="next"> <a href="${pagination.nextPageFullPath!}" class="next">
更多文章 阅览更多
</a> </a>
</#if> </#if>
</div> </div>

View File

@ -29,12 +29,12 @@
<div class="pagenav"> <div class="pagenav">
<#if pagination.hasPrev> <#if pagination.hasPrev>
<a href="${pagination.prevPageFullPath!}" class="pre"> <a href="${pagination.prevPageFullPath!}" class="pre">
回上页 退回上页
</a> </a>
</#if> </#if>
<#if pagination.hasNext> <#if pagination.hasNext>
<a href="${pagination.nextPageFullPath!}" class="next"> <a href="${pagination.nextPageFullPath!}" class="next">
更多文章 阅览更多
</a> </a>
</#if> </#if>
</div> </div>

View File

@ -12,13 +12,13 @@
<div class="content"> <div class="content">
${journal.content!} ${journal.content!}
</div> </div>
<div class="option"> <#-- <div class="option">
<i class="ri-thumb-up-line"></i> <i class="ri-thumb-up-line"></i>
<i class="ri-chat-3-line"></i> <i class="ri-chat-3-line"></i>
<i class="ri-share-forward-line"></i> <i class="ri-share-forward-line"></i>
</div> </div> -->
<#-- <div class="info"> <#-- <div class="info">
${user.nickname!} ${user.nickname!}
<#assign timeago = (.now?long - journal.createTime?long)> <#assign timeago = (.now?long - journal.createTime?long)>
@ -50,12 +50,12 @@
<div class="pagenav"> <div class="pagenav">
<#if pagination.hasPrev> <#if pagination.hasPrev>
<a href="${pagination.prevPageFullPath!}" class="pre"> <a href="${pagination.prevPageFullPath!}" class="pre">
回上页 退回上页
</a> </a>
</#if> </#if>
<#if pagination.hasNext> <#if pagination.hasNext>
<a href="${pagination.nextPageFullPath!}" class="next"> <a href="${pagination.nextPageFullPath!}" class="next">
更多日志 阅览更多
</a> </a>
</#if> </#if>
</div> </div>

View File

@ -1,7 +1,10 @@
<#macro comment post,type> <#macro comment post,type>
<#if !post.disallowComment!false> <#if !post.disallowComment!false>
<div class="comment">
<script src="//cdn.jsdelivr.net/npm/vue@2.6.10/dist/vue.min.js"></script> <script src="//cdn.jsdelivr.net/npm/vue@2.6.10/dist/vue.min.js"></script>
<script src="${options.comment_internal_plugin_js!'//cdn.jsdelivr.net/gh/halo-dev/halo-comment@latest/dist/halo-comment.min.js'}"></script> <script src="${options.comment_internal_plugin_js!'//cdn.jsdelivr.net/gh/halo-dev/halo-comment@latest/dist/halo-comment.min.js'}"></script>
<halo-comment id="${post.id?c}" type="${type}"/> <halo-comment id="${post.id?c}" type="${type}"/>
</div>
</#if> </#if>
</#macro> </#macro>

View File

@ -27,7 +27,7 @@
</head> </head>
<body> <body>
<#-- 菜单 --> <#-- 菜单 -->
<#include "menu.ftl">
<div class="container animate__animated animate__fadeInDown"> <div class="container animate__animated animate__fadeInDown">
@ -38,6 +38,7 @@
<#-- 脚注 --> <#-- 脚注 -->
<footer> <footer>
<#include "menu.ftl">
<div class="copyright"> <div class="copyright">
<a href="https://www.7wate.com">Designed by Zeuk&7Wate,</a> <a href="https://www.7wate.com">Designed by Zeuk&7Wate,</a>
<a href="https://halo.run">Proudly published with Halo</a> <a href="https://halo.run">Proudly published with Halo</a>

View File

@ -50,7 +50,14 @@
${post.formatContent!} ${post.formatContent!}
</div> </div>
</div> </div>
<div class="commentButton">
<a href="${blog_url!}">
退回首页
</a>
<a href="">
留下一言
</a>
</div>
</main> </main>
<#include "module/comment.ftl"> <#include "module/comment.ftl">
<@comment post=post type="post" /> <@comment post=post type="post" />

View File

@ -44,8 +44,15 @@
${sheet.formatContent!} ${sheet.formatContent!}
</div> </div>
</div> </div>
<#include "module/comment.ftl"> <div class="commentButton">
<@comment post=sheet type="sheet" /> <a href="${blog_url!}">
退回首页
</a>
<a href="">
留下一言
</a>
</div>
</main> </main>
<#include "module/comment.ftl">
<@comment post=sheet type="sheet" />
</@layout> </@layout>

View File

@ -178,7 +178,6 @@ main .post > .title {
margin-top: 4rem; margin-top: 4rem;
} }
main .post > .title > h1 > a { main .post > .title > h1 > a {
color: black;
letter-spacing: 0.0625rem; letter-spacing: 0.0625rem;
font-size: 2rem; font-size: 2rem;
line-height: 2rem; line-height: 2rem;
@ -186,18 +185,15 @@ main .post > .title > h1 > a {
main .post > .title > .info { main .post > .title > .info {
padding-bottom: 1rem; padding-bottom: 1rem;
margin-bottom: 1rem; margin-bottom: 1rem;
border-bottom: 1px solid #f3f3f3;
} }
main .post > .title > .info > span { main .post > .title > .info > span {
margin: 0 0.25rem; margin: 0 0.25rem;
font-weight: 400; font-weight: 400;
font-size: 0.75rem; font-size: 0.75rem;
color: rgba(0, 0, 0, 0.65);
} }
main .post > .title > .info > span i { main .post > .title > .info > span i {
position: relative; position: relative;
top: 0.125rem; top: 0.125rem;
color: rgba(0, 0, 0, 0.85);
} }
main .journals > .name { main .journals > .name {
font-size: 1.5rem; font-size: 1.5rem;
@ -215,7 +211,6 @@ main .journals > ul > li > .content {
main .journals > ul > li > .option { main .journals > ul > li > .option {
display: flex; display: flex;
justify-content: flex-end; justify-content: flex-end;
color: rgba(0, 0, 0, 0.65);
font-weight: 400; font-weight: 400;
font-size: 0.75rem; font-size: 0.75rem;
margin: 0 0.5rem; margin: 0 0.5rem;
@ -233,6 +228,26 @@ main .pagenav > a {
margin: 0 2rem; margin: 0 2rem;
} }
.comment {
width: 47rem;
margin: 1rem 0rem;
padding: 1rem 2.5rem;
background: #ffffff;
box-shadow: 0 0.375rem 1rem -0.5rem rgba(0, 0, 0, 0.08);
}
.commentButton {
display: flex;
justify-content: space-around;
margin-top: 2rem;
padding-top: 2rem;
width: 40rem;
border-top: 1px solid #f3f3f3;
}
.commentButton > a {
color: black;
}
footer { footer {
padding: 2rem 0; padding: 2rem 0;
} }

View File

@ -236,7 +236,6 @@ main {
margin-top: 4rem; margin-top: 4rem;
> h1 { > h1 {
> a { > a {
color: rgba(0, 0, 0, 1);
letter-spacing: 0.0625rem; letter-spacing: 0.0625rem;
font-size: 2rem; font-size: 2rem;
line-height: 2rem; line-height: 2rem;
@ -246,17 +245,14 @@ main {
> .info { > .info {
padding-bottom: 1rem; padding-bottom: 1rem;
margin-bottom: 1rem; margin-bottom: 1rem;
border-bottom: 1px solid #f3f3f3;
> span{ > span{
margin: 0 0.25rem; margin: 0 0.25rem;
font-weight: 400; font-weight: 400;
font-size: 0.75rem; font-size: 0.75rem;
color: rgb(0, 0, 0, 0.65);
i { i {
position: relative; position: relative;
top:0.125rem; top:0.125rem;
color: rgb(0, 0, 0, 0.85);
} }
} }
} }
@ -264,6 +260,7 @@ main {
} }
.journals{ .journals{
> .name{ > .name{
font-size: 1.5rem; font-size: 1.5rem;
font-weight: bold; font-weight: bold;
@ -280,7 +277,6 @@ main {
> .option{ > .option{
display: flex; display: flex;
justify-content: flex-end; justify-content: flex-end;
color: rgb(0, 0, 0, 0.65);
font-weight: 400; font-weight: 400;
font-size: 0.75rem; font-size: 0.75rem;
margin: 0 0.5rem; margin: 0 0.5rem;
@ -307,6 +303,25 @@ main {
} }
.comment
{
width: 47rem;
margin: 1rem 0rem;
padding: 1rem 2.5rem;
background: #ffffff;
box-shadow: 0 0.375rem 1rem -0.5rem rgba(0, 0, 0, 0.08);
}
.commentButton{
display: flex;
justify-content: space-around;
margin-top: 2rem;
padding-top: 2rem;
width: 40rem;
border-top: 1px solid #f3f3f3;
>a{
color: rgba(0, 0, 0, 1);
}
}
footer { footer {
padding: 2rem 0; padding: 2rem 0;

View File

@ -15,13 +15,6 @@ html::-webkit-scrollbar-thumb:hover {
background: #0095ff1a; background: #0095ff1a;
} }
body {
display: flex;
flex-wrap: nowrap;
flex-direction: column;
align-items: center;
}
.header > .title > a > span { .header > .title > a > span {
color: black; color: black;
} }
@ -81,6 +74,24 @@ main .pagenav a {
main .pagenav a:hover { main .pagenav a:hover {
color: rgba(0, 0, 0, 0.65); color: rgba(0, 0, 0, 0.65);
} }
main .post > .title > h1 {
color: black;
}
main .post > .title > h1 > a {
color: black;
}
main .post > .title > .info {
border-bottom: 1px solid #f3f3f3;
}
main .post > .title > .info > span {
color: rgba(0, 0, 0, 0.65);
}
main .post > .title > .info > span i {
color: rgba(0, 0, 0, 0.85);
}
main .journals > ul > li > .option {
color: rgba(0, 0, 0, 0.65);
}
footer .copyright a { footer .copyright a {
color: rgba(0, 0, 0, 0.25); color: rgba(0, 0, 0, 0.25);

View File

@ -17,13 +17,13 @@ html::-webkit-scrollbar-thumb:hover {
background: #0095ff1a; background: #0095ff1a;
} }
// Body // // Body
body { // body {
display: flex; // display: flex;
flex-wrap: nowrap; // flex-wrap: nowrap;
flex-direction: column; // flex-direction: column;
align-items: center; // align-items: center;
} // }
// Header 头部 // Header 头部
.header { .header {
@ -120,6 +120,41 @@ main {
} }
} }
} }
// 文章
.post{
> .title{
> h1 {
color: rgba(0, 0, 0, 1);
> a {
color: rgba(0, 0, 0, 1);
}
}
> .info {
border-bottom: 1px solid #f3f3f3;
> span{
color: rgb(0, 0, 0, 0.65);
i {
color: rgb(0, 0, 0, 0.85);
}
}
}
}
}
// 日志
.journals{
> ul{
> li{
> .option{
color: rgb(0, 0, 0, 0.65);
}
}
}
}
} }
// 脚注 // 脚注

View File

@ -20,12 +20,12 @@
<div class="pagenav"> <div class="pagenav">
<#if pagination.hasPrev> <#if pagination.hasPrev>
<a href="${pagination.prevPageFullPath!}" class="pre"> <a href="${pagination.prevPageFullPath!}" class="pre">
回上页 退回上页
</a> </a>
</#if> </#if>
<#if pagination.hasNext> <#if pagination.hasNext>
<a href="${pagination.nextPageFullPath!}" class="next"> <a href="${pagination.nextPageFullPath!}" class="next">
更多文章 阅览更多
</a> </a>
</#if> </#if>
</div> </div>