Merge pull request #6527 from stormpython/settings/searchbar
Kibana 5 Settings Redesign
This commit is contained in:
commit
67ca0ccfd4
1
.gitignore
vendored
1
.gitignore
vendored
|
@ -1,4 +1,5 @@
|
|||
.aws-config.json
|
||||
.ackrc
|
||||
.DS_Store
|
||||
.node_binaries
|
||||
node_modules
|
||||
|
|
|
@ -1,6 +1,7 @@
|
|||
<div class="app-container">
|
||||
<nav class="navbar navbar-default navbar-static-top subnav" data-test-subj="settingsNav">
|
||||
<div class="container-fluid">
|
||||
<bread-crumbs></bread-crumbs>
|
||||
<ul class="nav navbar-nav">
|
||||
<li ng-repeat="section in sections" ng-class="section.class">
|
||||
<a class="navbar-link" kbn-href="{{section.url}}" data-test-subj="{{section.name}}">{{section.display}}</a>
|
||||
|
|
|
@ -9,6 +9,7 @@ import 'ui/filters/start_from';
|
|||
import 'ui/field_editor';
|
||||
import 'plugins/kibana/settings/sections/indices/_indexed_fields';
|
||||
import 'plugins/kibana/settings/sections/indices/_scripted_fields';
|
||||
import 'ui/directives/bread_crumbs';
|
||||
import registry from 'ui/registry/settings_sections';
|
||||
import uiRoutes from 'ui/routes';
|
||||
import uiModules from 'ui/modules';
|
||||
|
|
|
@ -11,6 +11,10 @@ kbn-settings-objects-view {
|
|||
display: block;
|
||||
}
|
||||
|
||||
nav.navbar {
|
||||
height: 70px;
|
||||
}
|
||||
|
||||
.settings-nav {
|
||||
text-transform: capitalize;
|
||||
}
|
||||
|
@ -19,6 +23,15 @@ li.kbn-settings-tab:first-letter {
|
|||
text-transform: capitalize;
|
||||
}
|
||||
|
||||
kbn-settings-app {
|
||||
div.app-container {
|
||||
div.container-fluid {
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
kbn-settings-objects {
|
||||
form {
|
||||
margin-bottom: @line-height-computed;
|
||||
|
|
|
@ -28,8 +28,9 @@
|
|||
}
|
||||
|
||||
h3 {
|
||||
margin-top: 35px;
|
||||
padding: 0px 15px;
|
||||
margin-top: 0px;
|
||||
margin-bottom: 8px;
|
||||
padding: 0px 5px;
|
||||
}
|
||||
|
||||
.wizard-row {
|
||||
|
|
|
@ -1,3 +1,4 @@
|
|||
<bread-crumbs></bread-crumbs>
|
||||
<div class="wizard">
|
||||
<div class="wizard-column">
|
||||
<h3>Create New Visualization</h3>
|
||||
|
|
|
@ -1,3 +1,4 @@
|
|||
<bread-crumbs></bread-crumbs>
|
||||
<div class="wizard">
|
||||
<div class="wizard-column">
|
||||
<h3>From a New Search</h3>
|
||||
|
|
19
src/ui/public/chrome/api/__tests__/angular.js
vendored
Normal file
19
src/ui/public/chrome/api/__tests__/angular.js
vendored
Normal file
|
@ -0,0 +1,19 @@
|
|||
import expect from 'expect.js';
|
||||
|
||||
import kbnAngular from '../angular';
|
||||
import TabFakeStore from '../../__tests__/_tab_fake_store';
|
||||
import { noop } from 'lodash';
|
||||
|
||||
describe('Chrome API :: Angular', () => {
|
||||
describe('location helper methods', () => {
|
||||
it('should return the sub app based on the url', () => {
|
||||
const chrome = {
|
||||
getInjected: noop,
|
||||
addBasePath: noop
|
||||
};
|
||||
kbnAngular(chrome, {});
|
||||
});
|
||||
it('should return breadcrumbs based on the url', () => {
|
||||
});
|
||||
});
|
||||
});
|
14
src/ui/public/chrome/api/angular.js
vendored
14
src/ui/public/chrome/api/angular.js
vendored
|
@ -3,6 +3,9 @@ import modules from 'ui/modules';
|
|||
|
||||
module.exports = function (chrome, internals) {
|
||||
|
||||
chrome.getFirstPathSegment = _.noop;
|
||||
chrome.getBreadcrumbs = _.noop;
|
||||
|
||||
chrome.setupAngular = function () {
|
||||
var kibana = modules.get('kibana');
|
||||
|
||||
|
@ -21,7 +24,16 @@ module.exports = function (chrome, internals) {
|
|||
a.href = chrome.addBasePath('/elasticsearch');
|
||||
return a.href;
|
||||
}()))
|
||||
.config(chrome.$setupXsrfRequestInterceptor);
|
||||
.config(chrome.$setupXsrfRequestInterceptor)
|
||||
.run(($location) => {
|
||||
chrome.getFirstPathSegment = () => {
|
||||
return $location.path().split('/')[1];
|
||||
};
|
||||
|
||||
chrome.getBreadcrumbs = () => {
|
||||
return $location.path().split('/').slice(1);
|
||||
};
|
||||
});
|
||||
|
||||
require('../directives')(chrome, internals);
|
||||
|
||||
|
|
|
@ -76,12 +76,6 @@ module.exports = function (chrome, internals) {
|
|||
return internals.tabs.getActive();
|
||||
};
|
||||
|
||||
/**
|
||||
* @param {any} def - the default value if there isn't any active tab
|
||||
* @return {any}
|
||||
*/
|
||||
chrome.getActiveTabId = activeGetter('id');
|
||||
|
||||
/**
|
||||
* @param {any} def - the default value if there isn't any active tab
|
||||
* @return {any}
|
||||
|
|
|
@ -80,7 +80,7 @@
|
|||
</div>
|
||||
<!-- /Full navbar -->
|
||||
</nav>
|
||||
<div class="application" ng-class="'tab-' + chrome.getActiveTabId('-none-') + ' ' + chrome.getApplicationClasses()" ng-view></div>
|
||||
<div class="application" ng-class="'tab-' + chrome.getFirstPathSegment() + ' ' + chrome.getApplicationClasses()" ng-view></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
21
src/ui/public/directives/bread_crumbs.js
Normal file
21
src/ui/public/directives/bread_crumbs.js
Normal file
|
@ -0,0 +1,21 @@
|
|||
import _ from 'lodash';
|
||||
import chrome from 'ui/chrome/chrome';
|
||||
import breadCrumbsTemplate from 'ui/partials/bread_crumbs.html';
|
||||
import uiModules from 'ui/modules';
|
||||
var module = uiModules.get('kibana');
|
||||
|
||||
module.directive('breadCrumbs', function () {
|
||||
return {
|
||||
restrict: 'E',
|
||||
scope: true,
|
||||
template: breadCrumbsTemplate,
|
||||
controller: function ($scope) {
|
||||
$scope.crumbs = chrome.getBreadcrumbs();
|
||||
|
||||
if (_.last($scope.crumbs) === '') {
|
||||
// Remove the empty string from the end of the array
|
||||
$scope.crumbs.pop();
|
||||
}
|
||||
}
|
||||
};
|
||||
});
|
6
src/ui/public/partials/bread_crumbs.html
Normal file
6
src/ui/public/partials/bread_crumbs.html
Normal file
|
@ -0,0 +1,6 @@
|
|||
<ul>
|
||||
<li ng-repeat="crumb in crumbs">
|
||||
<span>{{crumb}}</span>
|
||||
<span ng-hide="$last"> / </span>
|
||||
</li>
|
||||
</ul>
|
|
@ -287,6 +287,32 @@ table {
|
|||
}
|
||||
}
|
||||
|
||||
//== breadCrumbsTemplate
|
||||
bread-crumbs {
|
||||
ul {
|
||||
margin: 0;
|
||||
padding: 8px 10px;
|
||||
list-style-type: none;
|
||||
text-transform: capitalize;
|
||||
|
||||
>li {
|
||||
display: inline;
|
||||
>span {
|
||||
color: @kibanaGray2;
|
||||
}
|
||||
>span:hover {
|
||||
color: @kibanaGray1;
|
||||
}
|
||||
}
|
||||
|
||||
>li:last-child {
|
||||
>span {
|
||||
color: @kibanaGray1;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//== SavedObjectFinder
|
||||
saved-object-finder {
|
||||
.row {
|
||||
|
@ -318,7 +344,7 @@ saved-object-finder {
|
|||
width: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.finder-hit-count, .finder-manage-object {
|
||||
min-width: 80px;
|
||||
padding: 5px;
|
||||
|
|
Loading…
Reference in a new issue