@dssp/dkpi 1.0.0-alpha.8 → 1.0.0-alpha.81

package/dist-client/shared/func.js

@@ -0,0 +1,22 @@
+import moment from 'moment';
+// a와 b의 차이를 계산하여 값과 클래스를 반환
+export const calcDiff = (a, b) => {
+    const origin = Number(a || '0');
+    const complete = Number(b || '0');
+    const diff = complete - origin;
+    if (!isFinite(diff))
+        return 0;
+    return diff;
+};
+// a와 b의 날짜 차이를 계산하여 값과 클래스를 반환
+export const calcDateDiff = (a, b) => {
+    const origin = moment(a, 'YYYY-MM-DD', true);
+    const complete = moment(b, 'YYYY-MM-DD', true);
+    if (!origin.isValid() || !complete.isValid())
+        return 0;
+    const diffDays = complete.diff(origin, 'days');
+    if (diffDays === 0)
+        return 0;
+    return diffDays;
+};
+//# sourceMappingURL=func.js.map

package/dist-client/shared/func.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"func.js","sourceRoot":"","sources":["../../client/shared/func.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,QAAQ,CAAA;AAE3B,4BAA4B;AAC5B,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,CAAkB,EAAE,CAAkB,EAAU,EAAE;IACzE,MAAM,MAAM,GAAG,MAAM,CAAC,CAAC,IAAI,GAAG,CAAC,CAAA;IAC/B,MAAM,QAAQ,GAAG,MAAM,CAAC,CAAC,IAAI,GAAG,CAAC,CAAA;IACjC,MAAM,IAAI,GAAG,QAAQ,GAAG,MAAM,CAAA;IAC9B,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC;QAAE,OAAO,CAAC,CAAA;IAC7B,OAAO,IAAI,CAAA;AACb,CAAC,CAAA;AAED,+BAA+B;AAC/B,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,CAAS,EAAE,CAAS,EAAU,EAAE;IAC3D,MAAM,MAAM,GAAG,MAAM,CAAC,CAAC,EAAE,YAAY,EAAE,IAAI,CAAC,CAAA;IAC5C,MAAM,QAAQ,GAAG,MAAM,CAAC,CAAC,EAAE,YAAY,EAAE,IAAI,CAAC,CAAA;IAC9C,IAAI,CAAC,MAAM,CAAC,OAAO,EAAE,IAAI,CAAC,QAAQ,CAAC,OAAO,EAAE;QAAE,OAAO,CAAC,CAAA;IAEtD,MAAM,QAAQ,GAAG,QAAQ,CAAC,IAAI,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IAC9C,IAAI,QAAQ,KAAK,CAAC;QAAE,OAAO,CAAC,CAAA;IAE5B,OAAO,QAAQ,CAAA;AACjB,CAAC,CAAA","sourcesContent":["import moment from 'moment'\n\n// a와 b의 차이를 계산하여 값과 클래스를 반환\nexport const calcDiff = (a: string | number, b: string | number): number => {\n  const origin = Number(a || '0')\n  const complete = Number(b || '0')\n  const diff = complete - origin\n  if (!isFinite(diff)) return 0\n  return diff\n}\n\n// a와 b의 날짜 차이를 계산하여 값과 클래스를 반환\nexport const calcDateDiff = (a: string, b: string): number => {\n  const origin = moment(a, 'YYYY-MM-DD', true)\n  const complete = moment(b, 'YYYY-MM-DD', true)\n  if (!origin.isValid() || !complete.isValid()) return 0\n\n  const diffDays = complete.diff(origin, 'days')\n  if (diffDays === 0) return 0\n\n  return diffDays\n}\n"]}

package/dist-client/shared/integration-fetch.d.ts

@@ -0,0 +1,35 @@
+/**
+ * 완공 입력 화면의 "자동 수집" 워크플로용 외부 시스템 연동 수집 함수.
+ *
+ * 데모 목적: 키스콘·세움터·올바로에서 "연동을 통해 값을 가져온다"는 워크플로를
+ * 보여주기 위한 것. 실제 스크래핑/API 연동의 깊이는 이 함수 내부에 캡슐화되어
+ * 있으므로, 추후 실연동(integration-kiscon / data-go-kr / integration-allbaro)
+ * 으로 교체할 때 이 본문만 바꾸면 화면/저장 흐름은 그대로 유지된다.
+ */
+export type IntegrationSource = 'kiscon' | 'saeumteo' | 'allbaro';
+export interface IntegrationSourceMeta {
+    source: IntegrationSource;
+    label: string;
+    icon: string;
+    desc: string;
+}
+/** 화면에 표시할 연동 소스 목록 (수집 순서대로) */
+export declare const INTEGRATION_SOURCES: IntegrationSourceMeta[];
+export interface CollectedField {
+    /** 폼의 projectKey (KPI_METRIC_KEY_MAPPING 의 projectKey 와 일치) */
+    projectKey: string;
+    label: string;
+    value: number | string;
+    unit?: string;
+}
+export interface CollectionResult {
+    source: IntegrationSource;
+    label: string;
+    fields: CollectedField[];
+}
+/**
+ * 한 외부 시스템에서 연동으로 값을 수집한다.
+ * 데모에서는 연동 수집을 흉내내기 위해 짧은 지연 후 대표값을 반환한다
+ * (프로젝트에 이미 있는 값이 있으면 우선 사용).
+ */
+export declare function collectFromSource(source: IntegrationSource, project: any): Promise<CollectionResult>;

package/dist-client/shared/integration-fetch.js

@@ -0,0 +1,53 @@
+/**
+ * 완공 입력 화면의 "자동 수집" 워크플로용 외부 시스템 연동 수집 함수.
+ *
+ * 데모 목적: 키스콘·세움터·올바로에서 "연동을 통해 값을 가져온다"는 워크플로를
+ * 보여주기 위한 것. 실제 스크래핑/API 연동의 깊이는 이 함수 내부에 캡슐화되어
+ * 있으므로, 추후 실연동(integration-kiscon / data-go-kr / integration-allbaro)
+ * 으로 교체할 때 이 본문만 바꾸면 화면/저장 흐름은 그대로 유지된다.
+ */
+/** 화면에 표시할 연동 소스 목록 (수집 순서대로) */
+export const INTEGRATION_SOURCES = [
+    { source: 'kiscon', label: '키스콘', icon: '🏗', desc: '건설공사대장 통보' },
+    { source: 'saeumteo', label: '세움터', icon: '🏛', desc: '건축물대장 / 건축HUB' },
+    { source: 'allbaro', label: '올바로', icon: '♻', desc: '건설폐기물 처리실적' }
+];
+/**
+ * 한 외부 시스템에서 연동으로 값을 수집한다.
+ * 데모에서는 연동 수집을 흉내내기 위해 짧은 지연 후 대표값을 반환한다
+ * (프로젝트에 이미 있는 값이 있으면 우선 사용).
+ */
+export async function collectFromSource(source, project) {
+    // 연동 수집이 "진행되는" 느낌을 주기 위한 짧은 지연 (데모용)
+    await new Promise(r => setTimeout(r, 700));
+    const bc = (project === null || project === void 0 ? void 0 : project.buildingComplex) || {};
+    switch (source) {
+        case 'kiscon':
+            return {
+                source,
+                label: '키스콘',
+                fields: [
+                    { projectKey: 'constructionPeriod', label: '계획공사기간', value: 30, unit: '개월' },
+                    { projectKey: 'constructionCost', label: '계획공사비', value: bc.constructionCost || 2500, unit: '억원' }
+                ]
+            };
+        case 'saeumteo':
+            return {
+                source,
+                label: '세움터',
+                fields: [
+                    { projectKey: 'area', label: '연면적', value: bc.area || 114000, unit: '㎡' },
+                    { projectKey: 'floorAreaRatio', label: '용적율', value: bc.floorAreaRatio || 250, unit: '%' },
+                    { projectKey: 'upperFloorCount', label: '지상층수', value: 25, unit: '층' },
+                    { projectKey: 'lowerFloorCount', label: '지하층수', value: 3, unit: '층' }
+                ]
+            };
+        case 'allbaro':
+            return {
+                source,
+                label: '올바로',
+                fields: [{ projectKey: 'totalConstructionWasteAmount', label: '총 건설폐기물', value: 15, unit: 'ton' }]
+            };
+    }
+}
+//# sourceMappingURL=integration-fetch.js.map

package/dist-client/shared/integration-fetch.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"integration-fetch.js","sourceRoot":"","sources":["../../client/shared/integration-fetch.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAWH,iCAAiC;AACjC,MAAM,CAAC,MAAM,mBAAmB,GAA4B;IAC1D,EAAE,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,WAAW,EAAE;IACjE,EAAE,MAAM,EAAE,UAAU,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,eAAe,EAAE;IACvE,EAAE,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,YAAY,EAAE;CACnE,CAAA;AAgBD;;;;GAIG;AACH,MAAM,CAAC,KAAK,UAAU,iBAAiB,CAAC,MAAyB,EAAE,OAAY;IAC7E,sCAAsC;IACtC,MAAM,IAAI,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC,CAAA;IAE1C,MAAM,EAAE,GAAG,CAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,eAAe,KAAI,EAAE,CAAA;IAEzC,QAAQ,MAAM,EAAE,CAAC;QACf,KAAK,QAAQ;YACX,OAAO;gBACL,MAAM;gBACN,KAAK,EAAE,KAAK;gBACZ,MAAM,EAAE;oBACN,EAAE,UAAU,EAAE,oBAAoB,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE;oBAC5E,EAAE,UAAU,EAAE,kBAAkB,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,CAAC,gBAAgB,IAAI,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE;iBACnG;aACF,CAAA;QAEH,KAAK,UAAU;YACb,OAAO;gBACL,MAAM;gBACN,KAAK,EAAE,KAAK;gBACZ,MAAM,EAAE;oBACN,EAAE,UAAU,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,CAAC,IAAI,IAAI,MAAM,EAAE,IAAI,EAAE,GAAG,EAAE;oBACzE,EAAE,UAAU,EAAE,gBAAgB,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,CAAC,cAAc,IAAI,GAAG,EAAE,IAAI,EAAE,GAAG,EAAE;oBAC1F,EAAE,UAAU,EAAE,iBAAiB,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,EAAE,EAAE,IAAI,EAAE,GAAG,EAAE;oBACtE,EAAE,UAAU,EAAE,iBAAiB,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,CAAC,EAAE,IAAI,EAAE,GAAG,EAAE;iBACtE;aACF,CAAA;QAEH,KAAK,SAAS;YACZ,OAAO;gBACL,MAAM;gBACN,KAAK,EAAE,KAAK;gBACZ,MAAM,EAAE,CAAC,EAAE,UAAU,EAAE,8BAA8B,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;aACnG,CAAA;IACL,CAAC;AACH,CAAC","sourcesContent":["/**\n * 완공 입력 화면의 \"자동 수집\" 워크플로용 외부 시스템 연동 수집 함수.\n *\n * 데모 목적: 키스콘·세움터·올바로에서 \"연동을 통해 값을 가져온다\"는 워크플로를\n * 보여주기 위한 것. 실제 스크래핑/API 연동의 깊이는 이 함수 내부에 캡슐화되어\n * 있으므로, 추후 실연동(integration-kiscon / data-go-kr / integration-allbaro)\n * 으로 교체할 때 이 본문만 바꾸면 화면/저장 흐름은 그대로 유지된다.\n */\n\nexport type IntegrationSource = 'kiscon' | 'saeumteo' | 'allbaro'\n\nexport interface IntegrationSourceMeta {\n  source: IntegrationSource\n  label: string\n  icon: string\n  desc: string\n}\n\n/** 화면에 표시할 연동 소스 목록 (수집 순서대로) */\nexport const INTEGRATION_SOURCES: IntegrationSourceMeta[] = [\n  { source: 'kiscon', label: '키스콘', icon: '🏗', desc: '건설공사대장 통보' },\n  { source: 'saeumteo', label: '세움터', icon: '🏛', desc: '건축물대장 / 건축HUB' },\n  { source: 'allbaro', label: '올바로', icon: '♻', desc: '건설폐기물 처리실적' }\n]\n\nexport interface CollectedField {\n  /** 폼의 projectKey (KPI_METRIC_KEY_MAPPING 의 projectKey 와 일치) */\n  projectKey: string\n  label: string\n  value: number | string\n  unit?: string\n}\n\nexport interface CollectionResult {\n  source: IntegrationSource\n  label: string\n  fields: CollectedField[]\n}\n\n/**\n * 한 외부 시스템에서 연동으로 값을 수집한다.\n * 데모에서는 연동 수집을 흉내내기 위해 짧은 지연 후 대표값을 반환한다\n * (프로젝트에 이미 있는 값이 있으면 우선 사용).\n */\nexport async function collectFromSource(source: IntegrationSource, project: any): Promise<CollectionResult> {\n  // 연동 수집이 \"진행되는\" 느낌을 주기 위한 짧은 지연 (데모용)\n  await new Promise(r => setTimeout(r, 700))\n\n  const bc = project?.buildingComplex || {}\n\n  switch (source) {\n    case 'kiscon':\n      return {\n        source,\n        label: '키스콘',\n        fields: [\n          { projectKey: 'constructionPeriod', label: '계획공사기간', value: 30, unit: '개월' },\n          { projectKey: 'constructionCost', label: '계획공사비', value: bc.constructionCost || 2500, unit: '억원' }\n        ]\n      }\n\n    case 'saeumteo':\n      return {\n        source,\n        label: '세움터',\n        fields: [\n          { projectKey: 'area', label: '연면적', value: bc.area || 114000, unit: '㎡' },\n          { projectKey: 'floorAreaRatio', label: '용적율', value: bc.floorAreaRatio || 250, unit: '%' },\n          { projectKey: 'upperFloorCount', label: '지상층수', value: 25, unit: '층' },\n          { projectKey: 'lowerFloorCount', label: '지하층수', value: 3, unit: '층' }\n        ]\n      }\n\n    case 'allbaro':\n      return {\n        source,\n        label: '올바로',\n        fields: [{ projectKey: 'totalConstructionWasteAmount', label: '총 건설폐기물', value: 15, unit: 'ton' }]\n      }\n  }\n}\n"]}

package/dist-client/themes/dark.css

@@ -1,17 +1,17 @@
 .dark {
-  --md-sys-color-primary: rgb(174 198 255);
-  --md-sys-color-surface-tint: rgb(174 198 255);
-  --md-sys-color-on-primary: rgb(17 47 96);
-  --md-sys-color-primary-container: rgb(44 70 120);
+  --md-sys-color-primary: rgb(173 198 255);
+  --md-sys-color-surface-tint: rgb(173 198 255);
+  --md-sys-color-on-primary: rgb(16 47 96);
+  --md-sys-color-primary-container: rgb(43 70 120);
   --md-sys-color-on-primary-container: rgb(216 226 255);
-  --md-sys-color-secondary: rgb(191 198 220);
-  --md-sys-color-on-secondary: rgb(41 48 65);
-  --md-sys-color-secondary-container: rgb(63 71 89);
-  --md-sys-color-on-secondary-container: rgb(219 226 249);
-  --md-sys-color-tertiary: rgb(222 188 223);
-  --md-sys-color-on-tertiary: rgb(64 40 67);
-  --md-sys-color-tertiary-container: rgb(88 62 91);
-  --md-sys-color-on-tertiary-container: rgb(252 215 251);
+  --md-sys-color-secondary: rgb(167 200 255);
+  --md-sys-color-on-secondary: rgb(4 48 95);
+  --md-sys-color-secondary-container: rgb(36 71 119);
+  --md-sys-color-on-secondary-container: rgb(213 227 255);
+  --md-sys-color-tertiary: rgb(234 181 238);
+  --md-sys-color-on-tertiary: rgb(72 32 79);
+  --md-sys-color-tertiary-container: rgb(96 55 103);
+  --md-sys-color-on-tertiary-container: rgb(254 214 255);
   --md-sys-color-error: rgb(255 180 171);
   --md-sys-color-on-error: rgb(105 0 5);
   --md-sys-color-error-container: rgb(147 0 10);
@@ -21,7 +21,7 @@
   --md-sys-color-surface: rgb(17 19 24);
   --md-sys-color-on-surface: rgb(226 226 233);
   --md-sys-color-surface-variant: rgb(68 71 79);
-  --md-sys-color-on-surface-variant: rgb(197 198 208);
+  --md-sys-color-on-surface-variant: rgb(196 198 208);
   --md-sys-color-outline: rgb(142 144 153);
   --md-sys-color-outline-variant: rgb(68 71 79);
   --md-sys-color-shadow: rgb(0 0 0);
@@ -30,17 +30,17 @@
   --md-sys-color-inverse-on-surface: rgb(47 48 54);
   --md-sys-color-inverse-primary: rgb(68 94 145);
   --md-sys-color-primary-fixed: rgb(216 226 255);
-  --md-sys-color-on-primary-fixed: rgb(0 26 66);
-  --md-sys-color-primary-fixed-dim: rgb(174 198 255);
-  --md-sys-color-on-primary-fixed-variant: rgb(44 70 120);
-  --md-sys-color-secondary-fixed: rgb(219 226 249);
-  --md-sys-color-on-secondary-fixed: rgb(20 27 44);
-  --md-sys-color-secondary-fixed-dim: rgb(191 198 220);
-  --md-sys-color-on-secondary-fixed-variant: rgb(63 71 89);
-  --md-sys-color-tertiary-fixed: rgb(252 215 251);
-  --md-sys-color-on-tertiary-fixed: rgb(41 19 45);
-  --md-sys-color-tertiary-fixed-dim: rgb(222 188 223);
-  --md-sys-color-on-tertiary-fixed-variant: rgb(88 62 91);
+  --md-sys-color-on-primary-fixed: rgb(0 26 65);
+  --md-sys-color-primary-fixed-dim: rgb(173 198 255);
+  --md-sys-color-on-primary-fixed-variant: rgb(43 70 120);
+  --md-sys-color-secondary-fixed: rgb(213 227 255);
+  --md-sys-color-on-secondary-fixed: rgb(0 27 60);
+  --md-sys-color-secondary-fixed-dim: rgb(167 200 255);
+  --md-sys-color-on-secondary-fixed-variant: rgb(36 71 119);
+  --md-sys-color-tertiary-fixed: rgb(254 214 255);
+  --md-sys-color-on-tertiary-fixed: rgb(48 9 57);
+  --md-sys-color-tertiary-fixed-dim: rgb(234 181 238);
+  --md-sys-color-on-tertiary-fixed-variant: rgb(96 55 103);
   --md-sys-color-surface-dim: rgb(17 19 24);
   --md-sys-color-surface-bright: rgb(55 57 62);
   --md-sys-color-surface-container-lowest: rgb(12 14 19);

package/dist-client/themes/light.css

@@ -1,17 +1,17 @@
 .light {
-  --md-sys-color-primary: rgb(68 94 145);
+  --md-sys-color-primary: rgb(11 77 162);
   --md-sys-color-surface-tint: rgb(68 94 145);
   --md-sys-color-on-primary: rgb(255 255 255);
   --md-sys-color-primary-container: rgb(216 226 255);
-  --md-sys-color-on-primary-container: rgb(44 70 120);
-  --md-sys-color-secondary: rgb(87 94 113);
+  --md-sys-color-on-primary-container: rgb(43 70 120);
+  --md-sys-color-secondary: rgb(36, 41, 60);
   --md-sys-color-on-secondary: rgb(255 255 255);
-  --md-sys-color-secondary-container: rgb(219 226 249);
-  --md-sys-color-on-secondary-container: rgb(63 71 89);
-  --md-sys-color-tertiary: rgb(113 85 115);
+  --md-sys-color-secondary-container: rgb(213 227 255);
+  --md-sys-color-on-secondary-container: rgb(36 71 119);
+  --md-sys-color-tertiary: rgb(122 79 128);
   --md-sys-color-on-tertiary: rgb(255 255 255);
-  --md-sys-color-tertiary-container: rgb(252 215 251);
-  --md-sys-color-on-tertiary-container: rgb(88 62 91);
+  --md-sys-color-tertiary-container: rgb(254 214 255);
+  --md-sys-color-on-tertiary-container: rgb(96 55 103);
   --md-sys-color-error: rgb(186 26 26);
   --md-sys-color-on-error: rgb(255 255 255);
   --md-sys-color-error-container: rgb(255 218 214);
@@ -23,29 +23,29 @@
   --md-sys-color-surface-variant: rgb(225 226 236);
   --md-sys-color-on-surface-variant: rgb(68 71 79);
   --md-sys-color-outline: rgb(117 119 127);
-  --md-sys-color-outline-variant: rgb(197 198 208);
+  --md-sys-color-outline-variant: rgb(196 198 208);
   --md-sys-color-shadow: rgb(0 0 0);
   --md-sys-color-scrim: rgb(0 0 0);
   --md-sys-color-inverse-surface: rgb(47 48 54);
   --md-sys-color-inverse-on-surface: rgb(240 240 247);
-  --md-sys-color-inverse-primary: rgb(174 198 255);
+  --md-sys-color-inverse-primary: rgb(173 198 255);
   --md-sys-color-primary-fixed: rgb(216 226 255);
-  --md-sys-color-on-primary-fixed: rgb(0 26 66);
-  --md-sys-color-primary-fixed-dim: rgb(174 198 255);
-  --md-sys-color-on-primary-fixed-variant: rgb(44 70 120);
-  --md-sys-color-secondary-fixed: rgb(219 226 249);
-  --md-sys-color-on-secondary-fixed: rgb(20 27 44);
-  --md-sys-color-secondary-fixed-dim: rgb(191 198 220);
-  --md-sys-color-on-secondary-fixed-variant: rgb(63 71 89);
-  --md-sys-color-tertiary-fixed: rgb(252 215 251);
-  --md-sys-color-on-tertiary-fixed: rgb(41 19 45);
-  --md-sys-color-tertiary-fixed-dim: rgb(222 188 223);
-  --md-sys-color-on-tertiary-fixed-variant: rgb(88 62 91);
+  --md-sys-color-on-primary-fixed: rgb(0 26 65);
+  --md-sys-color-primary-fixed-dim: rgb(173 198 255);
+  --md-sys-color-on-primary-fixed-variant: rgb(43 70 120);
+  --md-sys-color-secondary-fixed: rgb(213 227 255);
+  --md-sys-color-on-secondary-fixed: rgb(0 27 60);
+  --md-sys-color-secondary-fixed-dim: rgb(167 200 255);
+  --md-sys-color-on-secondary-fixed-variant: rgb(36 71 119);
+  --md-sys-color-tertiary-fixed: rgb(254 214 255);
+  --md-sys-color-on-tertiary-fixed: rgb(48 9 57);
+  --md-sys-color-tertiary-fixed-dim: rgb(234 181 238);
+  --md-sys-color-on-tertiary-fixed-variant: rgb(96 55 103);
   --md-sys-color-surface-dim: rgb(217 217 224);
   --md-sys-color-surface-bright: rgb(249 249 255);
   --md-sys-color-surface-container-lowest: rgb(255 255 255);
   --md-sys-color-surface-container-low: rgb(243 243 250);
-  --md-sys-color-surface-container: rgb(238 237 244);
-  --md-sys-color-surface-container-high: rgb(232 231 239);
+  --md-sys-color-surface-container: rgb(237 237 244);
+  --md-sys-color-surface-container-high: rgb(232 231 238);
   --md-sys-color-surface-container-highest: rgb(226 226 233);
 }