diff --git a/.gitignore b/.gitignore index ea071c3..c5b692a 100644 --- a/.gitignore +++ b/.gitignore @@ -26,4 +26,5 @@ dist-ssr .gradle build -templates \ No newline at end of file +templates +.workbuddy/ diff --git a/README.md b/README.md index a9a8836..d91b4db 100644 --- a/README.md +++ b/README.md @@ -40,7 +40,6 @@ | 模板名 | 模板文件 | 说明 | | ---- | --------------------- | --------------------- | -| 关于 | `page_about.html` | 关于页,头像 / 简介 / 社交链接可配置 | | 留言板 | `page_guestbook.html` | 以评论区作为留言板的单页 | | 微信读书 | `weread.html` | 微信读书书架展示,依赖微信读书插件 | | 豆瓣页面 | `douban.html` | 豆瓣记录页,依赖豆瓣插件 | @@ -129,7 +128,7 @@ pnpm check │ ├── error/ # 404 与通用错误页 │ ├── css/main.css # 全部样式(双主题变量、响应式、正文排版) │ ├── js/ # main.ts 全站脚本 / post.ts 文章脚本 / lightbox.ts 灯箱 -│ ├── index.html post.html page.html page_about.html +│ ├── index.html post.html page.html │ ├── archives.html category.html tag.html categories.html tags.html author.html │ ├── moments.html moment.html photos.html important-dates.html │ ├── weread.html douban.html links.html links-subscribe.html page_guestbook.html diff --git a/i18n/default.properties b/i18n/default.properties index a520758..d7645f7 100644 --- a/i18n/default.properties +++ b/i18n/default.properties @@ -30,9 +30,6 @@ error.404.message=Sorry, the page you visited does not exist or has been deleted error.back.home=Back to home error.back.prev=Go back footer.theme=Theme by {0} -about.social.github=GitHub -about.social.twitter=Twitter -about.social.email=Email post.words={0} words post.reading_time=About {0} min archive.stats.words=Total words @@ -47,7 +44,5 @@ stats.comments={0} comments stats.visits={0} visits stats.words={0} words douban.plugin_required=Douban plugin (plugin-douban) not detected. Please install and enable it, then set your Douban ID in the plugin settings. -photos.photo_count={0} photos -photos.back=Back to all albums moment.back_to_list=Back to moments moment.tags=Tags diff --git a/i18n/zh_CN.properties b/i18n/zh_CN.properties index f919cdd..23f0f7b 100644 --- a/i18n/zh_CN.properties +++ b/i18n/zh_CN.properties @@ -30,9 +30,6 @@ error.404.message=抱歉,您访问的页面不存在或已被删除。 error.back.home=返回首页 error.back.prev=返回上页 footer.theme=Theme by {0} -about.social.github=GitHub -about.social.twitter=Twitter -about.social.email=邮箱 post.words={0} 字 post.reading_time=约 {0} 分钟 archive.stats.words=总字数 @@ -47,7 +44,5 @@ stats.comments={0} 条评论 stats.visits={0} 次访问 stats.words={0} 字 douban.plugin_required=未检测到豆瓣插件(plugin-douban),请安装并启用后在插件设置中填写豆瓣 ID。 -photos.photo_count={0} 张照片 -photos.back=返回全部相册 moment.back_to_list=返回瞬间列表 moment.tags=标签 diff --git a/settings.yaml b/settings.yaml index 9e94ca1..7ef127f 100644 --- a/settings.yaml +++ b/settings.yaml @@ -60,34 +60,6 @@ spec: label: 首页展示置顶文章 value: true help: 在首页顶部以大标题样式展示最新的一篇置顶文章(需在文章设置中开启置顶) - - group: about - label: 关于页面 - formSchema: - - $formkit: attachment - name: avatar - label: 博主头像 - value: "" - help: 关于页面展示的头像,留空则使用站点 Logo - - $formkit: textarea - name: bio - label: 个人简介 - value: "一个热爱生活、热爱技术的普通人" - help: 关于页面头像下方显示的简介 - - $formkit: text - name: github_url - label: GitHub 链接 - value: "" - placeholder: https://github.com/yourname - - $formkit: text - name: twitter_url - label: Twitter 链接 - value: "" - placeholder: https://x.com/yourname - - $formkit: text - name: contact_email - label: 联系邮箱 - value: "" - placeholder: mail@example.com - group: seo label: SEO formSchema: @@ -158,34 +130,3 @@ spec: name: show_words label: 全站总字数(需 extra-api 插件) value: true - - group: photos - label: 图库 - formSchema: - - $formkit: checkbox - name: preview_default - label: 相册默认开启预览模式 - value: true - help: 进入相册瀑布流时默认开启点击放大预览,访客可在前台自行切换 - - $formkit: repeater - name: album_covers - label: 相册封面 - value: [] - help: 为相册手动指定封面;不配置时自动使用相册内第一张图片。「相册」直接从图库插件已存在的分组中选择 - children: - - $formkit: select - name: group - label: 相册 - validation: required - clearable: true - searchable: true - action: /apis/console.api.photo.halo.run/v1alpha1/photogroups - requestOption: - method: GET - itemsField: "" - labelField: spec.displayName - valueField: metadata.name - help: 选项自动取自图库插件中已创建的相册分组(需安装并启用图库插件) - - $formkit: attachment - name: cover - label: 封面图 - validation: required diff --git a/src/douban.html b/src/douban.html index 18385de..24a9734 100644 --- a/src/douban.html +++ b/src/douban.html @@ -79,8 +79,9 @@ >

+
-

名称

+

名称

年份 评分

@@ -119,8 +121,10 @@
+ +
-

名称

+

名称

年份 评分

@@ -159,8 +164,10 @@
+ +
-

名称

+

名称

年份 评分

@@ -199,8 +207,10 @@
+ +
-

名称

+

名称

年份 评分

diff --git a/src/links.html b/src/links.html index 9344c9b..c3560eb 100644 --- a/src/links.html +++ b/src/links.html @@ -31,37 +31,61 @@ .links-list a { display: flex; align-items: flex-start; - gap: 0.75rem; - padding: 1rem; + gap: 0.8rem; + padding: 1.1rem 1.25rem; width: 100%; box-sizing: border-box; border: 1px solid var(--color-border); - border-radius: var(--radius-md); + border-radius: var(--radius-lg, 0.75rem); background: var(--color-bg-secondary); color: var(--color-text); - transition: border-color var(--transition-fast); + transition: + border-color var(--transition-fast), + box-shadow var(--transition-fast); } .links-list a:hover { border-color: var(--color-primary); + box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06); } - .links-list img { - width: 2.5rem; - height: 2.5rem; - border-radius: var(--radius-sm); - object-fit: cover; + .links-avatar { + position: relative; + display: block; flex-shrink: 0; } + .links-avatar img { + display: block; + width: 2.75rem; + height: 2.75rem; + border-radius: var(--radius-md); + object-fit: cover; + background: var(--color-bg); + } + /* 头像右下角状态圆点 */ + .links-avatar::after { + content: ""; + position: absolute; + right: -0.1rem; + bottom: -0.1rem; + width: 0.55rem; + height: 0.55rem; + border-radius: 50%; + background: #2ea043; + border: 2px solid var(--color-bg-secondary); + } .links-list .links-body { display: flex; flex-direction: column; min-width: 0; + padding-top: 0.1rem; } .links-list .links-name { font-weight: 600; + line-height: 1.4; } .links-list .links-desc { - margin: 0.25rem 0 0; + margin: 0.3rem 0 0; font-size: 0.85rem; + line-height: 1.55; color: var(--color-text-secondary); display: -webkit-box; -webkit-line-clamp: 2; @@ -77,18 +101,79 @@ .links-section:first-of-type .links-group-title { margin-top: 0; } + /* 申请友链按钮 */ .links-apply { - margin-top: 2rem; + margin-top: 2.5rem; text-align: center; } - .link-apply-panel { - max-width: 32rem; - margin: 1.25rem auto 0; - text-align: left; + .btn-apply { + display: inline-block; + padding: 0.6rem 1.75rem; + border: 1px solid var(--color-primary); + border-radius: var(--radius-full); + background: var(--color-primary); + color: #fff; + font: inherit; + font-size: 0.95rem; + cursor: pointer; + transition: + opacity var(--transition-fast), + transform var(--transition-fast); + } + .btn-apply:hover { + opacity: 0.88; + } + .btn-apply:active { + transform: scale(0.97); + } + + /* 申请弹窗(运行时移至 body 下,避免被父级 stacking context 遮挡) */ + .link-apply-modal[hidden] { + display: none; + } + .link-apply-backdrop { + position: fixed; + inset: 0; + background: rgba(0, 0, 0, 0.45); + z-index: 1000; + } + .link-apply-dialog { + position: fixed; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + width: min(26rem, calc(100vw - 2rem)); + max-height: min(85vh, 44rem); + overflow-y: auto; + background: var(--color-bg); + border: 1px solid var(--color-border); + border-radius: var(--radius-lg, 0.75rem); + box-shadow: 0 12px 40px rgba(0, 0, 0, 0.18); + padding: 1.5rem; + z-index: 1001; + } + .link-apply-close { + position: absolute; + top: 0.75rem; + right: 0.75rem; + width: 2rem; + height: 2rem; + border: none; + border-radius: 50%; + background: transparent; + color: var(--color-text-muted); + font-size: 1.4rem; + line-height: 1; + cursor: pointer; + } + .link-apply-close:hover { + color: var(--color-text); + background: var(--color-bg-secondary); } .link-apply-title { - margin: 0 0 0.75rem; + margin: 0 0 1rem; font-size: 1.125rem; + padding-right: 2rem; } .apply-form .form-row { margin-bottom: 1rem; @@ -174,12 +259,14 @@ target="_blank" rel="noopener noreferrer" > - + + + 链接名称 - + + + 链接名称 - + + + 链接名称 - + + + +
-
@@ -326,12 +437,35 @@ var API = "/apis/api.link.halo.run/v1alpha1/link-applications"; var CAPTCHA = "/apis/api.link.halo.run/v1alpha1/link-applications/captcha"; var toggle = document.getElementById("link-apply-toggle"); - var panel = document.getElementById("link-apply-panel"); + var modal = document.getElementById("link-apply-modal"); var form = document.getElementById("link-apply-form"); var img = document.getElementById("captcha-img"); var status = document.getElementById("apply-status"); var challengeId = null; + // 弹窗移至 body 下,避免被页面父级 stacking context 遮挡 + document.body.appendChild(modal); + + function openModal() { + modal.hidden = false; + document.body.style.overflow = "hidden"; + if (!challengeId) loadCaptcha(); + } + function closeModal() { + modal.hidden = true; + document.body.style.overflow = ""; + } + + toggle.addEventListener("click", openModal); + + modal.addEventListener("click", function (e) { + if (e.target.closest("[data-close]")) closeModal(); + }); + + document.addEventListener("keydown", function (e) { + if (e.key === "Escape" && !modal.hidden) closeModal(); + }); + function loadCaptcha() { fetch(CAPTCHA, { method: "POST" }) .then(function (r) { @@ -348,13 +482,6 @@ }); } - toggle.addEventListener("click", function () { - panel.hidden = !panel.hidden; - if (!panel.hidden && !challengeId) { - loadCaptcha(); - } - }); - img.addEventListener("click", loadCaptcha); form.addEventListener("submit", function (e) { @@ -394,6 +521,7 @@ loadCaptcha(); status.className = "apply-status ok"; status.textContent = "申请已提交,等待管理员审核。"; + setTimeout(closeModal, 1500); } else { return r.json().then(function (err) { throw err; diff --git a/src/moment.html b/src/moment.html index 66c672e..d43c904 100644 --- a/src/moment.html +++ b/src/moment.html @@ -37,19 +37,10 @@ border-radius: 50%; object-fit: cover; } - .moment-owner-info { - display: flex; - flex-direction: column; - line-height: 1.3; - } .moment-owner-name { color: var(--color-text); font-weight: 600; } - .moment-owner-bio { - font-size: 0.8rem; - color: var(--color-text-muted); - } .moment-meta { display: inline-flex; align-items: center; @@ -69,17 +60,35 @@ .moment-tags a { color: var(--color-link); } - .moment-media img, + .moment-media { + display: grid; + grid-template-columns: repeat(3, minmax(0, 1fr)); + gap: 0.3rem; + margin-top: 0.75rem; + } + .moment-media img { + display: block; + width: 100%; + aspect-ratio: 1 / 1; + object-fit: cover; + border-radius: var(--radius-sm); + background: var(--color-bg-secondary); + } + .moment-media img:only-child { + aspect-ratio: auto; + width: auto; + max-width: min(100%, 22rem); + max-height: 26rem; + } .moment-media video { + grid-column: 1 / -1; display: block; max-width: 100%; - height: auto; - margin-top: 1rem; border-radius: var(--radius-md); } .moment-media audio { + grid-column: 1 / -1; width: 100%; - margin-top: 1rem; } .comments-section { margin-top: 2rem; @@ -104,18 +113,9 @@ th:alt="${moment.owner.displayName}" loading="lazy" /> - - 用户名 - - + 用户名
diff --git a/src/tags.html b/src/tags.html index 891351d..101731d 100644 --- a/src/tags.html +++ b/src/tags.html @@ -1,6 +1,34 @@