109 lines
3.1 KiB
HTML
109 lines
3.1 KiB
HTML
{{template "base/header" .}}
|
|
<style>
|
|
.sponsor {
|
|
position: relative;
|
|
}
|
|
|
|
.sponsor > .popup {
|
|
width: 280px;
|
|
background: #eee;
|
|
color: #fff;
|
|
box-shadow: 0 0 5px 0 #ccc;
|
|
border-radius: 5px;
|
|
line-height: 0;
|
|
}
|
|
|
|
.sponsor > .alipay {
|
|
background: #00a2ea;
|
|
}
|
|
|
|
.sponsor > .popup > .head {
|
|
text-align: center;
|
|
padding-top: 30px;
|
|
}
|
|
|
|
.sponsor .qrcode {
|
|
text-align: center;
|
|
}
|
|
|
|
.sponsor .qrcode img {
|
|
margin: 30px auto;
|
|
width: 80%;
|
|
}
|
|
|
|
.sponsor ul.platform {
|
|
padding: 0 !important;
|
|
margin: 0 !important;
|
|
text-align: center;
|
|
background: #FFF;
|
|
border-bottom-left-radius: 5px;
|
|
border-bottom-right-radius: 5px;
|
|
}
|
|
|
|
.sponsor ul.platform li {
|
|
display: inline-block;
|
|
cursor: pointer;
|
|
margin: 5px;
|
|
filter: grayscale(100%);
|
|
}
|
|
|
|
.sponsor ul.platform li.active {
|
|
font-weight: 600;
|
|
filter: grayscale(0%);
|
|
}
|
|
|
|
.sponsor ul.platform li.icon-alipay {
|
|
background: url(https://cdn.github.red/wp-content/plugins/you-shang/image/alipay.svg) no-repeat center center;
|
|
width: 24px;
|
|
height: 24px;
|
|
background-size: cover;
|
|
}
|
|
</style>
|
|
<div class="uk-card uk-card-default uk-card-body">
|
|
<div class="uk-child-width-expand@s" uk-grid>
|
|
<div>
|
|
<h2>给 NekoBox 打钱</h2>
|
|
<p>NekoBox 创立于 2020 年疫情初期，一开始是我疫情在家花了三天时间随手写得一个匿名留言箱。</p>
|
|
<p>目前 NekoBox 的服务器、CDN 开销还是我一个人承担，如果你也想为我分担一些，欢迎给 NekoBox 打钱！👏🏻</p>
|
|
</div>
|
|
<div>
|
|
<div class="sponsor">
|
|
<div class="alipay popup" style="">
|
|
<div class="head">谢谢老板 Thanks♪(･ω･)ﾉ</div>
|
|
<div class="qrcode">
|
|
<div class="qrcode-li alipay"><img
|
|
src="https://cdn.github.red/wp-content/uploads/2021/02/alipay_qrcode.jpg">
|
|
<noscript><img src="https://cdn.github.red/wp-content/uploads/2021/02/alipay_qrcode.jpg"/></noscript>
|
|
</div>
|
|
</div>
|
|
<ul class="platform">
|
|
<li class="icon-alipay active" data-bg-color="#00a2ea" data-thanks="谢谢老板 Thanks♪(･ω･)ﾉ"></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div uk-alert class="uk-text-small">感谢以下小伙伴对 NekoBox 的支持！</div>
|
|
<table class="uk-table uk-table-small uk-table-divider">
|
|
<thead>
|
|
<tr>
|
|
<th>日期</th>
|
|
<th>附言</th>
|
|
<th>金额</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody x-data="{ s: '' }" x-init="
|
|
s = await (async () => {
|
|
let html = '';
|
|
let items = (await(await fetch('https://pb.app.apicon.cn/api/collections/nekobox_sponsors/records?perPage=500&sort=-date')).json()).items;
|
|
items.forEach(item => {
|
|
html += `<tr class=uk-text-meta><td>${item.date.slice(0,10)}</td><td>${item.desc}</td><td>¥ ${item.price.toFixed(2)}</td></tr>`;
|
|
})
|
|
return html;
|
|
})()
|
|
" x-html="s">
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
{{template "base/footer" .}}
|