refactor: adjust dark mode color balance (#234)

fold-dev · Jun 1, 2024 · 035ee3c · 035ee3c
1 parent 4cb41c7
commit 035ee3c
Show file tree

Hide file tree

Showing 5 changed files with 10 additions and 10 deletions.
diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
     "name": "fold-dev",
     "title": "Fold",
-    "version": "0.11.3",
+    "version": "0.11.4",
     "description": "The UI component library for product teams.",
     "workspaces": {
         "packages": [

diff --git a/packages/core/package.json b/packages/core/package.json
@@ -1,7 +1,7 @@
 {
     "name": "@fold-dev/core",
     "title": "Fold",
-    "version": "0.11.3",
+    "version": "0.11.4",
     "description": "The UI library for product teams.",
     "main": "dist/index.js",
     "module": "dist/index.js",

diff --git a/packages/core/src/pill/pill.css b/packages/core/src/pill/pill.css
@@ -4,7 +4,7 @@
     --f-pill-buffer-icon: var(--f-space-1);
     --f-pill-border-width: 1px;
     --f-pill-border-radius: var(--f-radius-full);
-    --f-pill-border-color: var(--f-color-surface-strongest);
+    --f-pill-border-color: var(--f-color-border);
     --f-pill-color: var(--f-color-text-weaker);
     --f-pill-color-subtle: var(--f-color-text-weaker);
     --f-pill-color-color: var(--f-color-text-on-color);

diff --git a/packages/design/package.json b/packages/design/package.json
@@ -1,7 +1,7 @@
 {
     "name": "@fold-dev/design",
     "title": "Design Tokens",
-    "version": "0.11.3",
+    "version": "0.11.4",
     "description": "The UI library for product teams.",
     "main": "",
     "module": "",

diff --git a/packages/design/tokens/theme/dark.json b/packages/design/tokens/theme/dark.json
@@ -55,12 +55,12 @@
                 "on-color": { "value": "{color.black}" }
             },
             "surface": {
-                " ": { "value": "{color.base.800}" },
-                "strong": { "value": "{color.base.700}" },
-                "stronger": { "value": "{color.base.600}" },
-                "strongest": { "value": "{color.base.400}" },
-                "highlight": { "value": "{color.accent.700}" },
-                "inverse": { "value": "{color.base.300}" }
+                " ": { "value": "{color.base.900}" },
+                "strong": { "value": "{color.base.800}" },
+                "stronger": { "value": "{color.base.700}" },
+                "strongest": { "value": "{color.base.500}" },
+                "highlight": { "value": "{color.accent.800}" },
+                "inverse": { "value": "{color.base.400}" }
             },
             "border": {
                 " ": { "value": "{color.base.700}" },