mirror of
https://gitee.com/ulthon/ulthon_information.git
synced 2026-03-03 16:24:28 +08:00
优化文章样式；
This commit is contained in:
@@ -223,7 +223,7 @@ a.post-item:visited {
|
|||||||
color: #bbb;
|
color: #bbb;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/*
|
||||||
.ul-content p {
|
.ul-content p {
|
||||||
margin: 15px 0;
|
margin: 15px 0;
|
||||||
}
|
}
|
||||||
@@ -235,7 +235,6 @@ a.post-item:visited {
|
|||||||
.ul-content blockquote {
|
.ul-content blockquote {
|
||||||
white-space: pre-wrap;
|
white-space: pre-wrap;
|
||||||
line-height: 1.5;
|
line-height: 1.5;
|
||||||
/* 显示空格 */
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
@@ -243,7 +242,6 @@ a.post-item:visited {
|
|||||||
margin: 20px 0
|
margin: 20px 0
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 表格 */
|
|
||||||
.ul-content table {
|
.ul-content table {
|
||||||
border-collapse: collapse;
|
border-collapse: collapse;
|
||||||
}
|
}
|
||||||
@@ -262,8 +260,6 @@ a.post-item:visited {
|
|||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/* 引用 */
|
|
||||||
.ul-content blockquote {
|
.ul-content blockquote {
|
||||||
display : block;
|
display : block;
|
||||||
border-left : 8px solid #d0e5f2;
|
border-left : 8px solid #d0e5f2;
|
||||||
@@ -272,7 +268,7 @@ a.post-item:visited {
|
|||||||
background-color: #f1f1f1;
|
background-color: #f1f1f1;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 列表 */
|
|
||||||
.ul-content ul,
|
.ul-content ul,
|
||||||
.ul-content ol {
|
.ul-content ol {
|
||||||
margin: 10px 0 10px 20px;
|
margin: 10px 0 10px 20px;
|
||||||
@@ -282,7 +278,6 @@ a.post-item:visited {
|
|||||||
list-style: inherit;
|
list-style: inherit;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 分割线 */
|
|
||||||
.ul-content hr {
|
.ul-content hr {
|
||||||
display : block;
|
display : block;
|
||||||
width : 90%;
|
width : 90%;
|
||||||
@@ -290,12 +285,14 @@ a.post-item:visited {
|
|||||||
border : 0;
|
border : 0;
|
||||||
height : 1px;
|
height : 1px;
|
||||||
background-color: #ccc;
|
background-color: #ccc;
|
||||||
}
|
} */
|
||||||
|
|
||||||
.ul-content img {
|
.ul-content img {
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
}
|
}
|
||||||
|
.copyright{
|
||||||
|
margin-top: 15px;
|
||||||
|
}
|
||||||
.index-poster {
|
.index-poster {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
filter: blur(2px);
|
filter: blur(2px);
|
||||||
|
|||||||
1
public/static/lib/heti/heti-addon.min.js
vendored
Normal file
1
public/static/lib/heti/heti-addon.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
5
public/static/lib/heti/heti.min.css
vendored
Normal file
5
public/static/lib/heti/heti.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
@@ -2,264 +2,270 @@
|
|||||||
<html lang="en">
|
<html lang="en">
|
||||||
|
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<title>{$post.title}|{:get_system_config('site_name')}</title>
|
<title>{$post.title}|{:get_system_config('site_name')}</title>
|
||||||
<meta name="keywords" content="{:get_system_config('site_keywords')}">
|
<meta name="keywords" content="{:get_system_config('site_keywords')}">
|
||||||
<meta name="description" content="{$post.desc|default=$post.title}" />
|
<meta name="description" content="{$post.desc|default=$post.title}" />
|
||||||
{include file='common/_require'/}
|
{include file='common/_require'/}
|
||||||
<link rel="stylesheet" href="/static/lib/prismjs/prism.css">
|
<link rel="stylesheet" href="/static/lib/heti/heti.min.css">
|
||||||
<script src="/static/lib/prismjs/prism.js"></script>
|
<link rel="stylesheet" href="/static/lib/prismjs/prism.css">
|
||||||
<script src="/static/lib/clipboard/clipboard.js"></script>
|
<script src="/static/lib/prismjs/prism.js"></script>
|
||||||
<style>
|
<script src="/static/lib/clipboard/clipboard.js"></script>
|
||||||
|
<script src="/static/lib/heti/heti-addon.min.js"></script>
|
||||||
|
|
||||||
.share {
|
<style>
|
||||||
cursor: pointer;
|
.share {
|
||||||
}
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
.share i {
|
.share i {
|
||||||
font-size: 15px;
|
font-size: 15px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.share-tips-options div:hover {
|
.share-tips-options div:hover {
|
||||||
opacity: 0.8;
|
opacity: 0.8;
|
||||||
}
|
}
|
||||||
|
|
||||||
.share-tips-options div {
|
.share-tips-options div {
|
||||||
|
|
||||||
height: 22px;
|
height: 22px;
|
||||||
line-height: 22px;
|
line-height: 22px;
|
||||||
|
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
border: none;
|
border: none;
|
||||||
border-radius: 2px;
|
border-radius: 2px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
.post-container {
|
.post-container {
|
||||||
margin-top: 15px;
|
margin-top: 15px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.post-item {
|
.post-item {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: flex-start;
|
justify-content: flex-start;
|
||||||
align-items: flex-start;
|
align-items: flex-start;
|
||||||
}
|
}
|
||||||
|
|
||||||
.post-item .left img {
|
.post-item .left img {
|
||||||
width: 60px;
|
width: 60px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.post-item .right {
|
.post-item .right {
|
||||||
margin-left: 15px;
|
margin-left: 15px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.post-item .content {
|
.post-item .content {
|
||||||
margin-top: 5px;
|
margin-top: 5px;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<div class="layui-container main-container">
|
<div class="layui-container main-container">
|
||||||
<div class="layui-row layui-col-space12">
|
<div class="layui-row layui-col-space12">
|
||||||
{include file='common/_left'/}
|
{include file='common/_left'/}
|
||||||
<div class="layui-col-md7">
|
<div class="layui-col-md7">
|
||||||
<div class="main-container">
|
<div class="main-container">
|
||||||
<div class="content-container">
|
<div class="content-container">
|
||||||
<h1 class="title">
|
<h1 class="title">
|
||||||
{$post.title}
|
{$post.title}
|
||||||
</h1>
|
</h1>
|
||||||
<div class="info">
|
<div class="info">
|
||||||
<span>{$post->publish_time_text}</span>
|
<span>{$post->publish_time_text}</span>
|
||||||
<span>{:get_system_config('default_author')}</span>
|
<span>{:get_system_config('default_author')}</span>
|
||||||
<span class="share"><i class="layui-icon layui-icon-share"></i></span>
|
<span class="share"><i class="layui-icon layui-icon-share"></i></span>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<div class="desc">
|
<div class="desc">
|
||||||
{$post.desc_html|raw}
|
{$post.desc_html|raw}
|
||||||
</div>
|
</div>
|
||||||
{if !empty($post.jump_to_url) && $post.jump_to_url_status != 0}
|
{if !empty($post.jump_to_url) && $post.jump_to_url_status != 0}
|
||||||
<div class="jump-container">
|
<div class="jump-container">
|
||||||
<a href="{$post.jump_to_url}" class="layui-btn jump-btn" target="_blank">{$post.jump_to_btn_title|default='立即跳转'}</a>
|
<a href="{$post.jump_to_url}" class="layui-btn jump-btn" target="_blank">{$post.jump_to_btn_title|default='立即跳转'}</a>
|
||||||
</div>
|
</div>
|
||||||
{if $post.jump_to_url_status == 2 }
|
{if $post.jump_to_url_status == 2 }
|
||||||
<script>
|
<script>
|
||||||
window.layuiInitSuccess.push(function () {
|
window.layuiInitSuccess.push(function () {
|
||||||
var isJumped = false;
|
var isJumped = false;
|
||||||
var countDownNum = 5;
|
var countDownNum = 5;
|
||||||
var closeJump = false;
|
var closeJump = false;
|
||||||
var jumpUrl = '{$post.jump_to_url}'
|
var jumpUrl = '{$post.jump_to_url}'
|
||||||
window.layerJump = layer.confirm('即将自动打开新页面(倒计时<span class="jump-count-dowm">5</span>秒)', {
|
window.layerJump = layer.confirm('即将自动打开新页面(倒计时<span class="jump-count-dowm">5</span>秒)', {
|
||||||
btn: ['立即跳转', '取消'],
|
btn: ['立即跳转', '取消'],
|
||||||
offset: ['20%']
|
offset: ['20%']
|
||||||
}
|
}
|
||||||
, function (index, layero) {
|
, function (index, layero) {
|
||||||
//按钮【按钮一】的回调
|
//按钮【按钮一】的回调
|
||||||
window.open(jumpUrl)
|
window.open(jumpUrl)
|
||||||
isJumped = true
|
isJumped = true
|
||||||
layer.close(index)
|
layer.close(index)
|
||||||
}, function (index) {
|
}, function (index) {
|
||||||
//按钮【按钮二】的回调
|
//按钮【按钮二】的回调
|
||||||
closeJump = true
|
closeJump = true
|
||||||
})
|
})
|
||||||
|
|
||||||
|
window.timerJump = setInterval(() => {
|
||||||
|
countDownNum--
|
||||||
|
$('.jump-count-dowm').text(countDownNum)
|
||||||
|
if (countDownNum <= 0) {
|
||||||
|
clearInterval(window.timerJump)
|
||||||
|
layer.close(window.layerJump)
|
||||||
|
if (!closeJump && !isJumped) {
|
||||||
|
window.open(jumpUrl)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}, 1000);
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
{/if}
|
||||||
|
{/if}
|
||||||
|
<div class="">
|
||||||
|
<article class="ul-content entry heti heti--classic">
|
||||||
|
{$post->content_html|raw}
|
||||||
|
</article>
|
||||||
|
</div>
|
||||||
|
<div class="copyright">
|
||||||
|
{:get_system_config('post_copyright')}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="post-container">
|
||||||
|
|
||||||
|
<fieldset class="layui-elem-field layui-field-title">
|
||||||
|
<legend>评论</legend>
|
||||||
|
<div class="layui-field-box">
|
||||||
|
<div class="post-list">
|
||||||
|
{volist name='$post.comments' id='comment'}
|
||||||
|
<div class="post-item" id="comment-{$comment.id}" data-id="{$comment.id}">
|
||||||
|
<div class="left">
|
||||||
|
<img src="{$comment.user.avatar}" alt="">
|
||||||
|
</div>
|
||||||
|
<div class="right">
|
||||||
|
<div>{$comment.user.nickname|default=$comment.user.account}</div>
|
||||||
|
<div class="content">{$comment.content}</div>
|
||||||
|
{if !empty($user_info) && $user_info.uid == $comment.user_uid }
|
||||||
|
<div>
|
||||||
|
<div class="layui-btn layui-btn-xs delete" style="cursor: pointer;">删除</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/if}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{/volist}
|
||||||
|
</div>
|
||||||
|
<div class="post-main">
|
||||||
|
<form action="" class="layui-form">
|
||||||
|
<input type="hidden" name="post_id" value="{$post.id}">
|
||||||
|
<div class="layui-form-item layui-form-text">
|
||||||
|
|
||||||
|
|
||||||
|
<textarea name="content" placeholder="请输入内容" class="layui-textarea" autocomplete="off"></textarea>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="layui-form-item">
|
||||||
|
<button class="layui-btn" type="submit" lay-filter="postComment" lay-submit>发表评论</button>
|
||||||
|
{empty name='Request.session.user_uid'}
|
||||||
|
<a class="layui-word-aux" href="{$login_url|default=''}">点击登录</a>
|
||||||
|
{else /}
|
||||||
|
<a href="{:get_system_config('user_hub_host')}" target="_blank" class="layui-word-aux">{$user_info.nickname|default=$user_info.account}</a>
|
||||||
|
<a href="{:url('index/Logout',['back_url'=>$post.read_url])}" class="layui-word-aux">退出</a>
|
||||||
|
{/empty}
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</fieldset>
|
||||||
|
</div>
|
||||||
|
|
||||||
window.timerJump = setInterval(() => {
|
|
||||||
countDownNum--
|
|
||||||
$('.jump-count-dowm').text(countDownNum)
|
|
||||||
if (countDownNum <= 0) {
|
|
||||||
clearInterval(window.timerJump)
|
|
||||||
layer.close(window.layerJump)
|
|
||||||
if (!closeJump && !isJumped) {
|
|
||||||
window.open(jumpUrl)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}, 1000);
|
|
||||||
})
|
|
||||||
</script>
|
|
||||||
{/if}
|
|
||||||
{/if}
|
|
||||||
<div class="">
|
|
||||||
<div class="ul-content ">
|
|
||||||
{$post->content_html|raw}
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="copyright">
|
{include file='common/_right'/}
|
||||||
{:get_system_config('post_copyright')}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="post-container">
|
|
||||||
|
|
||||||
<fieldset class="layui-elem-field layui-field-title">
|
|
||||||
<legend>评论</legend>
|
|
||||||
<div class="layui-field-box">
|
|
||||||
<div class="post-list">
|
|
||||||
{volist name='$post.comments' id='comment'}
|
|
||||||
<div class="post-item" id="comment-{$comment.id}" data-id="{$comment.id}">
|
|
||||||
<div class="left">
|
|
||||||
<img src="{$comment.user.avatar}" alt="">
|
|
||||||
</div>
|
|
||||||
<div class="right">
|
|
||||||
<div>{$comment.user.nickname|default=$comment.user.account}</div>
|
|
||||||
<div class="content">{$comment.content}</div>
|
|
||||||
{if !empty($user_info) && $user_info.uid == $comment.user_uid }
|
|
||||||
<div>
|
|
||||||
<div class="layui-btn layui-btn-xs delete" style="cursor: pointer;">删除</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/if}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{/volist}
|
|
||||||
</div>
|
|
||||||
<div class="post-main">
|
|
||||||
<form action="" class="layui-form">
|
|
||||||
<input type="hidden" name="post_id" value="{$post.id}">
|
|
||||||
<div class="layui-form-item layui-form-text">
|
|
||||||
|
|
||||||
|
|
||||||
<textarea name="content" placeholder="请输入内容" class="layui-textarea" autocomplete="off"></textarea>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
<div class="layui-form-item">
|
|
||||||
<button class="layui-btn" type="submit" lay-filter="postComment" lay-submit>发表评论</button>
|
|
||||||
{empty name='Request.session.user_uid'}
|
|
||||||
<a class="layui-word-aux" href="{$login_url|default=''}">点击登录</a>
|
|
||||||
{else /}
|
|
||||||
<a href="{:get_system_config('user_hub_host')}" target="_blank" class="layui-word-aux">{$user_info.nickname|default=$user_info.account}</a>
|
|
||||||
<a href="{:url('index/Logout',['back_url'=>$post.read_url])}" class="layui-word-aux">退出</a>
|
|
||||||
{/empty}
|
|
||||||
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</fieldset>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
{include file='common/_right'/}
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="share-tips-options" style="display: none;">
|
||||||
<div class="share-tips-options" style="display: none;">
|
<div class="text" data-clipboard-text="{$post.share_text}">分享文案</div>
|
||||||
<div class="text" data-clipboard-text="{$post.share_text}">分享文案</div>
|
</div>
|
||||||
</div>
|
<script>
|
||||||
<script>
|
const heti = new Heti('.heti');
|
||||||
|
heti.autoSpacing(); // 自动进行中西文混排美化和标点挤压
|
||||||
|
</script>
|
||||||
|
<script>
|
||||||
|
|
||||||
layui.use(['form'], function () {
|
layui.use(['form'], function () {
|
||||||
var form = layui.form
|
var form = layui.form
|
||||||
|
|
||||||
form.on('submit(postComment)', function (data) {
|
form.on('submit(postComment)', function (data) {
|
||||||
$.post('{:url("PostComment/save")->suffix(false)}',
|
$.post('{:url("PostComment/save")->suffix(false)}',
|
||||||
data.field
|
data.field
|
||||||
, function (result) {
|
, function (result) {
|
||||||
if (result.code == 0) {
|
if (result.code == 0) {
|
||||||
layer.msg('发表评论成功')
|
layer.msg('发表评论成功')
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
location.reload()
|
location.reload()
|
||||||
}, 1200);
|
}, 1200);
|
||||||
} else {
|
} else {
|
||||||
layer.msg(result.msg)
|
layer.msg(result.msg)
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
return false;
|
return false;
|
||||||
})
|
})
|
||||||
|
|
||||||
})
|
|
||||||
|
|
||||||
$('.post-item .delete').click(function () {
|
|
||||||
var item = this;
|
|
||||||
|
|
||||||
var parent = $(item).closest('.post-item')
|
|
||||||
|
|
||||||
layer.confirm('确定要删除吗?', function () {
|
|
||||||
$.post('{:url("PostComment/delete")->suffix(false)}', {
|
|
||||||
id: $(parent).data('id')
|
|
||||||
}, function (result) {
|
|
||||||
if (result.code == 0) {
|
|
||||||
layer.msg('删除成功');
|
|
||||||
setTimeout(() => {
|
|
||||||
location.reload()
|
|
||||||
}, 1200);
|
|
||||||
} else {
|
|
||||||
layer.msg(result.msg)
|
|
||||||
}
|
|
||||||
})
|
})
|
||||||
})
|
|
||||||
})
|
|
||||||
|
|
||||||
$('.share').click(function () {
|
$('.post-item .delete').click(function () {
|
||||||
var html = $('.share-tips-options').prop("outerHTML")
|
var item = this;
|
||||||
|
|
||||||
window.layerTips = layer.tips(html, this, {
|
var parent = $(item).closest('.post-item')
|
||||||
tips: 2,
|
|
||||||
time: 0,
|
|
||||||
skin: 'share-tips',
|
|
||||||
success: function (layero) {
|
|
||||||
console.log(layero);
|
|
||||||
$(layero.css('top', $(layero).offset()['top'] - 15))
|
|
||||||
$(layero).find('.share-tips-options').show()
|
|
||||||
|
|
||||||
}
|
layer.confirm('确定要删除吗?', function () {
|
||||||
})
|
$.post('{:url("PostComment/delete")->suffix(false)}', {
|
||||||
})
|
id: $(parent).data('id')
|
||||||
$(document).click(function (e) {
|
}, function (result) {
|
||||||
if ($(e.target).closest('.share').length == 0 && $(e.target).closest('.share-tips').length == 0) {
|
if (result.code == 0) {
|
||||||
layer.close(window.layerTips)
|
layer.msg('删除成功');
|
||||||
}
|
setTimeout(() => {
|
||||||
})
|
location.reload()
|
||||||
var clipboard = new ClipboardJS('.share-tips .share-tips-options .text')
|
}, 1200);
|
||||||
clipboard.on('success', function (e) {
|
} else {
|
||||||
layer.msg('复制成功')
|
layer.msg(result.msg)
|
||||||
});
|
}
|
||||||
</script>
|
})
|
||||||
|
})
|
||||||
|
})
|
||||||
|
|
||||||
|
$('.share').click(function () {
|
||||||
|
var html = $('.share-tips-options').prop("outerHTML")
|
||||||
|
|
||||||
|
window.layerTips = layer.tips(html, this, {
|
||||||
|
tips: 2,
|
||||||
|
time: 0,
|
||||||
|
skin: 'share-tips',
|
||||||
|
success: function (layero) {
|
||||||
|
console.log(layero);
|
||||||
|
$(layero.css('top', $(layero).offset()['top'] - 15))
|
||||||
|
$(layero).find('.share-tips-options').show()
|
||||||
|
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
$(document).click(function (e) {
|
||||||
|
if ($(e.target).closest('.share').length == 0 && $(e.target).closest('.share-tips').length == 0) {
|
||||||
|
layer.close(window.layerTips)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
var clipboard = new ClipboardJS('.share-tips .share-tips-options .text')
|
||||||
|
clipboard.on('success', function (e) {
|
||||||
|
layer.msg('复制成功')
|
||||||
|
});
|
||||||
|
</script>
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
||||||
Reference in New Issue
Block a user