Add dark variant to softly emphasised text

exercism · Oct 31, 2024 · 8fea0b5 · 8fea0b5
1 parent 7f6521f
commit 8fea0b5
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 1 deletion.
diff --git a/app/css/ui-kit/colors.css b/app/css/ui-kit/colors.css
@@ -276,6 +276,7 @@
     --c-prominent-link-color: theme(colors.lightBlue);
     --textGradientStart: #2200ff;
     --textGradientEnd: #9e00ff;
+    --textColorSoftEmphasis: #333;
 
     --shadowColorED: 0, 80, 255;
     --shadowColorMain: 79, 114, 205;
@@ -544,6 +545,7 @@ body.namespace-.controller-insiders.theme-light,
     --textColorProgressTextCompleted: theme(colors.greenPrompt);
     --textGradientStart: #8370ff;
     --textGradientEnd: #b947ff;
+    --textColorSoftEmphasis: #f5f5f5;
 
     --c-prominent-link-color: theme(colors.lightGold);
     --color22: var(--c-533F56);

diff --git a/app/javascript/components/modals/welcome-modal/BeginnerView.tsx b/app/javascript/components/modals/welcome-modal/BeginnerView.tsx
@@ -12,7 +12,7 @@ export function JuniorView() {
           <p className="mb-8">
             You've signed up at a great time! In January, we're running a
             one-off{' '}
-            <strong className="font-semibold text-[#333]">
+            <strong className="font-semibold text-softEmphasis">
               part-time, remote bootcamp for beginners!
             </strong>
           </p>

diff --git a/tailwind.config.js b/tailwind.config.js
@@ -281,6 +281,8 @@ module.exports = {
       legendaryBadge: '#EB5757',
       legendaryBadgeFill: '#4B0000',
 
+      softEmphasis: 'var(--textColorSoftEmphasis)',
+
       white: '#fff',
       black: '#000',