web-projects/src/components/Footer.astro
WangDL bd570d5fb3 feat: init longde website project
- Astro 静态网站
- 首页、学习产品介绍
- 等待名单表单
- 隐私政策、用户协议、支持、下载、更新日志页面
- SEO 优化 (sitemap, robots, OG)
2026-05-04 15:22:20 +08:00

71 lines
1.4 KiB
Plaintext

---
const currentYear = new Date().getFullYear();
const footerLinks = [
{ href: '/privacy', label: '隐私政策' },
{ href: '/terms', label: '用户协议' },
{ href: '/support', label: '支持与反馈' },
];
---
<footer class="footer">
<div class="footer-content">
<div class="footer-brand">
<span class="copyright">© {currentYear} 龙德AI学习</span>
</div>
<nav class="footer-links">
{footerLinks.map(link => (
<a href={link.href} class="footer-link">{link.label}</a>
))}
</nav>
</div>
</footer>
<style>
.footer {
margin-top: auto;
padding: 2rem var(--page-padding);
border-top: 1px solid var(--color-border);
background: var(--color-bg);
}
.footer-content {
max-width: var(--max-width);
margin: 0 auto;
display: flex;
flex-direction: column;
align-items: center;
gap: 1rem;
text-align: center;
}
.copyright {
font-size: 0.75rem;
color: var(--color-text-secondary);
}
.footer-links {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 1.5rem;
}
.footer-link {
font-size: 0.8125rem;
color: var(--color-text-secondary);
text-decoration: none;
}
.footer-link:hover {
color: var(--color-text);
text-decoration: none;
}
@media (min-width: 640px) {
.footer-content {
flex-direction: row;
justify-content: space-between;
}
}
</style>