halo-theme-hao/templates/modules/widgets/aside/wechat.html

30 lines
1.3 KiB
HTML

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<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:attr="onclick='javascript:window.open(\''+ ${theme.config.sidebar.wechat.url} +'\')'">
<div id="flip-wrapper">
<div id="flip-content">
<div class="face"
th:style="'background: url('+ @{${#strings.isEmpty(faceImg) ? assets_link + '/images/wechat/wechat1.png' : faceImg }} +') center center / 100% no-repeat;'"></div>
<div class="back face"
th:style="'background: url('+ @{${#strings.isEmpty(backImg) ? assets_link + '/images/wechat/wechat2.png' : backImg }} +') center center / 100% no-repeat;'"></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>
</html>