UI - МЕЖПРОЕКТНАЯ КОММУНИКАЦИЯ: контроль цветов элементов, допил палитры и реворк основного UI

plane-src/packages/types/src/current-user/profile.ts

@@ -14,6 +14,8 @@ export type TUserProfile = {
   theme: {
     theme: string | undefined;
     nodedcAccent?: string | undefined;
+    nodedcPassiveCard?: string | undefined;
+    nodedcPassiveCardSurface?: string | undefined;
     nodedcCompactToolbar?: boolean | undefined;
   };
 

plane-src/packages/types/src/users.ts

@@ -70,6 +70,8 @@ export type TUserProfile = {
     background: string | undefined;
     darkPalette: boolean | undefined;
     nodedcAccent?: string | undefined;
+    nodedcPassiveCard?: string | undefined;
+    nodedcPassiveCardSurface?: string | undefined;
     nodedcCompactToolbar?: boolean | undefined;
   };
   onboarding_step: TOnboardingSteps;
@@ -110,6 +112,8 @@ export interface IUserTheme {
   background?: string | undefined;
   darkPalette?: boolean | undefined;
   nodedcAccent?: string | undefined;
+  nodedcPassiveCard?: string | undefined;
+  nodedcPassiveCardSurface?: string | undefined;
   nodedcCompactToolbar?: boolean | undefined;
 }
 

plane-src/packages/utils/src/theme/index.ts

@@ -30,6 +30,8 @@ export {
 // NODE.DC runtime accent
 export {
   applyNodedcAccent,
+  applyNodedcPassiveCardColor,
+  applyNodedcPassiveCardSurfaceColor,
   getReadableNodedcTextRgb,
   nodedcAccentHexToRgb,
   normalizeNodedcAccentHex,

plane-src/packages/utils/src/theme/nodedc-accent.ts

@@ -100,3 +100,33 @@ export const applyNodedcAccent = (hex: string | null | undefined): boolean => {
 
   return true;
 };
+
+export const applyNodedcPassiveCardColor = (hex: string | null | undefined): boolean => {
+  if (typeof document === "undefined") return false;
+
+  const passiveCardRgb = nodedcAccentHexToRgb(hex);
+  if (!passiveCardRgb) return false;
+
+  const root = document.documentElement;
+  const onPassiveCardRgb = getReadableNodedcTextRgb(passiveCardRgb);
+
+  root.style.setProperty("--nodedc-card-passive-rgb", formatRgbTuple(passiveCardRgb));
+  root.style.setProperty("--nodedc-on-card-passive-rgb", formatRgbTuple(onPassiveCardRgb));
+
+  return true;
+};
+
+export const applyNodedcPassiveCardSurfaceColor = (hex: string | null | undefined): boolean => {
+  if (typeof document === "undefined") return false;
+
+  const passiveCardSurfaceRgb = nodedcAccentHexToRgb(hex);
+  if (!passiveCardSurfaceRgb) return false;
+
+  const root = document.documentElement;
+  const onPassiveCardSurfaceRgb = getReadableNodedcTextRgb(passiveCardSurfaceRgb);
+
+  root.style.setProperty("--nodedc-card-passive-surface-rgb", formatRgbTuple(passiveCardSurfaceRgb));
+  root.style.setProperty("--nodedc-on-card-passive-surface-rgb", formatRgbTuple(onPassiveCardSurfaceRgb));
+
+  return true;
+};