refactor: consolidate theme colors

Author: abelflopes

packages/components/text/src/styles/_variables.scss

@@ -24,7 +24,7 @@ $text-types: (
   ),
   soft: (
     default: (
-      color: #718096,
+      color: get-color(neutral-500),
     ),
     hover: (),
   ),
@@ -41,7 +41,7 @@ $text-types: (
       font-size: 24px,
       font-weight: 500,
       line-height: 36px,
-      color: #1a202c,
+      color: get-color(neutral-800),
     ),
     hover: (),
   ),
@@ -84,18 +84,18 @@ $text-variations: (
   ),
   link: (
     default: (
-      color: #0052cc,
+      color: get-color(highlight-alt),
     ),
     hover: (
-      color: #003e99,
+      color: get-color(highlight-alt-dark),
     ),
   ),
   link_hidden: (
     default: (
       text-decoration: none,
     ),
     hover: (
-      color: #003e99,
+      color: get-color(highlight-alt-dark),
       text-decoration: underline,
     ),
   ),

packages/providers/theme/src/styles/_theme-type.scss

@@ -5,6 +5,8 @@ $theme-type: (
     "highlight-primary-light",
     "highlight-primary",
     "highlight-primary-dark",
+    "highlight-alt",
+    "highlight-alt-dark",
     "neutral-0",
     "neutral-100",
     "neutral-200",

packages/providers/theme/src/themes/default.ts

@@ -9,6 +9,8 @@ export const defaultTheme: Theme = {
     "highlight-primary-light": "hsl(185deg 50% 85%)",
     "highlight-primary": "hsl(185deg 50% 55%)",
     "highlight-primary-dark": "hsl(185deg 50% 35%)",
+    "highlight-alt": "#0052cc",
+    "highlight-alt-dark": "#003e99",
     "neutral-0": "#fff",
     "neutral-100": "#edf2f7",
     "neutral-200": "#DBDEEB",

packages/providers/theme/src/types.ts

@@ -4,6 +4,8 @@ export interface Theme {
     "highlight-primary-light": string;
     "highlight-primary": string;
     "highlight-primary-dark": string;
+    "highlight-alt": string;
+    "highlight-alt-dark": string;
     "neutral-0": string;
     "neutral-100": string;
     "neutral-200": string;