update card icon ui (#50)

* feat: update icons in various components and improve styling for better UI consistency

frontend/src/components/CardView.tsx

@@ -4,6 +4,7 @@ import { ClockCircleOutlined, StarFilled } from "@ant-design/icons";
 import type { ItemType } from "antd/es/menu/interface";
 import { formatDateTime } from "@/utils/unit";
 import ActionDropdown from "./ActionDropdown";
+import { Database } from "lucide-react";
 
 interface BaseCardDataType {
   id: string | number;
@@ -193,12 +194,9 @@ function CardView<T extends BaseCardDataType>(props: CardViewProps<T>) {
                   <div className="flex items-center gap-3 min-w-0">
                     {item?.icon && (
                       <div
-                        className={`flex-shrink-0 w-12 h-12 ${
-                          item?.iconColor ||
-                          "bg-gradient-to-br from-blue-100 to-blue-200"
-                        } rounded-lg flex items-center justify-center`}
+                        className={`flex-shrink-0 w-12 h-12 bg-gradient-to-br from-sky-300 to-blue-500 text-white rounded-lg flex items-center justify-center`}
                       >
-                        {item?.icon}
+                        <div className="w-6 h-6 text-gray-50">{item?.icon}</div>
                       </div>
                     )}
                     <div className="flex-1 min-w-0">

frontend/src/components/DetailHeader.tsx

@@ -49,13 +49,11 @@ function DetailHeader<T>({
       <div className="flex items-start justify-between">
         <div className="flex items-start gap-4 flex-1">
           <div
-            className={`w-16 h-16 text-white rounded-lg flex-center shadow-lg ${
-              data?.iconColor
-                ? data.iconColor
-                : "bg-gradient-to-br from-blue-100 to-blue-200"
-            }`}
+            className={`w-16 h-16 text-white rounded-lg flex-center shadow-lg bg-gradient-to-br from-sky-300 to-blue-500 text-white`}
           >
-            {data?.icon || <Database className="w-8 h-8" />}
+            {<div className="w-8 h-8 text-gray-50">{data?.icon}</div> || (
+              <Database className="w-8 h-8 text-white" />
+            )}
           </div>
           <div className="flex-1">
             <div className="flex items-center gap-3 mb-2">