Compare commits

...
2 Commits
Author SHA1 Message Date
wangairnan 5a78de6aa6 feat(web): 后台主题切换与移动端溢出菜单,设置保存按钮上移 topbar
- 后台 topbar 右侧常驻主题切换按钮(复用博客端三态循环逻辑),
  tooltip 新增 tip-below 朝下变体适配近视口顶部的 topbar
- <768px 侧栏隐藏时主题/返回博客/退出登录收进「···」溢出菜单;
  博客 <640px 首页/标签收进 header 溢出菜单(带 active 高亮)
- 新增通用 MoreMenu 组件:点击外部/Escape/选中项自动关闭,
  面板用 --popover 令牌 + 0.15s 淡入,与现有卡片风格一致
- 站点设置保存按钮移至 topbar 标题右侧,删除底部 sticky 保存条
- 修复两处回归:tip-below 气泡居中锚定越界产生页面横向滚动条
  (改右对齐);pn-site-menu-btn 基础 display 规则源码顺序在
  640px MQ 之后导致移动端菜单按钮不显示(前移至博客 header 区)
- 已用 Playwright 在 1440×900 / 390×844 实测后台四页与博客
  菜单展开/跳转均无溢出
2026-09-09 00:12:21 +08:00
wangairnan 646a49a26e feat(web): 页脚品牌与备案信息、首页文案精简及导航/侧栏交互优化
- 页脚「纯文本驱动」改为 Powered by Pure Note(链至仓库地址),新增
  公安备案展示:国徽图标 + 备案号链至 beian.mps.gov.cn,备案号可在
  后台设置(站点描述下一项)配置,留空不显示
- settings 白名单新增 beian_no 键(trim、≤200 字符、可清空),/api/site
  一并下发;TestSettingsWhitelist 补生效/清空/超长用例
- 去除首页 hero 文案区(PURE NOTE · 极简笔记/记录,而不打扰。等),
  同步清理失效样式并微调顶部留白
- 博客 header 首页/标签菜单补 House/Tags 图标,与管理按钮同风格
- 管理侧栏「返回博客/退出登录」浓缩为图标按钮置于用户行右侧,CSS
  悬浮 tooltip(top-center、带箭头,原生 title 延迟高不采用),返回
  博客改新窗口打开
2026-09-08 23:40:57 +08:00
9 changed files with 415 additions and 105 deletions
+13 -1
View File
@@ -396,6 +396,7 @@ type settingsDTO struct {
SiteTitle *string `json:"site_title"`
SiteDesc *string `json:"site_desc"`
PageSize *int `json:"page_size"`
BeianNo *string `json:"beian_no"`
}
// handleAdminSettingsGet GET /api/admin/settings:白名单三键;永不序列化 admin_password_hash。
@@ -414,7 +415,7 @@ func (s *Server) handleAdminSettingsPut(w http.ResponseWriter, r *http.Request)
dec.DisallowUnknownFields()
var dto settingsDTO
if err := dec.Decode(&dto); err != nil {
writeError(w, http.StatusBadRequest, "bad_request", "包含未知字段或类型不合法(白名单:site_title/site_desc/page_size)")
writeError(w, http.StatusBadRequest, "bad_request", "包含未知字段或类型不合法(白名单:site_title/site_desc/page_size/beian_no)")
return
}
if dto.SiteTitle != nil {
@@ -448,6 +449,17 @@ func (s *Server) handleAdminSettingsPut(w http.ResponseWriter, r *http.Request)
return
}
}
if dto.BeianNo != nil {
v := strings.TrimSpace(*dto.BeianNo)
if len([]rune(v)) > 200 {
writeError(w, http.StatusBadRequest, "bad_request", "备案号 ≤200 字符")
return
}
if err := s.st.SetSetting(store.KeyBeianNo, v); err != nil {
writeError(w, http.StatusInternalServerError, "internal", "内部错误")
return
}
}
// admin_password_hash 不可经此接口写入(§9.3):不在白名单结构体中,天然拒绝。
s.log.Info("admin_action", "op", "settings.update")
ss, err := s.st.GetSiteSettings()
+22 -1
View File
@@ -284,10 +284,31 @@ func TestSettingsWhitelist(t *testing.T) {
}
// PUT 合法键
resp, _ = e.do(admin, http.MethodPut, "/api/admin/settings",
[]byte(`{"site_title":"新标题","site_desc":"描述","page_size":5}`), e.adminHeaders())
[]byte(`{"site_title":"新标题","site_desc":"描述","page_size":5,"beian_no":"京公网安备12345678901号"}`), e.adminHeaders())
if resp.StatusCode != 200 {
t.Errorf("合法 PUT 应 200: %d", resp.StatusCode)
}
// beian_no 经 /api/site 可读且生效
_, body = e.get(e.client(), "/api/site")
if !strings.Contains(string(body), `"beian_no":"京公网安备12345678901号"`) {
t.Errorf("beian_no 设置应生效: %s", body)
}
// beian_no 可清空(空串 = 不展示)
resp, _ = e.do(admin, http.MethodPut, "/api/admin/settings",
[]byte(`{"beian_no":""}`), e.adminHeaders())
if resp.StatusCode != 200 {
t.Errorf("beian_no 清空应 200: %d", resp.StatusCode)
}
_, body = e.get(e.client(), "/api/site")
if !strings.Contains(string(body), `"beian_no":""`) {
t.Errorf("beian_no 应可清空: %s", body)
}
// beian_no 过长拒绝
resp, _ = e.do(admin, http.MethodPut, "/api/admin/settings",
[]byte(`{"beian_no":"`+strings.Repeat("备", 201)+`"}`), e.adminHeaders())
if resp.StatusCode != http.StatusBadRequest {
t.Errorf("beian_no 超长应 400: %d", resp.StatusCode)
}
// page_size 生效为公开列表默认
_, body = e.get(e.client(), "/api/notes")
if !strings.Contains(string(body), `"page_size":5`) {
+10 -2
View File
@@ -13,6 +13,7 @@ const (
KeySiteTitle = "site_title"
KeySiteDesc = "site_desc"
KeyPageSize = "page_size"
KeyBeianNo = "beian_no"
)
// GetSetting 读取单个设置。
@@ -37,6 +38,7 @@ type SiteSettings struct {
SiteTitle string `json:"site_title"`
SiteDesc string `json:"site_desc"`
PageSize int `json:"page_size"`
BeianNo string `json:"beian_no"`
}
// Defaults,未初始化时兜底。
@@ -44,11 +46,12 @@ const (
DefaultSiteTitle = "Pure Note"
DefaultSiteDesc = ""
DefaultPageSize = 10
DefaultBeianNo = ""
)
// GetSiteSettings 读取站点设置(白名单三键,带默认值)。
// GetSiteSettings 读取站点设置(白名单键,带默认值)。
func (s *Store) GetSiteSettings() (*SiteSettings, error) {
ss := &SiteSettings{SiteTitle: DefaultSiteTitle, SiteDesc: DefaultSiteDesc, PageSize: DefaultPageSize}
ss := &SiteSettings{SiteTitle: DefaultSiteTitle, SiteDesc: DefaultSiteDesc, PageSize: DefaultPageSize, BeianNo: DefaultBeianNo}
if v, ok, err := s.GetSetting(KeySiteTitle); err != nil {
return nil, err
} else if ok && v != "" {
@@ -67,5 +70,10 @@ func (s *Store) GetSiteSettings() (*SiteSettings, error) {
ss.PageSize = n
}
}
if v, ok, err := s.GetSetting(KeyBeianNo); err != nil {
return nil, err
} else if ok {
ss.BeianNo = strings.TrimSpace(v)
}
return ss, nil
}
Binary file not shown.

After

Width:  |  Height:  |  Size: 19 KiB

+134 -18
View File
@@ -1,20 +1,72 @@
import { useEffect, useRef, useState } from 'react'
import { Link, NavLink, Outlet, useLocation, useNavigate } from 'react-router'
import { Moon, Sun, Monitor, ExternalLink, House, PenLine, Trash2, Settings, LogOut } from 'lucide-react'
import {
Moon, Sun, Monitor, ExternalLink, House, PenLine, MoreHorizontal, Tags, Trash2, Settings, LogOut,
} from 'lucide-react'
import { useSiteTitle } from '../features/site'
import { useTheme } from '../lib/theme'
import { useAuth } from '../lib/auth'
/* ── 溢出菜单:触发按钮 + 下拉面板(点击外部 / Esc / 选中项关闭) ── */
function MoreMenu({ triggerClassName, triggerLabel, children }: {
triggerClassName: string
triggerLabel: string
children: React.ReactNode
}) {
const [open, setOpen] = useState(false)
const ref = useRef<HTMLDivElement>(null)
useEffect(() => {
if (!open) return
const onPointer = (e: PointerEvent) => {
if (ref.current && !ref.current.contains(e.target as Node)) setOpen(false)
}
const onKey = (e: KeyboardEvent) => {
if (e.key === 'Escape') setOpen(false)
}
document.addEventListener('pointerdown', onPointer)
document.addEventListener('keydown', onKey)
return () => {
document.removeEventListener('pointerdown', onPointer)
document.removeEventListener('keydown', onKey)
}
}, [open])
return (
<div className="pn-moremenu" ref={ref}>
<button
type="button"
className={triggerClassName}
aria-haspopup="menu"
aria-expanded={open}
aria-label={triggerLabel}
onClick={() => setOpen((v) => !v)}
>
<MoreHorizontal size={15} />
</button>
{open && (
<div className="pn-moremenu-panel" role="menu" onClick={() => setOpen(false)}>
{children}
</div>
)}
</div>
)
}
/* ── 博客端:居中单栏 720px 布局(博客系列设计稿) ─────────── */
function ThemeButton() {
function ThemeButton({ className = 'pn-site-navlink', tip = 'native' }: {
className?: string
tip?: 'native' | 'css'
}) {
const { mode, setMode } = useTheme()
const next = mode === 'light' ? 'dark' : mode === 'dark' ? 'system' : 'light'
const title = `主题:${mode === 'light' ? '浅色' : mode === 'dark' ? '深色' : '跟随系统'}(点击切换)`
return (
<button
type="button"
className="pn-site-navlink"
title={title}
className={className}
title={tip === 'native' ? title : undefined}
data-tip={tip === 'css' ? title : undefined}
aria-label={title}
onClick={() => setMode(next)}
>
@@ -32,12 +84,25 @@ export function BlogLayout() {
<div className="pn-site-header-inner">
<Link to="/" className="pn-site-wordmark">{title}</Link>
<nav className="pn-site-nav" aria-label="站点导航">
<NavLink to="/" end className="pn-site-navlink hide-sm">首页</NavLink>
<NavLink to="/tags" className="pn-site-navlink hide-sm">标签</NavLink>
<NavLink to="/" end className="pn-site-navlink hide-sm">
<House size={14} />首页
</NavLink>
<NavLink to="/tags" className="pn-site-navlink hide-sm">
<Tags size={14} />标签
</NavLink>
<NavLink to="/admin" className="pn-site-navlink">
<ExternalLink size={14} />管理
</NavLink>
<ThemeButton />
{/* <640px 首页/标签收进溢出菜单 */}
<MoreMenu triggerClassName="pn-site-navlink pn-site-menu-btn" triggerLabel="更多导航">
<NavLink to="/" end className={({ isActive }) => `pn-moremenu-item${isActive ? ' active' : ''}`}>
<House size={15} />首页
</NavLink>
<NavLink to="/tags" className={({ isActive }) => `pn-moremenu-item${isActive ? ' active' : ''}`}>
<Tags size={15} />标签
</NavLink>
</MoreMenu>
</nav>
</div>
</header>
@@ -46,7 +111,22 @@ export function BlogLayout() {
</main>
<footer className="pn-site-footer">
<div className="pn-site-footer-inner">
© {new Date().getFullYear()} {title} · 纯文本驱动 · <a href="/feed.xml">RSS</a>
<p className="pn-site-footer-line">
© {new Date().getFullYear()} {title} · Powered by{' '}
<a href="https://git.airnan.cn/wangairnan/pure-note" target="_blank" rel="noreferrer">Pure Note</a>
{' '}· <a href="/feed.xml">RSS</a>
</p>
{data?.beian_no && (
<a
className="pn-site-beian"
href="https://beian.mps.gov.cn/"
target="_blank"
rel="noreferrer"
>
<img src="/national_emblem.png" alt="" aria-hidden />
{data.beian_no}
</a>
)}
</div>
</footer>
</div>
@@ -56,10 +136,35 @@ export function BlogLayout() {
/* ── 管理端:sidebar + topbar + 移动端 tabbar(dashboard 设计稿) ── */
export function AdminTopbar({ title, children }: { title: string; children?: React.ReactNode }) {
const { logout } = useAuth()
const navigate = useNavigate()
const { mode, setMode } = useTheme()
const next = mode === 'light' ? 'dark' : mode === 'dark' ? 'system' : 'light'
const modeLabel = mode === 'light' ? '浅色' : mode === 'dark' ? '深色' : '跟随系统'
return (
<header className="pn-admin-topbar">
<h1>{title}</h1>
{children && <div className="pn-admin-actions">{children}</div>}
<div className="pn-admin-actions">
{children}
<ThemeButton className="pn-admin-iconbtn tip-below pn-admin-desktop-act" tip="css" />
{/* <768px 侧栏隐藏、topbar 空间有限:主题/返回博客/退出登录收进溢出菜单 */}
<MoreMenu triggerClassName="pn-admin-iconbtn pn-admin-mobile-act" triggerLabel="更多操作">
<button type="button" className="pn-moremenu-item" onClick={() => setMode(next)}>
{mode === 'light' ? <Sun size={15} /> : mode === 'dark' ? <Moon size={15} /> : <Monitor size={15} />}
主题:{modeLabel}
</button>
<a href="/" target="_blank" rel="noreferrer" className="pn-moremenu-item">
<ExternalLink size={15} />返回博客
</a>
<button
type="button"
className="pn-moremenu-item"
onClick={() => void logout().then(() => navigate('/'))}
>
<LogOut size={15} />退出登录
</button>
</MoreMenu>
</div>
</header>
)
}
@@ -108,22 +213,33 @@ function AdminSidebar() {
</nav>
<div className="pn-admin-foot">
<Link to="/" className="pn-admin-item">
<ExternalLink size={15} /><span>返回博客</span>
</Link>
<button
type="button"
className="pn-admin-item"
onClick={() => void logout().then(() => navigate('/'))}
>
<LogOut size={15} /><span>退出登录</span>
</button>
<div className="pn-admin-user">
<span className="pn-admin-avatar">管</span>
<span className="pn-admin-user-meta">
<span className="pn-admin-user-name">管理员</span>
<span className="pn-admin-user-role">站点所有者</span>
</span>
<span className="pn-admin-user-actions">
<a
href="/"
target="_blank"
rel="noreferrer"
className="pn-admin-iconbtn"
data-tip="返回博客"
aria-label="返回博客(新窗口打开)"
>
<ExternalLink size={15} />
</a>
<button
type="button"
className="pn-admin-iconbtn"
data-tip="退出登录"
aria-label="退出登录"
onClick={() => void logout().then(() => navigate('/'))}
>
<LogOut size={15} />
</button>
</span>
</div>
</div>
</aside>
+210 -62
View File
@@ -489,6 +489,11 @@ button:focus-visible {
width: 14px;
height: 14px;
}
/* 博客端溢出菜单触发按钮:<640px 显示(基础规则须在 640px MQ 之前,
否则同特异性下源码顺序靠后者覆盖 MQ 内的 display:inline-flex) */
.pn-site-menu-btn {
display: none;
}
.pn-site-main {
flex: 1;
width: 100%;
@@ -517,6 +522,24 @@ button:focus-visible {
.pn-site-footer-inner a:hover {
color: var(--foreground);
}
.pn-site-footer-line {
margin: 0;
}
.pn-site-beian {
display: inline-flex;
align-items: center;
gap: 6px;
margin-top: 8px;
}
.pn-site-beian img {
width: 14px;
height: 14px;
flex: none;
opacity: 0.85;
}
.pn-site-beian:hover img {
opacity: 1;
}
@media (max-width: 640px) {
.pn-site-header-inner {
@@ -529,41 +552,18 @@ button:focus-visible {
.pn-site-navlink.hide-sm {
display: none;
}
.pn-site-menu-btn {
display: inline-flex;
}
}
/* ============================================================
首页(博客首页.html)
============================================================ */
.pn-home-content {
padding-top: 64px;
padding-top: 56px;
padding-bottom: 24px;
}
.pn-home-hero {
margin-bottom: 48px;
}
.pn-home-eyebrow {
margin: 0 0 18px;
font-family: var(--font-mono);
font-size: 12px;
letter-spacing: 0.14em;
color: var(--muted-foreground);
}
.pn-home-title {
margin: 0 0 18px;
font-family: var(--font-serif);
font-weight: 400;
font-size: clamp(34px, 6vw, 46px);
line-height: 1.18;
letter-spacing: var(--tracking-tight);
color: var(--foreground);
}
.pn-home-desc {
margin: 0;
max-width: 560px;
font-size: 15px;
line-height: 1.8;
color: var(--muted-foreground);
}
.pn-home-filter {
margin-bottom: 8px;
}
@@ -728,10 +728,7 @@ button:focus-visible {
}
@media (max-width: 640px) {
.pn-home-content {
padding-top: 44px;
}
.pn-home-hero {
margin-bottom: 40px;
padding-top: 40px;
}
.pn-home-post {
padding: 26px 0;
@@ -1597,6 +1594,171 @@ button:focus-visible {
gap: 10px;
padding: 8px 10px 2px;
}
.pn-admin-user-actions {
display: inline-flex;
align-items: center;
gap: 4px;
margin-left: auto;
}
.pn-admin-iconbtn {
position: relative;
display: inline-flex;
align-items: center;
justify-content: center;
width: 28px;
height: 28px;
padding: 0;
border: 0;
border-radius: var(--radius-sm);
background: transparent;
color: var(--muted-foreground);
text-decoration: none;
cursor: pointer;
transition: background-color 0.15s ease, color 0.15s ease;
}
.pn-admin-iconbtn:hover {
background: var(--sidebar-accent);
color: var(--sidebar-accent-foreground);
}
.pn-admin-iconbtn svg {
width: 15px;
height: 15px;
}
/* CSS 悬浮 tooltip(原生 title 延迟高且部分环境不显示) */
.pn-admin-iconbtn::after {
content: attr(data-tip);
position: absolute;
left: 50%;
bottom: calc(100% + 10px);
z-index: 30;
padding: 4px 8px;
border-radius: var(--radius-sm);
background: var(--primary);
color: var(--primary-foreground);
font-size: 11px;
font-weight: 500;
line-height: 1.4;
white-space: nowrap;
opacity: 0;
pointer-events: none;
transform: translate(-50%, 2px);
transition: opacity 0.15s ease, transform 0.15s ease;
}
.pn-admin-iconbtn::before {
content: "";
position: absolute;
left: 50%;
bottom: 100%;
z-index: 30;
margin-left: -5px;
border: 5px solid transparent;
border-top-color: var(--primary);
opacity: 0;
pointer-events: none;
transition: opacity 0.15s ease;
}
.pn-admin-iconbtn:hover::after,
.pn-admin-iconbtn:focus-visible::after {
opacity: 1;
transform: translate(-50%, 0);
}
.pn-admin-iconbtn:hover::before,
.pn-admin-iconbtn:focus-visible::before {
opacity: 1;
}
/* tooltip 朝下变体(topbar 贴近视口顶部,气泡须向下弹出)。
气泡右对齐按钮:居中锚定会越过 topbar 右缘产生页面横向滚动条 */
.pn-admin-iconbtn.tip-below::after {
bottom: auto;
top: calc(100% + 10px);
left: auto;
right: 0;
transform: translate(0, -2px);
}
.pn-admin-iconbtn.tip-below::before {
bottom: auto;
top: 100%;
border-top-color: transparent;
border-bottom-color: var(--primary);
}
.pn-admin-iconbtn.tip-below:hover::after,
.pn-admin-iconbtn.tip-below:focus-visible::after {
transform: translate(0, 0);
}
/* 侧栏隐藏时的移动端兜底按钮(<768px 显示) */
.pn-admin-mobile-act {
display: none;
}
/* 溢出菜单:面板与菜单项(博客 header / 后台 topbar 共用) */
.pn-moremenu {
position: relative;
}
.pn-moremenu-panel {
position: absolute;
top: calc(100% + 8px);
right: 0;
z-index: 60;
min-width: 150px;
display: flex;
flex-direction: column;
gap: 2px;
padding: 6px;
border: 1px solid var(--border);
border-radius: var(--radius-md);
background: var(--popover);
box-shadow: var(--shadow-sm);
animation: pn-moremenu-in 0.15s ease;
}
@keyframes pn-moremenu-in {
from {
opacity: 0;
transform: translateY(-4px);
}
to {
opacity: 1;
transform: none;
}
}
.pn-moremenu-item {
display: flex;
align-items: center;
gap: 10px;
padding: 8px 10px;
border: 0;
border-radius: var(--radius-sm);
background: transparent;
color: var(--foreground);
font-size: 13px;
font-weight: 500;
line-height: 1.4;
text-align: left;
text-decoration: none;
white-space: nowrap;
cursor: pointer;
transition: background-color 0.15s ease;
}
.pn-moremenu-item:hover,
.pn-moremenu-item.active {
background: var(--muted);
color: var(--foreground);
}
.pn-moremenu-item.active {
font-weight: 600;
}
.pn-moremenu-item svg {
width: 15px;
height: 15px;
flex: none;
color: var(--muted-foreground);
}
.pn-moremenu-item.active svg {
color: var(--foreground);
}
/* 无 data-tip 的图标按钮不渲染空 tooltip 气泡(如菜单触发按钮) */
.pn-admin-iconbtn:not([data-tip])::after,
.pn-admin-iconbtn:not([data-tip])::before {
display: none;
}
.pn-admin-avatar {
width: 28px;
height: 28px;
@@ -1738,6 +1900,23 @@ button:focus-visible {
}
.pn-admin-topbar h1 {
font-size: 16px;
min-width: 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.pn-admin-actions {
gap: 6px;
}
.pn-admin-actions .btn {
padding-left: 10px;
padding-right: 10px;
}
.pn-admin-mobile-act {
display: inline-flex;
}
.pn-admin-desktop-act {
display: none;
}
.pn-admin-search {
display: none;
@@ -2527,41 +2706,10 @@ textarea.pn-as-input {
padding-top: 16px;
border-top: 1px solid var(--border);
}
.pn-as-save-bar {
position: sticky;
bottom: 20px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 16px;
padding: 12px 16px;
background: var(--card);
border: 1px solid var(--border);
border-radius: var(--radius-md);
box-shadow: var(--shadow-sm);
}
.pn-as-save-hint {
font-size: 12.5px;
color: var(--muted-foreground);
}
.pn-as-save-bar .btn {
min-height: 36px;
padding: 0 16px;
font-size: 13.5px;
flex: none;
}
.pn-as-save-bar .btn svg {
width: 15px;
height: 15px;
}
@media (max-width: 767px) {
.pn-as-card {
padding: 20px;
}
.pn-as-save-bar {
bottom: 88px;
flex-wrap: wrap;
}
}
/* ============================================================
+1
View File
@@ -87,6 +87,7 @@ export interface SiteSettings {
site_title: string
site_desc: string
page_size: number
beian_no: string
}
export interface NoteItem {
+25 -15
View File
@@ -18,6 +18,7 @@ export default function AdminSettings() {
const [title, setTitle] = useState('')
const [desc, setDesc] = useState('')
const [beian, setBeian] = useState('')
const [pageSize, setPageSize] = useState(10)
const [toast, setToast] = useState<{ msg: string; kind: 'success' | 'error' } | null>(null)
@@ -25,6 +26,7 @@ export default function AdminSettings() {
if (data) {
setTitle(data.site_title)
setDesc(data.site_desc)
setBeian(data.beian_no)
setPageSize(data.page_size)
}
}, [data])
@@ -33,7 +35,7 @@ export default function AdminSettings() {
mutationFn: () =>
api('/api/admin/settings', {
method: 'PUT',
body: JSON.stringify({ site_title: title, site_desc: desc, page_size: pageSize }),
body: JSON.stringify({ site_title: title, site_desc: desc, beian_no: beian, page_size: pageSize }),
}),
onSuccess: () => {
setToast({ msg: '设置已保存', kind: 'success' })
@@ -45,7 +47,17 @@ export default function AdminSettings() {
return (
<>
<AdminTopbar title="站点设置" />
<AdminTopbar title="站点设置">
<button
type="button"
className="btn primary"
disabled={saveSettings.isPending}
onClick={() => saveSettings.mutate()}
>
<Save size={15} />
{saveSettings.isPending ? '保存中…' : '保存更改'}
</button>
</AdminTopbar>
<div className="pn-admin-content pn-as-content">
<section className="card pn-as-card">
@@ -74,6 +86,17 @@ export default function AdminSettings() {
onChange={(e) => setDesc(e.target.value)}
/>
</div>
<div className="pn-as-field">
<label className="pn-as-label" htmlFor="beian-no">公安备案号</label>
<input
id="beian-no"
className="pn-as-input"
placeholder="如:京公网安备11000000000000号"
value={beian}
onChange={(e) => setBeian(e.target.value)}
/>
<p className="pn-as-hint">显示在博客页脚并链接至公安部备案官网;留空则不显示。</p>
</div>
<div className="pn-as-field">
<label className="pn-as-label" htmlFor="page-size">首页每页条数(1–100)</label>
<input
@@ -91,19 +114,6 @@ export default function AdminSettings() {
</section>
<ChangePassword onToast={setToast} />
<div className="pn-as-save-bar">
<span className="pn-as-save-hint">更改将在保存后应用到公开站点</span>
<button
type="button"
className="btn primary"
disabled={saveSettings.isPending}
onClick={() => saveSettings.mutate()}
>
<Save size={15} />
{saveSettings.isPending ? '保存中…' : '保存更改'}
</button>
</div>
</div>
<Toast message={toast?.msg ?? null} kind={toast?.kind} onDone={() => setToast(null)} />
-6
View File
@@ -61,12 +61,6 @@ export default function Home() {
return (
<div className="pn-home-content">
<section className="pn-home-hero">
<p className="pn-home-eyebrow">PURE NOTE · 极简笔记</p>
<h1 className="pn-home-title">记录,而不打扰。</h1>
<p className="pn-home-desc">Pure Note 是一个纯文本驱动的极简笔记工具,这里是公开的笔记。</p>
</section>
{topTags.length > 0 && (
<nav className="tabs pn-home-filter" aria-label="按标签筛选笔记">
<Link to="/" className={page === 1 ? 'active' : undefined}>全部</Link>