fix(skills): use theme-aware glass-card class for light mode compatibility

Replace hardcoded dark mode styles (bg-gray-900/40, border-white/10) with
the unified glass-card class that adapts to both light and dark themes.
This commit is contained in:
Jason
2025-11-29 21:18:51 +08:00
parent 3bf37cf0ff
commit 6ac4d1652c
2 changed files with 5 additions and 5 deletions
+3 -3
View File
@@ -90,7 +90,7 @@ export function RepoManagerPanel({
onClose={onClose}
>
{/* 添加仓库表单 */}
<div className="space-y-4 glass rounded-xl p-6 border border-white/10">
<div className="space-y-4 glass-card rounded-xl p-6">
<h3 className="text-base font-semibold text-foreground">
</h3>
@@ -139,7 +139,7 @@ export function RepoManagerPanel({
{t("skills.repo.list")}
</h3>
{repos.length === 0 ? (
<div className="text-center py-12 glass rounded-xl border border-white/10">
<div className="text-center py-12 glass-card rounded-xl">
<p className="text-sm text-muted-foreground">
{t("skills.repo.empty")}
</p>
@@ -149,7 +149,7 @@ export function RepoManagerPanel({
{repos.map((repo) => (
<div
key={`${repo.owner}/${repo.name}`}
className="flex items-center justify-between rounded-xl border border-white/10 bg-gray-900/40 px-4 py-3"
className="flex items-center justify-between glass-card rounded-xl px-4 py-3"
>
<div>
<div className="text-sm font-medium text-foreground">
+2 -2
View File
@@ -57,7 +57,7 @@ export function SkillCard({ skill, onInstall, onUninstall }: SkillCardProps) {
skill.directory.trim().toLowerCase() !== skill.name.trim().toLowerCase();
return (
<Card className="glass flex flex-col h-full border border-white/10 bg-gray-900/40 transition-all duration-300 hover:bg-gray-900/60 hover:border-white/20 hover:shadow-lg group relative overflow-hidden">
<Card className="glass-card flex flex-col h-full transition-all duration-300 hover:scale-[1.01] hover:shadow-lg group relative overflow-hidden">
<div className="absolute inset-0 bg-gradient-to-br from-primary/5 to-transparent opacity-0 group-hover:opacity-100 transition-opacity duration-500 pointer-events-none" />
<CardHeader className="pb-3">
<div className="flex items-start justify-between gap-2">
@@ -96,7 +96,7 @@ export function SkillCard({ skill, onInstall, onUninstall }: SkillCardProps) {
{skill.description || t("skills.noDescription")}
</p>
</CardContent>
<CardFooter className="flex gap-2 pt-3 border-t border-white/5 relative z-10">
<CardFooter className="flex gap-2 pt-3 border-t border-border/50 relative z-10">
{skill.readmeUrl && (
<Button
variant="ghost"