优化右侧公众号

This commit is contained in:
1152958806@qq.com 2023-10-09 00:24:32 +08:00
parent 7df176b4c5
commit e013b959d7
3 changed files with 32 additions and 3 deletions

View File

@ -646,13 +646,26 @@ spec:
value: value:
wechatImgFace: wechatImgFace:
wechatImgBack: wechatImgBack:
color: "#07C160"
wechatImg: "/themes/theme-hao/assets/images/gzh_cover.png"
url: "/wechat"
children: children:
- $formkit: color
name: color
label: 背景颜色
value: "#07C160"
- $formkit: attachment
name: wechatImg
label: 背景图
- $formkit: url
name: url
label: 链接
- $formkit: attachment - $formkit: attachment
name: wechatImgFace name: wechatImgFace
placeholder: 公众号正面图 label: 公众号正面图
- $formkit: attachment - $formkit: attachment
name: wechatImgBack name: wechatImgBack
placeholder: 公众号背面图 label: 公众号背面图
help: 图片可以从公众号后台下载物料或者自制 help: 图片可以从公众号后台下载物料或者自制
- $formkit: group - $formkit: group
name: power name: power

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.6 KiB

View File

@ -1,7 +1,8 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org"> <html lang="en" xmlns:th="http://www.thymeleaf.org">
<div class="card-widget heo-right-widget" id="card-wechat" th:fragment="wechat" <div class="card-widget heo-right-widget" id="card-wechat" th:fragment="wechat"
th:with="faceImg = ${theme.config.sidebar.wechat.wechatImgFace}, backImg=${theme.config.sidebar.wechat.wechatImgBack}"> th:with="faceImg = ${theme.config.sidebar.wechat.wechatImgFace}, backImg=${theme.config.sidebar.wechat.wechatImgBack}"
th:attr="onclick='javascript:window.open(\''+ ${theme.config.sidebar.wechat.url} +'\')'">
<div id="flip-wrapper"> <div id="flip-wrapper">
<div id="flip-content"> <div id="flip-content">
<div class="face" <div class="face"
@ -10,5 +11,20 @@ th:with="faceImg = ${theme.config.sidebar.wechat.wechatImgFace}, backImg=${theme
th:style="'background: url('+ @{${#strings.isEmpty(backImg) ? assets_link + '/images/wechat/wechat2.png' : backImg }} +') center center / 100% no-repeat;'"></div> th:style="'background: url('+ @{${#strings.isEmpty(backImg) ? assets_link + '/images/wechat/wechat2.png' : backImg }} +') center center / 100% no-repeat;'"></div>
</div> </div>
</div> </div>
<style>
#aside-content .card-widget#card-wechat {
background: [(${theme.config.sidebar.wechat.color})];
}
#aside-content .card-widget#card-wechat::before {
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
background: url([[${theme.config.sidebar.wechat.wechatImg}]]) center center no-repeat;
content: '';
}
</style>
</div> </div>
</html> </html>