Refactor to use color names instead of 'text-*' colors for Marker icons

Author: webstackdev

_TODO.md

@@ -241,3 +241,7 @@ This article has different approaches to [print pagination](https://www.customjs
 - We need to check for short form and deep article articles where the deep-dive index.pdf has a non-featured tag lik "argo-cd" only in the pdf.mdx. In those cases, we should make sure the callout for the deep dive includes the name of that non-featured (technology) tag and add the name to the tags: frontmatter key in the index.mdx
 
 - Need an article on OpenStack
+
+## Instructions to avoid missing files with GPT-4.1
+
+- Perform the instruction on all files in the `src/components/Marker/icons` directory. Use `file_search` for *.astro in the target directory before every batch operation. The operation should be repeated until all files in the directory are confirmed processed, not just those found in the first search. Provide a final report listing all files in the directory and which ones were updated, to catch any omissions.

src/components/Marker/icons/chart.astro

@@ -14,7 +14,7 @@ const { color, classes, size, accessible, focusable, isListMarker, title } = Ast
 
 <svg
   xmlns="http://www.w3.org/2000/svg"
-  class:list={["shrink-0", `w-${size} h-${size}`, color, classes, isListMarker ? "mt-0.5" : ""]}
+  class:list={["shrink-0", `w-${size} h-${size}`, `text-${color}`, classes, isListMarker ? "mt-0.5" : ""]}
   fill="none"
   stroke="currentColor"
   viewBox="0 0 24 24"

src/components/Marker/icons/check.astro

@@ -14,7 +14,7 @@ const { color, classes, size, accessible, focusable, isListMarker, title } = Ast
 
 <svg
   xmlns="http://www.w3.org/2000/svg"
-  class:list={["shrink-0", `w-${size} h-${size}`, color, classes, isListMarker ? "mt-0.5" : ""]}
+  class:list={["shrink-0", `w-${size} h-${size}`, `text-${color}`, classes, isListMarker ? "mt-0.5" : ""]}
   fill="none"
   stroke="currentColor"
   viewBox="0 0 24 24"

src/components/Marker/icons/chevron.astro

@@ -12,7 +12,7 @@ const { color, classes, size, accessible, focusable } = Astro.props
 
 <svg
   xmlns="http://www.w3.org/2000/svg"
-  class:list={["shrink-0", `w-${size} h-${size}`, color, classes]}
+  class:list={["shrink-0", `w-${size} h-${size}`, `text-${color}`, classes]}
   fill="none"
   stroke="currentColor"
   viewBox="0 0 24 24"

src/components/Marker/icons/clipboard.astro

@@ -14,7 +14,7 @@ const { color, classes, size, accessible, focusable, isListMarker, title } = Ast
 
 <svg
   xmlns="http://www.w3.org/2000/svg"
-  class:list={["shrink-0", `w-${size} h-${size}`, color, classes, isListMarker ? "mt-0.5" : ""]}
+  class:list={["shrink-0", `w-${size} h-${size}`, `text-${color}`, classes, isListMarker ? "mt-0.5" : ""]}
   fill="none"
   stroke="currentColor"
   viewBox="0 0 24 24"

src/components/Marker/icons/company.astro

@@ -13,7 +13,7 @@ const { color, classes, size, accessible, focusable, isListMarker } = Astro.prop
 
 <svg
   xmlns="http://www.w3.org/2000/svg"
-  class:list={["shrink-0", `w-${size} h-${size}`, color, classes, isListMarker ? "mt-0.5" : ""]}
+  class:list={["shrink-0", `w-${size} h-${size}`, `text-${color}`, classes, isListMarker ? "mt-0.5" : ""]}
   fill="none"
   stroke="currentColor"
   viewBox="0 0 24 24"

src/components/Marker/icons/conversation.astro

@@ -13,7 +13,7 @@ const { color, classes, size, accessible, focusable, isListMarker } = Astro.prop
 
 <svg
   xmlns="http://www.w3.org/2000/svg"
-  class:list={["shrink-0", `w-${size} h-${size}`, color, classes, isListMarker ? "mt-0.5" : ""]}
+  class:list={["shrink-0", `w-${size} h-${size}`, `text-${color}`, classes, isListMarker ? "mt-0.5" : ""]}
   fill="none"
   stroke="currentColor"
   viewBox="0 0 24 24"

src/components/Marker/icons/document.astro

@@ -14,7 +14,7 @@ const { color, classes, size, accessible, focusable, isListMarker, title } = Ast
 
 <svg
   xmlns="http://www.w3.org/2000/svg"
-  class:list={["shrink-0", `w-${size} h-${size}`, color, classes, isListMarker ? "mt-0.5" : ""]}
+  class:list={["shrink-0", `w-${size} h-${size}`, `text-${color}`, classes, isListMarker ? "mt-0.5" : ""]}
   fill="none"
   stroke="currentColor"
   viewBox="0 0 24 24"

src/components/Marker/icons/download-document.astro

@@ -13,7 +13,7 @@ const { color, classes, size, accessible, focusable, title } = Astro.props
 
 <svg
   xmlns="http://www.w3.org/2000/svg"
-  class:list={[`w-${size} h-${size}`, color, classes]}
+  class:list={[`w-${size} h-${size}`, `text-${color}`, classes]}
   fill="none"
   stroke="currentColor"
   viewBox="0 0 24 24"

src/components/Marker/icons/download.astro

@@ -13,7 +13,7 @@ const { color, classes, size, accessible, focusable, title } = Astro.props
 
 <svg
   xmlns="http://www.w3.org/2000/svg"
-  class:list={["shrink-0", `w-${size} h-${size}`, color, classes]}
+  class:list={["shrink-0", `w-${size} h-${size}`, `text-${color}`, classes]}
   fill="none"
   stroke="currentColor"
   viewBox="0 0 24 24"