فهرست منبع

tweak combined color ui

- use short label
Alexander Rose 4 سال پیش
والد
کامیت
7255e08ecf
2فایلهای تغییر یافته به همراه3 افزوده شده و 3 حذف شده
  1. 1 1
      src/mol-plugin-ui/controls/color.tsx
  2. 2 2
      src/mol-plugin-ui/skin/base/components/controls.scss

+ 1 - 1
src/mol-plugin-ui/controls/color.tsx

@@ -78,7 +78,7 @@ export class CombinedColorControl extends React.PureComponent<ParamProps<PD.Colo
                 control={<Button onClick={this.toggleExpanded} inline className='msp-combined-color-button' style={{ background: Color.toStyle(this.props.value) }} />} />
             {this.state.isExpanded && <div className='msp-control-offset'>
                 {this.swatch()}
-                <ControlRow label='RGB' control={<div style={{ display: 'flex', textAlignLast: 'center' }}>
+                <ControlRow label='RGB' className='msp-control-label-short' control={<div style={{ display: 'flex', textAlignLast: 'center', left: '80px' }}>
                     <TextInput onChange={this.onR} numeric value={r} delayMs={250} style={{ order: 1, flex: '1 1 auto', minWidth: 0 }} className='msp-form-control' onEnter={this.props.onEnter} blurOnEnter={true} blurOnEscape={true} />
                     <TextInput onChange={this.onG} numeric value={g} delayMs={250} style={{ order: 2, flex: '1 1 auto', minWidth: 0 }} className='msp-form-control' onEnter={this.props.onEnter} blurOnEnter={true} blurOnEscape={true} />
                     <TextInput onChange={this.onB} numeric value={b} delayMs={250} style={{ order: 3, flex: '1 1 auto', minWidth: 0 }} className='msp-form-control' onEnter={this.props.onEnter} blurOnEnter={true} blurOnEscape={true} />

+ 2 - 2
src/mol-plugin-ui/skin/base/components/controls.scss

@@ -56,11 +56,11 @@
 
 .msp-control-label-short {
     > span {
-        width: $control-label-short-width + $control-spacing;
+        width: $control-label-short-width + $control-spacing !important;
     }
 
     > div:nth-child(2) {
-        left: $control-label-short-width + $control-spacing;
+        left: $control-label-short-width + $control-spacing !important;
     }
 }