mirror of
https://github.com/afoim/fuwari.git
synced 2026-01-31 09:03:18 +08:00
feat: 添加公告组件并移除未使用的依赖
- 新增 NoticeConfig 类型和公告组件 Announcement.astro,支持可配置的公告显示 - 移除未使用的 assets 集合和 React 相关依赖,简化项目结构 - 更新依赖项从 dependencies 移动到 devDependencies,优化包管理 - 移除赞助页面的加密货币相关代码,清理界面 - 调整搜索组件样式,改善视觉一致性
This commit is contained in:
@@ -183,9 +183,9 @@ top-20 left-4 md:left-[unset] right-4 shadow-2xl rounded-2xl p-2">
|
||||
<div class="transition text-90 inline-flex font-bold group-hover:text-[var(--primary)]">
|
||||
{item.meta.title}<Icon icon="fa6-solid:chevron-right" class="transition text-[0.75rem] translate-x-1 my-auto text-[var(--primary)]"></Icon>
|
||||
</div>
|
||||
<div class="transition text-xs text-white mb-1 font-mono">
|
||||
{item.urlPath}
|
||||
</div>
|
||||
<div class="transition text-xs text-black/50 dark:text-white/50 mb-1 font-mono">
|
||||
{item.urlPath}
|
||||
</div>
|
||||
<div class="transition text-sm text-50">
|
||||
{@html item.excerpt}
|
||||
</div>
|
||||
|
||||
45
src/components/widget/Announcement.astro
Normal file
45
src/components/widget/Announcement.astro
Normal file
@@ -0,0 +1,45 @@
|
||||
---
|
||||
import { Icon } from "astro-icon/components";
|
||||
import { noticeConfig } from "@/config";
|
||||
|
||||
const { enable, level, content } = noticeConfig;
|
||||
|
||||
const iconMap = {
|
||||
info: "material-symbols:info-outline-rounded",
|
||||
note: "material-symbols:info-outline-rounded", // Admonition note uses circle info (like info)
|
||||
tip: "material-symbols:lightbulb-outline-rounded",
|
||||
caution: "material-symbols:report-problem-outline-rounded", // Admonition caution uses octagon alert
|
||||
warning: "material-symbols:warning-outline-rounded", // Admonition warning uses triangle warning
|
||||
important: "material-symbols:campaign-outline-rounded",
|
||||
};
|
||||
|
||||
const colorMap = {
|
||||
info: "var(--admonitions-color-note)", // Fallback to note color
|
||||
note: "var(--admonitions-color-note)",
|
||||
tip: "var(--admonitions-color-tip)",
|
||||
caution: "var(--admonitions-color-caution)",
|
||||
warning: "var(--admonitions-color-warning)",
|
||||
important: "var(--admonitions-color-caution)", // Fallback to caution color
|
||||
};
|
||||
|
||||
const currentIcon = iconMap[level] || iconMap.info;
|
||||
const currentColor = colorMap[level] || colorMap.info;
|
||||
---
|
||||
|
||||
{enable && (
|
||||
<div class="notice-card mb-4 relative transition-all duration-300 hover:shadow-lg onload-animation">
|
||||
<div class="notice-content flex items-center p-4 rounded-xl bg-[var(--card-bg)] border transition-colors" style={{ borderColor: currentColor, color: currentColor }}>
|
||||
<div class="icon-wrapper mr-4 flex items-center justify-center shrink-0">
|
||||
<Icon name={currentIcon} class="text-2xl" />
|
||||
</div>
|
||||
<div class="text-wrapper grow">
|
||||
<div class="notice-text text-sm md:text-base font-bold" set:html={content}></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="absolute inset-0 rounded-xl pointer-events-none border-2 opacity-10" style={{ borderColor: currentColor }}></div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<style>
|
||||
/* Remove local animation definition to use global .onload-animation */
|
||||
</style>
|
||||
@@ -4,12 +4,19 @@ import type {
|
||||
ImageFallbackConfig,
|
||||
LicenseConfig,
|
||||
NavBarConfig,
|
||||
NoticeConfig,
|
||||
ProfileConfig,
|
||||
SiteConfig,
|
||||
UmamiConfig,
|
||||
} from "./types/config";
|
||||
import { LinkPreset } from "./types/config";
|
||||
|
||||
export const noticeConfig: NoticeConfig = {
|
||||
enable: true,
|
||||
level: "warning",
|
||||
content: "请注意,该博客对于每篇文章都是有评论区的,如果你看不到或者必须手动刷新后才能看见,请反馈",
|
||||
};
|
||||
|
||||
export const siteConfig: SiteConfig = {
|
||||
title: "AcoFork Blog",
|
||||
subtitle: "技术分享与实践",
|
||||
|
||||
@@ -20,15 +20,6 @@ const postsCollection = defineCollection({
|
||||
}),
|
||||
});
|
||||
|
||||
const assetsCollection = defineCollection({
|
||||
type: "data",
|
||||
schema: z.object({
|
||||
title: z.string().optional(),
|
||||
description: z.string().optional(),
|
||||
}),
|
||||
});
|
||||
|
||||
export const collections = {
|
||||
posts: postsCollection,
|
||||
assets: assetsCollection,
|
||||
};
|
||||
|
||||
@@ -7,6 +7,7 @@ import type { MarkdownHeading } from "astro";
|
||||
import { Icon } from "astro-icon/components";
|
||||
import ImageWrapper from "../components/misc/ImageWrapper.astro";
|
||||
import TOC from "../components/widget/TOC.astro";
|
||||
import Announcement from "../components/widget/Announcement.astro";
|
||||
import { siteConfig } from "../config";
|
||||
import {
|
||||
BANNER_HEIGHT,
|
||||
@@ -86,6 +87,7 @@ const mainPanelTop = siteConfig.banner.enable
|
||||
<div id="content-wrapper" class="onload-animation">
|
||||
<!-- the overflow-hidden here prevent long text break the layout-->
|
||||
<!-- make id different from windows.swup global property -->
|
||||
<Announcement></Announcement>
|
||||
<slot></slot>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
@@ -174,31 +174,4 @@ const sponsors = Object.values(
|
||||
.sponsor-card {
|
||||
@apply transition-all duration-200 hover:shadow-md hover:scale-105;
|
||||
}
|
||||
.crypto-info {
|
||||
@apply space-y-3;
|
||||
}
|
||||
|
||||
.wallet-address, .bybit-uid {
|
||||
@apply text-center;
|
||||
}
|
||||
|
||||
.copy-btn {
|
||||
@apply transition-colors duration-200;
|
||||
}
|
||||
|
||||
.copy-btn:hover {
|
||||
color: var(--primary);
|
||||
opacity: 0.8;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
function copyToClipboard(text) {
|
||||
navigator.clipboard.writeText(text).then(function() {
|
||||
// 可以添加复制成功的提示
|
||||
alert('已复制到剪贴板');
|
||||
}, function(err) {
|
||||
console.error('复制失败: ', err);
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -123,3 +123,10 @@ export type GitHubEditConfig = {
|
||||
enable: boolean;
|
||||
baseUrl: string;
|
||||
};
|
||||
|
||||
export type NoticeConfig = {
|
||||
enable: boolean;
|
||||
level: "info" | "note" | "tip" | "caution" | "warning" | "important";
|
||||
content: string;
|
||||
};
|
||||
|
||||
|
||||
Reference in New Issue
Block a user