diff --git a/ui/src/chronograf/components/Panel.js b/ui/src/chronograf/components/Panel.js index 8796021d6e..94b83fb9c9 100644 --- a/ui/src/chronograf/components/Panel.js +++ b/ui/src/chronograf/components/Panel.js @@ -159,10 +159,10 @@ const Panel = React.createClass({ onChoose(item) { switch (item.text) { - case 'Builder': + case 'Query Builder': this.handleAddQuery(); break; - case 'Raw': + case 'Raw Text': this.handleAddRawQuery(); break; } @@ -170,7 +170,7 @@ const Panel = React.createClass({ renderAddQuery() { return ( - + ); diff --git a/ui/src/style/chronograf/components/_Panel.scss b/ui/src/style/chronograf/components/_Panel.scss index be552b5b9c..ea7b4eab3c 100644 --- a/ui/src/style/chronograf/components/_Panel.scss +++ b/ui/src/style/chronograf/components/_Panel.scss @@ -105,12 +105,6 @@ color: $g15-platinum; } - > span.icon.plus { - font-size: 12px; - position: relative; - top: -1px; - } - &-delete { margin: 0 -4px 0 1px; width: 16px; @@ -148,6 +142,24 @@ } } } +.panel--tab-new { + > .dropdown-toggle { + height: 28px !important; + border-radius: $radius $radius 0 0; + + > .icon { + margin: 0; + font-size: 12px; + position: relative; + top: -1px; + } + } + > .dropdown-menu { + width: 90px !important; + min-width: 90px !important; + max-width: 90px !important; + } +} .panel--tab-label { display: inline-block; font-size: 12px;