fix(chart): outline NVIDIA line-label logo in black / 为折线标签的 NVIDIA 图标添加黑色描边 (#941)

Co-authored-by: Cam Quilici <cameron@semianalysis.com>

Author: cquil11

packages/app/src/lib/vendor-logos.test.ts

@@ -28,6 +28,12 @@ describe('vendor logo icons', () => {
     expect(getLineLabelVendorIcon('unknown-hw')).toBeUndefined();
   });
 
+  it('outlines the NVIDIA mark in black so it stays visible on green pills', () => {
+    const svg = decodeURIComponent(VENDOR_LOGO_ICONS.NVIDIA.href);
+    expect(svg).toContain('stroke="#000000"');
+    expect(svg).toContain('paint-order="stroke"');
+  });
+
   it('inlines brand colors in the data URIs', () => {
     expect(decodeURIComponent(VENDOR_LOGO_ICONS.NVIDIA.href)).toContain('#76B900');
     expect(decodeURIComponent(VENDOR_LOGO_ICONS.AMD.href)).toContain('#000000');

packages/app/src/lib/vendor-logos.ts

@@ -32,7 +32,11 @@ export function getHwVendorLogo(vendor: string | undefined): string | undefined
  *
  * Color notes (this is deliberate — do not swap in the monochrome
  * `public/logos/{nvidia,amd}.svg` simple-icons assets here):
- * - NVIDIA: official brand green `#76B900` eye mark.
+ * - NVIDIA: official brand green `#76B900` eye mark, backed by a black
+ *   outline (`paint-order: stroke` draws the stroke behind the fill, so the
+ *   green mark stays full-width and the outline extends outward). NVIDIA
+ *   series lines are green, so without the outline the mark disappears into
+ *   the pill fill on those labels.
  * - AMD: the arrow symbol from the official AMD logo, in brand black —
  *   symbol only, no "AMD" wordmark, so it reads as a square mark like the
  *   other vendor icons at the 10px label size.
@@ -54,7 +58,7 @@ const svgDataUri = (svg: string): string => `data:image/svg+xml,${encodeURICompo
 
 /** NVIDIA eye mark (simple-icons geometry) in NVIDIA brand green. */
 const NVIDIA_LOGO_SVG =
-  '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="#76B900"><path d="M8.948 8.798v-1.43a6.7 6.7 0 0 1 .424-.018c3.922-.124 6.493 3.374 6.493 3.374s-2.774 3.851-5.75 3.851c-.398 0-.787-.062-1.158-.185v-4.346c1.528.185 1.837.857 2.747 2.385l2.04-1.714s-1.492-1.952-4-1.952a6.016 6.016 0 0 0-.796.035m0-4.735v2.138l.424-.027c5.45-.185 9.01 4.47 9.01 4.47s-4.08 4.964-8.33 4.964c-.37 0-.733-.035-1.095-.097v1.325c.3.035.61.062.91.062 3.957 0 6.82-2.023 9.593-4.408.459.371 2.34 1.263 2.73 1.652-2.633 2.208-8.772 3.984-12.253 3.984-.335 0-.653-.018-.971-.053v1.864H24V4.063zm0 10.326v1.131c-3.657-.654-4.673-4.46-4.673-4.46s1.758-1.944 4.673-2.262v1.237H8.94c-1.528-.186-2.73 1.245-2.73 1.245s.68 2.412 2.739 3.11M2.456 10.9s2.164-3.197 6.5-3.533V6.201C4.153 6.59 0 10.653 0 10.653s2.35 6.802 8.948 7.42v-1.237c-4.84-.6-6.492-5.936-6.492-5.936z"/></svg>';
+  '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="#76B900" stroke="#000000" stroke-width="2" stroke-linejoin="round" paint-order="stroke"><path d="M8.948 8.798v-1.43a6.7 6.7 0 0 1 .424-.018c3.922-.124 6.493 3.374 6.493 3.374s-2.774 3.851-5.75 3.851c-.398 0-.787-.062-1.158-.185v-4.346c1.528.185 1.837.857 2.747 2.385l2.04-1.714s-1.492-1.952-4-1.952a6.016 6.016 0 0 0-.796.035m0-4.735v2.138l.424-.027c5.45-.185 9.01 4.47 9.01 4.47s-4.08 4.964-8.33 4.964c-.37 0-.733-.035-1.095-.097v1.325c.3.035.61.062.91.062 3.957 0 6.82-2.023 9.593-4.408.459.371 2.34 1.263 2.73 1.652-2.633 2.208-8.772 3.984-12.253 3.984-.335 0-.653-.018-.971-.053v1.864H24V4.063zm0 10.326v1.131c-3.657-.654-4.673-4.46-4.673-4.46s1.758-1.944 4.673-2.262v1.237H8.94c-1.528-.186-2.73 1.245-2.73 1.245s.68 2.412 2.739 3.11M2.456 10.9s2.164-3.197 6.5-3.533V6.201C4.153 6.59 0 10.653 0 10.653s2.35 6.802 8.948 7.42v-1.237c-4.84-.6-6.492-5.936-6.492-5.936z"/></svg>';
 
 /** AMD arrow symbol (extracted from the official logo geometry) in brand black. */
 const AMD_LOGO_SVG =