diff --git a/mod/dashboard/Gruntfile.js b/mod/dashboard/Gruntfile.js
index 39870153a..a42b4145c 100644
--- a/mod/dashboard/Gruntfile.js
+++ b/mod/dashboard/Gruntfile.js
@@ -174,7 +174,7 @@ module.exports = function (grunt) {
options: {
dest: '<%= yeoman.dist %>'
},
- html: ['<%= yeoman.app %>/**/*.html']
+ html: ['<%= yeoman.app %>/index.html']
},
usemin: {
options: {
@@ -240,6 +240,14 @@ module.exports = function (grunt) {
}]
}
},
+
+ ngmin: {
+ dist: {
+ src: '.tmp/concat/scripts/app.js',
+ dest: '.tmp/concat/scripts/app.js'
+ }
+ },
+
// Put files not handled in other tasks here
copy: {
dist: {
@@ -251,10 +259,10 @@ module.exports = function (grunt) {
src: [
'*.{ico,png,txt}',
'.htaccess',
- 'images/{,*/}*.{webp,gif}',
+ 'images/{,*/}*.{webp,gif,svg}',
'styles/fonts/{,*/}*.*',
'views/*.*',
- 'index.html',
+ //'index.html',
'bower_components/sass-bootstrap/fonts/*.*'
]
}]
@@ -286,7 +294,7 @@ module.exports = function (grunt) {
'copy:styles'
],
dist: [
- 'compass',
+ //'compass',
'copy:styles',
'imagemin',
'svgmin',
@@ -327,13 +335,15 @@ module.exports = function (grunt) {
grunt.registerTask('build', [
'clean:dist',
+ 'jshint',
'useminPrepare',
'concurrent:dist',
'autoprefixer',
'concat',
'cssmin',
- 'uglify',
+ 'ngmin',
'usemin',
+ 'uglify',
'copy:dist'
]);
diff --git a/mod/dashboard/README.md b/mod/dashboard/README.md
index b41fff050..d212a9622 100644
--- a/mod/dashboard/README.md
+++ b/mod/dashboard/README.md
@@ -22,6 +22,8 @@ bower install
### View in Browser
+run `export ETCD_DASHBOARD_DIR=/absolute/path/to/coreos/etcd/mod/dashboard/app`
+
Run etcd like you normally would and afterward browse to:
http://localhost:4001/mod/dashboard/
diff --git a/mod/dashboard/app/.buildignore b/mod/dashboard/app/.buildignore
deleted file mode 100644
index fc98b8eb5..000000000
--- a/mod/dashboard/app/.buildignore
+++ /dev/null
@@ -1 +0,0 @@
-*.coffee
\ No newline at end of file
diff --git a/mod/dashboard/app/browser.html b/mod/dashboard/app/browser.html
deleted file mode 100644
index dcb769bd3..000000000
--- a/mod/dashboard/app/browser.html
+++ /dev/null
@@ -1,50 +0,0 @@
-
-
-
-
-
-
-
-
- etcd Browser
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
diff --git a/mod/dashboard/app/images/add.svg b/mod/dashboard/app/images/add.svg
new file mode 100644
index 000000000..d84c9ecb8
--- /dev/null
+++ b/mod/dashboard/app/images/add.svg
@@ -0,0 +1,7 @@
+
diff --git a/mod/dashboard/app/images/back.svg b/mod/dashboard/app/images/back.svg
new file mode 100644
index 000000000..0acbe5653
--- /dev/null
+++ b/mod/dashboard/app/images/back.svg
@@ -0,0 +1,6 @@
+
diff --git a/mod/dashboard/app/images/delete.svg b/mod/dashboard/app/images/delete.svg
new file mode 100644
index 000000000..fef624237
--- /dev/null
+++ b/mod/dashboard/app/images/delete.svg
@@ -0,0 +1,7 @@
+
diff --git a/mod/dashboard/app/images/logo.svg b/mod/dashboard/app/images/logo.svg
new file mode 100644
index 000000000..4a9177062
--- /dev/null
+++ b/mod/dashboard/app/images/logo.svg
@@ -0,0 +1,46 @@
+
diff --git a/mod/dashboard/app/index.html b/mod/dashboard/app/index.html
index e3995e6d1..ba2095168 100644
--- a/mod/dashboard/app/index.html
+++ b/mod/dashboard/app/index.html
@@ -1,8 +1,6 @@
-
-
-
-
-
+
+
+
@@ -11,124 +9,56 @@
-
-
-
+
etcd Dashboard
-
-
+
+
+
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/mod/dashboard/app/scripts/app.js b/mod/dashboard/app/scripts/app.js
new file mode 100644
index 000000000..c12f62f9d
--- /dev/null
+++ b/mod/dashboard/app/scripts/app.js
@@ -0,0 +1,43 @@
+'use strict';
+
+var app = angular.module('etcdControlPanel', [
+ 'ngRoute',
+ 'ngResource',
+ 'etcd',
+ 'etcdDirectives',
+ 'timeRelative',
+ 'underscore',
+ 'jquery',
+ 'moment',
+ 'vg'
+]);
+
+app.constant('urlPrefix', '/mod/dashboard');
+app.constant('keyPrefix', '/v2/keys/');
+
+app.config(function($routeProvider, $locationProvider, urlPrefix) {
+
+ function prefixUrl(url) {
+ return urlPrefix + url;
+ }
+
+ $locationProvider.html5Mode(true);
+
+ $routeProvider
+ .when(prefixUrl('/'), {
+ controller: 'HomeCtrl',
+ templateUrl: prefixUrl('/views/home.html')
+ })
+ .when(prefixUrl('/stats'), {
+ controller: 'StatsCtrl',
+ templateUrl: prefixUrl('/views/stats.html')
+ })
+ .when(prefixUrl('/browser'), {
+ controller: 'BrowserCtrl',
+ templateUrl: prefixUrl('/views/browser.html')
+ })
+ .otherwise({
+ templateUrl: prefixUrl('/404.html')
+ });
+
+});
diff --git a/mod/dashboard/app/scripts/common/directives/enter.js b/mod/dashboard/app/scripts/common/directives/enter.js
new file mode 100644
index 000000000..3aac7351d
--- /dev/null
+++ b/mod/dashboard/app/scripts/common/directives/enter.js
@@ -0,0 +1,16 @@
+'use strict';
+
+angular.module('etcdControlPanel')
+.directive('ngEnter', function() {
+ return function(scope, element, attrs) {
+ element.bind('keydown keypress', function(event) {
+ if(event.which === 13) {
+ scope.$apply(function(){
+ scope.$eval(attrs.ngEnter);
+ });
+
+ event.preventDefault();
+ }
+ });
+ };
+});
diff --git a/mod/dashboard/app/scripts/common/directives/highlight.js b/mod/dashboard/app/scripts/common/directives/highlight.js
new file mode 100644
index 000000000..7942a8cb7
--- /dev/null
+++ b/mod/dashboard/app/scripts/common/directives/highlight.js
@@ -0,0 +1,19 @@
+'use strict';
+
+angular.module('etcdControlPanel')
+.directive('highlight', function(keyPrefix) {
+ return {
+ restrict: 'E',
+ scope: {
+ highlightBase: '=',
+ highlightCurrent: '='
+ },
+ link: function(scope, element, attrs) {
+ var base = _.str.strRight(scope.highlightBase, keyPrefix),
+ current = _.str.trim(scope.highlightCurrent, '/');
+ if (base === current) {
+ element.parent().parent().addClass('etcd-selected');
+ }
+ }
+ };
+});
diff --git a/mod/dashboard/app/scripts/common/services/prefix-url.js b/mod/dashboard/app/scripts/common/services/prefix-url.js
new file mode 100644
index 000000000..1a95e1e68
--- /dev/null
+++ b/mod/dashboard/app/scripts/common/services/prefix-url.js
@@ -0,0 +1,10 @@
+'use strict';
+
+angular.module('etcdControlPanel')
+.factory('prefixUrl', function(urlPrefix) {
+
+ return function(url) {
+ return urlPrefix + url;
+ }
+
+});
diff --git a/mod/dashboard/app/scripts/controllers/browser.js b/mod/dashboard/app/scripts/controllers/browser.js
index 6d0af80c7..3066ec3ba 100644
--- a/mod/dashboard/app/scripts/controllers/browser.js
+++ b/mod/dashboard/app/scripts/controllers/browser.js
@@ -1,33 +1,39 @@
'use strict';
-angular.module('etcdBrowser', ['ngRoute', 'etcd', 'timeRelative'])
-
-.constant('keyPrefix', '/v2/keys/')
-
-.config(['$routeProvider', 'keyPrefix', function ($routeProvider, keyPrefix) {
- //read localstorage
- var previousPath = localStorage.getItem('etcd_path');
-
- $routeProvider
- .when('/', {
- redirectTo: keyPrefix
- })
- .otherwise({
- templateUrl: 'views/browser.html',
- controller: 'MainCtrl'
- });
-}])
-
-.controller('MainCtrl', ['$scope', '$location', 'EtcdV2', 'keyPrefix', function ($scope, $location, EtcdV2, keyPrefix) {
+angular.module('etcdControlPanel')
+.controller('BrowserCtrl', function ($scope, $window, EtcdV2, keyPrefix, $, _, moment) {
$scope.save = 'etcd-save-hide';
$scope.preview = 'etcd-preview-hide';
$scope.enableBack = true;
$scope.writingNew = false;
+ $scope.key = null;
+ $scope.list = [];
// etcdPath is the path to the key that is currenly being looked at.
- $scope.etcdPath = $location.path();
+ $scope.etcdPath = keyPrefix;
+ $scope.inputPath = keyPrefix;
- $scope.$watch('etcdPath', function() {
+ $scope.resetInputPath = function() {
+ $scope.inputPath = $scope.etcdPath;
+ };
+
+ $scope.setActiveKey = function(key) {
+ $scope.etcdPath = keyPrefix + _.str.trim(key, '/');
+ $scope.resetInputPath();
+ };
+
+ $scope.stripPrefix = function(path) {
+ return _.str.strRight(path, keyPrefix);
+ };
+
+ $scope.onEnter = function() {
+ var path = $scope.stripPrefix($scope.inputPath);
+ if (path !== '') {
+ $scope.setActiveKey(path);
+ }
+ };
+
+ $scope.updateCurrentKey = function() {
function etcdPathKey() {
return pathKey($scope.etcdPath);
}
@@ -39,17 +45,17 @@ angular.module('etcdBrowser', ['ngRoute', 'etcd', 'timeRelative'])
}
return parts[1];
}
-
// Notify everyone of the update
localStorage.setItem('etcdPath', $scope.etcdPath);
$scope.enableBack = true;
//disable back button if at root (/v2/keys/)
- if($scope.etcdPath === keyPrefix) {
+ if ($scope.etcdPath === keyPrefix) {
$scope.enableBack = false;
}
-
$scope.key = EtcdV2.getKey(etcdPathKey($scope.etcdPath));
- });
+ };
+
+ $scope.$watch('etcdPath', $scope.updateCurrentKey);
$scope.$watch('key', function() {
if ($scope.writingNew === true) {
@@ -63,7 +69,7 @@ angular.module('etcdBrowser', ['ngRoute', 'etcd', 'timeRelative'])
$scope.list = data.node.nodes;
$scope.preview = 'etcd-preview-hide';
} else {
- $scope.singleValue = data.value;
+ $scope.singleValue = data.node.value;
$scope.preview = 'etcd-preview-reveal';
$scope.key.getParent().get().success(function(data) {
$scope.list = data.node.nodes;
@@ -79,20 +85,18 @@ angular.module('etcdBrowser', ['ngRoute', 'etcd', 'timeRelative'])
//back button click
$scope.back = function() {
$scope.etcdPath = $scope.key.getParent().path();
- $scope.syncLocation();
+ $scope.resetInputPath();
$scope.preview = 'etcd-preview-hide';
$scope.writingNew = false;
};
- $scope.syncLocation = function() {
- $location.path($scope.etcdPath);
- };
-
$scope.showSave = function() {
$scope.save = 'etcd-save-reveal';
};
$scope.saveData = function() {
+ $scope.setActiveKey($scope.stripPrefix($scope.inputPath));
+ $scope.updateCurrentKey();
// TODO: fixup etcd to allow for empty values
$scope.key.set($scope.singleValue || ' ').then(function(response) {
$scope.save = 'etcd-save-hide';
@@ -100,11 +104,13 @@ angular.module('etcdBrowser', ['ngRoute', 'etcd', 'timeRelative'])
$scope.back();
$scope.writingNew = false;
}, function (response) {
- $scope.showSaveError(data.message);
+ $scope.showSaveError(response.message);
});
};
- $scope.deleteKey = function() {
+ $scope.deleteKey = function(key) {
+ $scope.setActiveKey(key);
+ $scope.updateCurrentKey();
$scope.key.deleteKey().then(function(response) {
//TODO: remove loader
$scope.save = 'etcd-save-hide';
@@ -136,56 +142,15 @@ angular.module('etcdBrowser', ['ngRoute', 'etcd', 'timeRelative'])
};
$scope.getHeight = function() {
- return $(window).height();
+ return $($window).height();
};
- $scope.$watch($scope.getHeight, function() {
- $('.etcd-body').css('height', $scope.getHeight()-45);
- });
- window.onresize = function(){
+
+ //$scope.$watch($scope.getHeight, function() {
+ ////$('.etcd-container.etcd-browser etcd-body').css('height', $scope.getHeight()-45);
+ //});
+
+ $window.onresize = function(){
$scope.$apply();
};
-}])
-
-.directive('ngEnter', function() {
- return function(scope, element, attrs) {
- element.bind('keydown keypress', function(event) {
- if(event.which === 13) {
- scope.$apply(function(){
- scope.$eval(attrs.ngEnter);
- });
-
- event.preventDefault();
- }
- });
- };
-})
-
-.directive('highlight', function() {
- return {
- restrict: 'A',
- link: function(scope, element, attrs) {
- if('#' + scope.etcdPath === attrs.href) {
- element.parent().parent().addClass('etcd-selected');
- }
- }
- };
-});
-
-moment.lang('en', {
- relativeTime : {
- future: 'Expires in %s',
- past: 'Expired %s ago',
- s: 'seconds',
- m: 'a minute',
- mm: '%d minutes',
- h: 'an hour',
- hh: '%d hours',
- d: 'a day',
- dd: '%d days',
- M: 'a month',
- MM: '%d months',
- y: 'a year',
- yy: '%d years'
- }
});
diff --git a/mod/dashboard/app/scripts/controllers/home.js b/mod/dashboard/app/scripts/controllers/home.js
new file mode 100644
index 000000000..a0f4b9ed3
--- /dev/null
+++ b/mod/dashboard/app/scripts/controllers/home.js
@@ -0,0 +1,3 @@
+angular.module('etcdControlPanel')
+.controller('HomeCtrl', function($scope) {
+});
diff --git a/mod/dashboard/app/scripts/controllers/root.js b/mod/dashboard/app/scripts/controllers/root.js
new file mode 100644
index 000000000..554f3c1fc
--- /dev/null
+++ b/mod/dashboard/app/scripts/controllers/root.js
@@ -0,0 +1,9 @@
+'use strict';
+
+angular.module('etcdControlPanel')
+.controller('RootCtrl', function($rootScope, prefixUrl) {
+
+ // Expose prefixUrl() function to all.
+ $rootScope.prefixUrl = prefixUrl;
+
+});
diff --git a/mod/dashboard/app/scripts/controllers/stats.js b/mod/dashboard/app/scripts/controllers/stats.js
index 614cfd78c..f376c2fec 100644
--- a/mod/dashboard/app/scripts/controllers/stats.js
+++ b/mod/dashboard/app/scripts/controllers/stats.js
@@ -1,20 +1,8 @@
'use strict';
-angular.module('etcdStats', ['ngRoute', 'etcd'])
-.config(['$routeProvider', function ($routeProvider) {
- $routeProvider
- .when('/', {
- templateUrl: 'views/stats.html',
- controller: 'StatsCtrl'
- })
- .otherwise({
- templateUrl: 'views/stats.html',
- controller: 'StatsCtrl'
- });
-}])
-
-.controller('StatsCtrl', ['$scope', 'EtcdV2', 'statsVega', function ($scope, EtcdV2, statsVega) {
+angular.module('etcdControlPanel')
+.controller('StatsCtrl', function ($scope, $rootScope, $interval, EtcdV2, statsVega, vg) {
$scope.graphContainer = '#latency';
$scope.graphVisibility = 'etcd-graph-show';
$scope.tableVisibility = 'etcd-table-hide';
@@ -42,10 +30,14 @@ angular.module('etcdStats', ['ngRoute', 'etcd'])
});
//sort array so peers don't jump when output
$scope.peers.sort(function(a, b){
- if(a.name < b.name) return -1;
- if(a.name > b.name) return 1;
+ if(a.name < b.name) {
+ return -1;
+ }
+ if(a.name > b.name) {
+ return 1;
+ }
return 0;
- });
+ });
drawGraph();
});
}
@@ -86,10 +78,10 @@ angular.module('etcdStats', ['ngRoute', 'etcd'])
$scope.getWidth = function() {
return $(window).width();
};
- $scope.$watch($scope.getHeight, function() {
- $('.etcd-body').css('height', $scope.getHeight()-5);
- readStats();
- });
+ //$scope.$watch($scope.getHeight, function() {
+ ////$('.etcd-container.etcd-stats .etcd-body').css('height', $scope.getHeight()-5);
+ //readStats();
+ //});
$scope.$watch($scope.getWidth, function() {
readStats();
});
@@ -97,12 +89,31 @@ angular.module('etcdStats', ['ngRoute', 'etcd'])
$scope.$apply();
};
- // Update the graphs live
- setInterval(function() {
- readStats();
- $scope.$apply();
- }, 500);
-}])
+ $scope.pollPromise = null;
+
+ $scope.startPolling = function() {
+ // Update the graphs live
+ if ($scope.pollPromise) {
+ return;
+ }
+ $scope.pollPromise = $interval(function() {
+ readStats();
+ }, 500);
+ };
+
+ $scope.stopPolling = function() {
+ $interval.cancel($scope.pollPromise);
+ $scope.pollPromise = null;
+ };
+
+ // Stop polling when navigating away from a view with this controller.
+ $rootScope.$on('$routeChangeStart', function () {
+ $scope.stopPolling();
+ });
+
+ $scope.startPolling();
+
+})
/* statsVega returns the vega configuration for the stats dashboard */
diff --git a/mod/dashboard/app/scripts/directives.js b/mod/dashboard/app/scripts/directives.js
new file mode 100644
index 000000000..f2714552d
--- /dev/null
+++ b/mod/dashboard/app/scripts/directives.js
@@ -0,0 +1,3 @@
+'use strict';
+
+angular.module('etcdDirectives', []);
diff --git a/mod/dashboard/app/scripts/shims.js b/mod/dashboard/app/scripts/shims.js
new file mode 100644
index 000000000..441727018
--- /dev/null
+++ b/mod/dashboard/app/scripts/shims.js
@@ -0,0 +1,36 @@
+'use strict';
+
+angular.module('underscore', []).factory('_', function($window) {
+ return $window._;
+});
+
+angular.module('jquery', []).factory('$', function($window) {
+ return $window.$;
+});
+
+angular.module('vg', []).factory('vg', function($window) {
+ return $window.vg;
+});
+
+angular.module('moment', []).factory('moment', function($window) {
+
+ $window.moment.lang('en', {
+ relativeTime : {
+ future: 'Expires in %s',
+ past: 'Expired %s ago',
+ s: 'seconds',
+ m: 'a minute',
+ mm: '%d minutes',
+ h: 'an hour',
+ hh: '%d hours',
+ d: 'a day',
+ dd: '%d days',
+ M: 'a month',
+ MM: '%d months',
+ y: 'a year',
+ yy: '%d years'
+ }
+ });
+
+ return $window.moment;
+});
diff --git a/mod/dashboard/app/stats.html b/mod/dashboard/app/stats.html
deleted file mode 100644
index 6056a7512..000000000
--- a/mod/dashboard/app/stats.html
+++ /dev/null
@@ -1,50 +0,0 @@
-
-
-
-
-
-
-
-
- etcd Browser
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
diff --git a/mod/dashboard/app/styles/browser.css b/mod/dashboard/app/styles/browser.css
new file mode 100644
index 000000000..5c7883cfa
--- /dev/null
+++ b/mod/dashboard/app/styles/browser.css
@@ -0,0 +1,186 @@
+.etcd-container.etcd-browser {
+ width: 100%;
+ height: 500px;
+}
+
+.home-container .etcd-container.etcd-browser {
+ height: 400px;
+}
+
+.etcd-container.etcd-browser .etcd-header {
+ height: 37px;
+}
+
+.etcd-container.etcd-browser.etcd-preview-reveal .etcd-back {
+ display: block;
+}
+
+.etcd-container.etcd-browser.etcd-preview-hide .etcd-back {
+ display: block;
+}
+
+.etcd-container.etcd-browser.etcd-preview-reveal .etcd-add {
+}
+
+.etcd-container.etcd-browser.etcd-preview-hide .etcd-add {
+}
+
+.etcd-container.etcd-browser .etcd-header .etcd-browser-path {
+ position: absolute;
+ left: 72px;
+ right: 0px;
+ top: 0;
+ margin: 6px 5px 6px 5px;
+}
+
+.etcd-container.etcd-browser .etcd-header .etcd-browser-path input {
+ width: 100%;
+ box-sizing: border-box;
+ -moz-box-sizing: border-box;
+ -webkit-box-sizing: border-box;
+}
+
+.etcd-container.etcd-browser .etcd-header .etcd-save {
+ position: absolute;
+ width: 54px;
+ right: -55px;
+ margin: 6px 0;
+}
+
+.etcd-container.etcd-browser.etcd-save-reveal .etcd-header .etcd-save {
+ right: 7px;
+}
+
+.etcd-container.etcd-browser.etcd-save-reveal .etcd-header .etcd-browser-path {
+ right: 62px;
+}
+
+.etcd-container.etcd-browser.etcd-save-hide .etcd-header .etcd-save {
+ right: -55px;
+}
+
+.etcd-container.etcd-browser.etcd-save-hide .etcd-header .etcd-browser-path {
+ right: 0px;
+}
+
+.etcd-container.etcd-browser .etcd-preview {
+ position: absolute;
+ left: 100%;
+ min-height: 100%;
+ overflow-y: auto;
+ overflow-x: hidden;
+ top: 0px;
+ box-sizing: border-box;
+ -moz-box-sizing: border-box;
+ background-color: #fff;
+ width: 100%;
+ border-left: 1px solid #ddd;
+}
+
+.etcd-container.etcd-browser .etcd-preview pre, .etcd-container.etcd-browser .etcd-preview textarea {
+ padding: 20px 20px 20px 20px;
+ margin: 0px;
+ font-family: Consolas, "Liberation Mono", Courier, monospace;
+ height: 100%;
+ width: 100%;
+ white-space: pre-wrap;
+ position: absolute;
+ font-size: 13px;
+ border: 1px;
+ outline: none;
+ box-sizing: border-box;
+ -moz-box-sizing: border-box;
+}
+
+.etcd-container.etcd-browser.etcd-preview-reveal .etcd-preview pre, .etcd-container.etcd-browser.etcd-preview-reveal .etcd-preview textarea {
+ display: block;
+}
+
+.etcd-container.etcd-browser .etcd-preview .etcd-empty {
+ top: 0px;
+ bottom: 0px;
+ width: 100%;
+ text-align: center;
+ position: absolute;
+}
+
+.etcd-container.etcd-browser.etcd-preview-reveal .etcd-empty {
+ display: none;
+}
+
+.etcd-container.etcd-browser .etcd-preview .etcd-empty-message {
+ margin-top: 25%;
+ color: #999;
+}
+
+/* Single Column Positioning */
+@media (max-width: 700px) {
+ .etcd-container.etcd-browser .etcd-list {
+ width: 100%;
+ }
+
+ .etcd-container.etcd-browser.etcd-preview-reveal .etcd-list {
+ left: -100%;
+ transition-property: all;
+ transition-duration: 250ms;
+ transition-timing-function: ease-in-out;
+ }
+
+ .etcd-container.etcd-browser.etcd-preview-hide .etcd-list {
+ left: 0%;
+ transition-property: all;
+ transition-duration: 250ms;
+ transition-timing-function: ease-in-out;
+ }
+
+ .etcd-container.etcd-browser .etcd-preview {
+ left: 100%;
+ }
+
+ .etcd-container.etcd-browser.etcd-preview-reveal .etcd-preview { left: -1px;
+ transition-property: all;
+ transition-duration: 250ms;
+ transition-timing-function: ease-in-out;
+ }
+
+ .etcd-container.etcd-browser.etcd-preview-hide .etcd-preview {
+ left: 100%;
+ transition-property: all;
+ transition-duration: 250ms;
+ transition-timing-function: ease-in-out;
+ }
+}
+
+
+/* Double Column Positioning */
+@media (min-width: 700px) {
+ .etcd-container.etcd-browser .etcd-list {
+ width: 50%;
+ }
+
+ .etcd-container.etcd-browser .etcd-preview {
+ left: 50%;
+ width: 50%;
+ }
+
+ .etcd-container.etcd-browser.etcd-preview-reveal .etcd-preview {
+ left: 50%; /* does nothing */
+ }
+
+ .etcd-container.etcd-browser.etcd-preview-reveal .etcd-preview .etcd-empty {
+ display: none;
+ }
+
+ .etcd-container.etcd-browser.etcd-preview-hide .etcd-preview {
+ left: 50%; /* does nothing */
+ }
+
+ .etcd-container.etcd-browser.etcd-preview-hide .etcd-preview .etcd-empty {
+ display: block;
+ }
+
+ .etcd-container.etcd-browser.etcd-preview-hide .etcd-preview pre, .etcd-container.etcd-browser.etcd-preview-hide .etcd-preview textarea {
+ display: none;
+ }
+}
+
diff --git a/mod/dashboard/app/styles/etcd-widgets.css b/mod/dashboard/app/styles/etcd-widgets.css
index 0ed4deb51..e97d9e60a 100644
--- a/mod/dashboard/app/styles/etcd-widgets.css
+++ b/mod/dashboard/app/styles/etcd-widgets.css
@@ -1,713 +1,381 @@
body {
- margin: 0px;
+ margin: 0px;
}
+
.etcd-container {
- background-color: #fff;
- border: 1px solid #ddd;
- border-radius: 5px;
- box-shadow: rgba(0, 0, 0, 0.14902) 0px 1px 3px;
- font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
- overflow: hidden;
- box-sizing: border-box;
- -moz-box-sizing: border-box;
- position: relative;
- user-select: none;
- -webkit-user-select: none;
- -moz-user-select: none;
- -ms-user-select: none;
+ background-color: #fff;
+ border: 1px solid #ddd;
+ border-radius: 5px;
+ box-shadow: rgba(0, 0, 0, 0.14902) 0px 1px 3px;
+ font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+ overflow: hidden;
+ box-sizing: border-box;
+ -moz-box-sizing: border-box;
+ position: relative;
+ user-select: none;
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ margin: 20px 0;
+ height: 100%;
}
- a {
- color: #2176AC;
- text-decoration: none;
- }
-
- a:hover, a:active {
- text-decoration: underline;
- }
-
- input[type=text] {
- box-shadow: inset 0 1px 2px rgba(0,0,0,.5);
- border: none;
- border-radius: 3px;
- font-size: 13px;
- padding-left: 5px;
- padding-right: 5px;
- height: 25px;
- }
-
- input[type=text]:focus {
-
- }
-
- h2 {
- font-size: 22px;
- font-family: "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
- font-weight: 500;
- margin: 0 0 20px 0;
- padding: 0;
- }
-
- .etcd-button {
- display:inline-block;
- padding:6px 12px;
- margin-bottom:0;
- font-size:14px;
- font-weight:normal;
- line-height:1.428571429;
- text-align:center;
- white-space:nowrap;
- vertical-align:middle;
- cursor:pointer;
- border:1px solid transparent;
- border-radius:4px;
- -webkit-user-select:none;
- -moz-user-select:none;
- -ms-user-select:none;
- -o-user-select:none;
- user-select:none;
- margin: 0px;
- border: none;
- box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.25);
- }
-
- .etcd-button.etcd-button-small {
- height: 25px;
- padding: 0 10px;
- font-size: 13px;
- }
-
- .etcd-button-primary {
- background-color: #428BCA;
- color: #fff;
- text-shadow: 0 0 3px rgba(0,0,0,0.25);
- }
-
- .etcd-button-primary:active {
- background-color: #2276ad;
- }
-
- .etcd-popover {
- background: #333;
- border-radius: 3px;
- padding: 15px;
- position: absolute;
- top: 39px;
- z-index: 9999;
- color: #fff;
- font-size: 13px;
- box-shadow: 0px 2px 10px rgba(0,0,0,.5);
- display: none;
- }
-
- .etcd-popover-error .etcd-popover-content {
- color: #FF3C43;
- font-weight: bold;
- user-select: text;
- -webkit-user-select: text;
- -moz-user-select: text;
- -ms-user-select: text;
- }
-
- .etcd-popover-notch {
- width: 14px;
- height: 14px;
- -webkit-transform: rotate(45deg);
- -moz-transform: rotate(45deg);
- -ms-transform: rotate(45deg);
- position: absolute;
- margin-top: -5px;
- margin-left: 3px;
- background: #333;
- top: 0px;
- right: 15px;
- }
-
- .etcd-popover.etcd-popover-right {
- left: 77px;
- }
-
- .etcd-popover-right .etcd-popover-notch {
- left: 15px;
- }
-
- .etcd-popover.etcd-popover-left {
- right: 10px;
- }
-
- .etcd-popover-left .etcd-popover-notch {
- right: 15px;
- }
-
- .etcd-popover-confirm {
- margin-top: 10px;
- }
-
- .etcd-popover-confirm button {
-
- }
-
- .etcd-header {
- width: 100%;
- position: relative;
- box-sizing: border-box;
- -moz-box-sizing: border-box;
- }
- .etcd-header.solid {
- background: #eeeeee;
- background: -moz-linear-gradient(top, #eeeeee 0%, #dddddd 100%);
- background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eeeeee), color-stop(100%,#dddddd));
- background: -webkit-linear-gradient(top, #eeeeee 0%,#dddddd 100%);
- background: -o-linear-gradient(top, #eeeeee 0%,#dddddd 100%);
- background: -ms-linear-gradient(top, #eeeeee 0%,#dddddd 100%);
- background: linear-gradient(to bottom, #eeeeee 0%,#dddddd 100%);
- filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#dddddd',GradientType=0 );
- }
-
- .etcd-body {
- top: 0px;
- left: 0px;
- position: relative;
- overflow-y: auto;
- overflow-x: hidden;
- height: 100%;
- width: 100%;
- box-sizing: border-box;
- -moz-box-sizing: border-box;
- }
-
- .etcd-body table {
- width: 100%;
- box-sizing: border-box;
- -moz-box-sizing: border-box;
- }
-
- .etcd-body table thead td {
- text-transform: uppercase;
- font-size: 11px;
- line-height: 20px;
- border-bottom: 1px solid #ddd;
- padding-top: 0px;
- padding-right: 10px;
- padding-bottom: 0px;
- padding-left: 0px;
- color: #666;
- }
-
- .etcd-body table tbody td {
- line-height: 18px;
- border-bottom: 1px solid #ddd;
- padding-top: 6px;
- padding-right: 10px;
- padding-bottom: 6px;
- padding-left: 0px;
- vertical-align: text-top;
- user-select: text;
- -webkit-user-select: text;
- -moz-user-select: text;
- -ms-user-select: text;
- }
-
- .etcd-body table .etcd-ttl-header {
- width: 33%;
- }
-
- .etcd-body table tbody .etcd-ttl {
- font-size: 13px;
- }
-
- .etcd-body table tbody .etcd-ttl .etcd-ttl-none {
- color: #999;
- font-weight: 100;
- }
-
- .etcd-body table .etcd-actions-header {
- width: 30px;
- }
-
- .etcd-body table thead td:first-child, .etcd-body table tbody td:first-child {
- padding-left: 10px;
- }
-
- .etcd-body table thead td:last-child, .etcd-body table tbody td:last-child {
- padding-right: 10px;
- }
-
- .etcd-container .etcd-preview .etcd-dialog {
- background: #333;
- position: absolute;
- right: 0px;
- left: 0px;
- padding: 20px;
- color: #fff;
- font-size: 14px;
- font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
- bottom: 0px;
- opacity: 0;
- min-height: 110px; /* REMOVE ME! */
- transition-property: all;
- transition-duration: 150ms;
- transition-timing-function: ease-in-out;
- }
-
- .etcd-container .etcd-preview .etcd-dialog .etcd-dialog-message {
- margin-bottom: 20px;
- }
-
- .etcd-container .etcd-preview .etcd-dialog .etcd-dialog-buttons a {
- line-height: 34px;
- color: #fff;
- vertical-align: middle;
- margin-left: 10px;
- }
-
- /*.etcd-container .etcd-preview .etcd-dialog.etcd-reveal {
- opacity: 1;
- }
-
- .etcd-container .etcd-preview .etcd-dialog.etcd-hide {
- opacity: 0;
- }*/
-
- .etcd-body .etcd-list {
- padding: 20px;
- box-sizing: border-box;
- -moz-box-sizing: border-box;
- overflow: auto;
- height: 100%;
- position: absolute;
- }
-
- .etcd-body .etcd-list .etcd-selected {
- background-color: #EAF3FF;
- }
-
- .etcd-body .etcd-list a.directory {
- font-weight: bold;
- }
-
- .etcd-body .etcd-list tr:hover .etcd-delete svg {
- 1visibility: visible;
- fill: #ff0000;
- }
-
- .etcd-body .etcd-list .etcd-delete {
- height: 20px;
- width: 25px;
- vertical-align: middle;
- margin: 0px;
- display: inline-block;
- }
-
- .etcd-body .etcd-list .etcd-delete svg {
- height: 20px;
- fill: #eee;
- }
-
- .etcd-body .etcd-list .etcd-selected .etcd-delete svg {
- height: 20px;
- fill: #ddd;
- }
-
- .etcd-body .etcd-list .etcd-delete:hover svg {
- cursor: pointer;
- fill: #ff0000;
- }
-
-
-.etcd-container.etcd-browser {
-
+a {
+ color: #2176AC;
+ text-decoration: none;
}
- .etcd-container.etcd-browser .etcd-header {
- height: 37px;
- }
-
- .etcd-back {
- height: 37px;
- width: 37px;
- vertical-align: middle;
- margin: 0px;
- position: absolute;
- top: 0px;
- left: 3px;
- display: none;
- }
-
- .etcd-container.etcd-browser.etcd-preview-reveal .etcd-back {
- display: block;
- }
-
- .etcd-container.etcd-browser.etcd-preview-hide .etcd-back {
- display: block;
- }
-
- .etcd-back svg {
- height: 20px;
- padding: 8px 6px;
- }
-
- .etcd-back:hover svg {
- cursor: pointer;
- fill: #428bca;
- }
-
- .etcd-back.etcd-disabled svg {
- fill: #bbb;
- }
-
- .etcd-add {
- height: 37px;
- width: 37px;
- vertical-align: middle;
- margin: 0px;
- position: absolute;
- top: 0px;
- left: 36px;
- }
-
- .etcd-container.etcd-browser.etcd-preview-reveal .etcd-add {
-
- }
-
- .etcd-container.etcd-browser.etcd-preview-hide .etcd-add {
-
- }
-
- .etcd-add svg {
- height: 22px;
- padding: 7px 6px;
- }
-
- .etcd-add:hover svg {
- cursor: pointer;
- fill: #428bca;
- }
-
- .etcd-add.etcd-disabled svg {
- fill: #bbb;
- }
-
- .etcd-container.etcd-browser .etcd-header .etcd-browser-path {
- position: absolute;
- left: 72px;
- right: 0px;
- top: 0;
- margin: 6px 5px 6px 5px;
- }
-
- .etcd-container.etcd-browser .etcd-header .etcd-browser-path input {
- width: 100%;
- box-sizing: border-box;
- -moz-box-sizing: border-box;
- -webkit-box-sizing: border-box;
- }
-
- .etcd-container.etcd-browser .etcd-header .etcd-save {
- position: absolute;
- width: 54px;
- right: -55px;
- margin: 6px 0;
- }
-
- .etcd-container.etcd-browser.etcd-save-reveal .etcd-header .etcd-save {
- right: 7px;
- }
-
- .etcd-container.etcd-browser.etcd-save-reveal .etcd-header .etcd-browser-path {
- right: 62px;
- }
-
- .etcd-container.etcd-browser.etcd-save-hide .etcd-header .etcd-save {
- right: -55px;
- }
-
- .etcd-container.etcd-browser.etcd-save-hide .etcd-header .etcd-browser-path {
- right: 0px;
- }
-
- .etcd-container.etcd-browser .etcd-preview {
- position: absolute;
- left: 100%;
- min-height: 100%;
- overflow-y: auto;
- overflow-x: hidden;
- top: 0px;
- box-sizing: border-box;
- -moz-box-sizing: border-box;
- background-color: #fff;
- width: 100%;
- border-left: 1px solid #ddd;
- }
-
- .etcd-container.etcd-browser .etcd-preview pre, .etcd-container.etcd-browser .etcd-preview textarea {
- padding: 20px 20px 20px 20px;
- margin: 0px;
- font-family: Consolas, "Liberation Mono", Courier, monospace;
- height: 100%;
- width: 100%;
- white-space: pre-wrap;
- position: absolute;
- font-size: 13px;
- border: 1px;
- outline: none;
- box-sizing: border-box;
- -moz-box-sizing: border-box;
- }
-
- .etcd-container.etcd-browser.etcd-preview-reveal .etcd-preview pre, .etcd-container.etcd-browser.etcd-preview-reveal .etcd-preview textarea {
- display: block;
- }
-
- .etcd-container.etcd-browser .etcd-preview .etcd-empty {
- top: 0px;
- bottom: 0px;
- width: 100%;
- text-align: center;
- position: absolute;
- }
-
- .etcd-container.etcd-browser.etcd-preview-reveal .etcd-empty {
- display: none;
- }
-
- .etcd-container.etcd-browser .etcd-preview .etcd-empty-message {
- margin-top: 25%;
- color: #999;
- }
-
- /* Single Column Positioning */
- @media (max-width: 700px) {
- .etcd-container.etcd-browser .etcd-list {
- width: 100%;
- }
-
- .etcd-container.etcd-browser.etcd-preview-reveal .etcd-list {
- left: -100%;
- transition-property: all;
- transition-duration: 250ms;
- transition-timing-function: ease-in-out;
- }
-
- .etcd-container.etcd-browser.etcd-preview-hide .etcd-list {
- left: 0%;
- transition-property: all;
- transition-duration: 250ms;
- transition-timing-function: ease-in-out;
- }
-
- .etcd-container.etcd-browser .etcd-preview {
- left: 100%;
- }
-
- .etcd-container.etcd-browser.etcd-preview-reveal .etcd-preview {
- left: -1px;
- transition-property: all;
- transition-duration: 250ms;
- transition-timing-function: ease-in-out;
- }
-
- .etcd-container.etcd-browser.etcd-preview-hide .etcd-preview {
- left: 100%;
- transition-property: all;
- transition-duration: 250ms;
- transition-timing-function: ease-in-out;
- }
- }
-
-
- /* Double Column Positioning */
- @media (min-width: 700px) {
- .etcd-container.etcd-browser .etcd-list {
- width: 50%;
- }
-
- .etcd-container.etcd-browser .etcd-preview {
- left: 50%;
- width: 50%;
- }
-
- .etcd-container.etcd-browser.etcd-preview-reveal .etcd-preview {
- left: 50%; /* does nothing */
- }
-
- .etcd-container.etcd-browser.etcd-preview-reveal .etcd-preview .etcd-empty {
- display: none;
- }
-
- .etcd-container.etcd-browser.etcd-preview-hide .etcd-preview {
- left: 50%; /* does nothing */
- }
-
- .etcd-container.etcd-browser.etcd-preview-hide .etcd-preview .etcd-empty {
- display: block;
- }
-
- .etcd-container.etcd-browser.etcd-preview-hide .etcd-preview pre, .etcd-container.etcd-browser.etcd-preview-hide .etcd-preview textarea {
- display: none;
- }
- }
-
-.etcd-container.etcd-stats {
-
+a:hover, a:active {
+ text-decoration: underline;
}
- .etcd-container.etcd-stats h2 {
- margin-top: -7px;
- }
+input[type=text] {
+ box-shadow: inset 0 1px 2px rgba(0,0,0,.5);
+ border: none;
+ border-radius: 3px;
+ font-size: 13px;
+ padding-left: 5px;
+ padding-right: 5px;
+ height: 25px;
+}
- .etcd-format-selector {
- position: absolute;
- top: 12px;
- right: 16px;
- z-index: 999;
- }
+input[type=text]:focus {
+}
- .etcd-format-selector .etcd-selector-item {
- display: inline-block;
- height: 12px;
- width: 12px;
- padding: 8px 4px;
- }
+h2 {
+ font-size: 22px;
+ font-family: "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
+ font-weight: 500;
+ margin: 0 0 20px 0;
+ padding: 0;
+}
- .etcd-format-selector .etcd-selector-item:hover {
- cursor: pointer;
- }
+.etcd-button {
+ display:inline-block;
+ padding:6px 12px;
+ margin-bottom:0;
+ font-size:14px;
+ font-weight:normal;
+ line-height:1.428571429;
+ text-align:center;
+ white-space:nowrap;
+ vertical-align:middle;
+ cursor:pointer;
+ border:1px solid transparent;
+ border-radius:4px;
+ -webkit-user-select:none;
+ -moz-user-select:none;
+ -ms-user-select:none;
+ -o-user-select:none;
+ user-select:none;
+ margin: 0px;
+ border: none;
+ box-shadow: inset 0 1px 0 rgba(255,255,255,0.2),0 1px 2px rgba(0,0,0,0.25);
+}
- .etcd-format-selector .etcd-selector-item svg {
- fill: #333;
- }
+.etcd-button.etcd-button-small {
+ height: 25px;
+ padding: 0 10px;
+ font-size: 13px;
+}
- .etcd-container.etcd-stats .etcd-graph {
- box-sizing: border-box;
- -moz-box-sizing: border-box;
- position: absolute;
- top: 0px;
- bottom: 0px;
- left: 0px;
- right: 0px;
- padding: 20px;
- }
+.etcd-button-primary {
+ background-color: #428BCA;
+ color: #fff;
+ text-shadow: 0 0 3px rgba(0,0,0,0.25);
+}
- .etcd-container.etcd-stats .etcd-graph .etcd-graph-container {
- position: absolute;
- top: 60px;
- bottom: 20px;
- left: 20px;
- right: 20px;
- box-sizing: border-box;
- -moz-box-sizing: border-box;
- }
+.etcd-button-primary:active {
+ background-color: #2276ad;
+}
- .etcd-container.etcd-stats table .etcd-latency {
- width: 50%;
- }
+.etcd-popover {
+ background: #333;
+ border-radius: 3px;
+ padding: 15px;
+ position: absolute;
+ top: 39px;
+ z-index: 9999;
+ color: #fff;
+ font-size: 13px;
+ box-shadow: 0px 2px 10px rgba(0,0,0,.5);
+ display: none;
+}
- .etcd-container.etcd-stats .etcd-list {
- position: absolute;
- left: 100%;
- min-height: 100%;
- overflow-y: auto;
- overflow-x: hidden;
- top: 0px;
- box-sizing: border-box;
- -moz-box-sizing: border-box;
- background-color: #fff;
- width: 100%;
- border-left: 1px solid #ddd;
- }
+.etcd-popover-error .etcd-popover-content {
+ color: #FF3C43;
+ font-weight: bold;
+ user-select: text;
+ -webkit-user-select: text;
+ -moz-user-select: text;
+ -ms-user-select: text;
+}
- .etcd-container.etcd-stats .etcd-list .etcd-square {
- height: 10px;
- width: 10px;
- display: inline-block;
- margin-right: 5px;
- }
+.etcd-popover-notch {
+ width: 14px;
+ height: 14px;
+ -webkit-transform: rotate(45deg);
+ -moz-transform: rotate(45deg);
+ -ms-transform: rotate(45deg);
+ position: absolute;
+ margin-top: -5px;
+ margin-left: 3px;
+ background: #333;
+ top: 0px;
+ right: 15px;
+}
- .etcd-container.etcd-stats .etcd-list .etcd-square-red {
- background-color: #c40022;
- }
+.etcd-popover.etcd-popover-right {
+ left: 77px;
+}
- .etcd-container.etcd-stats .etcd-list .etcd-square-orange {
- background-color: #FFC000;
- }
+.etcd-popover-right .etcd-popover-notch {
+ left: 15px;
+}
- .etcd-container.etcd-stats .etcd-list .etcd-square-green {
- background-color: #00DB24;
- }
+.etcd-popover.etcd-popover-left {
+ right: 10px;
+}
- .etcd-container.etcd-stats .etcd-list .etcd-peer-type {
- color: #999;
- padding-left: 3px;
- font-size: 13px;
- line-height: 100%;
- }
+.etcd-popover-left .etcd-popover-notch {
+ right: 15px;
+}
- .etcd-container.etcd-stats .etcd-list .etcd-latency-value {
- display: inline-block;
- }
+.etcd-popover-confirm {
+ margin-top: 10px;
+}
- /* Single Column Positioning */
- @media (max-width: 700px) {
- .etcd-container.etcd-stats .etcd-list {
- width: 100%;
- left: 100%;
- }
+.etcd-popover-confirm button {
+}
- .etcd-container.etcd-stats .etcd-graph {
- left: 0%;
- }
+.etcd-header {
+ width: 100%;
+ position: relative;
+ box-sizing: border-box;
+ -moz-box-sizing: border-box;
+}
+.etcd-header.solid {
+ background: #eeeeee;
+ background: -moz-linear-gradient(top, #eeeeee 0%, #dddddd 100%);
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eeeeee), color-stop(100%,#dddddd));
+ background: -webkit-linear-gradient(top, #eeeeee 0%,#dddddd 100%);
+ background: -o-linear-gradient(top, #eeeeee 0%,#dddddd 100%);
+ background: -ms-linear-gradient(top, #eeeeee 0%,#dddddd 100%);
+ background: linear-gradient(to bottom, #eeeeee 0%,#dddddd 100%);
+ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#dddddd',GradientType=0 );
+}
- .etcd-container.etcd-stats.etcd-table-reveal .etcd-graph {
- left: -100%;
- transition-property: all;
- transition-duration: 250ms;
- transition-timing-function: ease-in-out;
- }
- .etcd-container.etcd-stats.etcd-table-hide .etcd-graph {
- left: 0%;
- transition-property: all;
- transition-duration: 250ms;
- transition-timing-function: ease-in-out;
+.etcd-body {
+ top: 0px;
+ left: 0px;
+ position: relative;
+ overflow: hidden;
+ height: 100%;
+ width: 100%;
+ box-sizing: border-box;
+ -moz-box-sizing: border-box;
+}
- }
- .etcd-container.etcd-stats.etcd-table-hide .etcd-format-selector .etcd-selector-graph svg * {
- fill: #428bca;
- }
+.etcd-body table {
+ width: 100%;
+ box-sizing: border-box;
+ -moz-box-sizing: border-box;
+}
- .etcd-container.etcd-stats.etcd-table-hide .etcd-list {
- left: 100%;
- transition-property: all;
- transition-duration: 250ms;
- transition-timing-function: ease-in-out;
- }
- .etcd-container.etcd-stats.etcd-table-reveal .etcd-list {
- left: 0%;
- transition-property: all;
- transition-duration: 250ms;
- transition-timing-function: ease-in-out;
- }
- .etcd-container.etcd-stats.etcd-table-reveal .etcd-format-selector .etcd-selector-table svg * {
- fill: #428bca;
- }
+.etcd-body table thead td {
+ text-transform: uppercase;
+ font-size: 11px;
+ line-height: 20px;
+ border-bottom: 1px solid #ddd;
+ padding-top: 0px;
+ padding-right: 10px;
+ padding-bottom: 0px;
+ padding-left: 0px;
+ color: #666;
+}
- }
-
+.etcd-body table tbody td {
+ line-height: 18px;
+ border-bottom: 1px solid #ddd;
+ padding-top: 6px;
+ padding-right: 10px;
+ padding-bottom: 6px;
+ padding-left: 0px;
+ vertical-align: text-top;
+ user-select: text;
+ -webkit-user-select: text;
+ -moz-user-select: text;
+ -ms-user-select: text;
+}
- /* Double Column Positioning */
- @media (min-width: 700px) {
- .etcd-container.etcd-stats .etcd-list {
- width: 50%;
- left: 50%;
- }
+.etcd-body table .etcd-ttl-header {
+ width: 33%;
+}
- .etcd-container.etcd-stats .etcd-graph {
- left: 0%;
- width: 50%;
- }
+.etcd-body table tbody .etcd-ttl {
+ font-size: 13px;
+}
- .etcd-container.etcd-stats .etcd-format-selector {
- display: none;
- }
+.etcd-body table tbody .etcd-ttl .etcd-ttl-none {
+ color: #999;
+ font-weight: 100;
+}
+
+.etcd-body table .etcd-actions-header {
+ width: 30px;
+}
+
+.etcd-body table thead td:first-child, .etcd-body table tbody td:first-child {
+ padding-left: 10px;
+}
+
+.etcd-body table thead td:last-child, .etcd-body table tbody td:last-child {
+ padding-right: 10px;
+}
+
+.etcd-container .etcd-preview .etcd-dialog {
+ background: #333;
+ position: absolute;
+ right: 0px;
+ left: 0px;
+ padding: 20px;
+ color: #fff;
+ font-size: 14px;
+ font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+ bottom: 0px;
+ opacity: 0;
+ min-height: 110px; /* REMOVE ME! */
+ transition-property: all;
+ transition-duration: 150ms;
+ transition-timing-function: ease-in-out;
+}
+
+.etcd-container .etcd-preview .etcd-dialog .etcd-dialog-message {
+ margin-bottom: 20px;
+}
+
+.etcd-container .etcd-preview .etcd-dialog .etcd-dialog-buttons a {
+ line-height: 34px;
+ color: #fff;
+ vertical-align: middle;
+ margin-left: 10px;
+}
+
+.etcd-body .etcd-list {
+ padding: 20px;
+ box-sizing: border-box;
+ -moz-box-sizing: border-box;
+ overflow: auto;
+ height: 100%;
+ position: absolute;
+}
+
+.etcd-body .etcd-list .etcd-selected {
+ background-color: #EAF3FF;
+}
+
+.etcd-body .etcd-list a.directory {
+ font-weight: bold;
+}
+
+.etcd-list tr:hover .etcd-delete {
+ visibility: visible;
+ fill: #ff0000;
+}
+
+.etcd-delete {
+ height: 20px;
+ width: 25px;
+ vertical-align: middle;
+ margin: 0px;
+ display: inline-block;
+}
+
+.etcd-delete {
+ height: 20px;
+ fill: #eee;
+}
+
+.etcd-selected .etcd-delete {
+ height: 20px;
+ fill: #ddd;
+}
+
+.etcd-delete:hover {
+ cursor: pointer;
+ fill: #ff0000;
+}
+
+.etcd-back {
+ height: 37px;
+ width: 37px;
+ vertical-align: middle;
+ margin: 0px;
+ position: absolute;
+ top: 0px;
+ left: 3px;
+ display: none;
+}
+
+
+.etcd-back svg {
+ height: 20px;
+ padding: 8px 6px;
+}
+
+.etcd-back:hover svg {
+ cursor: pointer;
+ fill: #428bca;
+}
+
+.etcd-back.etcd-disabled svg {
+ fill: #bbb;
+}
+
+.etcd-add {
+ height: 37px;
+ width: 37px;
+ vertical-align: middle;
+ margin: 0px;
+ position: absolute;
+ top: 0px;
+ left: 36px;
+}
+
+
+.etcd-add svg {
+ height: 22px;
+ padding: 7px 6px;
+}
+
+.etcd-add:hover svg {
+ cursor: pointer;
+ fill: #428bca;
+}
+
+.etcd-add.etcd-disabled svg {
+ fill: #bbb;
+}
+
+.etcd-format-selector {
+ position: absolute;
+ top: 12px;
+ right: 16px;
+ z-index: 999;
+}
+
+.etcd-format-selector .etcd-selector-item {
+ display: inline-block;
+ height: 12px;
+ width: 12px;
+ padding: 8px 4px;
+}
+
+.etcd-format-selector .etcd-selector-item:hover {
+ cursor: pointer;
+}
+
+.etcd-format-selector .etcd-selector-item svg {
+ fill: #333;
+}
- }
diff --git a/mod/dashboard/app/styles/main.css b/mod/dashboard/app/styles/main.css
index c754fddc3..7eb1bb8d2 100644
--- a/mod/dashboard/app/styles/main.css
+++ b/mod/dashboard/app/styles/main.css
@@ -1,22 +1,56 @@
+html {
+ height: 100%;
+}
+
body {
- background: #fafafa;
- font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
- color: #333;
+ background: #fafafa;
+ font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+ color: #333;
+ padding: 30px;
+ margin: 0px;
+ height: 100%;
+}
+h1 {
+ font-family: "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
+ font-weight: 400;
+ margin: 0px 0px 20px 0px;
+ padding: 0px;
}
-.hero-unit {
- margin: 50px auto 0 auto;
- width: 300px;
- font-size: 18px;
- font-weight: 200;
- line-height: 30px;
- background-color: #eee;
- border-radius: 6px;
- padding: 60px;
+a {
+ color: #1e6ec1;
+ text-decoration: none;
}
-.hero-unit h1 {
- font-size: 60px;
- line-height: 1;
- letter-spacing: -1px;
+a:hover {
+ text-decoration: underline;
+}
+
+#footer {
+ width: 100%;
+ font-family: "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
+ margin-top: 20px;
+}
+
+#coreos-logo {
+ margin: 10px auto 0 auto;
+ height: 30px;
+ width: 80px;
+}
+
+#coreos-logo svg {
+ fill: #999;
+ MAX-WIDTH: 100PX;
+ DISPLAY: INLINE-BLOCK;
+ VERTICAL-ALIGN: MIDDLE;
+}
+
+#POWERED-BY {
+ FONT-SIZE: 12PX;
+ COLOR: #333;
+ WIDTH: 100%;
+ DISPLAY: INLINE-BLOCK;
+ VERTICAL-ALIGN: MIDDLE;
+ LINE-HEIGHT: 190%;
+ TEXT-ALIGN: CENTER;
}
diff --git a/mod/dashboard/app/styles/stats.css b/mod/dashboard/app/styles/stats.css
new file mode 100644
index 000000000..92fb3f18f
--- /dev/null
+++ b/mod/dashboard/app/styles/stats.css
@@ -0,0 +1,144 @@
+.etcd-container.etcd-stats {
+ width: 100%;
+ height: 500px;
+}
+
+.home-container .etcd-container.etcd-stats {
+ height: 400px;
+}
+
+.etcd-container.etcd-stats h2 {
+ margin-top: -7px;
+}
+
+.etcd-container.etcd-stats table .etcd-latency {
+ width: 50%;
+}
+
+.etcd-container.etcd-stats .etcd-list {
+ position: absolute;
+ left: 100%;
+ min-height: 100%;
+ overflow-y: auto;
+ overflow-x: hidden;
+ top: 0px;
+ box-sizing: border-box;
+ -moz-box-sizing: border-box;
+ background-color: #fff;
+ width: 100%;
+ border-left: 1px solid #ddd;
+}
+
+.etcd-container.etcd-stats .etcd-list .etcd-square {
+ height: 10px;
+ width: 10px;
+ display: inline-block;
+ margin-right: 5px;
+}
+
+.etcd-container.etcd-stats .etcd-list .etcd-square-red {
+ background-color: #c40022;
+}
+
+.etcd-container.etcd-stats .etcd-list .etcd-square-orange {
+ background-color: #FFC000;
+}
+
+.etcd-container.etcd-stats .etcd-list .etcd-square-green {
+ background-color: #00DB24;
+}
+
+.etcd-container.etcd-stats .etcd-list .etcd-peer-type {
+ color: #999;
+ padding-left: 3px;
+ font-size: 13px;
+ line-height: 100%;
+}
+
+.etcd-container.etcd-stats .etcd-list .etcd-latency-value {
+ display: inline-block;
+}
+
+.etcd-container.etcd-stats .etcd-graph {
+ box-sizing: border-box;
+ -moz-box-sizing: border-box;
+ position: absolute;
+ top: 0px;
+ bottom: 0px;
+ left: 0px;
+ right: 0px;
+ padding: 20px;
+}
+
+.etcd-container.etcd-stats .etcd-graph .etcd-graph-container {
+ position: absolute;
+ top: 60px;
+ bottom: 20px;
+ left: 20px;
+ right: 20px;
+ box-sizing: border-box;
+ -moz-box-sizing: border-box;
+}
+
+
+/* Single Column Positioning */
+@media (max-width: 700px) {
+ .etcd-container.etcd-stats .etcd-list {
+ width: 100%;
+ left: 100%;
+ }
+
+ .etcd-container.etcd-stats .etcd-graph {
+ left: 0%;
+ }
+
+ .etcd-container.etcd-stats.etcd-table-reveal .etcd-graph {
+ left: -100%;
+ transition-property: all;
+ transition-duration: 250ms;
+ transition-timing-function: ease-in-out;
+ }
+ .etcd-container.etcd-stats.etcd-table-hide .etcd-graph {
+ left: 0%;
+ transition-property: all;
+ transition-duration: 250ms;
+ transition-timing-function: ease-in-out;
+
+ }
+ .etcd-container.etcd-stats.etcd-table-hide .etcd-format-selector .etcd-selector-graph svg * {
+ fill: #428bca;
+ }
+
+ .etcd-container.etcd-stats.etcd-table-hide .etcd-list {
+ left: 100%;
+ transition-property: all;
+ transition-duration: 250ms;
+ transition-timing-function: ease-in-out;
+ }
+ .etcd-container.etcd-stats.etcd-table-reveal .etcd-list {
+ left: 0%;
+ transition-property: all;
+ transition-duration: 250ms;
+ transition-timing-function: ease-in-out;
+ }
+ .etcd-container.etcd-stats.etcd-table-reveal .etcd-format-selector .etcd-selector-table svg * {
+ fill: #428bca;
+ }
+}
+
+/* Double Column Positioning */
+@media (min-width: 700px) {
+ .etcd-container.etcd-stats .etcd-list {
+ width: 50%;
+ left: 50%;
+ }
+
+ .etcd-container.etcd-stats .etcd-graph {
+ left: 0%;
+ width: 50%;
+ }
+
+ .etcd-container.etcd-stats .etcd-format-selector {
+ display: none;
+ }
+}
diff --git a/mod/dashboard/app/views/browser.html b/mod/dashboard/app/views/browser.html
index b40dc38dc..35d15f5ec 100644
--- a/mod/dashboard/app/views/browser.html
+++ b/mod/dashboard/app/views/browser.html
@@ -1,99 +1,73 @@
-
+ 
+
+ 
+ 
+
+