[CL-42] Add code color (#3662)

libs/components/src/stories/colors.stories.mdx

@@ -49,11 +49,18 @@ export const Table = (args) => (
       {Row("info-500")}
       {Row("info-700")}
     </tbody>
+    <thead>
+      <tr>
+        <th>Text</th>
+        <th class="tw-w-20"></th>
+      </tr>
+    </thead>
     <tbody>
       {Row("text-main")}
       {Row("text-muted")}
       {Row("text-contrast")}
       {Row("text-alt2")}
+      {Row("text-code")}
     </tbody>
   </table>
 );

libs/components/src/tw-theme.css

@@ -30,6 +30,7 @@
   --color-text-muted: 109 117 126;
   --color-text-contrast: 255 255 255;
   --color-text-alt2: 255 255 255;
+  --color-text-code: 192 17 118;
 
   --tw-ring-offset-color: #ffffff;
 }
@@ -70,6 +71,7 @@
   --color-text-muted: 186 192 206;
   --color-text-contrast: 25 30 38;
   --color-text-alt2: 255 255 255;
+  --color-text-code: 240 141 199;
 
   --tw-ring-offset-color: #1f242e;
 }

libs/components/tailwind.config.base.js

@@ -50,6 +50,7 @@ module.exports = {
         muted: rgba("--color-text-muted"),
         contrast: rgba("--color-text-contrast"),
         alt2: rgba("--color-text-alt2"),
+        code: rgba("--color-text-code"),
       },
       background: {
         DEFAULT: rgba("--color-background"),
@@ -62,6 +63,7 @@ module.exports = {
       muted: rgba("--color-text-muted"),
       contrast: rgba("--color-text-contrast"),
       alt2: rgba("--color-text-alt2"),
+      code: rgba("--color-text-code"),
       success: rgba("--color-success-500"),
       danger: rgba("--color-danger-500"),
       warning: rgba("--color-warning-500"),