From 6ac4d1652ca88d96212dfb485b7ac11ff94a4914 Mon Sep 17 00:00:00 2001
From: Jason <farion1231@gmail.com>
Date: Sat, 29 Nov 2025 21:18:51 +0800
Subject: [PATCH] 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.
---
 src/components/skills/RepoManagerPanel.tsx | 6 +++---
 src/components/skills/SkillCard.tsx        | 4 ++--
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/components/skills/RepoManagerPanel.tsx b/src/components/skills/RepoManagerPanel.tsx
index 69914e2cf..c58ec570b 100644
--- a/src/components/skills/RepoManagerPanel.tsx
+++ b/src/components/skills/RepoManagerPanel.tsx
@@ -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">
diff --git a/src/components/skills/SkillCard.tsx b/src/components/skills/SkillCard.tsx
index 8fe82902a..4a22566d7 100644
--- a/src/components/skills/SkillCard.tsx
+++ b/src/components/skills/SkillCard.tsx
@@ -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"