feat: first screen description supports line breaks (#97)

This commit is contained in:
XPoet 2022-09-26 22:03:43 +08:00
parent b6e04e9153
commit 29ab3c216e
3 changed files with 11 additions and 7 deletions

View File

@ -28,7 +28,7 @@ style:
# Favicon (You can use local image or image external link) # Favicon (You can use local image or image external link)
favicon: /images/logo.svg favicon: /images/logo.svg
# Article image align position, value: left | center (!!!! --- 需调整) # Article image align position, value: left | center
article_img_align: left article_img_align: left
# Left side width # Left side width
@ -55,6 +55,7 @@ style:
background_img: /images/bg.svg background_img: /images/bg.svg
# First screen description # First screen description
# You can use the || to begin a newline, maximum is two lines.
description: Keep writing and Keep loving. description: Keep writing and Keep loving.
# If you want to customize the first screen font color, you can fill in here (e.g. "#0066CC") # If you want to customize the first screen font color, you can fill in here (e.g. "#0066CC")

View File

@ -1,15 +1,17 @@
<% <%
const { const { description: fs_description, hitokoto: fs_hitokoto } = theme.style.first_screen
description: fs_description,
hitokoto: fs_hitokoto
} = theme.style.first_screen
const { description: c_description } = config const { description: c_description } = config
let final_description = fs_description || c_description || ''
final_description = final_description.split('||').map(desc => desc.trim())
if (final_description.length > 2) { final_description.length = 2 }
%> %>
<div class="first-screen-container flex-center fade-in-down-animation"> <div class="first-screen-container flex-center fade-in-down-animation">
<div class="content flex-center"> <div class="content flex-center">
<% if (fs_description || c_description || fs_hitokoto.enable) { %> <% if (final_description.length || fs_hitokoto.enable) { %>
<div class="description hitokoto"> <div class="description hitokoto">
<%= fs_description || c_description %> <% for (const idx in final_description) { %>
<div><%= final_description[idx] %></div>
<% } %>
</div> </div>
<% } %> <% } %>
<% if (fs_hitokoto.enable) { %> <% if (fs_hitokoto.enable) { %>

View File

@ -31,6 +31,7 @@ $first-screen-font-color = $temp-font-color ? convert($temp-font-color) : var(--
box-sizing: border-box; box-sizing: border-box;
width: 80%; width: 80%;
height: 90%; height: 90%;
padding-top: 5rem;
.description { .description {
font-weight: bold; font-weight: bold;