调整文章格式,首页间距

dev
julylies 4 months ago
parent b7d042b097
commit 457d3269ba
  1. 12
      400.ftl
  2. 2
      500.ftl
  3. 19
      archives.ftl
  4. 2
      category.ftl
  5. 3
      header.ftl
  6. 4
      index.ftl
  7. 2
      links.ftl
  8. 50
      module/links-module.ftl
  9. 28
      module/page-nav.ftl
  10. 32
      module/post-module.ftl
  11. 2
      post.ftl
  12. 24
      source/css/kico.css
  13. 30
      source/css/single.css
  14. 2
      tags.ftl

@ -0,0 +1,12 @@
<#include "header.ftl" />
<@head title="400-${blog_title!}"/>
<main>
<div class="wrap">
<div class="error-page">
<h1>400</h1>
<p>找不到页面啦</p>
<img src="${theme_base!}/source/images/404.png"/>
</div>
</div>
</main>
<#include "footer.ftl">

@ -4,7 +4,7 @@
<div class="wrap">
<div class="error-page">
<h1>500</h1>
<p>找不到页面啦</p>
<p>出错了</p>
<img src="${theme_base!}/source/images/404.png"/>
</div>
</div>

@ -4,7 +4,8 @@
<div class="wrap min">
<section class="home-title">
<h1>归档</h1>
<@categoryTag method="list">
</section>
<#--<@categoryTag method="list">
<#list categories as category>
<span><a href="${category.fullPath!}">${category.name!}(${category.postCount!})</a></span>
</#list>
@ -43,6 +44,22 @@
</#list>
</div>
</@postTag>
</section>-->
<section class="home-posts">
<@postTag method="archive" type="month">
<div class="post-item">
<#list archives as archive>
<h2>${archive.year?c}年-${archive.month?c}月</h2>
<ul>
<#list archive.posts?sort_by("createTime")?reverse as post>
<li>
<a href="${post.fullPath!}">${post.title!}</a>
</li>
</#list>
</ul>
</#list>
</div>
</@postTag>
</section>
</div>
</main>

@ -1,5 +1,5 @@
<#include "header.ftl">
<@head title="分类:${category.name} - ${blog_title!}" />
<h1>分类:${category.name}</h1>
<#include "module/post-list.ftl">
<#include "module/post-module.ftl">
<#include "footer.ftl">

@ -2,7 +2,6 @@
<!DOCTYPE html>
<html lang="zh">
<head>
<#--<meta charset="UTF-8">-->
<title>${title}</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="renderer" content="webkit" />
@ -37,7 +36,7 @@
<link rel="preload stylesheet" as="style" href="${theme_base!}/source/plugins/prism/prism.css">
<link rel="preload stylesheet" as="style" href="${theme_base!}/source/plugins/prism/themes/prism-${settings.Code_highlighting!}.css">
<@global.head />
<#if ! (options.blog_favicon?? && options.blog_favicon!='')>
<#if !(options.blog_favicon?? && options.blog_favicon!='')>
<link rel="shortcut icon" type="images/x-icon" href="${theme_base!}/source/images/icon.png" sizes="192x192"/>
</#if>
<#-- 背景图片-->

@ -1,4 +1,4 @@
<#include "header.ftl" >
<#include "header.ftl">
<@head title="${blog_title!}"/>
<#include "module/post-module.ftl">
<#include "footer.ftl" />
<#include "footer.ftl">

@ -1,4 +1,4 @@
<#include "header.ftl">
<@head title="友情链接 -${blog_title!}" />
<main><#include "module/links-module.ftl"></main>
<#include "module/links-module.ftl">
<#include "footer.ftl">

@ -1,27 +1,27 @@
<div class="wrap min">
<h1>友情链接</h1>
<article>
<div class="links">
<@linkTag method="listTeams">
<#list teams as item>
<#--><@global.comment target=sheet type="sheet" />-->
<h3 class="link-title">
<span class="fake-title">${((item.team!'')?length>0)?string((item.team!''), '小伙伴们')}</span>
</h3>
<ul class="link-items fontSmooth">
<#list item.links?sort_by('priority')?reverse as link>
<li class="link-item">
<a class="link-item-inner effect-apollo" href="${link.url!}" title="${link.name!}" target="_blank">
<img class="lazyload" src="${link.logo!}" >
<#--<img class="lazyload" data-src="${link.logo!}" src="${theme_base!}/source/images/svg/loader/trans.ajax-spinner-preloader.svg" onerror="imgError(this)">-->
<span class="sitename">${link.name!}</span>
<div class="linkdes">${link.description!}</div>
</a>
</li>
<h1>友情链接</h1>
<article>
<div class="links">
<@linkTag method="listTeams">
<#list teams as item>
<#--><@global.comment target=sheet type="sheet" />-->
<h3 class="link-title">
<span class="fake-title">${((item.team!'')?length>0)?string((item.team!''), '小伙伴们')}</span>
</h3>
<ul class="link-items fontSmooth">
<#list item.links?sort_by('priority')?reverse as link>
<li class="link-item">
<a class="link-item-inner effect-apollo" href="${link.url!}" title="${link.name!}" target="_blank">
<img class="lazyload" src="${link.logo!}" >
<#--<img class="lazyload" data-src="${link.logo!}" src="${theme_base!}/source/images/svg/loader/trans.ajax-spinner-preloader.svg" onerror="imgError(this)">-->
<span class="sitename">${link.name!}</span>
<div class="linkdes">${link.description!}</div>
</a>
</li>
</#list>
</ul>
</#list>
</ul>
</#list>
</@linkTag>
</div>
</article>
</div>
</@linkTag>
</div>
</article>

@ -0,0 +1,28 @@
<#macro pagination method='index' slug="" display = "3">
<section class="page-navigator">
<#-- <@paginationTag method="index" slug="${slug!}" page="${posts.number}" total="${posts.totalPages}" display="3">-->
<@paginationTag method="${method!}" slug="${slug!}" page="${posts.number}" total="${posts.totalPages}" display="3">
<#if pagination.hasPrev>
<span class="prev">
<a href="${pagination.prevPageFullPath!}" title="上一页">«</a>
</span>
</#if>
<#list pagination.rainbowPages as number>
<#if number.isCurrent>
<span class="current">
<a href="${number.fullPath!}">${number.page!}</a>
</span>
<#else>
<span>
<a href="${number.fullPath!}">${number.page!}</a>
</span>
</#if>
</#list>
<#if pagination.hasNext>
<span class="next">
<a href="${pagination.nextPageFullPath!}" title="下一页">»</a>
</span>
</#if>
</@paginationTag>
</section>
</#macro>

@ -12,6 +12,21 @@
</div>
</section>
</#if>
<#if is_tag??>
<section class="home-title">
<h1>包含“${tag.name}”标签的文章</h1>
</section>
</#if>
<#if is_category??>
<section class="home-title">
<h1>“${category.name}”分类下的文章</h1>
</section>
</#if>
<#if is_search??>
<section class="home-title">
<h1>包含“${keyword!}”关键字的文章</h1>
</section>
</#if>
<section class="home-posts">
<#list posts.content as post>
<div class="post-item">
@ -45,11 +60,12 @@
</div>
</#list>
</section>
<section class="page-navigator">
<@paginationTag method="index" slug="${slug!}" page="${posts.number}" total="${posts.totalPages}" display="3">
<section class="page-navigator">
<@paginationTag method="index" slug="${slug!}" page="${posts.number}" total="${posts.totalPages}" display="3">
<#-- <@paginationTag method="${method!}" slug="${slug!}" page="${posts.number}" total="${posts.totalPages}" display="3">-->
<#if pagination.hasPrev>
<span class="current">
<a href="${pagination.prevPageFullPath!}" title="上一页"></a>
<span class="prev">
<a href="${pagination.prevPageFullPath!}" title="上一页">«</a>
</span>
</#if>
<#list pagination.rainbowPages as number>
@ -58,17 +74,17 @@
<a href="${number.fullPath!}">${number.page!}</a>
</span>
<#else>
<span class="current">
<span>
<a href="${number.fullPath!}">${number.page!}</a>
</span>
</#if>
</#list>
<#if pagination.hasNext>
<span class="current">
<a href="${pagination.nextPageFullPath!}" title="下一页"></a>
<span class="next">
<a href="${pagination.nextPageFullPath!}" title="下一页">»</a>
</span>
</#if>
</@paginationTag>
</section>
</section>
</div>
</main>

@ -64,7 +64,7 @@
</div>
</section>
</#if>
<@global.comment target=post type="post" />
</div>
</main>
<#include "footer.ftl">

@ -388,8 +388,26 @@ article a{
article > *{ margin-bottom: 1em }
article > *:last-child{ margin-bottom: 0 }
article h1, article h2, article h3{ font-size: 1.2em }
article h4, article h5, article h6{ font-size: 1.1em }
/*article h1, article h2, article h3{ font-size: 1.2em }
/*article h1{
font-size: 1.5em;
}
article h2{
font-size: 1.4em;
}
article h3{
font-size: 1.3em;
}
article h4{
font-size: 1.2em;
}
article h5{
font-size: 1.1em;
}
article h6{
font-size: 1.0em;
}
article h4, article h5, article h6{ font-size: 1.1em }*/
article ul, article ol, article dl{ line-height: 1.8 }
@ -498,7 +516,7 @@ blockquote{
line-height: 1.8;
font-style: oblique;
background: #f5fafd;
padding: 1em 1em 1em 2em;
padding: 1em 1em 1em 1em;
border-left: 5px #3498db solid;
}

@ -17,21 +17,22 @@
:root{
--blue: #6f9fc7;
--light-blue: #9fcff7;
--border: #ddd;
--dark-border: #ccc;
--light-border: #eee;
--light-background: #fff;
--radius: .25em;
--dark-blue: #6e8aad;
--board-back: #fff;
--board-border: #ccc;
}
body{
color: #555;
color: rgb(46, 44, 44);
font-weight: 300;
background: #fafafa;
transition: margin .3s, background .3s;
display: block;
}
body:before{
@ -385,7 +386,7 @@ main img {
/* - 首页大标题 */
.home-title{
text-align: center;
margin-bottom: 3em;
margin-bottom: 1em;
animation: fade-in-bottom .3s both; -webkit-animation: fade-in-bottom .3s both;
}
@ -415,7 +416,7 @@ main img {
/* - 文章简要 */
.post-item{
margin-bottom: 3em;
margin-bottom: 2em;
word-break: break-all;
width:100%;
height:100%;
@ -503,7 +504,8 @@ main img {
margin-bottom: 1em;
padding-bottom: 1em;
transition: border 0.3s;
border-bottom: 1px solid #ddd;
/*border-bottom: 1px solid #ddd;*/
border-bottom: 1px solid #6e8aad;
border-color: var(--border);
animation: fade-in-bottom .3s both; -webkit-animation: fade-in-bottom .3s both;
}
@ -531,11 +533,16 @@ article img{
.post-content, .page-content{ animation: fade-in-top .3s .2s backwards; -webkit-animation: fade-in-top .3s .2s backwards; }
.post-content, .page-content, .post-near, .post-tags, .post-author{ margin-bottom: 3em }
article h1, article h2, article h3{
margin-top: 3rem;
article h1, article h2, article h3,article h4,article h5,article h6{
margin-top: 0rem;
scroll-margin-top: 5em;
margin-bottom: 0em;
}
article p{
margin-bottom: 0.6em;
}
article h1{ font-size: 1.2em }
article h2{ font-size: 1.15em }
article h3{ font-size: 1.10em }
article h4{ font-size: 1.05em }
@ -544,7 +551,10 @@ article h6{ font-size: .9em }
article h1:before,
article h2:before,
article h3:before{
article h3:before,
article h4:before,
article h5:before,
article h6:before{
content: "#";
color: #6f9fc7;
color: var(--blue);

@ -29,7 +29,7 @@
<div class="tags-list">
<#if tags?? && tags?size gt 0>
<#list tags as tag>
<a href="${tag.fullPath!}" title="${tag.postCount!}个话题"> ${tag.name}(${tag.postCount!})</a>
<a href="${tag.fullPath!}" title="${tag.postCount!}篇文章"> ${tag.name}(${tag.postCount!})</a>
</#list>
</#if>
</@tagTag>

Loading…
Cancel
Save