From 2ba225fb2867b6719057d3f6d89512de6230f8fb Mon Sep 17 00:00:00 2001
From: joostdecock <joost@joost.at>
Date: Sat, 19 Apr 2025 13:30:03 +0200
Subject: [PATCH] [org] chore: Extended typography page

---
 sites/org/src/pages/typography.js | 27 +++++++++++++++++++++++++++
 1 file changed, 27 insertions(+)

diff --git a/sites/org/src/pages/typography.js b/sites/org/src/pages/typography.js
index f5d70bfac8e..64d0e423b4f 100644
--- a/sites/org/src/pages/typography.js
+++ b/sites/org/src/pages/typography.js
@@ -10,6 +10,20 @@ const p = (
   </p>
 )
 
+const namedColors = [
+  'base-100',
+  'base-200',
+  'base-300',
+  'primary',
+  'secondary',
+  'neutral',
+  'accent',
+  'success',
+  'info',
+  'warning',
+  'error',
+]
+
 const TypographyPage = ({ page }) => {
   return (
     <Layout
@@ -90,6 +104,19 @@ const TypographyPage = ({ page }) => {
               Tiny wide
             </button>
           </div>
+          <h2>Named colors</h2>
+          <ul className="tw:list tw:list-inside tw:list-disc tw:ml-2">
+            {namedColors.map((color) => (
+              <li key={color} className={`tw:text-${color}`}>
+                tw:{color}
+              </li>
+            ))}
+            {namedColors.map((color) => (
+              <li key={color} className={`tw:text-${color}-content tw:bg-${color}`}>
+                tw:{color}-content tw:bg-{color}
+              </li>
+            ))}
+          </ul>
           <h2>Tabs</h2>
           <Tabs>
             <TabItem value="1" label="Tab 1">