From a069a745110b02fb7ae78b0c065f43f8e42ea417 Mon Sep 17 00:00:00 2001
From: luna215 <paulluna0215@gmail.com>
Date: Wed, 28 Nov 2018 16:18:56 -0800
Subject: [PATCH] Added a background linear gradient to color control
parameters
---
src/mol-plugin/ui/controls/parameters.tsx | 5 ++++-
1 file changed, 4 insertions(+), 1 deletion(-)
diff --git a/src/mol-plugin/ui/controls/parameters.tsx b/src/mol-plugin/ui/controls/parameters.tsx
index 3cc673922..0ec240780 100644
--- a/src/mol-plugin/ui/controls/parameters.tsx
+++ b/src/mol-plugin/ui/controls/parameters.tsx
@@ -248,7 +248,10 @@ export class ColorControl extends SimpleParam<PD.Color> {
}
renderControl() {
- return <select value={this.props.value} onChange={this.onChange} style={{ borderLeft: `16px solid ${Color.toStyle(this.props.value)}` }}>
+ let rgb: any[] = Color.toStyle(this.props.value).replace('rgb(', '').split(', ');
+ rgb = rgb.map(c => parseInt(c));
+ let secondArg = `rgb(${rgb[0]}, ${rgb[1]}, ${rgb[2]}, 0.0)`;
+ return <select value={this.props.value} onChange={this.onChange} style={{background: `linear-gradient(90deg, ${Color.toStyle(this.props.value)}, ${secondArg})`}}>
{ColorValueOption(this.props.value)}
{ColorOptions()}
</select>;
--
GitLab