pull/3421/head
Andrew Watkins 2018-05-10 16:20:22 -07:00
parent b9a7068a46
commit 803875c1bb
3 changed files with 23 additions and 54 deletions

View File

@ -1,7 +1,7 @@
import React, {PureComponent} from 'react' import React, {PureComponent} from 'react'
import {BinaryExpressionNode, MemberExpressionNode} from 'src/types/ifql' import {BinaryExpressionNode, MemberExpressionNode} from 'src/types/ifql'
type FilterNode = BinaryExpressionNode | MemberExpressionNode type FilterNode = BinaryExpressionNode & MemberExpressionNode
interface Props { interface Props {
nodes: FilterNode[] nodes: FilterNode[]
@ -57,7 +57,7 @@ class FilterPreviewNode extends PureComponent<FilterPreviewNodeProps> {
return <div className="ifql-filter--operator">{node.source}</div> return <div className="ifql-filter--operator">{node.source}</div>
} }
default: { default: {
return '' return <div />
} }
} }
} }

View File

@ -30,7 +30,7 @@ class TimeMachineEditor extends PureComponent<Props> {
} }
if (this.props.visibility === 'visible') { if (this.props.visibility === 'visible') {
this.editor.refresh() setTimeout(() => this.editor.refresh(), 60)
} }
} }
@ -54,9 +54,9 @@ class TimeMachineEditor extends PureComponent<Props> {
autoCursor={true} autoCursor={true}
value={script} value={script}
options={options} options={options}
onKeyUp={this.handleKeyUp}
onBeforeChange={this.updateCode} onBeforeChange={this.updateCode}
onTouchStart={this.onTouchStart} onTouchStart={this.onTouchStart}
onKeyUp={this.handleKeyUp}
editorDidMount={this.handleMount} editorDidMount={this.handleMount}
/> />
</div> </div>

View File

@ -3,16 +3,10 @@ $ifql-node-tooltip-gap: 4px;
$ifql-node-gap: 5px; $ifql-node-gap: 5px;
$ifql-node-padding: 10px; $ifql-node-padding: 10px;
$ifql-arg-min-width: 120px; $ifql-arg-min-width: 120px;
<<<<<<< Updated upstream
=======
$ifql-number-color: $c-neutrino; $ifql-number-color: $c-neutrino;
$ifql-string-color: $c-honeydew; $ifql-string-color: $c-honeydew;
$ifql-boolean-color: $c-viridian; $ifql-boolean-color: $c-viridian;
$ifql-invalid-color: $c-viridian; $ifql-invalid-color: $c-viridian;
>>>>>>> Stashed changes
/* /*
Shared Node styles Shared Node styles
------------------ ------------------
@ -232,26 +226,11 @@ $ifql-invalid-color: $c-viridian;
------------------------------------------------------------------------------ ------------------------------------------------------------------------------
*/ */
<<<<<<< Updated upstream
.ifql-filter--expression {
min-height: 26px;
padding: 5px;
background-color: $g2-kevlar;
display: flex;
align-items: center;
border-radius: $radius - 1px;
transition: background-color 0.25s ease;
>.ifql-filter--expression {
background-color: $g4-onyx;
border-radius: $radius - 2px;
}
=======
$ifql-filter-gap: 6px; $ifql-filter-gap: 6px;
$ifql-filter-unit: 26px; $ifql-filter-unit: 26px;
$ifql-filter-unit-wrapped: 34px; $ifql-filter-unit-wrapped: 34px;
$ifql-filter-expression: $g3-castle; $ifql-filter-expression: $g3-castle;
$ifql-filter-parens: $g5-pepper; $ifql-filter-parens: $g5-pepper;
%ifql-filter-style { %ifql-filter-style {
height: $ifql-filter-unit; height: $ifql-filter-unit;
line-height: $ifql-filter-unit; line-height: $ifql-filter-unit;
@ -264,7 +243,6 @@ $ifql-filter-parens: $g5-pepper;
background-color: $ifql-filter-expression; background-color: $ifql-filter-expression;
border-radius: 3px 0 0 3px; border-radius: 3px 0 0 3px;
padding-left: $ifql-filter-gap; padding-left: $ifql-filter-gap;
>>>>>>> Stashed changes
} }
.ifql-filter--operator { .ifql-filter--operator {
@ -273,32 +251,23 @@ $ifql-filter-parens: $g5-pepper;
padding: 0 ($ifql-filter-gap / 2); padding: 0 ($ifql-filter-gap / 2);
} }
<<<<<<< Updated upstream .ifql-filter--value+.ifql-filter--operator,
.func-node:hover { .ifql-filter--paren-close+.ifql-filter--operator {
.ifql-filter--expression {
background-color: $g4-onyx;
>.ifql-filter--expression {
background-color: $g6-smoke;
}
=======
.ifql-filter--value + .ifql-filter--operator,
.ifql-filter--paren-close + .ifql-filter--operator {
padding: 0 $ifql-filter-gap; padding: 0 $ifql-filter-gap;
} }
.ifql-filter--key + .ifql-filter--operator { .ifql-filter--key+.ifql-filter--operator {
background-color: $ifql-filter-expression; background-color: $ifql-filter-expression;
} }
.ifql-filter--key + .ifql-filter--operator + .ifql-filter--value { .ifql-filter--key+.ifql-filter--operator+.ifql-filter--value {
background-color: $ifql-filter-expression; background-color: $ifql-filter-expression;
border-radius: 0 3px 3px 0; border-radius: 0 3px 3px 0;
} }
.ifql-filter--value { .ifql-filter--value {
@extend %ifql-filter-style; @extend %ifql-filter-style;
padding-right: $ifql-filter-gap; padding-right: $ifql-filter-gap;
&.number { &.number {
color: $ifql-number-color; color: $ifql-number-color;
} }
@ -318,10 +287,12 @@ $ifql-filter-parens: $g5-pepper;
background-color: $ifql-filter-parens; background-color: $ifql-filter-parens;
border: (($ifql-filter-unit-wrapped - $ifql-filter-unit) / 2) solid $ifql-filter-expression; border: (($ifql-filter-unit-wrapped - $ifql-filter-unit) / 2) solid $ifql-filter-expression;
} }
.ifql-filter--paren-open { .ifql-filter--paren-open {
border-right: 0; border-right: 0;
border-radius: 3px 0 0 3px; border-radius: 3px 0 0 3px;
} }
.ifql-filter--paren-close { .ifql-filter--paren-close {
border-left: 0; border-left: 0;
border-radius: 0 3px 3px 0; border-radius: 0 3px 3px 0;
@ -331,7 +302,6 @@ $ifql-filter-parens: $g5-pepper;
position: relative; position: relative;
z-index: 2; z-index: 2;
background-color: $ifql-filter-parens; background-color: $ifql-filter-parens;
&:before { &:before {
content: ''; content: '';
width: 100%; width: 100%;
@ -344,25 +314,24 @@ $ifql-filter-parens: $g5-pepper;
border-color: $ifql-filter-expression; border-color: $ifql-filter-expression;
z-index: -1; z-index: -1;
box-sizing: border-box; box-sizing: border-box;
>>>>>>> Stashed changes
} }
} }
.ifql-filter--paren-open + .ifql-filter--key, .ifql-filter--paren-open+.ifql-filter--key,
.ifql-filter--paren-open + .ifql-filter--key + .ifql-filter--operator, .ifql-filter--paren-open+.ifql-filter--key+.ifql-filter--operator,
.ifql-filter--paren-open + .ifql-filter--key + .ifql-filter--operator + .ifql-filter--value, .ifql-filter--paren-open+.ifql-filter--key+.ifql-filter--operator+.ifql-filter--value,
.ifql-filter--paren-open + .ifql-filter--key + .ifql-filter--operator + .ifql-filter--value + .ifql-filter--operator + .ifql-filter--key, .ifql-filter--paren-open+.ifql-filter--key+.ifql-filter--operator+.ifql-filter--value+.ifql-filter--operator+.ifql-filter--key,
.ifql-filter--paren-open + .ifql-filter--key + .ifql-filter--operator + .ifql-filter--value + .ifql-filter--operator + .ifql-filter--key + .ifql-filter--operator, .ifql-filter--paren-open+.ifql-filter--key+.ifql-filter--operator+.ifql-filter--value+.ifql-filter--operator+.ifql-filter--key+.ifql-filter--operator,
.ifql-filter--paren-open + .ifql-filter--key + .ifql-filter--operator + .ifql-filter--value + .ifql-filter--operator + .ifql-filter--key + .ifql-filter--operator + .ifql-filter--value, .ifql-filter--paren-open+.ifql-filter--key+.ifql-filter--operator+.ifql-filter--value+.ifql-filter--operator+.ifql-filter--key+.ifql-filter--operator+.ifql-filter--value,
.ifql-filter--paren-open + .ifql-filter--key + .ifql-filter--operator + .ifql-filter--value + .ifql-filter--operator + .ifql-filter--key + .ifql-filter--operator + .ifql-filter--value + .ifql-filter--operator + .ifql-filter--key, .ifql-filter--paren-open+.ifql-filter--key+.ifql-filter--operator+.ifql-filter--value+.ifql-filter--operator+.ifql-filter--key+.ifql-filter--operator+.ifql-filter--value+.ifql-filter--operator+.ifql-filter--key,
.ifql-filter--paren-open + .ifql-filter--key + .ifql-filter--operator + .ifql-filter--value + .ifql-filter--operator + .ifql-filter--key + .ifql-filter--operator + .ifql-filter--value + .ifql-filter--operator + .ifql-filter--key + .ifql-filter--operator, .ifql-filter--paren-open+.ifql-filter--key+.ifql-filter--operator+.ifql-filter--value+.ifql-filter--operator+.ifql-filter--key+.ifql-filter--operator+.ifql-filter--value+.ifql-filter--operator+.ifql-filter--key+.ifql-filter--operator,
.ifql-filter--paren-open + .ifql-filter--key + .ifql-filter--operator + .ifql-filter--value + .ifql-filter--operator + .ifql-filter--key + .ifql-filter--operator + .ifql-filter--value + .ifql-filter--operator + .ifql-filter--key + .ifql-filter--operator + .ifql-filter--value { .ifql-filter--paren-open+.ifql-filter--key+.ifql-filter--operator+.ifql-filter--value+.ifql-filter--operator+.ifql-filter--key+.ifql-filter--operator+.ifql-filter--value+.ifql-filter--operator+.ifql-filter--key+.ifql-filter--operator+.ifql-filter--value {
@extend %ifql-filter-wrapped; @extend %ifql-filter-wrapped;
} }
.ifql-filter--paren-open + .ifql-filter--key + .ifql-filter--operator + .ifql-filter--value + .ifql-filter--operator, .ifql-filter--paren-open+.ifql-filter--key+.ifql-filter--operator+.ifql-filter--value+.ifql-filter--operator,
.ifql-filter--paren-open + .ifql-filter--key + .ifql-filter--operator + .ifql-filter--value + .ifql-filter--operator + .ifql-filter--key + .ifql-filter--operator + .ifql-filter--value + .ifql-filter--operator { .ifql-filter--paren-open+.ifql-filter--key+.ifql-filter--operator+.ifql-filter--value+.ifql-filter--operator+.ifql-filter--key+.ifql-filter--operator+.ifql-filter--value+.ifql-filter--operator {
background-color: $ifql-filter-expression; background-color: $ifql-filter-expression;
height: $ifql-filter-unit-wrapped; height: $ifql-filter-unit-wrapped;
line-height: $ifql-filter-unit-wrapped; line-height: $ifql-filter-unit-wrapped;
} }