From ee08b4f733841248a95a2f33afcca2bb466b761f Mon Sep 17 00:00:00 2001
From: Brian Rinaldi <brian.rinaldi@gmail.com>
Date: Wed, 2 Sep 2026 07:22:30 -0400
Subject: [PATCH] Fix gray card icons on Azure docs home page

The Sample Apps and Changelog cards imported file.svg and change.svg,
which have gray (#707385) hardcoded in their fill and are authored at
15px for use as CSS background-images in custom.css. The other cards use
the purple 36x36 *_Color.svg set, so those two rendered gray and
undersized.

Point Changelog at the existing CIPipelines_Color.svg, and add
SampleApps_Color.svg -- the same document artwork as file.svg, recolored
to #4D0DCF and padded to match the set's optical sizing. file.svg and
change.svg are left untouched so the .file-icon and .change-icon CSS
rules keep rendering gray.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
---
 src/assets/images/SampleApps_Color.svg | 3 +++
 src/content/docs/azure/index.mdx       | 6 +++---
 2 files changed, 6 insertions(+), 3 deletions(-)
 create mode 100644 src/assets/images/SampleApps_Color.svg

diff --git a/src/assets/images/SampleApps_Color.svg b/src/assets/images/SampleApps_Color.svg
new file mode 100644
index 000000000..9427ad28e
--- /dev/null
+++ b/src/assets/images/SampleApps_Color.svg
@@ -0,0 +1,3 @@
+<svg width="36" height="36" viewBox="-1.5 -1.5 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M13.75 0V6.875H12.5V2.5H1.25V10H7.5V11.25H0V0H13.75ZM11.875 14.7612L15 13.1987V10.2116L11.8749 11.7741L8.75 10.2116V13.1987L11.875 14.7612ZM11.8749 10.7259L14.8623 9.23231L11.875 7.73875L8.88775 9.23238L11.8749 10.7259Z" fill="#4D0DCF"/>
+</svg>
diff --git a/src/content/docs/azure/index.mdx b/src/content/docs/azure/index.mdx
index 952d3dc97..657ea542c 100644
--- a/src/content/docs/azure/index.mdx
+++ b/src/content/docs/azure/index.mdx
@@ -12,8 +12,8 @@ import { OverviewCards, HeroCards } from '../../../components/OverviewCards';
 import rocketIcon from '../../../assets/images/GettingStarted_Color.svg';
 import connectionsIcon from '../../../assets/images/Integrations_Color.svg';
 import cubeIcon from '../../../assets/images/LSAWS_Color.svg';
-import fileIcon from '../../../assets/images/file.svg';
-import changeIcon from '../../../assets/images/change.svg';
+import fileIcon from '../../../assets/images/SampleApps_Color.svg';
+import pipelineIcon from '../../../assets/images/CIPipelines_Color.svg';
 
 <HeroCards
   cards={[
@@ -61,7 +61,7 @@ import changeIcon from '../../../assets/images/change.svg';
       title: "Changelog",
       description: "Track Azure emulator updates and release highlights.",
       href: "/azure/changelog",
-      icon: changeIcon.src
+      icon: pipelineIcon.src
     }
   ]}
   client:load