♻️ Removed raised-tokens from darkside roles

navikt · Jan 20, 2025 · bbca69a · bbca69a
1 parent 7e6d91e
commit bbca69a
Show file tree

Hide file tree

Showing 5 changed files with 12 additions and 35 deletions.
diff --git a/@navikt/core/css/darkside/chat.darkside.css b/@navikt/core/css/darkside/chat.darkside.css
@@ -73,14 +73,14 @@
 .navds-chat--info {
   & .navds-chat__bubble,
   & .navds-chat__avatar {
-    background-color: var(--ax-bg-info-raised);
+    background-color: var(--ax-bg-info-moderate);
   }
 }
 
 .navds-chat--neutral {
   & .navds-chat__bubble,
   & .navds-chat__avatar {
-    background-color: var(--ax-bg-raised);
+    background-color: var(--ax-bg-moderate);
   }
 }
 

diff --git a/@navikt/core/tokens/darkside/tests/validate-config.test.ts b/@navikt/core/tokens/darkside/tests/validate-config.test.ts
@@ -27,19 +27,13 @@ describe("Validate token configurations", () => {
 
   test(`Semantic tokens for all roles: Lightmode`, () => {
     expect(
-      validateConfig(
-        semanticTokensForAllRolesConfig("light"),
-        configKeysWithGroup,
-      ),
+      validateConfig(semanticTokensForAllRolesConfig(), configKeysWithGroup),
     ).toBeTruthy();
   });
 
   test(`Semantic tokens for all roles: Darkmode`, () => {
     expect(
-      validateConfig(
-        semanticTokensForAllRolesConfig("dark"),
-        configKeysWithGroup,
-      ),
+      validateConfig(semanticTokensForAllRolesConfig(), configKeysWithGroup),
     ).toBeTruthy();
   });
 

diff --git a/@navikt/core/tokens/darkside/tokens.config.ts b/@navikt/core/tokens/darkside/tokens.config.ts
@@ -35,7 +35,7 @@ export const lightModeTokens = () => {
     mergeConfigs([
       shadowTokenConfig("light"),
       opacityTokenConfig("light"),
-      semanticTokensForAllRolesConfig("light"),
+      semanticTokensForAllRolesConfig(),
       textContrastTokenConfig,
       semanticTokenConfig("light"),
       globalColorLightModeConfig,
@@ -52,7 +52,7 @@ export const darkModeTokens = () => {
     mergeConfigs([
       shadowTokenConfig("dark"),
       opacityTokenConfig("dark"),
-      semanticTokensForAllRolesConfig("dark"),
+      semanticTokensForAllRolesConfig(),
       textContrastTokenConfig,
       semanticTokenConfig("dark"),
       globalColorDarkModeConfig,

diff --git a/@navikt/core/tokens/darkside/tokens/semantic-roles.ts b/@navikt/core/tokens/darkside/tokens/semantic-roles.ts
@@ -1,12 +1,8 @@
 import _ from "lodash";
-import {
-  ColorRolesList,
-  type ColorTheme,
-  type SemanticColorRoles,
-} from "../../types";
+import { ColorRolesList, type SemanticColorRoles } from "../../types";
 import { type StyleDictionaryTokenConfig } from "../tokens.util";
 
-const configForRole = (role: SemanticColorRoles, theme: ColorTheme) => {
+const configForRole = (role: SemanticColorRoles) => {
   return {
     bg: {
       [`${role}-soft`]: {
@@ -69,17 +65,6 @@ const configForRole = (role: SemanticColorRoles, theme: ColorTheme) => {
         type: "color",
         group: `background.${role}`,
       },
-      [`${role}-raised`]: {
-        /* We bump raised for darkmode */
-        value: `{ax.${role}.${theme === "light" ? "100" : "200"}.value}`,
-        type: "color",
-        group: `background.${role}`,
-      },
-      [`${role}-raised-hover`]: {
-        value: `{ax.${role}.${theme === "light" ? "200" : "300"}.value}`,
-        type: "color",
-        group: `background.${role}`,
-      },
     },
     text: {
       [role]: {
@@ -126,9 +111,9 @@ const configForRole = (role: SemanticColorRoles, theme: ColorTheme) => {
 /**
  * We need to deep merge the token config for each role to get the complete token config for all roles.
  */
-export const semanticTokensForAllRolesConfig = (theme: ColorTheme) => {
+export const semanticTokensForAllRolesConfig = () => {
   return ColorRolesList.filter((name) => name !== "neutral").reduce(
-    (acc, role) => _.merge(acc, configForRole(role, theme)),
+    (acc, role) => _.merge(acc, configForRole(role)),
     {} as ReturnType<typeof configForRole>,
   );
 };
diff --git a/@navikt/core/tokens/types.ts b/@navikt/core/tokens/types.ts
@@ -68,8 +68,7 @@ export type StaticBgKeys =
   | `${SemanticColorRoles}-soft`
   | `${SemanticColorRoles}-moderate`
   | `${SemanticColorRoles}-moderateA`
-  | `${SemanticColorRoles}-strong`
-  | `${SemanticColorRoles}-raised`;
+  | `${SemanticColorRoles}-strong`;
 
 export type StatefulBgKeys =
   | `${SemanticColorRoles}-hover`
@@ -79,8 +78,7 @@ export type StatefulBgKeys =
   | `${SemanticColorRoles}-moderate-pressed`
   | `${SemanticColorRoles}-moderate-pressedA`
   | `${SemanticColorRoles}-strong-hover`
-  | `${SemanticColorRoles}-strong-pressed`
-  | `${SemanticColorRoles}-raised-hover`;
+  | `${SemanticColorRoles}-strong-pressed`;
 
 export type DefaultTextColorKeys =
   | "default"