chore(template): theme logo

src/pages/benchmark/components/detail-content.tsx

@@ -1,5 +1,5 @@
 import { IconFont } from '@gpustack/core-ui';
-import { useIntl, useSearchParams } from '@umijs/max';
+import { useIntl } from '@umijs/max';
 import { Tabs, TabsProps } from 'antd';
 import React, { useState } from 'react';
 import Environment from './environment';
@@ -12,7 +12,6 @@ const Details: React.FC<{
 }> = ({ tabBarExtraContent }) => {
   const intl = useIntl();
   const [activeKey, setActiveKey] = useState('summary');
-  const [searchParams] = useSearchParams();
 
   const items: TabsProps['items'] = [
     {

src/pages/gpu-service/templates/components/template-card.tsx

@@ -7,6 +7,7 @@ import metaxLogo from '@/assets/logo/metax.png';
 import mooreLogo from '@/assets/logo/moore-logo.png';
 import nvidiaLogo from '@/assets/logo/nvidia.png';
 import pytorchBlackLogo from '@/assets/logo/pytorch_black.png';
+import pytorchLightLogo from '@/assets/logo/pytorch_light.png';
 import sgLangLogo from '@/assets/logo/sglang.png';
 import theadLogoEN from '@/assets/logo/t-head-en.png';
 import theadLogoZH from '@/assets/logo/t-head-zh.png';
@@ -14,6 +15,7 @@ import tensorflowkLogo from '@/assets/logo/tensorflow.svg';
 import ubuntuLogo from '@/assets/logo/ubuntu_logo.png';
 import vllmLogo from '@/assets/logo/vllm.png';
 import PluginExtraFields from '@/components/plugin-extra-fields';
+import useUserSettings from '@/hooks/use-user-settings';
 import OwnerTag from '@/pages/gpu-service/components/owner-tag';
 import {
   GPUsConfigs,
@@ -33,7 +35,8 @@ import styled from 'styled-components';
 import { manufactureColorMap, templateActions } from '../config';
 import { ListItem } from '../config/types';
 
-const imageLogoMap = {
+// Light theme logos
+const imageLogoLightMap = {
   vllm: vllmLogo,
   sglang: sgLangLogo,
   jupyter: jupyterLogo,
@@ -42,25 +45,31 @@ const imageLogoMap = {
   ubuntu: ubuntuLogo
 } as const;
 
+// Dark theme logos: inherit light, override only the ones that need a variant
+const imageLogoDarkMap: typeof imageLogoLightMap = {
+  ...imageLogoLightMap,
+  pytorch: pytorchLightLogo
+};
+
 const matchImageLogo = (
-  image: string | undefined
+  image: string | undefined,
+  isDark: boolean
 ): { logo: string; type: string } | null => {
   if (!image) return null;
+  const logoMap = imageLogoLightMap;
   const lower = image.toLowerCase();
-  let matched: keyof typeof imageLogoMap | null = null;
+  let matched: keyof typeof logoMap | null = null;
   let earliest = Infinity;
-  (Object.keys(imageLogoMap) as Array<keyof typeof imageLogoMap>).forEach(
-    (key) => {
-      const idx = lower.indexOf(key);
-      if (idx !== -1 && idx < earliest) {
-        earliest = idx;
-        matched = key;
-      }
+  (Object.keys(logoMap) as Array<keyof typeof logoMap>).forEach((key) => {
+    const idx = lower.indexOf(key);
+    if (idx !== -1 && idx < earliest) {
+      earliest = idx;
+      matched = key;
     }
-  );
+  });
   return matched
     ? {
-        logo: imageLogoMap[matched],
+        logo: logoMap[matched],
         type: matched
       }
     : null;
@@ -135,6 +144,7 @@ interface TemplateCardProps {
 
 const TemplateCardItem: React.FC<TemplateCardProps> = ({ data, onSelect }) => {
   const intl = useIntl();
+  const { isDarkTheme } = useUserSettings();
 
   const manufacturerLabelMap: Record<string, string> = useMemo(() => {
     return Object.values(GPUsConfigs).reduce(
@@ -158,7 +168,7 @@ const TemplateCardItem: React.FC<TemplateCardProps> = ({ data, onSelect }) => {
   };
 
   const renderLogo = () => {
-    const imageLogo = matchImageLogo(data.spec?.image);
+    const imageLogo = matchImageLogo(data.spec?.image, isDarkTheme);
     if (imageLogo?.logo) {
       return (
         <LogoImg