fix(style): instance type card height

src/pages/gpu-service/instances/components/instance-type-item.tsx

@@ -137,13 +137,9 @@ export const InstanceMetadataSection: React.FC<MetadataSectionProps> = ({
     spec
   } as InstanceTypeItemModel);
 
-  // Sliceable types show "Max {n} · Sliceable {m}%" instead of just the count.
+  // Sliceable types get a dedicated "Sliceable {n}%" row (on its own grid row)
+  // rather than crowding it into the Max cell.
   const showSliceable = !!spec.sliceable && (slicedMaxPercentage ?? 0) > 0;
-  const maxValue = showSliceable
-    ? `${spec.maxComputeUnitCount || 0} · ${intl.formatMessage({
-        id: 'gpuservice.instance.sliceable'
-      })} ${slicedMaxPercentage}%`
-    : `${spec.maxComputeUnitCount || 0}`;
 
   return (
     <Meta $columns={isGPU ? 11 : 7}>
@@ -171,7 +167,7 @@ export const InstanceMetadataSection: React.FC<MetadataSectionProps> = ({
               },
               { count: '' }
             )}
-            value={maxValue}
+            value={`${spec.maxComputeUnitCount || 0}`}
           />
           {/* row 2: OS | Arch | CPU */}
           <MetaItem
@@ -196,6 +192,14 @@ export const InstanceMetadataSection: React.FC<MetadataSectionProps> = ({
               </Flex>
             }
           />
+          {/* row 3 (sliceable types only): Sliceable {n}% on its own row */}
+          <MetaItem
+            show={showSliceable}
+            showDot={false}
+            icon="icon-sliced"
+            label={intl.formatMessage({ id: 'gpuservice.instance.sliceable' })}
+            value={`${slicedMaxPercentage}%`}
+          />
         </>
       )}
 

src/pages/gpu-service/instances/components/instance-type-list.tsx

@@ -4,6 +4,7 @@ import { TemplateCard } from '@gpustack/core-ui';
 import { Empty, Flex, Spin } from 'antd';
 import _ from 'lodash';
 import { InstanceTypeItem as InstanceTypeItemModel } from '../config/types';
+import styles from '../styles/instances.module.less';
 import InstanceTypeItem from './instance-type-item';
 
 interface InstanceTypeListProps {
@@ -50,10 +51,10 @@ const InstanceTypeList: React.FC<InstanceTypeListProps> = ({
         return (
           <TemplateCard
             key={name}
+            className={styles.instanceTypeCard}
             clickable
             ghost
             hoverable
-            height={106}
             active={value === name}
             disabled={item.disabled}
             onClick={() => handleSelect(item)}

src/pages/gpu-service/instances/styles/instances.module.less

@@ -45,3 +45,10 @@
   font-weight: 400;
   font-size: 12px;
 }
+
+// TemplateCard applies a fixed inline height; override to let sliceable cards
+// (with the extra Sliceable row) grow while keeping a 106px floor.
+.instanceTypeCard {
+  height: auto !important;
+  min-height: 106px;
+}