Expose filing details in a cleaner footer layout

Constraint: Homepage footer must show the public ICP filing number and MIIT lookup entry while staying compact.
Rejected: Separate备案说明行 | made the footer visually heavier and less balanced
Confidence: high
Scope-risk: narrow
Directive: Keep future compliance text public-only; do not commit备案后台 credentials or personal filing materials.
Tested: npm run build
Not-tested: Live browser visual review after deployment
This commit is contained in:
SepComet 2026-05-27 13:46:48 +08:00
parent afa01ce2af
commit 72734bed80
2 changed files with 43 additions and 5 deletions

View File

@ -5,15 +5,21 @@ import { site } from '../config';
<footer class="footer"> <footer class="footer">
<div class="container"> <div class="container">
<div class="footer-card"> <div class="footer-card">
<div> <div class="footer-brand">
<p class="eyebrow">Built for public sharing</p>
<p class="footer-meta"> <p class="footer-meta">
<span>© {new Date().getFullYear()} {site.name}</span> <span>© {new Date().getFullYear()} {site.name}</span>
<span>·</span>
<span>Astro static site</span>
</p> </p>
</div> </div>
<a
class="footer-beian__link"
href="https://beian.miit.gov.cn"
target="_blank"
rel="noreferrer"
>
湘ICP备2026017510号-1
</a>
<div class="inline-links"> <div class="inline-links">
<a class="section-link" href="/logs">查看开发日志</a> <a class="section-link" href="/logs">查看开发日志</a>
<a class="section-link" href="/projects">浏览项目</a> <a class="section-link" href="/projects">浏览项目</a>

View File

@ -955,7 +955,7 @@ main {
.footer-card { .footer-card {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: nowrap;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
gap: 1rem; gap: 1rem;
@ -970,6 +970,32 @@ main {
color: var(--muted); color: var(--muted);
} }
.footer-brand {
display: flex;
align-items: center;
gap: 0.75rem;
min-width: 0;
}
.footer-meta {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 0.45rem;
}
.footer-beian__link {
color: var(--muted-strong);
flex-shrink: 0;
font-size: 0.95rem;
text-decoration: none;
white-space: nowrap;
}
.footer-beian__link:hover {
color: var(--text);
}
@media (max-width: 1024px) { @media (max-width: 1024px) {
.hero-grid, .hero-grid,
.stack-grid, .stack-grid,
@ -1050,6 +1076,12 @@ main {
flex-direction: column; flex-direction: column;
} }
.footer-brand {
align-items: flex-start;
flex-direction: column;
gap: 0.25rem;
}
.hero-title { .hero-title {
font-size: 2.6rem; font-size: 2.6rem;
} }