change words and padding according to ux review comments (opendistro-for-elasticsearch#132)

* change words and padding according to ux review comments

* fix padding of monitor schedule

Author: ylwu-amzn

public/pages/CreateMonitor/components/MonitorDefinition/MonitorDefinition.js

@@ -31,15 +31,15 @@ const onChangeDefinition = (e, form, resetResponse) => {
 const selectDefinitions = plugins => {
   return plugins === undefined || plugins.indexOf(ES_AD_PLUGIN) == -1
     ? defaultSelectDefinitions
-    : [...defaultSelectDefinitions, { value: 'ad', text: 'Define using Anomaly detector' }];
+    : [...defaultSelectDefinitions, { value: 'ad', text: 'Define using anomaly detector' }];
 };
 
 const MonitorDefinition = ({ resetResponse, plugins }) => (
   <FormikSelect
     name="searchType"
     formRow
     rowProps={{
-      label: 'How do you want to define the monitor?',
+      label: 'Define the monitor',
       style: { paddingLeft: '10px' },
     }}
     inputProps={{

public/pages/CreateMonitor/components/Schedule/Frequencies/Interval.js

@@ -49,7 +49,7 @@ const Interval = () => (
         inputProps={{ icon: 'clock', min: 1 }}
       />
     </EuiFlexItem>
-    <EuiFlexItem style={{ margin: '0px' }}>
+    <EuiFlexItem style={{ margin: '2px' }}>
       <FormikSelect
         name="period.unit"
         formRow

public/pages/CreateMonitor/components/Schedule/Frequencies/__snapshots__/Frequencies.test.js.snap

@@ -243,7 +243,7 @@ exports[`Frequencies renders FrequencyPicker 1`] = `
   </div>
   <div
     class="euiFlexItem"
-    style="margin:0px"
+    style="margin:2px"
   >
     <div
       class="euiFormRow euiFormRow--hasEmptyLabelSpace"
@@ -347,7 +347,7 @@ exports[`Frequencies renders Interval 1`] = `
   </div>
   <div
     class="euiFlexItem"
-    style="margin:0px"
+    style="margin:2px"
   >
     <div
       class="euiFormRow euiFormRow--hasEmptyLabelSpace"

public/pages/CreateMonitor/containers/AnomalyDetectors/AnomalyDetectors.js

@@ -65,7 +65,11 @@ class AnomalyDetectors extends React.Component {
       }
     }
     return (
-      <div>
+      <div
+        style={{
+          maxWidth: '390px',
+        }}
+      >
         <FormikComboBox
           name={'detectorId'}
           formRow

public/pages/CreateMonitor/containers/AnomalyDetectors/__tests__/__snapshots__/AnomalyDetector.test.js.snap

@@ -113,7 +113,13 @@ exports[`AnomalyDetectors renders 1`] = `
       }
     }
   >
-    <div>
+    <div
+      style={
+        Object {
+          "maxWidth": "390px",
+        }
+      }
+    >
       <FormikComboBox
         fieldProps={
           Object {

public/pages/CreateTrigger/containers/DefineTrigger/AnomalyDetectorTrigger.js

@@ -58,7 +58,7 @@ class AnomalyDetectorTrigger extends React.Component {
                     thresholdEnum={adValues.anomalyGradeThresholdEnum}
                     keyFieldName="anomalyDetector.anomalyGradeThresholdEnum"
                     valueFieldName="anomalyDetector.anomalyGradeThresholdValue"
-                    label="Anomaly grade condition"
+                    label="Anomaly grade threshold"
                   />
                   <EuiSpacer size="xs" />
                   <AnomaliesChart
@@ -77,7 +77,7 @@ class AnomalyDetectorTrigger extends React.Component {
                     thresholdEnum={adValues.anomalyConfidenceThresholdEnum}
                     keyFieldName="anomalyDetector.anomalyConfidenceThresholdEnum"
                     valueFieldName="anomalyDetector.anomalyConfidenceThresholdValue"
-                    label="Anomaly confidence condition"
+                    label="Anomaly confidence threshold"
                   />
                   <EuiSpacer size="xs" />
                   <AnomaliesChart

public/pages/MonitorDetails/containers/MonitorDetails.js

@@ -297,8 +297,7 @@ export default class MonitorDetails extends Component {
                     external="true"
                     target="_blank"
                   >
-                    {detector.name}
-                    <EuiIcon size="s" type="popout" />
+                    {detector.name} <EuiIcon size="s" type="popout" />
                   </EuiLink>
                 </EuiText>
               </EuiFlexItem>