Files
tamakyi ea9ba3e8fc 首页: 修复功能卡下方各卡片之间缺少间距
tb-grid 之后的三张独立卡片(域名迁移/一点提醒/近期更新)彼此相邻
却没有垂直间距,挤成一整块。用 .tb-grid ~ .uk-card 统一加 16px 上边距。
2026-10-30 17:56:21 +08:00

272 lines
10 KiB
HTML
Raw Permalink Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
{{template "base/header" .}}
<style>
/* 首页:hero + 功能卡 + 统计条。仅首页使用的排版,颜色全部走令牌,亮暗自动适配。
正文文案沿用本站既有的中文(首页一直是中文直写,不随语言切换)。 */
.tb-hero {
padding: 36px 24px 32px;
text-align: center;
background-image: linear-gradient(180deg, var(--tb-primary-weak), rgba(255, 255, 255, 0));
}
.tb-hero-title {
margin: 0;
font-size: var(--tb-fs-hero);
line-height: 1.35;
font-weight: 600;
color: var(--tb-text);
}
.tb-hero-lead {
margin: 12px auto 0;
max-width: 30rem;
font-size: var(--tb-fs-lg);
line-height: 1.8;
color: var(--tb-text-muted);
}
.tb-hero-actions {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 10px;
margin-top: 22px;
}
.tb-hero-actions .uk-button {
min-width: 112px;
}
.tb-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
gap: 12px;
margin-top: 12px;
}
/* 功能卡下方的独立卡片(域名迁移 / 一点提醒 / 近期更新)之间保持间距,
否则它们会挤成一整块,阅读分不清边界。 */
.tb-grid ~ .uk-card {
margin-top: 16px;
}
.tb-grid .uk-card {
padding: 18px 18px 20px;
text-align: left;
}
.tb-card-title {
margin: 0 0 6px;
font-size: var(--tb-fs-lg);
font-weight: 600;
color: var(--tb-text);
}
.tb-card-text {
margin: 0;
font-size: var(--tb-fs-md);
line-height: 1.7;
color: var(--tb-text-muted);
}
.tb-card-text + .tb-card-text {
margin-top: 8px;
}
.tb-card-text.tb-lead {
margin-top: 12px;
}
.tb-changelog summary + ul {
margin-top: 10px;
}
.tb-section-title {
margin: 0 0 10px;
font-size: var(--tb-fs-lg);
font-weight: 600;
color: var(--tb-text);
}
.tb-notice-tag {
display: inline-block;
margin: 0 0 8px;
padding: 2px 8px;
border-radius: var(--tb-radius-xs);
background: var(--tb-primary-weak);
color: var(--tb-primary);
font-size: var(--tb-fs-xs);
}
.tb-list {
margin: 0;
padding-left: 1.15em;
font-size: var(--tb-fs-md);
line-height: 1.9;
color: var(--tb-text);
}
.tb-changelog summary {
cursor: pointer;
font-size: var(--tb-fs-md);
font-weight: 600;
color: var(--tb-text);
list-style: none;
}
.tb-changelog summary::-webkit-details-marker { display: none; }
.tb-changelog summary::before {
content: "▸";
display: inline-block;
margin-right: 8px;
color: var(--tb-text-muted);
transition: transform 0.2s ease;
}
.tb-changelog[open] summary::before { transform: rotate(90deg); }
@media (max-width: 480px) {
.tb-hero { padding: 28px 16px 24px; }
.tb-hero-title { font-size: var(--tb-fs-xl); }
}
</style>
<div class="uk-card uk-card-default tb-hero">
<h1 class="tb-hero-title">{{t .LangCode "site.title"}}</h1>
<p class="tb-hero-lead">
一个无需注册即可提问的匿名提问箱。不用下载 App,不用绑定社交账号,连邮箱都不必是真的。
</p>
<div class="tb-hero-actions">
<a href="/explore" class="uk-button uk-button-primary">{{t .LangCode "nav.explore"}}</a>
<a href="/rules" class="uk-button uk-button-default">{{t .LangCode "site.footer.rules"}}</a>
</div>
</div>
<div class="tb-grid">
<div class="uk-card uk-card-default">
<p class="tb-card-title">匿名也能问</p>
<p class="tb-card-text">不需要账号、不需要真实邮箱,打开就能写。想收到回复再留邮箱即可。</p>
</div>
<div class="uk-card uk-card-default">
<p class="tb-card-title">不止一问一答</p>
<p class="tb-card-text">问题二维码、私聊、投票、追加提问、Markdown 排版,原版没有的这里都有。</p>
</div>
<div class="uk-card uk-card-default">
<p class="tb-card-title">箱子归你</p>
<p class="tb-card-text">头像、背景、二维码配色都能自己调,还能设置审核严格度和收集时段。</p>
</div>
</div>
<div class="uk-card uk-card-default uk-card-body">
<p class="tb-notice-tag">域名迁移</p>
<p class="tb-card-text">
本站已切换到 <a href="https://box.shiroko.one/">box.shiroko.one</a>,原域名将在 2026 年 12 月 24 日到期,
期间通过 301 转发指向新域名,到期后旧域名将彻底不再使用。
</p>
<p class="tb-card-text">
审核服务已切换到阿里云,审核速度提升且误伤更少;同时允许用户调整审核严格度,在不碰底线的前提下
可以设置不接受辱骂、广告等信息(即「不听坏话模式」)。
</p>
</div>
<div class="uk-card uk-card-default uk-card-body">
<h2 class="tb-section-title">一点提醒</h2>
<ul class="tb-list">
<li>本站唯一指定认证站长:<a href="https://box.shiroko.one/_/tamakyi">小狼</a>,注意不要被骗。</li>
<li>本站提倡友好、友善的发言,请遵守<a href="/rules">社区规则</a>。无论匿名与否,都要为自己的发言负责。</li>
<li>不允许垃圾信息、广告、辱骂、涉政、暴恐、色情、违禁、无意义、灌水提问,涉政或不良言论将直接删除。</li>
</ul>
<p class="tb-card-text tb-lead">
想先试试功能,可以到站长的提问箱
<a href="//box.shiroko.one/_/tamakyi">小狼的提问箱</a> 提问或提意见。
</p>
</div>
<details class="uk-card uk-card-default uk-card-body tb-changelog">
<summary>近期更新</summary>
<ul class="tb-list">
<li><strong>2026.10</strong> 优化前端显示,增加主题编辑器功能,预置3套主题,并添加了问题页面“进入下一条未读提问”的功能,优化可用性,详情见<a href="https://blog.shiroko.one/record/tamabox-update-20261022。">这里</li>
<li><strong>2026.9</strong> 新增审核严格度选项,增加提问、投票、私聊的总开关,可设置定时收集、定量收集或关闭功能,前后端显示也更易用了。</li>
<li><strong>2026.8</strong> 新增<a href="https://box.shiroko.one/vote/sANyLkiBNUGN">投票功能</a>、追加提问、多语言、<a href="https://box.shiroko.one/_/tamakyi/2894">Markdown 显示</a>、置顶显示等,详情见<a href="https://blog.shiroko.one/record/tamabox_changelog_20260813">这里</a>。</li>
<li><strong>2026.8</strong> 放弃使用 recaptcha 等对国内用户不友好的验证方式,更新密码加密方式,修复图片上传等一系列问题。</li>
<li><strong>2026.5</strong> 增加私聊功能,可连续对话,详见<a href="https://blog.shiroko.one/record/tamabox-update-20260513">介绍</a>;另有提问箱卡片分享。</li>
<li><strong>2026.2</strong> 新增用户展示和标签功能,可给自己贴 5 个标签并选择是否在<a href="https://box.shiroko.one/explore">探索页</a>展示,详情见<a href="https://blog.shiroko.one/record/tamabox-tags">狼的公告板</a>。</li>
</ul>
</details>
<!-- 评论区资源只在本页加载(此前挂在 header 里,等于每页都下载 ~200KB 的 waline.js) -->
<link rel="stylesheet" href="https://r2.337845818.best/tamabox/cdn/waline/client/v2/waline-no-commits.css" media="print" onload="this.media='all'"/>
<script defer src="https://cdnjs.snrat.com/ajax/libs/waline/2.15.8/waline.js"></script>
<div id="waline"></div>
<script>
document.addEventListener('DOMContentLoaded', function () {
const waline = Waline.init({
el: '#waline',
//后端服务器地址
serverURL: 'https://waline.337845818.best/',
path: window.location.href,
// 中文默认
locale: {
nick: '昵称',
nickError: '昵称不能少于3个字符',
mail: '邮箱',
mailError: '请填写正确的邮件地址',
link: '网址',
optional: '可选',
placeholder: '欢迎评论(可以无需登录,但需要手工审核,不会立即展现)',
sofa: '来发评论吧~',
submit: '提交',
like: '喜欢',
cancelLike: '取消喜欢',
reply: '回复',
cancelReply: '取消回复',
comment: '评论',
refresh: '刷新',
more: '加载更多...',
preview: '预览',
emoji: '表情',
uploadImage: '上传图片',
seconds: '秒前',
minutes: '分钟前',
hours: '小时前',
days: '天前',
now: '刚刚',
uploading: '正在上传',
login: '登录',
logout: '退出',
admin: '博主',
sticky: '置顶',
word: '字',
wordHint: '评论字数应在 $0 到 $1 字之间!\n当前字数:$2',
anonymous: '无名小狼',
level0: '潜水',
level1: '冒泡',
level2: '吐槽',
level3: '活跃',
level4: '话痨',
level5: '传说',
gif: '表情包',
gifSearchPlaceholder: '搜索表情包',
profile: '个人资料',
approved: '通过',
waiting: '待审核',
spam: '垃圾',
unsticky: '取消置顶',
oldest: '按倒序',
latest: '按正序',
hottest: '按热度',
reactionTitle: '',
reaction0: '哇哦',
reaction1: 'prpr',
reaction2: '流汗',
reaction3: '生气',
reaction4: '流鼻血',
reaction5: 'あべ',
},
reaction: [
'https://ali-imgs.acfun.cn/kimg/bs2/zt-image-host/ChYwOGQ3OTRhYzRjMTBkZmZhZDVmZTA1EIjM1y8.gif',
'https://ali-imgs.acfun.cn/kimg/bs2/zt-image-host/ChQwOGEyOTlhYzRjMTBmOWFkZjAwYRCIzNcv.gif',
'https://ali-imgs.acfun.cn/kimg/bs2/zt-image-host/ChYwOGRhOTVhYzRjMTBkNmViYTVlNTA2EIjM1y8.gif',
'https://ali-imgs.acfun.cn/kimg/bs2/zt-image-host/ChYwOGU1OTJhYzRjMTBmMzk3ZmVmNTAyEIjM1y8.gif',
'https://ali-imgs.acfun.cn/kimg/bs2/zt-image-host/ChYwOGNkODdhYzRjMTBjYmEwOTFjNjAxEIjM1y8.gif',
'https://ali-imgs.acfun.cn/kimg/bs2/zt-image-host/ChQwODliOGVhYzRjMTBmOGM0ZWY1ZRCIzNcv.gif',
],
meta: ['nick','mail'],
requiredMeta: ['mail'],
pageview: true,
search: false,
login: 'enable',
wordLimit: 50,
pageSize: 5,
avatar: 'identicon',
emoji: [
'https://gcore.jsdelivr.net/gh/tamakyi/emoji-collection@main/acfun-color/60x60',
],
//禁止图片上传按钮
imageUploader: false,
//不显示版权标志
copyright: false,
});
});
</script>
{{template "base/footer" .}}