github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-04-24 17:59:23 -04:00
Code Issues Projects Releases Packages Wiki Activity

EUI css reset fixes (#15685) (#15688)

Browse source 
* EUI css reset fixes
* Fix linting errors.
This commit is contained in:
CJ Cenizal 2017-12-19 07:06:09 -08:00 • committed by GitHub
parent 5ed5235eed
commit 6ea957879d
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
32 changed files with 304 additions and 205 deletions
Download patch file Download diff file Expand all files Collapse all files

66
src/core_plugins/console/public/src/directives/help.html
View file

@ -1,40 +1,38 @@
<h2 class="kuiLocalDropdownTitle">Help</h2>
<h2 class="euiTitle">Help</h2>
<tabset>
<tab heading="Request format">
<div class="list-group-item list-group-item--noBorder">
<div class="euiSpacer euiSpacer--m"></div>
<div class="euiPanel euiPanel--paddingLarge">
<div class="euiFlexGroup euiFlexGroup--gutterExtraLarge">
<div class="euiFlexItem">
<h2 class="euiTitle">Request format</h2>
<div class="euiSpacer euiSpacer--l"></div>
You can type one or more requests in the white editor. Console understands requests in a compact format:
<sense-help-example></sense-help-example>
</div>
</tab>
<tab heading="Keyboard tips">
<div class="list-group-item list-group-item--noBorder">
<dl class="dl-horizontal">
<dt></dt>
<dd><strong>General editing</strong></dd>
<dt>Ctrl/Cmd + I</dt>
<dd>Auto indent current request</dd>
<dt>Ctrl + Space</dt>
<dd>Open Auto complete (even if not typing)</dd>
<dt>Ctrl/Cmd + Enter</dt>
<dd>Submit request</dd>
<dt>Ctrl/Cmd + Up/Down</dt>
<dd>Jump to the previous/next request start or end.</dd>
<dt>Ctrl/Cmd + Alt + L</dt>
<dd>Collapse/expand current scope.</dd>
<dt>Ctrl/Cmd + Option + 0</dt>
<dd>Collapse all scopes but the current one. Expand by adding a shift.</dd>
</dl>
<dl class="dl-horizontal">
<dt></dt>
<dd><strong>When auto-complete is visible</strong></dd>
<dt>Down arrow</dt>
<dd>Switch focus to auto-complete menu. Use arrows to further select a term</dd>
<dt>Enter/Tab</dt>
<dd>Select the currently selected or the top most term in auto-complete menu</dd>
<dt>Esc</dt>
<dd>Close auto-complete menu</dd>
<div class="euiFlexItem">
<h2 class="euiTitle">Keyboard commands</h2>
<div class="euiSpacer euiSpacer--l"></div>
<dl class="euiDescriptionList euiDescriptionList--row euiDescriptionList--compressed">
<dt class="euiDescriptionList__title">Ctrl/Cmd + I</dt>
<dd class="euiDescriptionList__description">Auto indent current request</dd>
<dt class="euiDescriptionList__title">Ctrl + Space</dt>
<dd class="euiDescriptionList__description">Open Auto complete (even if not typing)</dd>
<dt class="euiDescriptionList__title">Ctrl/Cmd + Enter</dt>
<dd class="euiDescriptionList__description">Submit request</dd>
<dt class="euiDescriptionList__title">Ctrl/Cmd + Up/Down</dt>
<dd class="euiDescriptionList__description">Jump to the previous/next request start or end.</dd>
<dt class="euiDescriptionList__title">Ctrl/Cmd + Alt + L</dt>
<dd class="euiDescriptionList__description">Collapse/expand current scope.</dd>
<dt class="euiDescriptionList__title">Ctrl/Cmd + Option + 0</dt>
<dd class="euiDescriptionList__description">Collapse all scopes but the current one. Expand by adding a shift.</dd>
<dt class="euiDescriptionList__title">Down arrow</dt>
<dd class="euiDescriptionList__description">Switch focus to auto-complete menu. Use arrows to further select a term</dd>
<dt class="euiDescriptionList__title">Enter/Tab</dt>
<dd class="euiDescriptionList__description">Select the currently selected or the top most term in auto-complete menu</dd>
<dt class="euiDescriptionList__title">Esc</dt>
<dd class="euiDescriptionList__description">Close auto-complete menu</dd>
</dl>
</div>
</tab>
</tabset>
</div>
</div>

58
src/core_plugins/console/public/src/directives/welcome.html
View file

@ -1,33 +1,37 @@
<h2 class="kuiLocalDropdownTitle">Welcome to Console</h2>
<div class="euiText">
<p><strong>Quick intro to the UI</strong></p>
<h2>Welcome to Console</h2>
<p>The Console UI is split into two panes: an editor pane (left) and a response pane (right).
Use the editor to type requests and submit them to Elasticsearch. The results will be displayed in
the response pane on the right side.
</p>
<p><strong>Quick intro to the UI</strong></p>
<p>Console understands requests in a compact format, similar to cURL:
<sense-help-example></sense-help-example>
<p>The Console UI is split into two panes: an editor pane (left) and a response pane (right).
Use the editor to type requests and submit them to Elasticsearch. The results will be displayed in
the response pane on the right side.
</p>
<p>While typing a request, Console will make suggestions which you can then accept by hitting Enter/Tab.
These suggestions are made based on the request structure <i>as well as</i> your indices and types.
</p>
<p>Console understands requests in a compact format, similar to cURL:
<sense-help-example></sense-help-example>
<p><strong>A few quick tips, while I have your attention</strong></p>
<ul>
<li>Submit requests to ES using the green triangle button.</li>
<li>Use the wrench menu for other useful things.</li>
<li>You can paste requests in cURL format and they will be translated to the Console syntax.</li>
<li>You can resize the editor and output panes by dragging the separator between them.</li>
<li>Study the keyboard shortcuts under the Help button. Good stuff in there!</li>
</ul>
<p>While typing a request, Console will make suggestions which you can then accept by hitting Enter/Tab.
These suggestions are made based on the request structure <i>as well as</i> your indices and types.
</p>
<button
type="button"
class="kuiButton kuiButton--primary"
data-test-subj="help-close-button"
ng-click="kbnTopNav.close()"
>
Get to work
</button>
<p><strong>A few quick tips, while I have your attention</strong></p>
<ul>
<li>Submit requests to ES using the green triangle button.</li>
<li>Use the wrench menu for other useful things.</li>
<li>You can paste requests in cURL format and they will be translated to the Console syntax.</li>
<li>You can resize the editor and output panes by dragging the separator between them.</li>
<li>Study the keyboard shortcuts under the Help button. Good stuff in there!</li>
</ul>
<button
type="button"
class="kuiButton kuiButton--primary"
data-test-subj="help-close-button"
ng-click="kbnTopNav.close()"
>
Get to work
</button>
</div>

1
src/core_plugins/kbn_vislib_vis_types/public/controls/gauge_options.html
View file

@ -175,6 +175,7 @@
class="kuiButton kuiButton--primary kuiButton--fullWidth">
Add Range
</div>
<div class="euiSpacer euiSpacer--s"></div>
<div class="text text-center text-info">Note: colors can be changed in the legend</div>
</div>
</div>

1
src/core_plugins/kbn_vislib_vis_types/public/controls/heatmap_options.html
View file

@ -170,6 +170,7 @@
>
Add Range
</button>
<div class="euiSpacer euiSpacer--s"></div>
<div class="text text-center text-info">Note: colors can be changed in the legend</div>
</div>
</div>

2
src/core_plugins/kibana/public/dashboard/styles/index.less
View file

@ -117,7 +117,7 @@
.start-screen {
margin: 20px auto;
max-width: 800px;
background: tint(@globalColorBlue, 90%);
background: #FFF;
padding: 40px;
border-radius: 4px;
}

6
src/core_plugins/kibana/public/dev_tools/partials/dev_tools_app.html
View file

@ -9,13 +9,13 @@
></bread-crumbs>
<!-- Tabs. -->
<div data-transclude-slot="bottomRow" class="kuiLocalTabs" role="tablist">
<div data-transclude-slot="bottomRow" class="euiTabs" role="tablist">
<a
role="tab"
aria-selected="{{kbnDevToolsApp.currentPath === item.url}}"
ng-repeat="item in kbnDevToolsApp.devTools"
class="kuiLocalTab"
ng-class="{'kuiLocalTab-isSelected': kbnDevToolsApp.currentPath === item.url}"
class="euiTab"
ng-class="{'euiTab-isSelected': kbnDevToolsApp.currentPath === item.url}"
kbn-href="{{::item.url}}"
>
{{::item.display}}

4
src/core_plugins/kibana/public/discover/components/field_chooser/lib/detail_views/string.html
View file

@ -1,6 +1,6 @@
<div class="discover-field-details">
<div class="kuiVerticalRhythmSmall">
<p class="kuiSubduedText" ng-show="!field.details.error">
<p class="euiText euiText--extraSmall euiTextColor--subdued" ng-show="!field.details.error">
Top 5 values in
<span ng-if="!field.details.error">
<a
@ -20,7 +20,7 @@
<div class="clearfix"></div>
<div ng-if="field.details.error" class="discover-field-details-error">{{field.details.error}}</div>
<div ng-if="field.details.error" class="euiText euiText--extraSmall euiTextColor--subdued">{{field.details.error}}</div>
<div ng-if="!field.details.error">
<div ng-repeat="bucket in ::field.details.buckets" class="discover-field-details-item">

5
src/core_plugins/kibana/public/discover/index.html
View file

@ -65,7 +65,10 @@
<!-- loading -->
<div ng-show="resultState === 'loading'">
<div class="discover-overlay">
<h2>Searching</h2>
<div class="euiTitle">
<h2>Searching</h2>
</div>
<div class="euiSpacer euiSpacer--m"></div>
<div ng-show="fetchStatus">{{fetchStatus.complete}}/{{fetchStatus.total}}</div>
</div>
</div>

52
src/core_plugins/kibana/public/discover/partials/no_results.html
View file

@ -1,5 +1,6 @@
<div>
<div class="col-md-10 col-md-offset-1" data-test-subj="discoverNoResults">
<div class="euiPage">
<div class="euiText" data-test-subj="discoverNoResults">
<h1>No results found <i aria-hidden="true" class="fa fa-meh-o"></i></h1>
@ -63,21 +64,46 @@
The search bar at the top uses Elasticsearch's support for Lucene <a class="kuiLink" documentation-href="query.luceneQuerySyntax" target="_blank" rel="noopener noreferrer">Query String syntax</a>. Let's say we're searching web server logs that have been parsed into a few fields.
</p>
<h4>Examples:</h4>
Find requests that contain the number 200, in any field:
<pre>200</pre>
<h4>Examples</h4>
Or we can search in a specific field. Find 200 in the status field:
<pre>status:200</pre>
<p>Find requests that contain the number 200, in any field:</p>
<div class="euiCodeBlock euiCodeBlock--light euiCodeBlock--paddingSmall">
<code class="euiCodeBlock__code">
<pre class="euiCodeBlock__pre">200</pre>
</code>
</div>
<div class="euiSpacer euiSpacer--l"></div>
Find all status codes between 400-499:
<pre>status:[400 TO 499]</pre>
<p>Or we can search in a specific field. Find 200 in the status field:</p>
<div class="euiCodeBlock euiCodeBlock--light euiCodeBlock--paddingSmall">
<code class="euiCodeBlock__code">
<pre class="euiCodeBlock__pre">status:200</pre>
</code>
</div>
<div class="euiSpacer euiSpacer--l"></div>
Find status codes 400-499 with the extension php:
<pre>status:[400 TO 499] AND extension:PHP</pre>
<p>Find all status codes between 400-499:</p>
<div class="euiCodeBlock euiCodeBlock--light euiCodeBlock--paddingSmall">
<code class="euiCodeBlock__code">
<pre class="euiCodeBlock__pre">status:[400 TO 499]</pre>
</code>
</div>
<div class="euiSpacer euiSpacer--l"></div>
Or HTML
<pre>status:[400 TO 499] AND (extension:php OR extension:html)</pre>
<p>Find status codes 400-499 with the extension php:</p>
<div class="euiCodeBlock euiCodeBlock--light euiCodeBlock--paddingSmall">
<code class="euiCodeBlock__code">
<pre class="euiCodeBlock__pre">status:[400 TO 499] AND extension:PHP</pre>
</code>
</div>
<div class="euiSpacer euiSpacer--l"></div>
<p>Or HTML</p>
<div class="euiCodeBlock euiCodeBlock--light euiCodeBlock--paddingSmall">
<code class="euiCodeBlock__code">
<pre class="euiCodeBlock__pre">status:[400 TO 499] AND (extension:php OR extension:html)</pre>
</code>
</div>
</div>
</div>

6
src/core_plugins/kibana/public/discover/styles/main.less
View file

@ -78,6 +78,7 @@
bottom: 0;
right: 0;
z-index: 20;
padding-top: 10px;
opacity: 0.75;
text-align: center;
@ -209,10 +210,6 @@
white-space: nowrap;
}
.discover-field-details-error {
margin-top: 5px;
}
.discover-field-details-item {
margin-top: 5px;
}
@ -222,6 +219,7 @@
}
.discover-field-details-item-title {
line-height: 1.5;
display: flex;
align-items: center;
justify-content: space-between;

141
src/core_plugins/kibana/public/home/components/home.js
View file

@ -3,10 +3,19 @@ import PropTypes from 'prop-types';
import { Synopsis } from './synopsis';
import {
KuiLinkButton,
KuiFlexGroup,
KuiFlexItem,
KuiFlexGrid,
} from 'ui_framework/components';
import {
EuiPage,
EuiPanel,
EuiTitle,
EuiSpacer,
EuiFlexGroup,
EuiFlexItem,
EuiFlexGrid,
EuiText,
} from '@elastic/eui';
import { FeatureCatalogueCategory } from 'ui/registry/feature_catalogue';
export function Home({ addBasePath, directories }) {
@ -18,92 +27,104 @@ export function Home({ addBasePath, directories }) {
})
.map((directory) => {
return (
<KuiFlexItem style={{ minHeight: 64 }} key={directory.id}>
<EuiFlexItem style={{ minHeight: 64 }} key={directory.id}>
<Synopsis
description={directory.description}
iconUrl={addBasePath(directory.icon)}
title={directory.title}
url={addBasePath(directory.path)}
/>
</KuiFlexItem>
</EuiFlexItem>
);
});
};
return (
<div className="kuiView home">
<div className="kuiViewContent">
<EuiPage className="home">
<div className="kuiViewContentItem kuiVerticalRhythmXLarge">
<KuiFlexGroup
className="kuiVerticalRhythmSmall"
justifyContent="spaceBetween"
alignItems="flexEnd"
>
<KuiFlexItem>
<h1 className="kuiTitle">
Welcome to Kibana
</h1>
</KuiFlexItem>
<EuiFlexGroup
justifyContent="spaceBetween"
alignItems="flexEnd"
>
<EuiFlexItem>
<EuiTitle size="l">
<h1>Welcome to Kibana</h1>
</EuiTitle>
</EuiFlexItem>
<KuiFlexItem grow={false}>
<KuiFlexGroup alignItems="center">
<KuiFlexItem grow={false}>
<p className="kuiText kuiSubduedText">
Data already in Elasticsearch?
</p>
</KuiFlexItem>
<EuiFlexItem grow={false}>
<EuiFlexGroup alignItems="center">
<EuiFlexItem grow={false}>
<p className="kuiText kuiSubduedText">
Data already in Elasticsearch?
</p>
</EuiFlexItem>
<KuiFlexItem grow={false}>
<KuiLinkButton
buttonType="secondary"
href={addBasePath('/app/kibana#/management/kibana/index')}
>
Set up index patterns
</KuiLinkButton>
</KuiFlexItem>
</KuiFlexGroup>
<EuiFlexItem grow={false}>
<KuiLinkButton
buttonType="secondary"
href={addBasePath('/app/kibana#/management/kibana/index')}
>
Set up index patterns
</KuiLinkButton>
</EuiFlexItem>
</EuiFlexGroup>
</KuiFlexItem>
</KuiFlexGroup>
</div>
</EuiFlexItem>
</EuiFlexGroup>
<div className="kuiViewContentItem kuiVerticalRhythmXLarge">
<KuiFlexGroup className="kuiVerticalRhythm">
<KuiFlexItem className="kuiPanel homePanel">
<h3 className="kuiSubTitle kuiVerticalRhythm">
<EuiSpacer size="l" />
<EuiFlexGroup className="kuiVerticalRhythm">
<EuiFlexItem>
<EuiPanel paddingSize="l">
<EuiTitle>
<h3>
Visualize and Explore Data
</h3>
<KuiFlexGrid className="kuiVerticalRhythmSmall homeTopFeatures" columns={2}>
{ renderDirectories(FeatureCatalogueCategory.DATA) }
</KuiFlexGrid>
</KuiFlexItem>
<KuiFlexItem className="kuiPanel homePanel">
<h3 className="kuiSubTitle kuiVerticalRhythm">
</EuiTitle>
<EuiSpacer size="m"/>
<EuiFlexGrid columns={2}>
{ renderDirectories(FeatureCatalogueCategory.DATA) }
</EuiFlexGrid>
</EuiPanel>
</EuiFlexItem>
<EuiFlexItem>
<EuiPanel paddingSize="l">
<EuiTitle>
<h3>
Manage and Administer the Elastic Stack
</h3>
<KuiFlexGrid className="kuiVerticalRhythmSmall homeTopFeatures" columns={2}>
{ renderDirectories(FeatureCatalogueCategory.ADMIN) }
</KuiFlexGrid>
</KuiFlexItem>
</KuiFlexGroup>
</div>
</EuiTitle>
<EuiSpacer size="m"/>
<EuiFlexGrid columns={2}>
{ renderDirectories(FeatureCatalogueCategory.ADMIN) }
</EuiFlexGrid>
</EuiPanel>
</EuiFlexItem>
</EuiFlexGroup>
<div className="kuiViewContentItem kuiVerticalRhythmXLarge text-center">
<h4 className="kuiSubduedText kuiVerticalRhythmSmall">
Didn’t find what you were looking for?
</h4>
<EuiSpacer size="l" />
<EuiFlexGroup justifyContent="center">
<EuiFlexItem grow={false}>
<EuiText>
<p>
Didn’t find what you were looking for?
</p>
</EuiText>
<EuiSpacer size="s" />
<KuiLinkButton
buttonType="secondary"
href="#/home/feature_directory"
>
View full directory of Kibana plugins
</KuiLinkButton>
</div>
</EuiFlexItem>
</EuiFlexGroup>
</div>
</div>
</EuiPage>
);
}

9
src/core_plugins/kibana/public/home/home.less
View file

@ -5,15 +5,6 @@
min-height: 100vh;
}
.homePanel {
padding: 24px;
background-color: @white;
}
.homeTopFeatures {
margin-top: 12px;
}
.homeFeatureDirectory {
background: @white;
margin: 0;

4
src/core_plugins/kibana/public/management/landing.html
View file

@ -23,7 +23,7 @@
</div>
</div>
<div class="kuiPanelBody management-panel__body">
<div class="kuiPanelBody">
<div class="row">
<ul class="list-unstyled">
<li
@ -32,7 +32,7 @@
>
<a
data-test-subj="{{::item.name}}"
class="management-panel__link"
class="euiLink euiLink--primary management-panel__link"
ng-class="{ 'management-panel__link--disabled': item.disabled || !item.url }"
kbn-href="{{::item.disabled ? '' : item.url}}"
tooltip="{{::item.tooltip}}"

2
src/core_plugins/kibana/public/management/sections/indices/edit_index_pattern/edit_index_pattern.html
View file

@ -27,7 +27,7 @@
index and the field's associated core type as recorded by Elasticsearch.
While this list allows you to view the core type of each field, changing
field types must be done using Elasticsearch's
<a target="_window" href="http://www.elastic.co/guide/en/elasticsearch/reference/current/mapping.html">
<a target="_window" class="euiLink euiLink--primary" href="http://www.elastic.co/guide/en/elasticsearch/reference/current/mapping.html">
Mapping API
<i aria-hidden="true" class="fa-link fa"></i>
</a>

14
src/core_plugins/kibana/public/management/sections/indices/index.html
View file

@ -1,6 +1,6 @@
<div class="col-md-2 sidebar-container" role="region" aria-label="Index patterns">
<div class="sidebar-list">
<div class="sidebar-list-header">
<div class="sidebar-item-title full-title">
<h5>
<a
ng-if="editingId"
@ -18,10 +18,12 @@
class="sidebar-item"
>
<div class="sidebar-item-title full-title">
<span class="label label-warning">Warning</span>
<p>
No default index pattern. You must select or create one to continue.
</p>
<div class="euiText euiText--extraSmall">
<div class="euiBadge euiBadge--warning">Warning</div>
<p>
No default index pattern. You must select or create one to continue.
</p>
</div>
</div>
</li>
@ -29,7 +31,7 @@
ng-repeat="pattern in indexPatternList | orderBy:['-default','title'] track by pattern.id"
class="sidebar-item"
>
<a href="{{::pattern.url}}" class="show">
<a href="{{::pattern.url}}" class="euiLink euiLink--primary show">
<div class="{{::pattern.class}}">
<i aria-hidden="true" ng-if="pattern.default" class="fa fa-star"></i>
<span ng-bind="::pattern.title"></span>

12
src/core_plugins/kibana/public/management/sections/objects/_objects.html
View file

@ -3,7 +3,7 @@
<!-- Header -->
<div class="kuiViewContentItem kuiBar kuiVerticalRhythm">
<div class="kuiBarSection">
<h1 class="kuiTitle">
<h1 class="euiTitle">
Edit Saved Objects
</h1>
</div>
@ -38,9 +38,13 @@
</div>
<!-- Intro -->
<p class="kuiViewContentItem kuiVerticalRhythm">
From here you can delete saved objects, such as saved searches. You can also edit the raw data of saved objects. Typically objects are only modified via their associated application, which is probably what you should use instead of this screen. Each tab is limited to 100 results. You can use the filter to find objects not in the default list.
</p>
<div class="euiText">
<p class="kuiViewContentItem">
From here you can delete saved objects, such as saved searches. You can also edit the raw data of saved objects. Typically objects are only modified via their associated application, which is probably what you should use instead of this screen. Each tab is limited to 100 results. You can use the filter to find objects not in the default list.
</p>
</div>
<div class="euiSpacer euiSpacer--m"></div>
<!-- Tabs -->
<div class="kuiViewContentItem kuiVerticalRhythm">

4
src/core_plugins/kibana/public/management/styles/main.less
View file

@ -37,10 +37,6 @@ kbn-management-landing {
}
.management-panel__body {
padding-bottom: 30px;
}
.management-panel__link {
font-size: 17px;
line-height: 32px;

3
src/core_plugins/kibana/public/visualize/editor/styles/_editor.less
View file

@ -3,7 +3,7 @@
@vis-editor-sidebar-basis: (100/12) * 2%; // two of twelve columns
@vis-editor-sidebar-min-width: 350px;
@vis-editor-nesting-width: 8px;
@vis-editor-agg-editor-spacing: 5px;
@vis-editor-agg-editor-spacing: 10px;
.vis-editor {
.flex-parent();
@ -219,6 +219,7 @@
text-align: center;
background: @vis-editor-agg-error-bg;
color: @vis-editor-agg-error-color;
line-height: 1.5;
}
.vis-editor-agg-editor-ranges {

20
src/core_plugins/metrics/public/components/annotations_editor.js
View file

@ -8,7 +8,11 @@ import FieldSelect from './aggs/field_select';
import uuid from 'uuid';
import IconSelect from './icon_select';
import YesNo from './yes_no';
import { htmlIdGenerator } from '@elastic/eui';
import {
htmlIdGenerator,
EuiText,
} from '@elastic/eui';
function newAnnotation() {
return {
@ -175,12 +179,14 @@ class AnnotationsEditor extends Component {
.bind(null, this.props, newAnnotation);
content = (
<div className="vis_editor__annotations-missing">
<p>Click the button below to create an annotation data source.</p>
<button
className="thor__button-outlined-default large"
onClick={handleAdd}
>Add Data Source
</button>
<EuiText>
<p>Click the button below to create an annotation data source.</p>
<button
className="thor__button-outlined-default large"
onClick={handleAdd}
>Add Data Source
</button>
</EuiText>
</div>
);
} else {

14
src/core_plugins/metrics/public/components/markdown_editor.js
View file

@ -11,7 +11,9 @@ import { KuiCodeEditor } from 'ui_framework/components';
import _ from 'lodash';
import 'brace/mode/markdown';
import 'brace/theme/github';
import {
EuiText,
EuiCodeBlock,
} from '@elastic/eui';
@ -108,13 +110,13 @@ class MarkdownEditor extends Component {
/>
</div>
<div className="vis_editor__markdown-variables">
<div>
<EuiText>
The following variables can be used in the Markdown by using the Handlebar (mustache) syntax.{' '}
<a href="http://handlebarsjs.com/expressions.html" target="_BLANK">
Click here for documentation
</a>{' '}
on the available expressions.
</div>
</EuiText>
<table className="table">
<thead>
<tr>
@ -129,8 +131,12 @@ class MarkdownEditor extends Component {
)}
<div className="vis_editor__markdown-code-desc">
There is also a special variable named <code>_all</code> which you can use to access the entire tree. This is useful for
creating lists with data from a group by...
<EuiText>
<p>
There is also a special variable named <code>_all</code> which you can use to access the entire tree. This is useful for
creating lists with data from a group by...
</p>
</EuiText>
</div>
<EuiCodeBlock>

2
src/ui/public/agg_types/controls/filters.html
View file

@ -64,3 +64,5 @@
>
Add Filter
</button>
<div class="euiSpacer euiSpacer--s"></div>

7
src/ui/public/agg_types/controls/ip_ranges.html
View file

@ -1,9 +1,12 @@
<div>
<p>
<button type="button" class="kuiButton kuiButton--basic" ng-show="agg.params.ipRangeType == 'mask'" ng-click="agg.params.ipRangeType = 'fromTo'">Use From/To</button>
<button type="button" class="kuiButton kuiButton--basic" ng-show="agg.params.ipRangeType != 'mask'" ng-click="agg.params.ipRangeType = 'mask'">Use CIDR Masks</button>
<button type="button" class="kuiButton kuiButton--secondary" ng-show="agg.params.ipRangeType == 'mask'" ng-click="agg.params.ipRangeType = 'fromTo'">Use From/To</button>
<button type="button" class="kuiButton kuiButton--secondary" ng-show="agg.params.ipRangeType != 'mask'" ng-click="agg.params.ipRangeType = 'mask'">Use CIDR Masks</button>
</p>
<div class="euiSpacer euiSpacer--s"></div>
<div ng-show="agg.params.ipRangeType != 'mask'">
<table class="vis-editor-agg-editor-ranges form-group" ng-show="agg.params.ranges.fromTo.length">
<tr>

2
src/ui/public/agg_types/controls/string.html
View file

@ -1,4 +1,6 @@
<div class="form-group">
<div class="euiSpacer euiSpacer--m"></div>
<label for="visEditorStringInput{{agg.id}}{{aggParam.name}}">{{ aggParam.name | label }}</label>
<div>
<input

36
src/ui/public/field_editor/field_editor.html
View file

@ -7,7 +7,7 @@
</p>
</div>
<div ng-if="editor.creating" class="form-group">
<label for="scriptedFieldName">Name</label>
<label for="scriptedFieldName" class="kuiFormLabel">Name</label>
<input
ng-model="editor.field.name"
id="scriptedFieldName"
@ -27,7 +27,7 @@
</div>
<div ng-if="editor.field.scripted" class="form-group">
<label for="scriptedFieldLang">Language</label>
<label for="scriptedFieldLang" class="kuiFormLabel">Language</label>
<div class="kuiInfoPanel kuiInfoPanel--warning kuiVerticalRhythm" ng-if="editor.field.lang && editor.isDeprecatedLang(editor.field.lang)">
<div class="kuiInfoPanelHeader">
<span
@ -61,7 +61,7 @@
</div>
<div class="form-group">
<label for="scriptedFieldType">Type</label>
<label for="scriptedFieldType" class="kuiFormLabel">Type</label>
<select
ng-if="editor.field.scripted"
id="scriptedFieldType"
@ -83,7 +83,7 @@
<i class="fa fa-warning"></i> Warning
</span>
<label for="scriptFieldFormat">Format <small>(Default: <i>{{editor.defFormatType.resolvedTitle}}</i>)</small></label>
<label for="scriptFieldFormat" class="kuiFormLabel">Format <small>(Default: <i>{{editor.defFormatType.resolvedTitle}}</i>)</small></label>
<div class="hintbox" ng-if="editor.showFormatHelp">
<h4 class="hintbox-heading">
@ -112,7 +112,7 @@
</div>
<div class="form-group">
<label for="editorFieldCount">Popularity</label>
<label for="editorFieldCount" class="kuiFormLabel">Popularity</label>
<div class="kuiFieldGroup">
<div class="kuiFieldGroupSection">
<input
@ -157,7 +157,7 @@
<div ng-if="editor.field.scripted">
<div class="form-group">
<label for="scriptedFieldScript">Script</label>
<label for="scriptedFieldScript" class="kuiFormLabel">Script</label>
<textarea
required
class="field-editor_script-input form-control text-monospace"
@ -167,12 +167,11 @@
></textarea>
</div>
<div class="form-group">
<div class="hintbox">
<h4>
<i class="fa fa-warning text-warning"></i> Proceed with caution
</h4>
<div class="euiCallOut euiCallOut--warning">
<div class="euiCallOutHeader">
<span class="euiCallOutHeader__title">Proceed with caution</span>
</div>
<div class="euiText euiText--small">
<p>
Please familiarize yourself with <a target="_window" documentation-href="scriptedFields.scriptFields">script fields <i class="fa-link fa"></i></a> and with <a target="_window" documentation-href="scriptedFields.scriptAggs">scripts in aggregations <i class="fa-link fa"></i></a> before using scripted fields.
</p>
@ -183,12 +182,13 @@
</div>
</div>
<div class="form-group">
<div class="hintbox">
<h4>
<i class="fa fa-question-circle text-info"></i> Scripting Help
</h4>
<div class="euiSpacer euiSpacer--m"></div>
<div class="euiCallOut euiCallOut--primary">
<div class="euiCallOutHeader">
<span class="euiCallOutHeader__title">Scripting Help</span>
</div>
<div class="euiText euiText--small">
<p>
By default, Kibana scripted fields use <a target="_window" documentation-href="scriptedFields.painless">Painless <i class="fa-link fa"></i></a>, a simple and secure scripting language designed specifically for use with Elasticsearch. To access values in the document use the following format:
</p>
@ -234,6 +234,8 @@
</div>
<div class="euiSpacer euiSpacer--l"></div>
<div ng-if="editor.conflictDescriptionsLength > 0">
<p>
<i class="fa fa-warning text-warning"></i>

2
src/ui/public/number_list/number_list.html
View file

@ -33,6 +33,8 @@
Please specify at least one {{numberListCntr.getUnitName()}}
</p>
<div class="euiSpacer euiSpacer--s"></div>
<button
ng-click="numberListCntr.add()"
type="button"

19
src/ui/public/styles/base.less
View file

@ -87,7 +87,7 @@ ul.navbar-inline li {
.checkbox label {
display: flex;
align-items: center;
padding-left: 0;
padding-left: 0 !important;
input[type="checkbox"] {
float: none;
@ -541,6 +541,16 @@ style-compile {
background-color: @globalColorWhite;
padding: 10px;
border-radius: 4px;
label {
margin-bottom: 5px !important;
font-weight: 700;
display: block;
}
.vis-option-item label {
font-weight: normal !important;
}
}
.kuiSideBarSection .kuiSideBarSection .kuiSideBarSection{
@ -631,7 +641,7 @@ style-compile {
*/
.kuiSideBarFormSectionTitle {
font-size: 12px;
color: @globalColorMediumGray;
color: @globalColorDarkGray;
margin: 10px 0 !important; // 1
padding-bottom: 2px;
}
@ -695,4 +705,9 @@ style-compile {
height: 64px;
}
.pdf-options label {
padding-bottom: 5px;
display: block;
}
@import "~dragula/dist/dragula.css";

1
src/ui/public/styles/hintbox.less
View file

@ -5,6 +5,7 @@
border-radius: 5px;
margin-bottom: @hintbox-spacing-vertical;
background-color: @hintbox-background-color;
line-height: 1.5;
a {
color: @hintbox-link-color !important;

10
src/ui/public/styles/sidebar.less
View file

@ -39,6 +39,16 @@
border-top: solid 1px transparent;
border-bottom: solid 1px transparent;
label {
margin-bottom: 5px;
font-weight: 700;
display: block;
}
label[for] {
cursor: pointer;
}
&.active {
background-color: darken(@globalColorLightestGray, 10%) !important;
color: @sidebar-active-color;

1
src/ui/public/vis/editors/default/agg_add.html
View file

@ -1,5 +1,6 @@
<div ng-show="add.form" class="vis-editor-agg-add-schemas">
<label>Select {{ groupName }} type</label>
<div class="euiSpacer euiSpacer--s"></div>
<ul class="form-group list-group list-group-menu">
<li
tabindex="0"

1
src/ui/public/vis/editors/default/agg_select.html
View file

@ -1,6 +1,7 @@
<div class="form-group">
<label ng-if="$index < 1 || groupName !== 'buckets'">Aggregation</label>
<label ng-if="$index >= 1 && groupName === 'buckets'">Sub Aggregation</label>
<div class="euiSpacer euiSpacer--s"></div>
<ui-select
required
name="agg"

3
ui_framework/dist/ui_framework.css vendored
View file

@ -3690,7 +3690,8 @@ main {
max-width: 20px;
/* 1 */
color: #191E23;
border-top: 1px solid #D9D9D9; }
border-top: 1px solid #D9D9D9;
vertical-align: middle; }
/**
* 1. Vertically align all children.

1
ui_framework/src/components/table/_table.scss
View file

@ -104,6 +104,7 @@
@include tableCell;
color: $kuiFontColor;
border-top: $kuiBorderThin;
vertical-align: middle;
}
/**