From 60b63d7a22fcbe7671d2c370b02410ea0df63ed4 Mon Sep 17 00:00:00 2001
From: Syngnat <yangguofeng919@gmail.com>
Date: Sat, 11 Apr 2026 21:53:50 +0800
Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20feat(icon):=20=E8=A1=A5=E5=85=85=20?=
 =?UTF-8?q?SQL=20Server=20=E6=95=B0=E6=8D=AE=E5=BA=93=E5=9B=BE=E6=A0=87?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Fixes #287
---
 frontend/public/db-icons/sqlserver.svg    | 6 ++++++
 frontend/src/components/DatabaseIcons.tsx | 4 ++--
 2 files changed, 8 insertions(+), 2 deletions(-)
 create mode 100644 frontend/public/db-icons/sqlserver.svg

diff --git a/frontend/public/db-icons/sqlserver.svg b/frontend/public/db-icons/sqlserver.svg
new file mode 100644
index 0000000..d59a844
--- /dev/null
+++ b/frontend/public/db-icons/sqlserver.svg
@@ -0,0 +1,6 @@
+<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+  <title>SQL Server</title>
+  <path fill="#A91D22" d="M4.2 7.25c1.05-1.56 4.53-2.69 8.24-2.69 3.34 0 6.13.91 7.25 2.15.57.64.63 1.29.16 1.87-1 1.27-3.81 2.09-7.18 2.09-3.85 0-7.1-1.03-8.29-2.52-.32-.4-.38-.61-.18-.9Z"/>
+  <path fill="#D63539" d="M5.07 11.11c1.27-1.2 4.24-2.04 7.42-2.04 3.59 0 6.58 1.04 7.34 2.54.27.54.16 1.07-.34 1.55-1.18 1.12-3.89 1.81-7.12 1.81-3.56 0-6.56-.91-7.6-2.25-.4-.52-.31-1.02.3-1.61Z"/>
+  <path fill="#F15F5C" d="M7.2 16.12c1.12-.75 3.11-1.18 5.38-1.18 2.43 0 4.59.52 5.71 1.39.84.65 1 1.42.42 2.05-.92 1-3.09 1.63-5.74 1.63-2.87 0-5.34-.75-6.22-1.88-.53-.68-.36-1.37.45-2.01Z"/>
+</svg>
diff --git a/frontend/src/components/DatabaseIcons.tsx b/frontend/src/components/DatabaseIcons.tsx
index 6d55fb2..bbc0628 100644
--- a/frontend/src/components/DatabaseIcons.tsx
+++ b/frontend/src/components/DatabaseIcons.tsx
@@ -37,7 +37,7 @@ export const getDbDefaultColor = (type: string): string =>
 
 const BRAND_SVG_TYPES = new Set([
     'mysql', 'mariadb', 'postgres', 'redis', 'mongodb', 'clickhouse', 'sqlite',
-    'diros', 'sphinx', 'duckdb',
+    'diros', 'sphinx', 'duckdb', 'sqlserver',
 ]);
 
 /** 品牌 SVG 图标：用 <img> 加载 /db-icons/*.svg */
@@ -110,7 +110,7 @@ const OracleIcon: React.FC<DbIconProps> = ({ size = 16, color }) => (
     <ColorBadge size={size} color={color || DB_DEFAULT_COLORS.oracle} label="Or" />
 );
 const SQLServerIcon: React.FC<DbIconProps> = ({ size = 16, color }) => (
-    <ColorBadge size={size} color={color || DB_DEFAULT_COLORS.sqlserver} label="SS" />
+    <BrandSvgIcon type="sqlserver" size={size} color={color} />
 );
 const DorisIcon: React.FC<DbIconProps> = ({ size = 16, color }) => (
     <BrandSvgIcon type="diros" size={size} color={color} />