maxmustermann/kibana
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Management core Less to Sass (#23596)

Browse source 
Converts management's less to sass. Makes minor adjustments to those pages for some design cleanup.
This commit is contained in:
dave.snider@gmail.com 2018-10-04 22:33:49 -07:00 committed by GitHub
parent 03202be64a
commit 57b1a6ce71
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
51 changed files with 954 additions and 1165 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
src/core_plugins/kibana/public/index.scss
View file

@ -16,6 +16,9 @@
@import './visualize/index';
@import 'ui/public/vis/index';
// Management styles
@import './management/index';
// Dashboard styles
// MUST STAY AT THE BOTTOM BECAUSE OF DARK THEME IMPORTS
@import './dashboard/index';

46
src/core_plugins/kibana/public/management/_hacks.scss Normal file
View file

@ -0,0 +1,46 @@
// SASSTODO: figure out why this is needed
kbn-management-app,
kbn-management-landing,
kbn-management-indices,
kbn-management-indices-edit,
kbn-management-indices-create,
kbn-management-advanced,
kbn-management-objects,
kbn-management-objects-view {
display: block;
}
// SASSTODO: Remove when Kibana has a proper background color
.tab-account, .tab-management {
background-color: $euiColorEmptyShade;
}
// SASSTODO: Remove when Kibana has a proper background color
kbn-management-objects, kbn-management-app {
background: $euiColorLightestShade;
min-height: 100vh;
}
.kbn-management-tab:first-letter {
text-transform: capitalize;
}
// SASSTODO: Remove when this is replaced with EuiCode
kbn-management-objects-view {
.ace_editor { height: 300px; }
}
// SASSTODO: These are some dragula settings.
.gu-handle {
cursor: move;
cursor: grab;
cursor: -moz-grab;
cursor: -webkit-grab;
}
.gu-mirror,
.gu-mirror .gu-handle {
cursor: grabbing;
cursor: -moz-grabbing;
cursor: -webkit-grabbing;
}

55
src/core_plugins/kibana/public/management/_management_app.scss Normal file
View file

@ -0,0 +1,55 @@
.mgtPanel {
margin-bottom: $euiSize;
background: $euiColorEmptyShade;
}
// SASSTODO: Remove when this is replaced by the side nav
.mgtPanel__link {
@include euiFontSizeL;
line-height: 2; // Give some buffer for when they wrap
&.mgtPanel__link--disabled {
opacity: $euiColorDarkShade;
cursor: default;
&:hover, &:visited {
color: $euiColorPrimary;
}
}
}
// SASSTODO: Remove when this form is replaced by EUI
kbn-management-objects {
form {
margin-bottom: $euiSize;
}
.list-unstyled {
li {
border-bottom: $euiBorderThin;
padding: $euiSizeS;
}
}
.empty {
color: $euiColorDarkShade;
}
.item {
padding: $euiSizeM;
.item-title {
margin-left: $euiSizeL;
}
.actions {
margin-top: $euiSizeXS;
}
}
.header {
.title, .controls {
padding-right: 1em;
display: inline-block;
}
}
}

1
src/core_plugins/kibana/public/management/index.js
View file

@ -18,7 +18,6 @@
*/
import './sections';
import './styles/main.less';
import 'ui/filters/start_from';
import 'ui/field_editor';
import uiRoutes from 'ui/routes';

14
src/core_plugins/kibana/public/management/index.scss Normal file
View file

@ -0,0 +1,14 @@
// This file is imported into src/core_plugings/kibana/publix/index.scss
// Prefix all styles with "dsh" to avoid conflicts.
// Examples
// mgtChart
// mgtChart__legend
// mgtChart__legend--small
// mgtChart__legend-isLoading
@import 'hacks';
// Core
@import 'management_app';
@import 'sections/settings/advanced_settings';

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

@ -11,12 +11,10 @@
ng-repeat="section in sections"
class="page-row"
>
<div class="kuiPanel management-panel" role="group">
<div class="kuiPanel mgtPanel" role="group">
<div class="kuiPanelHeader">
<div class="kuiPanelHeaderSection">
<div
class="management-panel__heading-icon management-panel__heading-icon--{{::section.id}}"
></div>
<icon type="'{{::section.icon}}'" size="'l'"></icon>
<h3 class="kuiPanelHeader__title">
{{::section.display}}
</h3>
@ -32,8 +30,8 @@
>
<a
data-test-subj="{{::item.id}}"
class="euiLink euiLink--primary management-panel__link"
ng-class="{ 'management-panel__link--disabled': item.disabled || !item.url }"
class="euiLink euiLink--primary mgtPanel__link"
ng-class="{ 'mgtPanel__link--disabled': item.disabled || !item.url }"
kbn-href="{{::item.disabled ? '' : item.url}}"
tooltip="{{::item.tooltip}}"
tooltip-placement="bottom"

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

@ -1,52 +1,58 @@
<div class="col-md-2 sidebar-container" role="region" aria-label="{{'kbn.management.editIndexPatternAria' | i18n: { defaultMessage: 'Index patterns' } }}">
<div class="sidebar-list">
<div class="sidebar-item-title full-title">
<h5 data-test-subj="createIndexPatternParent">
<a
ng-if="editingId"
href="#/management/kibana/index"
class="kuiButton kuiButton--primary kuiButton--small"
data-test-subj="createIndexPatternButton"
<div class="euiPage">
<div class="col-md-2 sidebar-container" role="region" aria-label="{{'kbn.management.editIndexPatternAria' | i18n: { defaultMessage: 'Index patterns' } }}">
<div class="sidebar-list">
<div class="sidebar-item-title full-title">
<h5 data-test-subj="createIndexPatternParent">
<a
ng-if="editingId"
href="#/management/kibana/index"
class="kuiButton kuiButton--primary kuiButton--small"
data-test-subj="createIndexPatternButton"
>
<span aria-hidden="true" class="kuiIcon fa-plus"></span>
<span i18n-id="kbn.management.editIndexPattern.createIndexButton"
i18n-default-message="Create Index Pattern"></span>
</a>
</h5>
</div>
<ul class="list-unstyled">
<li
ng-if="!defaultIndex"
class="sidebar-item"
>
<span aria-hidden="true" class="kuiIcon fa-plus"></span>
<span i18n-id="kbn.management.editIndexPattern.createIndexButton"
i18n-default-message="Create Index Pattern"></span>
</a>
</h5>
<div class="sidebar-item-title full-title">
<div class="euiText euiText--extraSmall">
<div class="euiBadge euiBadge--warning"
i18n-id="kbn.management.editIndexPattern.createIndex.warningHeader"
i18n-default-message="Warning"></div>
<p i18n-id="kbn.management.editIndexPattern.createIndex.warningLabel"
i18n-default-message="No default index pattern. You must select or create one to continue."></p>
</div>
</div>
</li>
<li
ng-repeat="pattern in indexPatternList | orderBy:['-default','title'] track by pattern.id"
class="sidebar-item"
>
<a
href="{{::pattern.url}}"
class="euiLink euiLink--primary show"
data-test-subj="indexPatternLink"
>
<div class="{{::pattern.class}}">
<i aria-hidden="true" ng-if="pattern.default" class="fa fa-star"></i>
<span ng-bind="::pattern.title"></span>
</div>
</a>
</li>
</ul>
</div>
<ul class="list-unstyled">
<li
ng-if="!defaultIndex"
class="sidebar-item"
>
<div class="sidebar-item-title full-title">
<div class="euiText euiText--extraSmall">
<div class="euiBadge euiBadge--warning"
i18n-id="kbn.management.editIndexPattern.createIndex.warningHeader"
i18n-default-message="Warning"></div>
<p i18n-id="kbn.management.editIndexPattern.createIndex.warningLabel"
i18n-default-message="No default index pattern. You must select or create one to continue."></p>
</div>
</div>
</li>
<li
ng-repeat="pattern in indexPatternList | orderBy:['-default','title'] track by pattern.id"
class="sidebar-item"
>
<a
href="{{::pattern.url}}"
class="euiLink euiLink--primary show"
data-test-subj="indexPatternLink"
>
<div class="{{::pattern.class}}">
<i aria-hidden="true" ng-if="pattern.default" class="fa fa-star"></i>
<span ng-bind="::pattern.title"></span>
</div>
</a>
</li>
</ul>
</div>
</div>
<div class="col-md-10" ng-transclude></div>
<div class="col-md-10">
<div class="euiPanel euiPanel--paddingLarge">
<div ng-transclude></div>
</div>
</div>
</div>

136
src/core_plugins/kibana/public/management/sections/objects/components/objects_table/components/relationships/__jest__/__snapshots__/relationships.test.js.snap
View file

@ -65,8 +65,8 @@ exports[`Relationships should render dashboards normally 1`] = `
columns={
Array [
Object {
"name": "Type",
"render": [Function],
"width": 24,
},
Object {
"field": "title",
@ -183,131 +183,9 @@ exports[`Relationships should render index patterns normally 1`] = `
</EuiTitle>
</EuiFlyoutHeader>
<EuiFlyoutBody>
<EuiDescriptionList
align="left"
compressed={false}
textStyle="normal"
type="row"
>
<React.Fragment
key="searches"
>
<EuiDescriptionListTitle
style={
Object {
"marginBottom": "1rem",
}
}
>
<EuiCallOut
color="warning"
size="m"
title="Warning"
>
<p>
Here are some saved searches that use this index pattern. If
you delete this index pattern, these saved searches will not
longer work properly.
</p>
</EuiCallOut>
</EuiDescriptionListTitle>
<EuiInMemoryTable
columns={
Array [
Object {
"name": "Type",
"render": [Function],
},
Object {
"field": "title",
"name": "Title",
"render": [Function],
},
Object {
"actions": Array [
Object {
"description": "View this saved object within Kibana",
"icon": "eye",
"name": "In app",
"onClick": [Function],
},
],
"name": "Actions",
},
]
}
items={
Array [
Object {
"id": "1",
},
]
}
pagination={true}
responsive={true}
sorting={false}
/>
</React.Fragment>
<React.Fragment
key="visualizations"
>
<EuiDescriptionListTitle
style={
Object {
"marginBottom": "1rem",
}
}
>
<EuiCallOut
color="warning"
size="m"
title="Warning"
>
<p>
Here are some visualizations that use this index pattern. If
you delete this index pattern, these visualizations will not
longer work properly.
</p>
</EuiCallOut>
</EuiDescriptionListTitle>
<EuiInMemoryTable
columns={
Array [
Object {
"name": "Type",
"render": [Function],
},
Object {
"field": "title",
"name": "Title",
"render": [Function],
},
Object {
"actions": Array [
Object {
"description": "View this saved object within Kibana",
"icon": "eye",
"name": "In app",
"onClick": [Function],
},
],
"name": "Actions",
},
]
}
items={
Array [
Object {
"id": "2",
},
]
}
pagination={true}
responsive={true}
sorting={false}
/>
</React.Fragment>
</EuiDescriptionList>
<EuiLoadingKibana
size="xl"
/>
</EuiFlyoutBody>
</EuiFlyout>
`;
@ -375,8 +253,8 @@ exports[`Relationships should render searches normally 1`] = `
columns={
Array [
Object {
"name": "Type",
"render": [Function],
"width": 24,
},
Object {
"field": "title",
@ -434,8 +312,8 @@ exports[`Relationships should render searches normally 1`] = `
columns={
Array [
Object {
"name": "Type",
"render": [Function],
"width": 24,
},
Object {
"field": "title",
@ -537,8 +415,8 @@ exports[`Relationships should render visualizations normally 1`] = `
columns={
Array [
Object {
"name": "Type",
"render": [Function],
"width": 24,
},
Object {
"field": "title",

2
src/core_plugins/kibana/public/management/sections/objects/components/objects_table/components/relationships/relationships.js
View file

@ -169,7 +169,7 @@ export class Relationships extends Component {
items={list}
columns={[
{
name: 'Type',
width: 24,
render: () => (
<EuiToolTip
position="top"

926
src/core_plugins/kibana/public/management/sections/settings/__snapshots__/advanced_settings.test.js.snap
View file

@ -1,487 +1,495 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`AdvancedSettings should render normally 1`] = `
<div
className="advancedSettings"
<EuiPage
restrictWidth={true}
>
<EuiFlexGroup
alignItems="stretch"
component="div"
direction="row"
gutterSize="none"
justifyContent="flexStart"
responsive={true}
wrap={false}
<div
className="mgtAdvancedSettings"
>
<EuiFlexItem
<EuiFlexGroup
alignItems="stretch"
component="div"
grow={true}
direction="row"
gutterSize="none"
justifyContent="flexStart"
responsive={true}
wrap={false}
>
<advanced_settings_page_title />
</EuiFlexItem>
<EuiFlexItem
component="div"
grow={true}
>
<Search
categories={
Array [
"general",
"elasticsearch",
]
}
onQueryChange={[Function]}
query={
Query {
"ast": _AST {
"_clauses": Array [],
"_indexedClauses": Object {
"field": Object {},
"is": Object {},
"term": Array [],
},
},
"syntax": Object {
"parse": [Function],
"print": [Function],
},
"text": "",
<EuiFlexItem
component="div"
grow={true}
>
<advanced_settings_page_title />
</EuiFlexItem>
<EuiFlexItem
component="div"
grow={true}
>
<Search
categories={
Array [
"general",
"elasticsearch",
]
}
}
/>
</EuiFlexItem>
</EuiFlexGroup>
<advanced_settings_page_subtitle />
<EuiSpacer
size="m"
/>
<CallOuts />
<EuiSpacer
size="m"
/>
<Form
categories={
Array [
"general",
"elasticsearch",
]
}
categoryCounts={
Object {
"elasticsearch": 2,
"general": 11,
onQueryChange={[Function]}
query={
Query {
"ast": _AST {
"_clauses": Array [],
"_indexedClauses": Object {
"field": Object {},
"is": Object {},
"term": Array [],
},
},
"syntax": Object {
"parse": [Function],
"print": [Function],
},
"text": "",
}
}
/>
</EuiFlexItem>
</EuiFlexGroup>
<advanced_settings_page_subtitle />
<EuiSpacer
size="m"
/>
<CallOuts />
<EuiSpacer
size="m"
/>
<Form
categories={
Array [
"general",
"elasticsearch",
]
}
}
clear={[Function]}
clearQuery={[Function]}
save={[Function]}
settings={
Object {
"elasticsearch": Array [
Object {
"ariaName": "test array setting",
"category": Array [
"elasticsearch",
],
"defVal": Array [
"default_value",
],
"description": "Description for Test array setting",
"displayName": "Test array setting",
"isCustom": undefined,
"isOverridden": false,
"name": "test:array:setting",
"options": undefined,
"readonly": false,
"type": "array",
"value": undefined,
},
Object {
"ariaName": "test boolean setting",
"category": Array [
"elasticsearch",
],
"defVal": true,
"description": "Description for Test boolean setting",
"displayName": "Test boolean setting",
"isCustom": undefined,
"isOverridden": false,
"name": "test:boolean:setting",
"options": undefined,
"readonly": false,
"type": "boolean",
"value": undefined,
},
],
"general": Array [
Object {
"ariaName": "test customstring setting",
"category": Array [
"general",
],
"defVal": null,
"description": "Description for Test custom string setting",
"displayName": "Test custom string setting",
"isCustom": undefined,
"isOverridden": false,
"name": "test:customstring:setting",
"options": undefined,
"readonly": false,
"type": "string",
"value": undefined,
},
Object {
"ariaName": "test image setting",
"category": Array [
"general",
],
"defVal": null,
"description": "Description for Test image setting",
"displayName": "Test image setting",
"isCustom": undefined,
"isOverridden": false,
"name": "test:image:setting",
"options": undefined,
"readonly": false,
"type": "image",
"value": undefined,
},
Object {
"ariaName": "test is overridden json",
"category": Array [
"general",
],
"defVal": "{
categoryCounts={
Object {
"elasticsearch": 2,
"general": 11,
}
}
clear={[Function]}
clearQuery={[Function]}
save={[Function]}
settings={
Object {
"elasticsearch": Array [
Object {
"ariaName": "test array setting",
"category": Array [
"elasticsearch",
],
"defVal": Array [
"default_value",
],
"description": "Description for Test array setting",
"displayName": "Test array setting",
"isCustom": undefined,
"isOverridden": false,
"name": "test:array:setting",
"options": undefined,
"readonly": false,
"type": "array",
"value": undefined,
},
Object {
"ariaName": "test boolean setting",
"category": Array [
"elasticsearch",
],
"defVal": true,
"description": "Description for Test boolean setting",
"displayName": "Test boolean setting",
"isCustom": undefined,
"isOverridden": false,
"name": "test:boolean:setting",
"options": undefined,
"readonly": false,
"type": "boolean",
"value": undefined,
},
],
"general": Array [
Object {
"ariaName": "test customstring setting",
"category": Array [
"general",
],
"defVal": null,
"description": "Description for Test custom string setting",
"displayName": "Test custom string setting",
"isCustom": undefined,
"isOverridden": false,
"name": "test:customstring:setting",
"options": undefined,
"readonly": false,
"type": "string",
"value": undefined,
},
Object {
"ariaName": "test image setting",
"category": Array [
"general",
],
"defVal": null,
"description": "Description for Test image setting",
"displayName": "Test image setting",
"isCustom": undefined,
"isOverridden": false,
"name": "test:image:setting",
"options": undefined,
"readonly": false,
"type": "image",
"value": undefined,
},
Object {
"ariaName": "test is overridden json",
"category": Array [
"general",
],
"defVal": "{
\\"foo\\": \\"bar\\"
}",
"description": "Description for overridden json",
"displayName": "An overridden json",
"isCustom": undefined,
"isOverridden": true,
"name": "test:isOverridden:json",
"options": undefined,
"readonly": false,
"type": "json",
"value": undefined,
},
Object {
"ariaName": "test is overridden number",
"category": Array [
"general",
],
"defVal": 1234,
"description": "Description for overridden number",
"displayName": "An overridden number",
"isCustom": undefined,
"isOverridden": true,
"name": "test:isOverridden:number",
"options": undefined,
"readonly": false,
"type": "number",
"value": undefined,
},
Object {
"ariaName": "test is overridden select",
"category": Array [
"general",
],
"defVal": "orange",
"description": "Description for overridden select setting",
"displayName": "Test overridden select setting",
"isCustom": undefined,
"isOverridden": true,
"name": "test:isOverridden:select",
"options": Array [
"apple",
"orange",
"banana",
],
"readonly": false,
"type": "select",
"value": undefined,
},
Object {
"ariaName": "test is overridden string",
"category": Array [
"general",
],
"defVal": "foo",
"description": "Description for overridden string",
"displayName": "An overridden string",
"isCustom": undefined,
"isOverridden": true,
"name": "test:isOverridden:string",
"options": undefined,
"readonly": false,
"type": "string",
"value": undefined,
},
Object {
"ariaName": "test json setting",
"category": Array [
"general",
],
"defVal": "{\\"foo\\": \\"bar\\"}",
"description": "Description for Test json setting",
"displayName": "Test json setting",
"isCustom": undefined,
"isOverridden": false,
"name": "test:json:setting",
"options": undefined,
"readonly": false,
"type": "json",
"value": undefined,
},
Object {
"ariaName": "test markdown setting",
"category": Array [
"general",
],
"defVal": "",
"description": "Description for Test markdown setting",
"displayName": "Test markdown setting",
"isCustom": undefined,
"isOverridden": false,
"name": "test:markdown:setting",
"options": undefined,
"readonly": false,
"type": "markdown",
"value": undefined,
},
Object {
"ariaName": "test number setting",
"category": Array [
"general",
],
"defVal": 5,
"description": "Description for Test number setting",
"displayName": "Test number setting",
"isCustom": undefined,
"isOverridden": false,
"name": "test:number:setting",
"options": undefined,
"readonly": false,
"type": "number",
"value": undefined,
},
Object {
"ariaName": "test select setting",
"category": Array [
"general",
],
"defVal": "orange",
"description": "Description for Test select setting",
"displayName": "Test select setting",
"isCustom": undefined,
"isOverridden": false,
"name": "test:select:setting",
"options": Array [
"apple",
"orange",
"banana",
],
"readonly": false,
"type": "select",
"value": undefined,
},
Object {
"ariaName": "test string setting",
"category": Array [
"general",
],
"defVal": null,
"description": "Description for Test string setting",
"displayName": "Test string setting",
"isCustom": undefined,
"isOverridden": false,
"name": "test:string:setting",
"options": undefined,
"readonly": false,
"type": "string",
"value": undefined,
},
],
"description": "Description for overridden json",
"displayName": "An overridden json",
"isCustom": undefined,
"isOverridden": true,
"name": "test:isOverridden:json",
"options": undefined,
"readonly": false,
"type": "json",
"value": undefined,
},
Object {
"ariaName": "test is overridden number",
"category": Array [
"general",
],
"defVal": 1234,
"description": "Description for overridden number",
"displayName": "An overridden number",
"isCustom": undefined,
"isOverridden": true,
"name": "test:isOverridden:number",
"options": undefined,
"readonly": false,
"type": "number",
"value": undefined,
},
Object {
"ariaName": "test is overridden select",
"category": Array [
"general",
],
"defVal": "orange",
"description": "Description for overridden select setting",
"displayName": "Test overridden select setting",
"isCustom": undefined,
"isOverridden": true,
"name": "test:isOverridden:select",
"options": Array [
"apple",
"orange",
"banana",
],
"readonly": false,
"type": "select",
"value": undefined,
},
Object {
"ariaName": "test is overridden string",
"category": Array [
"general",
],
"defVal": "foo",
"description": "Description for overridden string",
"displayName": "An overridden string",
"isCustom": undefined,
"isOverridden": true,
"name": "test:isOverridden:string",
"options": undefined,
"readonly": false,
"type": "string",
"value": undefined,
},
Object {
"ariaName": "test json setting",
"category": Array [
"general",
],
"defVal": "{\\"foo\\": \\"bar\\"}",
"description": "Description for Test json setting",
"displayName": "Test json setting",
"isCustom": undefined,
"isOverridden": false,
"name": "test:json:setting",
"options": undefined,
"readonly": false,
"type": "json",
"value": undefined,
},
Object {
"ariaName": "test markdown setting",
"category": Array [
"general",
],
"defVal": "",
"description": "Description for Test markdown setting",
"displayName": "Test markdown setting",
"isCustom": undefined,
"isOverridden": false,
"name": "test:markdown:setting",
"options": undefined,
"readonly": false,
"type": "markdown",
"value": undefined,
},
Object {
"ariaName": "test number setting",
"category": Array [
"general",
],
"defVal": 5,
"description": "Description for Test number setting",
"displayName": "Test number setting",
"isCustom": undefined,
"isOverridden": false,
"name": "test:number:setting",
"options": undefined,
"readonly": false,
"type": "number",
"value": undefined,
},
Object {
"ariaName": "test select setting",
"category": Array [
"general",
],
"defVal": "orange",
"description": "Description for Test select setting",
"displayName": "Test select setting",
"isCustom": undefined,
"isOverridden": false,
"name": "test:select:setting",
"options": Array [
"apple",
"orange",
"banana",
],
"readonly": false,
"type": "select",
"value": undefined,
},
Object {
"ariaName": "test string setting",
"category": Array [
"general",
],
"defVal": null,
"description": "Description for Test string setting",
"displayName": "Test string setting",
"isCustom": undefined,
"isOverridden": false,
"name": "test:string:setting",
"options": undefined,
"readonly": false,
"type": "string",
"value": undefined,
},
],
}
}
}
showNoResultsMessage={true}
/>
<advanced_settings_page_footer
onQueryMatchChange={[Function]}
query={
Query {
"ast": _AST {
"_clauses": Array [],
"_indexedClauses": Object {
"field": Object {},
"is": Object {},
"term": Array [],
showNoResultsMessage={true}
/>
<advanced_settings_page_footer
onQueryMatchChange={[Function]}
query={
Query {
"ast": _AST {
"_clauses": Array [],
"_indexedClauses": Object {
"field": Object {},
"is": Object {},
"term": Array [],
},
},
},
"syntax": Object {
"parse": [Function],
"print": [Function],
},
"text": "",
"syntax": Object {
"parse": [Function],
"print": [Function],
},
"text": "",
}
}
}
/>
</div>
/>
</div>
</EuiPage>
`;
exports[`AdvancedSettings should render specific setting if given setting key 1`] = `
<div
className="advancedSettings"
<EuiPage
restrictWidth={true}
>
<EuiFlexGroup
alignItems="stretch"
component="div"
direction="row"
gutterSize="none"
justifyContent="flexStart"
responsive={true}
wrap={false}
<div
className="mgtAdvancedSettings"
>
<EuiFlexItem
<EuiFlexGroup
alignItems="stretch"
component="div"
grow={true}
direction="row"
gutterSize="none"
justifyContent="flexStart"
responsive={true}
wrap={false}
>
<advanced_settings_page_title />
</EuiFlexItem>
<EuiFlexItem
component="div"
grow={true}
>
<Search
categories={
Array [
"general",
"elasticsearch",
]
}
onQueryChange={[Function]}
query={
Query {
"ast": _AST {
"_clauses": Array [
Object {
"field": "ariaName",
"match": "must",
"operator": "eq",
"type": "field",
"value": "test string setting",
},
],
"_indexedClauses": Object {
"field": Object {
"ariaName": Array [
Object {
"field": "ariaName",
"match": "must",
"operator": "eq",
"type": "field",
"value": "test string setting",
},
],
},
"is": Object {},
"term": Array [],
},
},
"syntax": Object {
"parse": [Function],
"print": [Function],
},
"text": "ariaName:\\"test string setting\\"",
}
}
/>
</EuiFlexItem>
</EuiFlexGroup>
<advanced_settings_page_subtitle />
<EuiSpacer
size="m"
/>
<CallOuts />
<EuiSpacer
size="m"
/>
<Form
categories={
Array [
"general",
"elasticsearch",
]
}
categoryCounts={
Object {
"elasticsearch": 2,
"general": 11,
}
}
clear={[Function]}
clearQuery={[Function]}
save={[Function]}
settings={
Object {
"general": Array [
Object {
"ariaName": "test string setting",
"category": Array [
<EuiFlexItem
component="div"
grow={true}
>
<advanced_settings_page_title />
</EuiFlexItem>
<EuiFlexItem
component="div"
grow={true}
>
<Search
categories={
Array [
"general",
],
"defVal": null,
"description": "Description for Test string setting",
"displayName": "Test string setting",
"isCustom": undefined,
"isOverridden": false,
"name": "test:string:setting",
"options": undefined,
"readonly": false,
"type": "string",
"value": undefined,
},
],
"elasticsearch",
]
}
onQueryChange={[Function]}
query={
Query {
"ast": _AST {
"_clauses": Array [
Object {
"field": "ariaName",
"match": "must",
"operator": "eq",
"type": "field",
"value": "test string setting",
},
],
"_indexedClauses": Object {
"field": Object {
"ariaName": Array [
Object {
"field": "ariaName",
"match": "must",
"operator": "eq",
"type": "field",
"value": "test string setting",
},
],
},
"is": Object {},
"term": Array [],
},
},
"syntax": Object {
"parse": [Function],
"print": [Function],
},
"text": "ariaName:\\"test string setting\\"",
}
}
/>
</EuiFlexItem>
</EuiFlexGroup>
<advanced_settings_page_subtitle />
<EuiSpacer
size="m"
/>
<CallOuts />
<EuiSpacer
size="m"
/>
<Form
categories={
Array [
"general",
"elasticsearch",
]
}
}
showNoResultsMessage={true}
/>
<advanced_settings_page_footer
onQueryMatchChange={[Function]}
query={
Query {
"ast": _AST {
"_clauses": Array [
categoryCounts={
Object {
"elasticsearch": 2,
"general": 11,
}
}
clear={[Function]}
clearQuery={[Function]}
save={[Function]}
settings={
Object {
"general": Array [
Object {
"field": "ariaName",
"match": "must",
"operator": "eq",
"type": "field",
"value": "test string setting",
"ariaName": "test string setting",
"category": Array [
"general",
],
"defVal": null,
"description": "Description for Test string setting",
"displayName": "Test string setting",
"isCustom": undefined,
"isOverridden": false,
"name": "test:string:setting",
"options": undefined,
"readonly": false,
"type": "string",
"value": undefined,
},
],
"_indexedClauses": Object {
"field": Object {
"ariaName": Array [
Object {
"field": "ariaName",
"match": "must",
"operator": "eq",
"type": "field",
"value": "test string setting",
},
],
},
"is": Object {},
"term": Array [],
},
},
"syntax": Object {
"parse": [Function],
"print": [Function],
},
"text": "ariaName:\\"test string setting\\"",
}
}
}
/>
</div>
showNoResultsMessage={true}
/>
<advanced_settings_page_footer
onQueryMatchChange={[Function]}
query={
Query {
"ast": _AST {
"_clauses": Array [
Object {
"field": "ariaName",
"match": "must",
"operator": "eq",
"type": "field",
"value": "test string setting",
},
],
"_indexedClauses": Object {
"field": Object {
"ariaName": Array [
Object {
"field": "ariaName",
"match": "must",
"operator": "eq",
"type": "field",
"value": "test string setting",
},
],
},
"is": Object {},
"term": Array [],
},
},
"syntax": Object {
"parse": [Function],
"print": [Function],
},
"text": "ariaName:\\"test string setting\\"",
}
}
/>
</div>
</EuiPage>
`;

60
src/core_plugins/kibana/public/management/sections/settings/advanced_settings.js
View file

@ -25,6 +25,7 @@ import {
EuiFlexGroup,
EuiFlexItem,
EuiSpacer,
EuiPage,
Query,
} from '@elastic/eui';
@ -34,7 +35,6 @@ import { Form } from './components/form';
import { getAriaName, toEditableConfig, DEFAULT_CATEGORY } from './lib';
import './advanced_settings.less';
import {
registerDefaultComponents,
PAGE_TITLE_COMPONENT,
@ -154,34 +154,36 @@ export class AdvancedSettings extends Component {
const PageFooter = getSettingsComponent(PAGE_FOOTER_COMPONENT);
return (
<div className="advancedSettings">
<EuiFlexGroup gutterSize="none">
<EuiFlexItem>
<PageTitle />
</EuiFlexItem>
<EuiFlexItem>
<Search
query={query}
categories={this.categories}
onQueryChange={this.onQueryChange}
/>
</EuiFlexItem>
</EuiFlexGroup>
<PageSubtitle />
<EuiSpacer size="m" />
<CallOuts />
<EuiSpacer size="m" />
<Form
settings={filteredSettings}
categories={this.categories}
categoryCounts={this.categoryCounts}
clearQuery={this.clearQuery}
save={this.saveConfig}
clear={this.clearConfig}
showNoResultsMessage={!footerQueryMatched}
/>
<PageFooter query={query} onQueryMatchChange={this.onFooterQueryMatchChange} />
</div>
<EuiPage restrictWidth>
<div className="mgtAdvancedSettings">
<EuiFlexGroup gutterSize="none">
<EuiFlexItem>
<PageTitle />
</EuiFlexItem>
<EuiFlexItem>
<Search
query={query}
categories={this.categories}
onQueryChange={this.onQueryChange}
/>
</EuiFlexItem>
</EuiFlexGroup>
<PageSubtitle />
<EuiSpacer size="m" />
<CallOuts />
<EuiSpacer size="m" />
<Form
settings={filteredSettings}
categories={this.categories}
categoryCounts={this.categoryCounts}
clearQuery={this.clearQuery}
save={this.saveConfig}
clear={this.clearConfig}
showNoResultsMessage={!footerQueryMatched}
/>
<PageFooter query={query} onQueryMatchChange={this.onFooterQueryMatchChange} />
</div>
</EuiPage>
);
}
}

30
src/core_plugins/kibana/public/management/sections/settings/advanced_settings.less
View file

@ -1,30 +0,0 @@
@import (reference) '~ui/styles/variables/colors';
.advancedSettings {
padding: 20px;
background: @globalColorLightestGray;
min-height: calc(~"100vh - 70px");
> div {
max-width: 1000px;
margin: 0 auto;
}
.advancedSettings__field {
+ * {
margin-top: 24px;
}
&__wrapper {
width: 720px;
}
&__actions {
padding-top: 30px;
}
.euiFormHelpText {
padding-bottom: 0;
}
}
}

19
src/core_plugins/kibana/public/management/sections/settings/advanced_settings.scss Normal file
View file

@ -0,0 +1,19 @@
.mgtAdvancedSettings {
padding: $euiSizeL;
background: $euiColorLightestShade;
min-height: calc(100vh - 70px);
.mgtAdvancedSettings__field {
+ * {
margin-top: $euiSize;
}
&Wrapper {
width: 640px;
}
&Actions {
padding-top: $euiSizeM;
}
}
}

128
src/core_plugins/kibana/public/management/sections/settings/components/field/__snapshots__/field.test.js.snap
View file

@ -3,7 +3,7 @@
exports[`Field for array setting should render as read only with help text if overridden 1`] = `
<EuiFlexGroup
alignItems="stretch"
className="advancedSettings__field"
className="mgtAdvancedSettings__field"
component="div"
direction="row"
gutterSize="l"
@ -16,7 +16,7 @@ exports[`Field for array setting should render as read only with help text if ov
grow={false}
>
<EuiDescribedFormGroup
className="advancedSettings__field__wrapper"
className="mgtAdvancedSettings__fieldWrapper"
description={
<React.Fragment>
<div
@ -99,7 +99,7 @@ exports[`Field for array setting should render as read only with help text if ov
exports[`Field for array setting should render custom setting icon if it is custom 1`] = `
<EuiFlexGroup
alignItems="stretch"
className="advancedSettings__field"
className="mgtAdvancedSettings__field"
component="div"
direction="row"
gutterSize="l"
@ -112,7 +112,7 @@ exports[`Field for array setting should render custom setting icon if it is cust
grow={false}
>
<EuiDescribedFormGroup
className="advancedSettings__field__wrapper"
className="mgtAdvancedSettings__fieldWrapper"
description={
<React.Fragment>
<div
@ -177,7 +177,7 @@ exports[`Field for array setting should render custom setting icon if it is cust
exports[`Field for array setting should render default value if there is no user value set 1`] = `
<EuiFlexGroup
alignItems="stretch"
className="advancedSettings__field"
className="mgtAdvancedSettings__field"
component="div"
direction="row"
gutterSize="l"
@ -190,7 +190,7 @@ exports[`Field for array setting should render default value if there is no user
grow={false}
>
<EuiDescribedFormGroup
className="advancedSettings__field__wrapper"
className="mgtAdvancedSettings__fieldWrapper"
description={
<React.Fragment>
<div
@ -250,7 +250,7 @@ exports[`Field for array setting should render default value if there is no user
exports[`Field for array setting should render user value if there is user value is set 1`] = `
<EuiFlexGroup
alignItems="stretch"
className="advancedSettings__field"
className="mgtAdvancedSettings__field"
component="div"
direction="row"
gutterSize="l"
@ -263,7 +263,7 @@ exports[`Field for array setting should render user value if there is user value
grow={false}
>
<EuiDescribedFormGroup
className="advancedSettings__field__wrapper"
className="mgtAdvancedSettings__fieldWrapper"
description={
<React.Fragment>
<div
@ -354,7 +354,7 @@ exports[`Field for array setting should render user value if there is user value
exports[`Field for boolean setting should render as read only with help text if overridden 1`] = `
<EuiFlexGroup
alignItems="stretch"
className="advancedSettings__field"
className="mgtAdvancedSettings__field"
component="div"
direction="row"
gutterSize="l"
@ -367,7 +367,7 @@ exports[`Field for boolean setting should render as read only with help text if
grow={false}
>
<EuiDescribedFormGroup
className="advancedSettings__field__wrapper"
className="mgtAdvancedSettings__fieldWrapper"
description={
<React.Fragment>
<div
@ -448,7 +448,7 @@ exports[`Field for boolean setting should render as read only with help text if
exports[`Field for boolean setting should render custom setting icon if it is custom 1`] = `
<EuiFlexGroup
alignItems="stretch"
className="advancedSettings__field"
className="mgtAdvancedSettings__field"
component="div"
direction="row"
gutterSize="l"
@ -461,7 +461,7 @@ exports[`Field for boolean setting should render custom setting icon if it is cu
grow={false}
>
<EuiDescribedFormGroup
className="advancedSettings__field__wrapper"
className="mgtAdvancedSettings__fieldWrapper"
description={
<React.Fragment>
<div
@ -524,7 +524,7 @@ exports[`Field for boolean setting should render custom setting icon if it is cu
exports[`Field for boolean setting should render default value if there is no user value set 1`] = `
<EuiFlexGroup
alignItems="stretch"
className="advancedSettings__field"
className="mgtAdvancedSettings__field"
component="div"
direction="row"
gutterSize="l"
@ -537,7 +537,7 @@ exports[`Field for boolean setting should render default value if there is no us
grow={false}
>
<EuiDescribedFormGroup
className="advancedSettings__field__wrapper"
className="mgtAdvancedSettings__fieldWrapper"
description={
<React.Fragment>
<div
@ -595,7 +595,7 @@ exports[`Field for boolean setting should render default value if there is no us
exports[`Field for boolean setting should render user value if there is user value is set 1`] = `
<EuiFlexGroup
alignItems="stretch"
className="advancedSettings__field"
className="mgtAdvancedSettings__field"
component="div"
direction="row"
gutterSize="l"
@ -608,7 +608,7 @@ exports[`Field for boolean setting should render user value if there is user val
grow={false}
>
<EuiDescribedFormGroup
className="advancedSettings__field__wrapper"
className="mgtAdvancedSettings__fieldWrapper"
description={
<React.Fragment>
<div
@ -697,7 +697,7 @@ exports[`Field for boolean setting should render user value if there is user val
exports[`Field for image setting should render as read only with help text if overridden 1`] = `
<EuiFlexGroup
alignItems="stretch"
className="advancedSettings__field"
className="mgtAdvancedSettings__field"
component="div"
direction="row"
gutterSize="l"
@ -710,7 +710,7 @@ exports[`Field for image setting should render as read only with help text if ov
grow={false}
>
<EuiDescribedFormGroup
className="advancedSettings__field__wrapper"
className="mgtAdvancedSettings__fieldWrapper"
description={
<React.Fragment>
<div
@ -790,7 +790,7 @@ exports[`Field for image setting should render as read only with help text if ov
exports[`Field for image setting should render custom setting icon if it is custom 1`] = `
<EuiFlexGroup
alignItems="stretch"
className="advancedSettings__field"
className="mgtAdvancedSettings__field"
component="div"
direction="row"
gutterSize="l"
@ -803,7 +803,7 @@ exports[`Field for image setting should render custom setting icon if it is cust
grow={false}
>
<EuiDescribedFormGroup
className="advancedSettings__field__wrapper"
className="mgtAdvancedSettings__fieldWrapper"
description={
<React.Fragment>
<div
@ -866,7 +866,7 @@ exports[`Field for image setting should render custom setting icon if it is cust
exports[`Field for image setting should render default value if there is no user value set 1`] = `
<EuiFlexGroup
alignItems="stretch"
className="advancedSettings__field"
className="mgtAdvancedSettings__field"
component="div"
direction="row"
gutterSize="l"
@ -879,7 +879,7 @@ exports[`Field for image setting should render default value if there is no user
grow={false}
>
<EuiDescribedFormGroup
className="advancedSettings__field__wrapper"
className="mgtAdvancedSettings__fieldWrapper"
description={
<React.Fragment>
<div
@ -937,7 +937,7 @@ exports[`Field for image setting should render default value if there is no user
exports[`Field for image setting should render user value if there is user value is set 1`] = `
<EuiFlexGroup
alignItems="stretch"
className="advancedSettings__field"
className="mgtAdvancedSettings__field"
component="div"
direction="row"
gutterSize="l"
@ -950,7 +950,7 @@ exports[`Field for image setting should render user value if there is user value
grow={false}
>
<EuiDescribedFormGroup
className="advancedSettings__field__wrapper"
className="mgtAdvancedSettings__fieldWrapper"
description={
<React.Fragment>
<div
@ -1049,7 +1049,7 @@ exports[`Field for image setting should render user value if there is user value
exports[`Field for json setting should render as read only with help text if overridden 1`] = `
<EuiFlexGroup
alignItems="stretch"
className="advancedSettings__field"
className="mgtAdvancedSettings__field"
component="div"
direction="row"
gutterSize="l"
@ -1062,7 +1062,7 @@ exports[`Field for json setting should render as read only with help text if ove
grow={false}
>
<EuiDescribedFormGroup
className="advancedSettings__field__wrapper"
className="mgtAdvancedSettings__fieldWrapper"
description={
<React.Fragment>
<div
@ -1165,7 +1165,7 @@ exports[`Field for json setting should render as read only with help text if ove
exports[`Field for json setting should render custom setting icon if it is custom 1`] = `
<EuiFlexGroup
alignItems="stretch"
className="advancedSettings__field"
className="mgtAdvancedSettings__field"
component="div"
direction="row"
gutterSize="l"
@ -1178,7 +1178,7 @@ exports[`Field for json setting should render custom setting icon if it is custo
grow={false}
>
<EuiDescribedFormGroup
className="advancedSettings__field__wrapper"
className="mgtAdvancedSettings__fieldWrapper"
description={
<React.Fragment>
<div
@ -1259,7 +1259,7 @@ exports[`Field for json setting should render custom setting icon if it is custo
exports[`Field for json setting should render default value if there is no user value set 1`] = `
<EuiFlexGroup
alignItems="stretch"
className="advancedSettings__field"
className="mgtAdvancedSettings__field"
component="div"
direction="row"
gutterSize="l"
@ -1272,7 +1272,7 @@ exports[`Field for json setting should render default value if there is no user
grow={false}
>
<EuiDescribedFormGroup
className="advancedSettings__field__wrapper"
className="mgtAdvancedSettings__fieldWrapper"
description={
<React.Fragment>
<div
@ -1383,7 +1383,7 @@ exports[`Field for json setting should render default value if there is no user
exports[`Field for json setting should render user value if there is user value is set 1`] = `
<EuiFlexGroup
alignItems="stretch"
className="advancedSettings__field"
className="mgtAdvancedSettings__field"
component="div"
direction="row"
gutterSize="l"
@ -1396,7 +1396,7 @@ exports[`Field for json setting should render user value if there is user value
grow={false}
>
<EuiDescribedFormGroup
className="advancedSettings__field__wrapper"
className="mgtAdvancedSettings__fieldWrapper"
description={
<React.Fragment>
<div
@ -1507,7 +1507,7 @@ exports[`Field for json setting should render user value if there is user value
exports[`Field for markdown setting should render as read only with help text if overridden 1`] = `
<EuiFlexGroup
alignItems="stretch"
className="advancedSettings__field"
className="mgtAdvancedSettings__field"
component="div"
direction="row"
gutterSize="l"
@ -1520,7 +1520,7 @@ exports[`Field for markdown setting should render as read only with help text if
grow={false}
>
<EuiDescribedFormGroup
className="advancedSettings__field__wrapper"
className="mgtAdvancedSettings__fieldWrapper"
description={
<React.Fragment>
<div
@ -1619,7 +1619,7 @@ exports[`Field for markdown setting should render as read only with help text if
exports[`Field for markdown setting should render custom setting icon if it is custom 1`] = `
<EuiFlexGroup
alignItems="stretch"
className="advancedSettings__field"
className="mgtAdvancedSettings__field"
component="div"
direction="row"
gutterSize="l"
@ -1632,7 +1632,7 @@ exports[`Field for markdown setting should render custom setting icon if it is c
grow={false}
>
<EuiDescribedFormGroup
className="advancedSettings__field__wrapper"
className="mgtAdvancedSettings__fieldWrapper"
description={
<React.Fragment>
<div
@ -1713,7 +1713,7 @@ exports[`Field for markdown setting should render custom setting icon if it is c
exports[`Field for markdown setting should render default value if there is no user value set 1`] = `
<EuiFlexGroup
alignItems="stretch"
className="advancedSettings__field"
className="mgtAdvancedSettings__field"
component="div"
direction="row"
gutterSize="l"
@ -1726,7 +1726,7 @@ exports[`Field for markdown setting should render default value if there is no u
grow={false}
>
<EuiDescribedFormGroup
className="advancedSettings__field__wrapper"
className="mgtAdvancedSettings__fieldWrapper"
description={
<React.Fragment>
<div
@ -1802,7 +1802,7 @@ exports[`Field for markdown setting should render default value if there is no u
exports[`Field for markdown setting should render user value if there is user value is set 1`] = `
<EuiFlexGroup
alignItems="stretch"
className="advancedSettings__field"
className="mgtAdvancedSettings__field"
component="div"
direction="row"
gutterSize="l"
@ -1815,7 +1815,7 @@ exports[`Field for markdown setting should render user value if there is user va
grow={false}
>
<EuiDescribedFormGroup
className="advancedSettings__field__wrapper"
className="mgtAdvancedSettings__fieldWrapper"
description={
<React.Fragment>
<div
@ -1922,7 +1922,7 @@ exports[`Field for markdown setting should render user value if there is user va
exports[`Field for number setting should render as read only with help text if overridden 1`] = `
<EuiFlexGroup
alignItems="stretch"
className="advancedSettings__field"
className="mgtAdvancedSettings__field"
component="div"
direction="row"
gutterSize="l"
@ -1935,7 +1935,7 @@ exports[`Field for number setting should render as read only with help text if o
grow={false}
>
<EuiDescribedFormGroup
className="advancedSettings__field__wrapper"
className="mgtAdvancedSettings__fieldWrapper"
description={
<React.Fragment>
<div
@ -2018,7 +2018,7 @@ exports[`Field for number setting should render as read only with help text if o
exports[`Field for number setting should render custom setting icon if it is custom 1`] = `
<EuiFlexGroup
alignItems="stretch"
className="advancedSettings__field"
className="mgtAdvancedSettings__field"
component="div"
direction="row"
gutterSize="l"
@ -2031,7 +2031,7 @@ exports[`Field for number setting should render custom setting icon if it is cus
grow={false}
>
<EuiDescribedFormGroup
className="advancedSettings__field__wrapper"
className="mgtAdvancedSettings__fieldWrapper"
description={
<React.Fragment>
<div
@ -2096,7 +2096,7 @@ exports[`Field for number setting should render custom setting icon if it is cus
exports[`Field for number setting should render default value if there is no user value set 1`] = `
<EuiFlexGroup
alignItems="stretch"
className="advancedSettings__field"
className="mgtAdvancedSettings__field"
component="div"
direction="row"
gutterSize="l"
@ -2109,7 +2109,7 @@ exports[`Field for number setting should render default value if there is no use
grow={false}
>
<EuiDescribedFormGroup
className="advancedSettings__field__wrapper"
className="mgtAdvancedSettings__fieldWrapper"
description={
<React.Fragment>
<div
@ -2169,7 +2169,7 @@ exports[`Field for number setting should render default value if there is no use
exports[`Field for number setting should render user value if there is user value is set 1`] = `
<EuiFlexGroup
alignItems="stretch"
className="advancedSettings__field"
className="mgtAdvancedSettings__field"
component="div"
direction="row"
gutterSize="l"
@ -2182,7 +2182,7 @@ exports[`Field for number setting should render user value if there is user valu
grow={false}
>
<EuiDescribedFormGroup
className="advancedSettings__field__wrapper"
className="mgtAdvancedSettings__fieldWrapper"
description={
<React.Fragment>
<div
@ -2273,7 +2273,7 @@ exports[`Field for number setting should render user value if there is user valu
exports[`Field for select setting should render as read only with help text if overridden 1`] = `
<EuiFlexGroup
alignItems="stretch"
className="advancedSettings__field"
className="mgtAdvancedSettings__field"
component="div"
direction="row"
gutterSize="l"
@ -2286,7 +2286,7 @@ exports[`Field for select setting should render as read only with help text if o
grow={false}
>
<EuiDescribedFormGroup
className="advancedSettings__field__wrapper"
className="mgtAdvancedSettings__fieldWrapper"
description={
<React.Fragment>
<div
@ -2386,7 +2386,7 @@ exports[`Field for select setting should render as read only with help text if o
exports[`Field for select setting should render custom setting icon if it is custom 1`] = `
<EuiFlexGroup
alignItems="stretch"
className="advancedSettings__field"
className="mgtAdvancedSettings__field"
component="div"
direction="row"
gutterSize="l"
@ -2399,7 +2399,7 @@ exports[`Field for select setting should render custom setting icon if it is cus
grow={false}
>
<EuiDescribedFormGroup
className="advancedSettings__field__wrapper"
className="mgtAdvancedSettings__fieldWrapper"
description={
<React.Fragment>
<div
@ -2481,7 +2481,7 @@ exports[`Field for select setting should render custom setting icon if it is cus
exports[`Field for select setting should render default value if there is no user value set 1`] = `
<EuiFlexGroup
alignItems="stretch"
className="advancedSettings__field"
className="mgtAdvancedSettings__field"
component="div"
direction="row"
gutterSize="l"
@ -2494,7 +2494,7 @@ exports[`Field for select setting should render default value if there is no use
grow={false}
>
<EuiDescribedFormGroup
className="advancedSettings__field__wrapper"
className="mgtAdvancedSettings__fieldWrapper"
description={
<React.Fragment>
<div
@ -2571,7 +2571,7 @@ exports[`Field for select setting should render default value if there is no use
exports[`Field for select setting should render user value if there is user value is set 1`] = `
<EuiFlexGroup
alignItems="stretch"
className="advancedSettings__field"
className="mgtAdvancedSettings__field"
component="div"
direction="row"
gutterSize="l"
@ -2584,7 +2584,7 @@ exports[`Field for select setting should render user value if there is user valu
grow={false}
>
<EuiDescribedFormGroup
className="advancedSettings__field__wrapper"
className="mgtAdvancedSettings__fieldWrapper"
description={
<React.Fragment>
<div
@ -2692,7 +2692,7 @@ exports[`Field for select setting should render user value if there is user valu
exports[`Field for string setting should render as read only with help text if overridden 1`] = `
<EuiFlexGroup
alignItems="stretch"
className="advancedSettings__field"
className="mgtAdvancedSettings__field"
component="div"
direction="row"
gutterSize="l"
@ -2705,7 +2705,7 @@ exports[`Field for string setting should render as read only with help text if o
grow={false}
>
<EuiDescribedFormGroup
className="advancedSettings__field__wrapper"
className="mgtAdvancedSettings__fieldWrapper"
description={
<React.Fragment>
<div
@ -2788,7 +2788,7 @@ exports[`Field for string setting should render as read only with help text if o
exports[`Field for string setting should render custom setting icon if it is custom 1`] = `
<EuiFlexGroup
alignItems="stretch"
className="advancedSettings__field"
className="mgtAdvancedSettings__field"
component="div"
direction="row"
gutterSize="l"
@ -2801,7 +2801,7 @@ exports[`Field for string setting should render custom setting icon if it is cus
grow={false}
>
<EuiDescribedFormGroup
className="advancedSettings__field__wrapper"
className="mgtAdvancedSettings__fieldWrapper"
description={
<React.Fragment>
<div
@ -2866,7 +2866,7 @@ exports[`Field for string setting should render custom setting icon if it is cus
exports[`Field for string setting should render default value if there is no user value set 1`] = `
<EuiFlexGroup
alignItems="stretch"
className="advancedSettings__field"
className="mgtAdvancedSettings__field"
component="div"
direction="row"
gutterSize="l"
@ -2879,7 +2879,7 @@ exports[`Field for string setting should render default value if there is no use
grow={false}
>
<EuiDescribedFormGroup
className="advancedSettings__field__wrapper"
className="mgtAdvancedSettings__fieldWrapper"
description={
<React.Fragment>
<div
@ -2939,7 +2939,7 @@ exports[`Field for string setting should render default value if there is no use
exports[`Field for string setting should render user value if there is user value is set 1`] = `
<EuiFlexGroup
alignItems="stretch"
className="advancedSettings__field"
className="mgtAdvancedSettings__field"
component="div"
direction="row"
gutterSize="l"
@ -2952,7 +2952,7 @@ exports[`Field for string setting should render user value if there is user valu
grow={false}
>
<EuiDescribedFormGroup
className="advancedSettings__field__wrapper"
className="mgtAdvancedSettings__fieldWrapper"
description={
<React.Fragment>
<div

6
src/core_plugins/kibana/public/management/sections/settings/components/field/field.js
View file

@ -566,7 +566,7 @@ export class Field extends PureComponent {
}
return (
<EuiFormRow className="advancedSettings__field__actions">
<EuiFormRow className="mgtAdvancedSettings__fieldActions" hasEmptyLabelSpace>
<EuiFlexGroup>
<EuiFlexItem grow={false}>
<EuiButton
@ -599,10 +599,10 @@ export class Field extends PureComponent {
const { error, isInvalid } = this.state;
return (
<EuiFlexGroup className="advancedSettings__field">
<EuiFlexGroup className="mgtAdvancedSettings__field">
<EuiFlexItem grow={false}>
<EuiDescribedFormGroup
className="advancedSettings__field__wrapper"
className="mgtAdvancedSettings__fieldWrapper"
title={this.renderTitle(setting)}
description={this.renderDescription(setting)}
idAria={`${setting.name}-aria`}

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

@ -1,228 +0,0 @@
@import (reference) "~ui/styles/theme";
@import (reference) "~ui/styles/variables";
kbn-management-app,
kbn-management-landing,
kbn-management-indices,
kbn-management-indices-edit,
kbn-management-indices-create,
kbn-management-advanced,
kbn-management-objects,
kbn-management-objects-view {
display: block;
}
.tab-account {
background-color: #FFFFFF;
}
.tab-management {
background-color: #FFFFFF;
}
.kbn-management-tab:first-letter {
text-transform: capitalize;
}
kbn-management-objects {
background: @globalColorLightestGray;
min-height: 100vh;
}
kbn-management-app {
li.current-page {
font-size: 1.5em;
margin: 0 10px;
}
min-height: 100vh;
}
kbn-management-landing {
.management-panel {
margin-bottom: 10px;
}
.management-panel__link {
font-size: 17px;
line-height: 32px;
&.management-panel__link--disabled {
opacity: 0.5;
cursor: default;
&:hover, &:visited {
color: @kibanaBlue2;
}
}
}
/**
* 1. Set icon size.
* 2. Hack the panel title to move to the left a bit.
*/
.management-panel__heading-icon {
width: 20px; /* 1 */
height: 20px; /* 1 */
background-position: center;
background-repeat: no-repeat;
background-size: contain; /* 1 */
margin-right: -3px; /* 2 */
}
.management-panel__heading-icon--security {
background-image: url("~ui/icons/security-gray.svg");
}
.management-panel__heading-icon--elasticsearch {
background-image: url("~ui/icons/elasticsearch-gray.svg");
}
.management-panel__heading-icon--kibana {
background-image: url("~ui/icons/kibana-gray.svg");
}
.management-panel__heading-icon--beats {
background-image: url("~ui/icons/beats-gray.svg");
}
.management-panel__heading-icon--logstash {
background-image: url("~ui/icons/logstash-gray.svg");
}
}
kbn-management-objects {
form {
margin-bottom: @line-height-computed;
}
.list-unstyled {
li {
border-bottom: 1px solid;
border-bottom-color: @management-objects-list-border;
padding: 8px;
}
}
.empty {
color: @management-objects-empty-color;
}
.item {
padding: 12px;
.item-title {
margin-left: 30px;
}
.actions {
margin-top: -6px;
}
}
.header {
.title, .controls {
padding-right: 1em;
display: inline-block;
}
}
}
.managementChangeIndexModal {
width: 800px;
overflow: auto;
max-height: 89vh;
}
kbn-management-advanced {
// super specific rule to override bootstrap's equally specific rule
// https://github.com/twbs/bootstrap/blob/1f329f8f17aa989eabc6e94bdcab93e69ef0e463/less/tables.less#L35
.table {
table-layout: fixed;
tbody > tr > td {
vertical-align: middle;
}
}
.advancedSettingsTableRowImage {
height: 3em;
width: auto;
}
.advancedSettingsTableRowActionsCell {
max-width: 300px;
}
}
kbn-management-objects-view {
.ace_editor { height: 300px; }
}
.advanced-settings {
overflow-x: scroll;
table {
width: 100%;
tr.default td.value {
color: @management-advanced-table-default-color;
}
td {
font-family: @font-family-monospace;
&.actions {
width: 150px;
}
}
}
}
.indices-settings {
i.active {
color: @management-indices-active-color;
}
tr.field-settings {
.field-popularize {
margin-left: 5px;
display: none;
}
&:hover .field-popularize {
display: inline;
}
}
}
kbn-management-indices {
.fields {
display: block;
table {
.table-striped()
}
th:last-child,
td:last-child {
text-align: right;
}
}
.indexed-fields {
th:first-child,
td:first-child {
width: 35%;
}
}
.scripted-fields header {
margin: 5px 0;
text-align: right;
}
p.text-center {
padding-top: 1em;
}
}
@import "~ui/dragula/gu-dragula.less";

1
src/dev/precommit_hook/casing_check_config.js
View file

@ -161,7 +161,6 @@ export const TEMPORARILY_IGNORED_PATHS = [
'src/ui/public/assets/favicons/mstile-150x150.png',
'src/ui/public/assets/favicons/safari-pinned-tab.svg',
'src/ui/public/directives/__tests__/confirm-click.js',
'src/ui/public/dragula/gu-dragula.less',
'src/ui/public/field_format_editor/editors/url/icons/flag-icon.LICENSE',
'src/ui/public/icons/beats-color.svg',
'src/ui/public/icons/beats-gray.svg',

13
src/ui/public/dragula/gu-dragula.less
View file

@ -1,13 +0,0 @@
.gu-handle {
cursor: move;
cursor: grab;
cursor: -moz-grab;
cursor: -webkit-grab;
}
.gu-mirror,
.gu-mirror .gu-handle {
cursor: grabbing;
cursor: -moz-grabbing;
cursor: -webkit-grabbing;
}

5
src/ui/public/management/index.js
View file

@ -41,15 +41,18 @@ management.register('data', {
management.register('elasticsearch', {
display: 'Elasticsearch',
order: 20
order: 20,
icon: 'logoElasticsearch'
});
management.register('kibana', {
display: 'Kibana',
order: 30,
icon: 'logoKibana',
});
management.register('logstash', {
display: 'Logstash',
order: 30,
icon: 'logoLogstash',
});

2
src/ui/public/management/section.js
View file

@ -31,6 +31,7 @@ export class ManagementSection {
* @param {boolean|null} options.visible - defaults to true
* @param {boolean|null} options.disabled - defaults to false
* @param {string|null} options.tooltip - defaults to ''
* @param {string|null} options.icon - defaults to ''
* @returns {ManagementSection}
*/
@ -44,6 +45,7 @@ export class ManagementSection {
this.visible = true;
this.disabled = false;
this.tooltip = '';
this.icon = '';
this.url = '';
assign(this, options);

1
x-pack/plugins/index_management/index.js
View file

@ -18,6 +18,7 @@ export function indexManagement(kibana) {
publicDir: resolve(__dirname, 'public'),
require: ['kibana', 'elasticsearch', 'xpack_main'],
uiExports: {
styleSheetPaths: `${__dirname}/public/index.scss`,
managementSections: [
'plugins/index_management',
]

17
x-pack/plugins/index_management/public/_index_management.scss Normal file
View file

@ -0,0 +1,17 @@
#indReactRoot {
background-color: $euiColorLightestShade;
}
.indTable__link {
text-align: left;
}
.indTable__horizontalScrollContainer {
overflow-x: auto;
max-width: 100%;
height: 100vh;
}
.indTable__horizontalScroll {
min-width: 800px;
width: 100%;
}

13
x-pack/plugins/index_management/public/index.scss Normal file
View file

@ -0,0 +1,13 @@
// Import the EUI global scope so we can use EUI constants
@import 'ui/public/styles/_styling_constants';
// Index management plugin styles
// Prefix all styles with "ind" to avoid conflicts.
// Examples
// indChart
// indChart__legend
// indChart__legend--small
// indChart__legend-isLoading
@import 'index_management';

2
x-pack/plugins/index_management/public/main.html
View file

@ -1,3 +1,3 @@
<kbn-management-app section="elasticsearch/index_management">
<div id="indexManagementReactRoot" class="indexTableHorizontalScrollContainer"></div>
<div id="indexManagementReactRoot" class="indTable__horizontalScrollContainer"></div>
</kbn-management-app>

2
x-pack/plugins/index_management/public/sections/index_list/components/index_list/index_list.js
View file

@ -29,7 +29,7 @@ export class IndexList extends React.PureComponent {
render() {
return (
<div className="indexTableHorizontalScroll im-snapshotTestSubject">
<div className="indTable__horizontalScroll im-snapshotTestSubject">
<IndexTable />
<DetailPanel />
</div>

2
x-pack/plugins/index_management/public/sections/index_list/components/index_table/index_table.js
View file

@ -168,7 +168,7 @@ export class IndexTableUi extends Component {
} else if (fieldName === 'name') {
return (
<EuiLink
className="indexTable__link"
className="indTable__link"
data-test-subj="indexTableIndexNameLink"
onClick={() => {
openDetailPanel(value);

8
x-pack/plugins/index_management/public/styles/table.less
View file

@ -2,23 +2,23 @@
background-color: #F5F5F5;
}
.indexTable__link {
.indTable__link {
text-align: left;
}
.indexTable__header--name {
width: 25%;
}
.indexTableHorizontalScrollContainer {
.indTable__horizontalScrollContainer {
overflow-x: auto;
max-width: 100%;
height: 100vh;
}
.indexTableHorizontalScroll {
.indTable__horizontalScroll {
min-width: 800px;
width: 100%;
}
.indexDetail__codeBlock {
.indDetail__codeBlock {
background: transparent;
}

4
x-pack/plugins/license_management/__jest__/__snapshots__/add_license.test.js.snap
View file

@ -1,5 +1,5 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`AddLicense component when license is active should display correct verbiage 1`] = `"<div class=\\"euiCard euiCard--centerAligned\\"><span class=\\"euiCard__content\\"><span class=\\"euiTitle euiTitle--medium euiCard__title\\">Update your license</span><div class=\\"euiText euiText--small euiCard__description\\"><p>If you already have a new license, upload it now.</p></div></span><span class=\\"euiCard__footer\\"><a class=\\"euiButton euiButton--primary licenseManagement__marginTop\\" href=\\"#/management/elasticsearch/license_management/upload_license\\" data-test-subj=\\"updateLicenseButton\\"><span class=\\"euiButton__content\\"><span class=\\"euiButton__text\\">Update license</span></span></a></span></div>"`;
exports[`AddLicense component when license is active should display correct verbiage 1`] = `"<div class=\\"euiCard euiCard--centerAligned\\"><span class=\\"euiCard__content\\"><span class=\\"euiTitle euiTitle--medium euiCard__title\\">Update your license</span><div class=\\"euiText euiText--small euiCard__description\\"><p>If you already have a new license, upload it now.</p></div></span><span class=\\"euiCard__footer\\"><a class=\\"euiButton euiButton--primary\\" href=\\"#/management/elasticsearch/license_management/upload_license\\" data-test-subj=\\"updateLicenseButton\\"><span class=\\"euiButton__content\\"><span class=\\"euiButton__text\\">Update license</span></span></a></span></div>"`;
exports[`AddLicense component when license is expired should display with correct verbiage 1`] = `"<div class=\\"euiCard euiCard--centerAligned\\"><span class=\\"euiCard__content\\"><span class=\\"euiTitle euiTitle--medium euiCard__title\\">Update your license</span><div class=\\"euiText euiText--small euiCard__description\\"><p>If you already have a new license, upload it now.</p></div></span><span class=\\"euiCard__footer\\"><a class=\\"euiButton euiButton--primary licenseManagement__marginTop\\" href=\\"#/management/elasticsearch/license_management/upload_license\\" data-test-subj=\\"updateLicenseButton\\"><span class=\\"euiButton__content\\"><span class=\\"euiButton__text\\">Update license</span></span></a></span></div>"`;
exports[`AddLicense component when license is expired should display with correct verbiage 1`] = `"<div class=\\"euiCard euiCard--centerAligned\\"><span class=\\"euiCard__content\\"><span class=\\"euiTitle euiTitle--medium euiCard__title\\">Update your license</span><div class=\\"euiText euiText--small euiCard__description\\"><p>If you already have a new license, upload it now.</p></div></span><span class=\\"euiCard__footer\\"><a class=\\"euiButton euiButton--primary\\" href=\\"#/management/elasticsearch/license_management/upload_license\\" data-test-subj=\\"updateLicenseButton\\"><span class=\\"euiButton__content\\"><span class=\\"euiButton__text\\">Update license</span></span></a></span></div>"`;

6
x-pack/plugins/license_management/__jest__/__snapshots__/request_trial_extension.test.js.snap
View file

@ -1,7 +1,7 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`RequestTrialExtension component should display when license is active and trial has been used 1`] = `"<div class=\\"euiFlexItem\\"><div class=\\"euiCard euiCard--centerAligned\\"><span class=\\"euiCard__content\\"><span class=\\"euiTitle euiTitle--medium euiCard__title\\">Extend your trial</span><div class=\\"euiText euiText--small euiCard__description\\"><p><span>If you’d like to continuing using security, machine learning, and our other awesome <a class=\\"euiLink euiLink--primary\\" href=\\"https://www.elastic.co/subscriptions/xpack\\" target=\\"_blank\\" rel=\\"noopener noreferrer\\">Platinum features</a>, request an extension now.</span></p></div></span><span class=\\"euiCard__footer\\"><a class=\\"euiButton euiButton--primary licenseManagement__marginTop\\" href=\\"https://www.elastic.co/trialextension\\" target=\\"_blank\\" rel=\\"noopener noreferrer\\" data-test-subj=\\"extendTrialButton\\"><span class=\\"euiButton__content\\"><span class=\\"euiButton__text\\">Extend trial</span></span></a></span></div></div>"`;
exports[`RequestTrialExtension component should display when license is active and trial has been used 1`] = `"<div class=\\"euiFlexItem\\"><div class=\\"euiCard euiCard--centerAligned\\"><span class=\\"euiCard__content\\"><span class=\\"euiTitle euiTitle--medium euiCard__title\\">Extend your trial</span><div class=\\"euiText euiText--small euiCard__description\\"><p><span>If you’d like to continuing using security, machine learning, and our other awesome <a class=\\"euiLink euiLink--primary\\" href=\\"https://www.elastic.co/subscriptions/xpack\\" target=\\"_blank\\" rel=\\"noopener noreferrer\\">Platinum features</a>, request an extension now.</span></p></div></span><span class=\\"euiCard__footer\\"><a class=\\"euiButton euiButton--primary\\" href=\\"https://www.elastic.co/trialextension\\" target=\\"_blank\\" rel=\\"noopener noreferrer\\" data-test-subj=\\"extendTrialButton\\"><span class=\\"euiButton__content\\"><span class=\\"euiButton__text\\">Extend trial</span></span></a></span></div></div>"`;
exports[`RequestTrialExtension component should display when license is not active and trial has been used 1`] = `"<div class=\\"euiFlexItem\\"><div class=\\"euiCard euiCard--centerAligned\\"><span class=\\"euiCard__content\\"><span class=\\"euiTitle euiTitle--medium euiCard__title\\">Extend your trial</span><div class=\\"euiText euiText--small euiCard__description\\"><p><span>If you’d like to continuing using security, machine learning, and our other awesome <a class=\\"euiLink euiLink--primary\\" href=\\"https://www.elastic.co/subscriptions/xpack\\" target=\\"_blank\\" rel=\\"noopener noreferrer\\">Platinum features</a>, request an extension now.</span></p></div></span><span class=\\"euiCard__footer\\"><a class=\\"euiButton euiButton--primary licenseManagement__marginTop\\" href=\\"https://www.elastic.co/trialextension\\" target=\\"_blank\\" rel=\\"noopener noreferrer\\" data-test-subj=\\"extendTrialButton\\"><span class=\\"euiButton__content\\"><span class=\\"euiButton__text\\">Extend trial</span></span></a></span></div></div>"`;
exports[`RequestTrialExtension component should display when license is not active and trial has been used 1`] = `"<div class=\\"euiFlexItem\\"><div class=\\"euiCard euiCard--centerAligned\\"><span class=\\"euiCard__content\\"><span class=\\"euiTitle euiTitle--medium euiCard__title\\">Extend your trial</span><div class=\\"euiText euiText--small euiCard__description\\"><p><span>If you’d like to continuing using security, machine learning, and our other awesome <a class=\\"euiLink euiLink--primary\\" href=\\"https://www.elastic.co/subscriptions/xpack\\" target=\\"_blank\\" rel=\\"noopener noreferrer\\">Platinum features</a>, request an extension now.</span></p></div></span><span class=\\"euiCard__footer\\"><a class=\\"euiButton euiButton--primary\\" href=\\"https://www.elastic.co/trialextension\\" target=\\"_blank\\" rel=\\"noopener noreferrer\\" data-test-subj=\\"extendTrialButton\\"><span class=\\"euiButton__content\\"><span class=\\"euiButton__text\\">Extend trial</span></span></a></span></div></div>"`;
exports[`RequestTrialExtension component should display when platinum license is not active and trial has been used 1`] = `"<div class=\\"euiFlexItem\\"><div class=\\"euiCard euiCard--centerAligned\\"><span class=\\"euiCard__content\\"><span class=\\"euiTitle euiTitle--medium euiCard__title\\">Extend your trial</span><div class=\\"euiText euiText--small euiCard__description\\"><p><span>If you’d like to continuing using security, machine learning, and our other awesome <a class=\\"euiLink euiLink--primary\\" href=\\"https://www.elastic.co/subscriptions/xpack\\" target=\\"_blank\\" rel=\\"noopener noreferrer\\">Platinum features</a>, request an extension now.</span></p></div></span><span class=\\"euiCard__footer\\"><a class=\\"euiButton euiButton--primary licenseManagement__marginTop\\" href=\\"https://www.elastic.co/trialextension\\" target=\\"_blank\\" rel=\\"noopener noreferrer\\" data-test-subj=\\"extendTrialButton\\"><span class=\\"euiButton__content\\"><span class=\\"euiButton__text\\">Extend trial</span></span></a></span></div></div>"`;
exports[`RequestTrialExtension component should display when platinum license is not active and trial has been used 1`] = `"<div class=\\"euiFlexItem\\"><div class=\\"euiCard euiCard--centerAligned\\"><span class=\\"euiCard__content\\"><span class=\\"euiTitle euiTitle--medium euiCard__title\\">Extend your trial</span><div class=\\"euiText euiText--small euiCard__description\\"><p><span>If you’d like to continuing using security, machine learning, and our other awesome <a class=\\"euiLink euiLink--primary\\" href=\\"https://www.elastic.co/subscriptions/xpack\\" target=\\"_blank\\" rel=\\"noopener noreferrer\\">Platinum features</a>, request an extension now.</span></p></div></span><span class=\\"euiCard__footer\\"><a class=\\"euiButton euiButton--primary\\" href=\\"https://www.elastic.co/trialextension\\" target=\\"_blank\\" rel=\\"noopener noreferrer\\" data-test-subj=\\"extendTrialButton\\"><span class=\\"euiButton__content\\"><span class=\\"euiButton__text\\">Extend trial</span></span></a></span></div></div>"`;

8
x-pack/plugins/license_management/__jest__/__snapshots__/telemetry_opt_in.test.js.snap
View file

@ -40,7 +40,7 @@ exports[`TelemetryOptIn should display when telemetry not opted in 1`] = `
Read more
</EuiLink>
}
className="licenseManagement__baseline"
className="eui-AlignBaseline"
closePopover={[Function]}
hasArrow={true}
id="readMorePopover"
@ -49,7 +49,7 @@ exports[`TelemetryOptIn should display when telemetry not opted in 1`] = `
panelPaddingSize="m"
>
<EuiText
className="licenseManagement__narrowText"
className="licManagement__narrowText"
grow={true}
>
<p>
@ -111,7 +111,7 @@ exports[`TelemetryOptIn should display when telemetry not opted in 1`] = `
Read more
</EuiLink>
}
className="licenseManagement__baseline"
className="eui-AlignBaseline"
closePopover={[Function]}
hasArrow={true}
id="readMorePopover"
@ -123,7 +123,7 @@ exports[`TelemetryOptIn should display when telemetry not opted in 1`] = `
onOutsideClick={[Function]}
>
<div
className="euiPopover euiPopover--anchorDownCenter licenseManagement__baseline"
className="euiPopover euiPopover--anchorDownCenter eui-AlignBaseline"
id="readMorePopover"
onClick={[Function]}
onKeyDown={[Function]}

1
x-pack/plugins/license_management/index.js
View file

@ -14,6 +14,7 @@ export function licenseManagement(kibana) {
publicDir: resolve(__dirname, 'public'),
require: ['kibana', 'elasticsearch'],
uiExports: {
styleSheetPaths: `${__dirname}/public/index.scss`,
managementSections: [
'plugins/license_management',
]

23
x-pack/plugins/license_management/public/_license_management.scss Normal file
View file

@ -0,0 +1,23 @@
.licFeature {
flex-grow: 1;
background: $euiColorLightestShade;
min-height: 100vh;
}
.licManagement__pageBody {
padding-top: $euiSizeL;
min-height: auto;
}
// EUITODO: Fix modal width/max-width
.licManagement__modal {
width: 70vw;
}
.licManagement__narrowText {
width: 240px;
}
.licManagement__ieFlex {
flex-shrink: 0;
}

4
x-pack/plugins/license_management/public/app.js
View file

@ -14,8 +14,8 @@ import {
} from '@elastic/eui';
export default () => (
<EuiPage className="licenseManagement">
<EuiPageBody className="licenseManagement__pageBody">
<EuiPage restrictWidth>
<EuiPageBody className="licManagement__pageBody">
<Switch>
<Route path={`${BASE_PATH}upload_license`} component={UploadLicense}/>
<Route path={`${BASE_PATH}`} component={LicenseDashboard}/>

4
x-pack/plugins/license_management/public/components/telemetry_opt_in/telemetry_opt_in.js
View file

@ -80,9 +80,9 @@ export class TelemetryOptIn extends React.Component {
button={readMoreButton}
isOpen={showMoreTelemetryInfo}
closePopover={this.closeReadMorePopover}
className="licenseManagement__baseline"
className="eui-AlignBaseline"
>
<EuiText className="licenseManagement__narrowText" >
<EuiText className="licManagement__narrowText" >
<p>
This feature periodically sends basic feature usage statistics.
This information will not be shared outside of Elastic.

3
x-pack/plugins/license_management/public/index.js
View file

@ -5,5 +5,4 @@
*/
import './management_section';
import './register_route';
import './styles/main.less';
import './register_route';

13
x-pack/plugins/license_management/public/index.scss Normal file
View file

@ -0,0 +1,13 @@
// EUI globals
@import 'ui/public/styles/styling_constants';
// License amnagement plugin styles
// Prefix all styles with "lic" to avoid conflicts.
// Examples
// licChart
// licChart__legend
// licChart__legend--small
// licChart__legend-isLoading
@import 'license_management';

2
x-pack/plugins/license_management/public/main.html
View file

@ -1,3 +1,3 @@
<kbn-management-app section="elasticsearch/license_management">
<div id="licenseReactRoot" class="licenseFeature"></div>
<div id="licenseReactRoot"></div>
</kbn-management-app>

1
x-pack/plugins/license_management/public/sections/license_dashboard/add_license/add_license.js
View file

@ -17,7 +17,6 @@ export const AddLicense = ({ uploadPath = `#${BASE_PATH}upload_license` }) => {
footer={
<EuiButton
data-test-subj="updateLicenseButton"
className="licenseManagement__marginTop"
href={uploadPath}
>
Update license

2
x-pack/plugins/license_management/public/sections/license_dashboard/license_dashboard.js
View file

@ -20,7 +20,7 @@ import {
export const LicenseDashboard = () => {
return (
<div className="licenseManagement__contain">
<div className="licManagement__contain">
<EuiFlexGroup justifyContent="spaceAround">
<LicenseStatus />
</EuiFlexGroup>

1
x-pack/plugins/license_management/public/sections/license_dashboard/request_trial_extension/request_trial_extension.js
View file

@ -32,7 +32,6 @@ export const RequestTrialExtension = ({ shouldShowRequestTrialExtension }) => {
footer={
<EuiButton
data-test-subj="extendTrialButton"
className="licenseManagement__marginTop"
target="_blank"
href="https://www.elastic.co/trialextension"
>

8
x-pack/plugins/license_management/public/sections/license_dashboard/start_trial/start_trial.js
View file

@ -56,7 +56,7 @@ export class StartTrial extends React.PureComponent {
return (
<EuiOverlayMask>
<EuiModal
className="licenseManagement__modal"
className="licManagement__modal"
onClose={this.cancel}
>
<EuiModalHeader>
@ -114,9 +114,9 @@ export class StartTrial extends React.PureComponent {
<EuiFlexItem grow={false}>
<TelemetryOptIn isStartTrial={true} ref={(ref) => {this.telemetryOptIn = ref; }}/>
</EuiFlexItem>
<EuiFlexItem grow={false} className="licenseManagement__ieFlex">
<EuiFlexItem grow={false} className="licManagement__ieFlex">
<EuiFlexGroup responsive={false}>
<EuiFlexItem grow={false} className="licenseManagement__ieFlex">
<EuiFlexItem grow={false} className="licManagement__ieFlex">
<EuiButtonEmpty
data-test-subj="confirmModalCancelButton"
onClick={this.cancel}
@ -125,7 +125,7 @@ export class StartTrial extends React.PureComponent {
Cancel
</EuiButtonEmpty>
</EuiFlexItem>
<EuiFlexItem grow={false} className="licenseManagement__ieFlex">
<EuiFlexItem grow={false} className="licManagement__ieFlex">
<EuiButton
data-test-subj="confirmModalConfirmButton"
onClick={this.startLicenseTrial}

33
x-pack/plugins/license_management/public/styles/main.less
View file

@ -1,33 +0,0 @@
@import (reference) '~ui/styles/variables/colors';
.licenseFeature {
flex-grow: 1;
background: @globalColorLightestGray;
min-height: 100vh;
}
.licenseManagement__pageBody {
padding-top: 24px;
min-height: auto;
}
// EUITODO: Fix modal width/max-width
.licenseManagement__modal {
width: 70vw;
@media only screen and (max-width: 767px) {
width: ~"calc(100vw + 2px)";
}
}
.licenseManagement__baseline {
vertical-align: baseline;
}
.licenseManagement__narrowText {
width: 240px;
}
.licenseManagement__marginTop {
margin-top: auto;
}
.licenseManagement__ieFlex {
flex-shrink: 0;
}

2
x-pack/plugins/logstash/public/components/pipeline_list/pipeline_list.js
View file

@ -203,7 +203,7 @@ export class PipelineList extends React.Component {
const { clonePipeline, createPipeline, isReadOnly, openPipeline } = this.props;
const { isSelectable, message, pipelines, selection, showConfirmDeleteModal } = this.state;
return (
<EuiPage style={{ minHeight: '100vh' }} data-test-subj="pipelineList">
<EuiPage data-test-subj="pipelineList">
<EuiPageContent horizontalPosition="center">
{this.renderNoPermissionCallOut()}
<PipelinesTable

11
x-pack/plugins/ml/public/settings/settings.html
View file

@ -3,23 +3,22 @@
<div class="page-row">
<div class="kuiPanel management-panel">
<div class="kuiPanel mgtPanel">
<div class="kuiPanelHeader">
<div class="kuiPanelHeaderSection">
<div class="management-panel__heading-icon management-panel__heading-icon--elasticsearch"></div>
<div class="kuiPanelHeader__title ng-binding">
Job Management
</div>
</div>
</div>
<div class="kuiPanelBody management-panel__body">
<div class="kuiPanelBody mgtPanel__body">
<div class="row">
<ul class="list-unstyled">
<li class="col-xs-4 col-md-3 ng-scope">
<a
data-test-subj=""
class="management-panel__link ng-binding"
class="mgtPanel__link ng-binding"
tooltip=""
tooltip-placement="bottom"
tooltip-popup-delay="400"
@ -32,7 +31,7 @@
<a
ng-if="(canCreateFilter === true)"
data-test-subj=""
class="management-panel__link ng-binding"
class="mgtPanel__link ng-binding"
tooltip=""
tooltip-placement="bottom"
tooltip-popup-delay="400"
@ -42,7 +41,7 @@
</a>
<span
ng-if="(canCreateFilter === false)"
class="management-panel__link disabled ng-binding"
class="mgtPanel__link disabled ng-binding"
tooltip="You do not have permission to manage filter lists"
tooltip-placement="bottom"
tooltip-popup-delay="400"

4
x-pack/plugins/ml/public/settings/styles/main.less
View file

@ -7,8 +7,8 @@
}
ml-settings {
.management-panel {
.management-panel__link {
.mgtPanel {
.mgtPanel__link {
font-size: 17px;
line-height: 32px;
margin-left: 6px;

4
x-pack/plugins/monitoring/public/components/license/index.js
View file

@ -47,8 +47,8 @@ export function License(props) {
const { status, type, isExpired, expiryDate } = props;
return (
<EuiPage className="licenseManagement">
<EuiPageBody className="licenseManagement__pageBody">
<div className="licenseManagement__contain">
<EuiPageBody className="licManagement__pageBody">
<div className="licManagement__contain">
<LicenseStatus
isExpired={isExpired}
status={status}

2
x-pack/plugins/monitoring/public/views/license/index.html
View file

@ -1,3 +1,3 @@
<monitoring-main data-test-subj="xpackLicensePage">
<div id="licenseReact" class="licenseFeature"></div>
<div id="licenseReact" class="licFeature"></div>
</monitoring-main>

3
x-pack/plugins/security/public/views/management/management.js
View file

@ -31,7 +31,8 @@ routes.defaults(/\/management/, {
function ensureSecurityRegistered() {
const registerSecurity = () => management.register('security', {
display: 'Security',
order: 10
order: 10,
icon: 'securityApp',
});
const getSecurity = () => management.getSection('security');

13
x-pack/plugins/watcher/public/sections/watch_edit/components/json_watch_edit/json_watch_edit.html
View file

@ -3,8 +3,9 @@
omit-breadcrumb-pages="{{ jsonWatchEdit.omitBreadcrumbPages }}"
page-title="jsonWatchEdit.breadcrumb"
>
<div class="kuiViewContent kuiViewContent--constrainedWidth">
<div class="kuiViewContentItem kuiVerticalRhythm">
<div class="euiSpacer euiSpacer--l"></div>
<div class="kuiViewContent euiPanel euiPanel--paddingLarge kuiViewContent--constrainedWidth">
<div class="kuiVerticalRhythm">
<watch-edit-title-bar
xpack-watch="jsonWatchEdit.watch"
is-watch-valid="jsonWatchEdit.isValid"
@ -14,7 +15,7 @@
></watch-edit-title-bar>
</div>
<div class="kuiViewContentItem kuiVerticalRhythm">
<div class="kuiVerticalRhythm">
<kbn-tabs
selected-tab-id="jsonWatchEdit.selectedTabId"
on-tab-select="jsonWatchEdit.onTabSelect"
@ -42,7 +43,7 @@
</div>
<div
class="kuiViewContentItem kuiVerticalRhythm"
class="kuiVerticalRhythm"
ng-show="jsonWatchEdit.selectedTabId === 'edit-watch'"
>
<watch-edit-detail
@ -54,7 +55,7 @@
</div>
<div
class="kuiViewContentItem kuiVerticalRhythm"
class="kuiVerticalRhythm"
ng-show="jsonWatchEdit.selectedTabId === 'watch-simulate'"
>
<div class="kuiVerticalRhythm">
@ -85,7 +86,7 @@
</div>
<div
class="kuiViewContentItem kuiVerticalRhythm"
class="kuiVerticalRhythm"
ng-show="jsonWatchEdit.selectedTabId === 'simulate-results'"
>
<div class="kuiVerticalRhythm">

132
x-pack/plugins/watcher/public/sections/watch_edit/components/threshold_watch_edit/threshold_watch_edit.html
View file

@ -6,95 +6,87 @@
>
<div class="thresholdWatchEditContent">
<div class="kuiPanel kuiVerticalRhythm thresholdWatchEditSectionPanel">
<div class="kuiPanelBody">
<watch-edit-title-panel
fields="thresholdWatchEdit.fields"
xpack-watch="thresholdWatchEdit.watch"
on-change="thresholdWatchEdit.onChange"
on-valid="thresholdWatchEdit.onTitlePanelValid"
on-invalid="thresholdWatchEdit.onTitlePanelInvalid"
></watch-edit-title-panel>
</div>
<div class="euiPanel euiPanel--paddingLarge kuiVerticalRhythm">
<watch-edit-title-panel
fields="thresholdWatchEdit.fields"
xpack-watch="thresholdWatchEdit.watch"
on-change="thresholdWatchEdit.onChange"
on-valid="thresholdWatchEdit.onTitlePanelValid"
on-invalid="thresholdWatchEdit.onTitlePanelInvalid"
></watch-edit-title-panel>
</div>
<div
class="kuiPanel kuiVerticalRhythm thresholdWatchEditSectionPanel"
class="kuiPanel kuiVerticalRhythm euiPanel euiPanel--paddingLarge"
ng-show="thresholdWatchEdit.titlePanelValid"
>
<div class="kuiPanelBody">
<section class="kuiVerticalRhythm">
<header>
<h2 class="kuiSubTitle">
Matching the following condition
</h2>
</header>
</section>
<section class="kuiVerticalRhythm">
<header>
<h2 class="kuiSubTitle">
Matching the following condition
</h2>
</header>
</section>
<div class="kuiVerticalRhythm" style="margin-bottom:30px;">
<threshold-watch-expression
threshold-watch="thresholdWatchEdit.watch"
fields="thresholdWatchEdit.fields"
on-change="thresholdWatchEdit.onChange"
on-valid="thresholdWatchEdit.onConditionPanelValid"
on-invalid="thresholdWatchEdit.onConditionPanelInvalid"
></threshold-watch-expression>
<div class="kuiVerticalRhythm" style="margin-bottom:30px;">
<threshold-watch-expression
threshold-watch="thresholdWatchEdit.watch"
fields="thresholdWatchEdit.fields"
on-change="thresholdWatchEdit.onChange"
on-valid="thresholdWatchEdit.onConditionPanelValid"
on-invalid="thresholdWatchEdit.onConditionPanelInvalid"
></threshold-watch-expression>
</div>
<div class="kuiPanel kuiVerticalRhythm">
<div
class="kuiPanelHeader"
ng-show="thresholdWatchEdit.visualizeDataPageCount > 1"
>
<div class="kuiPanelHeaderSection">
<div class="kuiPanelHeader__title">
{{ thresholdWatchEdit.visualizeDataTitle }}
</div>
</div>
</div>
<div class="kuiPanel kuiVerticalRhythm">
<div class="kuiPanelBody">
<div
class="kuiPanelHeader"
ng-show="thresholdWatchEdit.visualizeDataPageCount > 1"
>
<div class="kuiPanelHeaderSection">
<div class="kuiPanelHeader__title">
{{ thresholdWatchEdit.visualizeDataTitle }}
</div>
</div>
class="kuiVerticalRhythm kuiWatchVisualization"
ng-class="{ kuiWatchVisualizationMulti: thresholdWatchEdit.visualizeDataPageCount > 1 }">
<threshold-preview-chart
series="thresholdWatchEdit.chartSeries"
threshold-value="thresholdWatchEdit.watch.threshold"
start-date="thresholdWatchEdit.visualizeTimeWindowFrom"
end-date="thresholdWatchEdit.visualizeTimeWindowTo"
></threshold-preview-chart>
</div>
<div class="kuiPanelBody">
<div
class="kuiVerticalRhythm kuiWatchVisualization"
ng-class="{ kuiWatchVisualizationMulti: thresholdWatchEdit.visualizeDataPageCount > 1 }">
<threshold-preview-chart
series="thresholdWatchEdit.chartSeries"
threshold-value="thresholdWatchEdit.watch.threshold"
start-date="thresholdWatchEdit.visualizeTimeWindowFrom"
end-date="thresholdWatchEdit.visualizeTimeWindowTo"
></threshold-preview-chart>
</div>
</div>
<panel-pager
on-next-page="thresholdWatchEdit.onVisualizationNextPage"
on-previous-page="thresholdWatchEdit.onVisualizationPreviousPage"
ng-show="thresholdWatchEdit.visualizeDataPageCount > 1"
></panel-pager>
</div>
<panel-pager
on-next-page="thresholdWatchEdit.onVisualizationNextPage"
on-previous-page="thresholdWatchEdit.onVisualizationPreviousPage"
ng-show="thresholdWatchEdit.visualizeDataPageCount > 1"
></panel-pager>
</div>
</div>
<div
class="kuiPanel kuiVerticalRhythm thresholdWatchEditSectionPanel"
class="kuiPanel kuiVerticalRhythm euiPanel euiPanel--paddingLarge"
ng-show="thresholdWatchEdit.titlePanelValid && thresholdWatchEdit.conditionPanelValid"
>
<div class="kuiPanelBody">
<watch-actions
actions="thresholdWatchEdit.watch.actions"
on-action-add="thresholdWatchEdit.onActionAdd"
on-action-change="thresholdWatchEdit.onActionChange"
on-action-simulate="thresholdWatchEdit.onActionSimulate"
on-action-delete="thresholdWatchEdit.onActionDelete"
on-valid="thresholdWatchEdit.onActionsValid"
on-invalid="thresholdWatchEdit.onActionsInvalid"
></watch-actions>
</div>
<watch-actions
actions="thresholdWatchEdit.watch.actions"
on-action-add="thresholdWatchEdit.onActionAdd"
on-action-change="thresholdWatchEdit.onActionChange"
on-action-simulate="thresholdWatchEdit.onActionSimulate"
on-action-delete="thresholdWatchEdit.onActionDelete"
on-valid="thresholdWatchEdit.onActionsValid"
on-invalid="thresholdWatchEdit.onActionsInvalid"
></watch-actions>
</div>
<div class="kuiButtonGroup kuiVerticalRhythm thresholdWatchEditSectionPanel thresholdWatchEditButtons">
<div class="kuiButtonGroup kuiVerticalRhythm euiPanel euiPanel--paddingLarge thresholdWatchEditButtons">
<button
class="kuiButton kuiButton--primary"

3
x-pack/plugins/watcher/public/sections/watch_edit/components/watch_edit_title_bar/watch_edit_title_bar.html
View file

@ -1,4 +1,7 @@
<div class="kuiBar">
<div class="kuiBarSection">
<h2 class="euiTitle euiTitle--medium">New watch</h2>
</div>
<div class="kuiBarSection">
<div class="kuiButtonGroup">
<button