fix(drawing): add sub shadow for color picker control button

box · Jan 14, 2021 · 699c3ff · 699c3ff
1 parent 52a08e3
commit 699c3ff
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 1 deletion.
diff --git a/src/lib/viewers/controls/color-picker/ColorPickerControl.scss b/src/lib/viewers/controls/color-picker/ColorPickerControl.scss
@@ -33,6 +33,12 @@
     }
 }
 
+.bp-ColorPickerControl-highlight {
+    padding: 8px;
+    background-color: $fours;
+    border-radius: 4px;
+}
+
 .bp-ColorPickerControl-swatch {
     width: 18px;
     height: 18px;

diff --git a/src/lib/viewers/controls/color-picker/ColorPickerControl.tsx b/src/lib/viewers/controls/color-picker/ColorPickerControl.tsx
@@ -31,7 +31,9 @@ export default function ColorPickerControl({
                 type="button"
                 {...rest}
             >
-                <div className="bp-ColorPickerControl-swatch" style={{ backgroundColor: activeColor }} />
+                <div className="bp-ColorPickerControl-highlight">
+                    <div className="bp-ColorPickerControl-swatch" style={{ backgroundColor: activeColor }} />
+                </div>
             </button>
             {isColorPickerToggled && (
                 <div className="bp-ColorPickerControl-palette">