diff --git a/frontend/src/metabase/questions/components/CollectionBadge.jsx b/frontend/src/metabase/questions/components/CollectionBadge.jsx
index 64c74dc075d80b25509bf0bd8b1156ea238275ca..143520b64333f5aa63cb28db9bc50eef5d7dfa91 100644
--- a/frontend/src/metabase/questions/components/CollectionBadge.jsx
+++ b/frontend/src/metabase/questions/components/CollectionBadge.jsx
@@ -12,8 +12,8 @@ const CollectionBadge = ({ className, collection }) =>
className={cx(className, "flex align-center px1 rounded mx1")}
style={{
fontSize: 14,
- color: Color(collection.color).darken(0.1).hexString(),
- backgroundColor: Color(collection.color).lighten(0.4).hexString()
+ color: Color(collection.color).darken(0.1).hex(),
+ backgroundColor: Color(collection.color).lighten(0.4).hex()
}}
>
{collection.name}
diff --git a/frontend/src/metabase/questions/components/Labels.jsx b/frontend/src/metabase/questions/components/Labels.jsx
index 5ae520ce03096ffb10f506eaa28e00f58b6ec609..cadf7680243fc2acd3dc436d3c45eac04b524f1f 100644
--- a/frontend/src/metabase/questions/components/Labels.jsx
+++ b/frontend/src/metabase/questions/components/Labels.jsx
@@ -47,8 +47,8 @@ class Label extends Component {
<span
className={S.label}
style={{
- backgroundColor: hovered ? color(icon).darken(0.1).hexString() : icon,
- boxShadow: `1px 1px 0 ${color(icon).darken(hovered ? 0.1 : 0.2).hexString()}`,
+ backgroundColor: hovered ? color(icon).darken(0.1).hex() : icon,
+ boxShadow: `1px 1px 0 ${color(icon).darken(hovered ? 0.1 : 0.2).hex()}`,
transition: 'background .3s ease-in-out'
}}
>
diff --git a/frontend/src/metabase/visualizations/Progress.jsx b/frontend/src/metabase/visualizations/Progress.jsx
index 0377fbc4719f0f49e6a08d51bc833253d106deac..faf2bd64d48e4eaa0b1632b54072c80e10045c05 100644
--- a/frontend/src/metabase/visualizations/Progress.jsx
+++ b/frontend/src/metabase/visualizations/Progress.jsx
@@ -80,8 +80,8 @@ export default class Progress extends Component {
const goal = settings["progress.goal"] || 0;
const mainColor = settings["progress.color"];
- const lightColor = Color(mainColor).lighten(0.25).rgbString();
- const darkColor = Color(mainColor).darken(0.30).rgbString();
+ const lightColor = Color(mainColor).lighten(0.25).rgb().string();
+ const darkColor = Color(mainColor).darken(0.30).rgb().string();
const progressColor = mainColor;
const restColor = value > goal ? darkColor : lightColor;
diff --git a/package.json b/package.json
index 90c0187d13866e432a6bc4642934031d857729c1..133d7ca9fe07ef2ec668fcf10b8b930b7529fffd 100644
--- a/package.json
+++ b/package.json
@@ -14,7 +14,7 @@
"babel-polyfill": "^6.6.1",
"chevrotain": "^0.21.0",
"classnames": "^2.1.3",
- "color": "^0.11.1",
+ "color": "^1.0.3",
"crossfilter": "^1.3.12",
"d3": "^3.5.17",
"dc": "^2.0.0-beta.32",
diff --git a/yarn.lock b/yarn.lock
index 1b340aabaf32cca205c8137755cd0fcb46ca741a..82ee8e57f65795e4498dfdaad503e0f734fd832e 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1504,7 +1504,7 @@ color-convert@^0.5.3:
version "0.5.3"
resolved "https://registry.yarnpkg.com/color-convert/-/color-convert-0.5.3.tgz#bdb6c69ce660fadffe0b0007cc447e1b9f7282bd"
-color-convert@^1.3.0:
+color-convert@^1.3.0, color-convert@^1.8.2:
version "1.8.2"
resolved "https://registry.yarnpkg.com/color-convert/-/color-convert-1.8.2.tgz#be868184d7c8631766d54e7078e2672d7c7e3339"
dependencies:
@@ -1520,6 +1520,13 @@ color-string@^0.3.0:
dependencies:
color-name "^1.0.0"
+color-string@^1.4.0:
+ version "1.4.0"
+ resolved "https://registry.yarnpkg.com/color-string/-/color-string-1.4.0.tgz#2b47f8565fb0eb52f9f77c801992b8ca55d6e898"
+ dependencies:
+ color-name "^1.0.0"
+ simple-swizzle "^0.2.2"
+
color@^0.10.1:
version "0.10.1"
resolved "https://registry.yarnpkg.com/color/-/color-0.10.1.tgz#c04188df82a209ddebccecdacd3ec320f193739f"
@@ -1527,7 +1534,7 @@ color@^0.10.1:
color-convert "^0.5.3"
color-string "^0.3.0"
-color@^0.11.0, color@^0.11.1, color@^0.11.3, color@^0.11.4:
+color@^0.11.0, color@^0.11.3, color@^0.11.4:
version "0.11.4"
resolved "https://registry.yarnpkg.com/color/-/color-0.11.4.tgz#6d7b5c74fb65e841cd48792ad1ed5e07b904d764"
dependencies:
@@ -1535,6 +1542,13 @@ color@^0.11.0, color@^0.11.1, color@^0.11.3, color@^0.11.4:
color-convert "^1.3.0"
color-string "^0.3.0"
+color@^1.0.3:
+ version "1.0.3"
+ resolved "https://registry.yarnpkg.com/color/-/color-1.0.3.tgz#e48e832d85f14ef694fb468811c2d5cfe729b55d"
+ dependencies:
+ color-convert "^1.8.2"
+ color-string "^1.4.0"
+
colormin@^1.0.5:
version "1.1.2"
resolved "https://registry.yarnpkg.com/colormin/-/colormin-1.1.2.tgz#ea2f7420a72b96881a38aae59ec124a6f7298133"
@@ -3353,6 +3367,10 @@ is-arrayish@^0.2.1:
version "0.2.1"
resolved "https://registry.yarnpkg.com/is-arrayish/-/is-arrayish-0.2.1.tgz#77c99840527aa8ecb1a8ba697b80645a7a926a9d"
+is-arrayish@^0.3.1:
+ version "0.3.1"
+ resolved "https://registry.yarnpkg.com/is-arrayish/-/is-arrayish-0.3.1.tgz#c2dfc386abaa0c3e33c48db3fe87059e69065efd"
+
is-binary-path@^1.0.0:
version "1.0.1"
resolved "https://registry.yarnpkg.com/is-binary-path/-/is-binary-path-1.0.1.tgz#75f16642b480f187a711c814161fd3a4a7655898"
@@ -6180,6 +6198,12 @@ signal-exit@^3.0.0:
version "3.0.2"
resolved "https://registry.yarnpkg.com/signal-exit/-/signal-exit-3.0.2.tgz#b5fdc08f1287ea1178628e415e25132b73646c6d"
+simple-swizzle@^0.2.2:
+ version "0.2.2"
+ resolved "https://registry.yarnpkg.com/simple-swizzle/-/simple-swizzle-0.2.2.tgz#a4da6b635ffcccca33f70d17cb92592de95e557a"
+ dependencies:
+ is-arrayish "^0.3.1"
+
slash@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/slash/-/slash-1.0.0.tgz#c41f2f6c39fc16d1cd17ad4b5d896114ae470d55"