From 4288c123457dcb4b3aeeda8a494fc3480f4ccd55 Mon Sep 17 00:00:00 2001 From: Samuel Padgett Date: Sat, 2 Apr 2016 10:57:36 -0400 Subject: [PATCH] Improve display of logs in web console --- assets/app/scripts/directives/logViewer.js | 23 +- assets/app/styles/_log.less | 72 ++++++- assets/app/views/browse/build.html | 20 +- assets/app/views/browse/deployment.html | 20 +- assets/app/views/browse/pod.html | 53 ++--- .../views/directives/logs/_log-viewer.html | 55 ++--- pkg/assets/bindata.go | 198 +++++++++--------- 7 files changed, 249 insertions(+), 192 deletions(-) diff --git a/assets/app/scripts/directives/logViewer.js b/assets/app/scripts/directives/logViewer.js index 50abf50b5a3e..e1cd289da959 100644 --- a/assets/app/scripts/directives/logViewer.js +++ b/assets/app/scripts/directives/logViewer.js @@ -148,9 +148,29 @@ angular.module('openshiftConsole') } }; + var fillHeight = function(animate) { + var content = $('.log-view-output'); + var contentTop = content.offset().top; + if (contentTop < 0) { + // Content top is off the page already. + return; + } + + var fill = Math.floor($(window).height() - contentTop); + if (!$scope.chromeless) { + // Add some bottom margin if not chromeless. + fill = fill - 35; + } + if (animate) { + content.animate({ 'min-height': fill +'px' }, 'fast'); + } else { + content.css('min-height', fill + 'px'); + } + }; // roll up & debounce the various fns to call on resize var onResize = _.debounce(function() { + fillHeight(true); // update scroll handlers detectScrollableNode(); attachScrollEvents(); @@ -160,7 +180,6 @@ angular.module('openshiftConsole') onScroll(); }, 100); - $win.on('resize', onResize); @@ -259,6 +278,8 @@ angular.module('openshiftConsole') $scope.empty = false; if($scope.state !== 'logs') { $scope.state = 'logs'; + // setTimeout so that the log content is visible to correctly calculate fill height. + setTimeout(fillHeight); } }); diff --git a/assets/app/styles/_log.less b/assets/app/styles/_log.less index 3de116657d71..065fa86bca01 100644 --- a/assets/app/styles/_log.less +++ b/assets/app/styles/_log.less @@ -1,13 +1,50 @@ .log-title { margin-top: 0; } -.log-timestamp, .log-size-warning { - margin-bottom: 10px; +.log-header { + margin-bottom: 3px; + label { + margin-bottom: 0; + } + .dash { + .text-muted(); + margin: 0 2px; + } + .log-actions { + form { + display: inline-block; + } + .btn-link { + padding: 0; + } + } + .log-timestamps { + .text-muted(); + display: block; + } + @media (min-width: @screen-sm-min) { + .log-status { + display: inline-block; + } + .log-timestamps { + .small(); + display: inline-block; + margin-left: 3px; + } + .log-actions { + .pull-right(); + margin-left: 5px; + } + } +} +.log-size-warning { + margin: 0; } .log-view { background-color: @log-bg-color; + // Make sure log-actions are not hidden behind log if they wrap. + clear: both; font-family: @font-family-monospace; - min-height: 60px; padding: 0; position: relative; pre, pre code { @@ -75,18 +112,36 @@ @media (min-width: @screen-sm-min) { font-size: 12px; } - padding: 30px 0 30px; - .ellipsis-loader { - // Give space between log output and loader - margin-top: 30px; + padding: 40px 0; + @media only screen and (max-device-width: 736px) and (-webkit-min-device-pixel-ratio: 0) { + // On an iPhone, add additional margin so that following logs is never obscured + // by the bottom buttons that are displayed and hidden. + padding-bottom: 70px; } table { table-layout: fixed; width: 100%; } + .ellipsis-loader { + // Show the loading dots at the bottom, even when the log content doesn't fill the page. + position: absolute; + bottom: 10px; + // Center the dots. + margin-left: auto; + margin-right: auto; + left: 0; + right: 0; + } } } - +.log-end-msg { + font-family: @font-family-base; + font-size: @font-size-base - 1; + color: #72767b; + position: absolute; + bottom: 5px; + left: 10px; +} // TODO: need to encapsulate this better .chromeless .log-scroll-top.affix { right: 0px; // override @@ -140,7 +195,6 @@ background: lighten(#d1d1d1, 8%); } } - .table-log-pods { > tbody + tbody { border-top-width: 1px; diff --git a/assets/app/views/browse/build.html b/assets/app/views/browse/build.html index fc330f019648..59b83c23d576 100644 --- a/assets/app/views/browse/build.html +++ b/assets/app/views/browse/build.html @@ -107,19 +107,15 @@

empty="logEmpty" run="logCanRun"> -
-
- Build status: - - {{build.status.phase}} + + + {{build.status.phase}} - - — Log from {{build.status.startTimestamp | date : 'short'}} - - to {{build.status.completionTimestamp | date : 'short'}} - - -
+
+ Log from {{build.status.startTimestamp | date : 'short'}} + + to {{build.status.completionTimestamp | date : 'short'}} +
diff --git a/assets/app/views/browse/deployment.html b/assets/app/views/browse/deployment.html index bf1cb42a53db..10018c674abf 100644 --- a/assets/app/views/browse/deployment.html +++ b/assets/app/views/browse/deployment.html @@ -93,18 +93,14 @@

Container {{container.name}}

empty="logEmpty" run="logCanRun"> -
-
-
- Deployment status: - - {{deployment | deploymentStatus}} -
-
-
- — Log from {{deployment.metadata.creationTimestamp | date : 'short'}} -
-
+ + + + {{deployment | deploymentStatus}} + +
+
+ Log from {{deployment.metadata.creationTimestamp | date : 'short'}}
diff --git a/assets/app/views/browse/pod.html b/assets/app/views/browse/pod.html index 541579ff5602..a53901881719 100644 --- a/assets/app/views/browse/pod.html +++ b/assets/app/views/browse/pod.html @@ -81,20 +81,6 @@

Container {{container.name}}

Logs - - - - {{pod.spec.containers[0].name}} - - - - Container {{container.name}}

empty="logEmpty" run="logCanRun"> -
-
- Container status: - - {{containerStateReason || containerStatusKey | sentenceCase}} -
-
- — - - Last {{lasStatusKey}} log - - Log - from {{containerStartTime | date : 'short'}} - to {{containerEndTime | date : 'short'}} -
-
+ + + + {{pod.spec.containers[0].name}} + + + + + + + + {{containerStateReason || containerStatusKey | sentenceCase}} + + + + Log from {{containerStartTime | date : 'short'}} to {{containerEndTime | date : 'short'}} + diff --git a/assets/app/views/directives/logs/_log-viewer.html b/assets/app/views/directives/logs/_log-viewer.html index f30bd120c93c..8d118a46ccfc 100644 --- a/assets/app/views/directives/logs/_log-viewer.html +++ b/assets/app/views/directives/logs/_log-viewer.html @@ -1,31 +1,27 @@ -
-
-
- - Open full view of log - -
+
+
+
+
- +
-
+ | + + + Expand + +
- -
+
Only the previous {{options.tailLines || 1000}} log lines and new log messages will be displayed because of the large log size. @@ -33,11 +29,10 @@ -
- +
+
-

Logs are not available.

@@ -60,12 +55,12 @@

Logs are not available.

-
+
-
+
Logs are not available. Go to end
-
+
-
- + +
+ End of log
Logs are not available. name="logBottom">
-
The maximum web console log size has been reached. Use the command-line interface or reload the log to see new messages.
-
- End of log -
-
An error occurred loading the log. diff --git a/pkg/assets/bindata.go b/pkg/assets/bindata.go index ff68e636f13a..33a10d2972b8 100644 --- a/pkg/assets/bindata.go +++ b/pkg/assets/bindata.go @@ -6642,22 +6642,30 @@ top:j.followAffixTop || 0, bottom:j.followAffixBottom || 0 } }); -}, x = _.debounce(function() { -r(), v(), s(), w(), u(); +}, x = function(a) { +var b = $(".log-view-output"), c = b.offset().top; +if (!(0 > c)) { +var d = Math.floor($(window).height() - c); +j.chromeless || (d -= 35), a ? b.animate({ +"min-height":d + "px" +}, "fast") :b.css("min-height", d + "px"); +} +}, y = _.debounce(function() { +x(!0), r(), v(), s(), w(), u(); }, 100); -i.on("resize", x); -var y, z = function() { +i.on("resize", y); +var z, A = function() { t = !0, g.scrollBottom(o); -}, A = function() { -j.autoScrollActive = !j.autoScrollActive, j.autoScrollActive && z(); -}, B = document.createDocumentFragment(), C = _.debounce(function() { -l.appendChild(B), B = document.createDocumentFragment(), j.autoScrollActive && z(), j.showScrollLinks || s(); +}, B = function() { +j.autoScrollActive = !j.autoScrollActive, j.autoScrollActive && A(); +}, C = document.createDocumentFragment(), D = _.debounce(function() { +l.appendChild(C), C = document.createDocumentFragment(), j.autoScrollActive && A(), j.showScrollLinks || s(); }, 100, { maxWait:300 -}), D = function(a) { -y && (y.stop(), y = null), a || (C.cancel(), l && (l.innerHTML = ""), B = document.createDocumentFragment()); -}, E = function() { -if (D(), j.name && j.run) { +}), E = function(a) { +z && (z.stop(), z = null), a || (D.cancel(), l && (l.innerHTML = ""), C = document.createDocumentFragment()); +}, F = function() { +if (E(), j.name && j.run) { angular.extend(j, { loading:!0, autoScroll:!1, @@ -6669,32 +6677,32 @@ follow:!0, tailLines:1e3, limitBytes:10485760 }, j.options); -y = f.createStream(j.resource, j.name, j.context, a); +z = f.createStream(j.resource, j.name, j.context, a); var c = 0, d = function(a) { -c++, B.appendChild(k(c, a)), C(); +c++, C.appendChild(k(c, a)), D(); }; -y.onMessage(function(b, e, f) { +z.onMessage(function(b, e, f) { j.$evalAsync(function() { -j.empty = !1, "logs" !== j.state && (j.state = "logs"); +j.empty = !1, "logs" !== j.state && (j.state = "logs", setTimeout(x)); }), a.limitBytes && f >= a.limitBytes && (j.$evalAsync(function() { j.limitReached = !0, j.loading = !1; -}), D(!0)), d(b), !j.largeLog && c >= a.tailLines && j.$evalAsync(function() { +}), E(!0)), d(b), !j.largeLog && c >= a.tailLines && j.$evalAsync(function() { j.largeLog = !0; }); -}), y.onClose(function() { -y = null, j.$evalAsync(function() { +}), z.onClose(function() { +z = null, j.$evalAsync(function() { j.autoScrollActive = !1, 0 !== c || j.emptyStateMessage || (j.state = "empty", j.emptyStateMessage = "The logs are no longer available or could not be loaded."); }), b(function() { j.loading = !1; }, 100); -}), y.onError(function() { -y = null, j.$evalAsync(function() { +}), z.onError(function() { +z = null, j.$evalAsync(function() { angular.extend(j, { loading:!1, autoScroll:!1 }), 0 === c ? (j.state = "empty", j.emptyStateMessage = "The logs are no longer available or could not be loaded.") :j.errorWhileRunning = !0; }); -}), y.start(); +}), z.start(); } }; angular.extend(j, { @@ -6708,11 +6716,11 @@ g.scrollBottom(o); onScrollTop:function() { j.autoScrollActive = !1, g.scrollTop(o); }, -toggleAutoScroll:A, +toggleAutoScroll:B, goChromeless:g.chromelessLink, -restartLogs:E -}), j.$watchGroup([ "name", "options.container", "run" ], E), j.$on("$destroy", function() { -D(), i.off("resize", x), i.off("scroll", u), n.off("scroll", u); +restartLogs:F +}), j.$watchGroup([ "name", "options.container", "run" ], F), j.$on("$destroy", function() { +E(), i.off("resize", y), i.off("scroll", u), n.off("scroll", u); }), e.getLoggingURL().then(function(b) { var e = _.get(j.context, "project.metadata.name"), f = _.get(j.options, "container"); e && f && j.name && b && (angular.extend(j, { @@ -9782,18 +9790,14 @@ var _scriptsTemplatesJs = []byte(`angular.module('openshiftConsoleTemplates', [] "\n" + "Logs\n" + "\n" + - "
\n" + - "
\n" + - "Build status:\n" + + "\n" + "\n" + "{{build.status.phase}}\n" + - "\n" + - "— Log from {{build.status.startTimestamp | date : 'short'}}\n" + + "
\n" + + "Log from {{build.status.startTimestamp | date : 'short'}}\n" + "\n" + "to {{build.status.completionTimestamp | date : 'short'}}\n" + "\n" + - "\n" + - "
\n" + "
\n" + "\n" + "\n" + @@ -10091,18 +10095,14 @@ var _scriptsTemplatesJs = []byte(`angular.module('openshiftConsoleTemplates', [] "\n" + "Logs\n" + "\n" + - "
\n" + - "
\n" + - "
\n" + - "Deployment status:\n" + + "\n" + + "\n" + "\n" + "{{deployment | deploymentStatus}}\n" + - "
\n" + - "
\n" + + "\n" + + "
\n" + "
\n" + - "— Log from {{deployment.metadata.creationTimestamp | date : 'short'}}\n" + - "
\n" + - "
\n" + + "Log from {{deployment.metadata.creationTimestamp | date : 'short'}}\n" + "
\n" + "
\n" + "\n" + @@ -10427,29 +10427,21 @@ var _scriptsTemplatesJs = []byte(`angular.module('openshiftConsoleTemplates', [] "\n" + "\n" + "Logs\n" + + "\n" + "\n" + "\n" + "{{pod.spec.containers[0].name}}\n" + "\n" + "\n" + - "\n" + - "
\n" + - "
\n" + - "Container status:\n" + - "\n" + - "{{containerStateReason || containerStatusKey | sentenceCase}}\n" + - "
\n" + - "
\n" + - "—\n" + - "\n" + - "Last {{lasStatusKey}} log\n" + + "\n" + + "\n" + + "\n" + + "{{containerStateReason || containerStatusKey | sentenceCase}}\n" + + "\n" + + "\n" + + "Log from {{containerStartTime | date : 'short'}} to {{containerEndTime | date : 'short'}}\n" + "\n" + - "Log\n" + - "from {{containerStartTime | date : 'short'}}\n" + - "to {{containerEndTime | date : 'short'}}\n" + - "
\n" + - "
\n" + "
\n" + "
\n" + " 0\">\n" + @@ -12286,28 +12278,30 @@ var _scriptsTemplatesJs = []byte(`angular.module('openshiftConsoleTemplates', [] $templateCache.put('views/directives/logs/_log-viewer.html', - "
\n" + - "
\n" + - "
\n" + - "\n" + - "Open full view of log \n" + - "\n" + - "
\n" + + "
\n" + + "
\n" + + "
\n" + + "\n" + "
\n" + "\n" + "\n" + - "\n" + + "\n" + "
\n" + + "|\n" + + "
\n" + + "\n" + + "Expand\n" + + "\n" + + "\n" + "
\n" + "
\n" + - "
\n" + - "
\n" + + "
\n" + "\n" + "Only the previous {{options.tailLines || 1000}} log lines and new log messages will be displayed because of the large log size.\n" + "
\n" + "\n" + - "
\n" + - "\n" + + "
\n" + + "\n" + "
\n" + "
\n" + "

Logs are not available.

\n" + @@ -12325,9 +12319,9 @@ var _scriptsTemplatesJs = []byte(`angular.module('openshiftConsoleTemplates', [] "
\n" + "
\n" + "\n" + - "
\n" + + "
\n" + "\n" + - "
\n" + + "
\n" + "\n" + - "
\n" + + "
\n" + "\n" + "\n" + "
\n" + "\n" + - "
\n" + "\n" + + "
\n" + + "End of log\n" + "
\n" + "
\n" + "
\n" + @@ -12357,9 +12352,6 @@ var _scriptsTemplatesJs = []byte(`angular.module('openshiftConsoleTemplates', [] "The maximum web console log size has been reached. Use the command-line interface or\n" + "reload the log to see new messages.\n" + "
\n" + - "
\n" + - "End of log\n" + - "
\n" + "
\n" + "An error occurred loading the log.\n" + "Reload\n" + @@ -83893,7 +83885,7 @@ var _stylesMainCss = []byte(`/*! /*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */ hr,img{border:0} div.code,pre,textarea{overflow:auto} -.btn,.c3 text{-webkit-user-select:none;-moz-user-select:none} +.btn,.c3 text{-moz-user-select:none} .navbar-fixed-bottom .navbar-collapse,.navbar-fixed-top .navbar-collapse,.pre-scrollable{max-height:340px} html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%} article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block} @@ -83948,7 +83940,6 @@ h2,h3{page-break-after:avoid} .img-thumbnail,body{background-color:#fff} @font-face{font-family:'Glyphicons Halflings';src:url(../../components/bootstrap/dist/fonts/glyphicons-halflings-regular.eot);src:url(../../components/bootstrap/dist/fonts/glyphicons-halflings-regular.eot?#iefix) format('embedded-opentype'),url(../../components/bootstrap/dist/fonts/glyphicons-halflings-regular.woff2) format('woff2'),url(../../components/bootstrap/dist/fonts/glyphicons-halflings-regular.woff) format('woff'),url(../../components/bootstrap/dist/fonts/glyphicons-halflings-regular.ttf) format('truetype'),url(../../components/bootstrap/dist/fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular) format('svg')} .glyphicon{position:relative;top:1px;display:inline-block;font-family:'Glyphicons Halflings';font-style:normal;font-weight:400;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale} -.popover,.tooltip,body{font-family:"Open Sans",Helvetica,Arial,sans-serif} .glyphicon-asterisk:before{content:"\2a"} .glyphicon-plus:before{content:"\2b"} .glyphicon-eur:before,.glyphicon-euro:before{content:"\20ac"} @@ -84209,7 +84200,7 @@ h2,h3{page-break-after:avoid} .glyphicon-menu-up:before{content:"\e260"} *,:after,:before{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box} html{font-size:10px;-webkit-tap-highlight-color:transparent} -body{font-size:13px;line-height:1.66666667;color:#333} +body{font-family:"Open Sans",Helvetica,Arial,sans-serif;font-size:13px;line-height:1.66666667;color:#333} button,input,select,textarea{font-family:inherit;font-size:inherit;line-height:inherit} a{color:#0099d3;text-decoration:none} a:focus,a:hover{color:#00618a;text-decoration:underline} @@ -84228,7 +84219,6 @@ hr{margin-top:21px;margin-bottom:21px;border-top:1px solid #eee} .h1,.h2,.h3,h1,h2,h3{margin-top:21px;margin-bottom:10.5px} .h1 .small,.h1 small,.h2 .small,.h2 small,.h3 .small,.h3 small,h1 .small,h1 small,h2 .small,h2 small,h3 .small,h3 small{font-size:65%} .h4,.h5,.h6,h4,h5,h6{margin-top:10.5px;margin-bottom:10.5px} -div.code,p,pre{margin:0 0 10.5px} .h4 .small,.h4 small,.h5 .small,.h5 small,.h6 .small,.h6 small,h4 .small,h4 small,h5 .small,h5 small,h6 .small,h6 small{font-size:75%} .h1,h1{font-size:24px} .h2,h2{font-size:19px} @@ -84236,6 +84226,7 @@ div.code,p,pre{margin:0 0 10.5px} .h4,h4{font-size:14px} .h5,h5{font-size:13px} .h6,h6{font-size:12px} +p{margin:0 0 10.5px} .lead{margin-bottom:21px;font-size:14px;font-weight:300;line-height:1.4} dt,kbd kbd{font-weight:700} @media (min-width:768px){.lead{font-size:19.5px} @@ -84302,7 +84293,7 @@ code{color:#c7254e;background-color:#f9f2f4} kbd{color:#fff;background-color:#333;box-shadow:inset 0 -1px 0 rgba(0,0,0,.25)} kbd kbd{padding:0;font-size:100%;box-shadow:none} .checkbox label,.checkbox-inline,.radio label,.radio-inline{font-weight:400;padding-left:20px;cursor:pointer;margin-bottom:0} -div.code,pre{padding:10px;font-size:12px;line-height:1.66666667;word-break:break-all;word-wrap:break-word;background-color:#fcfcfc;border:1px solid #ccc;border-radius:1px} +div.code,pre{padding:10px;margin:0 0 10.5px;font-size:12px;line-height:1.66666667;word-break:break-all;word-wrap:break-word;background-color:#fcfcfc;border:1px solid #ccc;border-radius:1px} .container,.container-fluid{margin-right:auto;margin-left:auto} pre code,table{background-color:transparent} pre code{padding:0;font-size:inherit;color:inherit;white-space:pre-wrap;border-radius:0} @@ -84644,7 +84635,7 @@ select[multiple].input-lg,textarea.input-lg{height:auto} @media (min-width:768px){.form-horizontal .form-group-lg .control-label{padding-top:9px;font-size:15px} .form-horizontal .form-group-sm .control-label{padding-top:3px;font-size:11px} } -.btn{display:inline-block;margin-bottom:0;font-weight:600;text-align:center;vertical-align:middle;touch-action:manipulation;cursor:pointer;border:1px solid transparent;white-space:nowrap;padding:2px 6px;font-size:13px;line-height:1.66666667;border-radius:1px;-ms-user-select:none;user-select:none} +.btn{display:inline-block;margin-bottom:0;font-weight:600;text-align:center;vertical-align:middle;touch-action:manipulation;cursor:pointer;border:1px solid transparent;white-space:nowrap;padding:2px 6px;font-size:13px;line-height:1.66666667;border-radius:1px;-webkit-user-select:none;-ms-user-select:none;user-select:none} .btn.active.focus,.btn.active:focus,.btn.focus,.btn:active.focus,.btn:active:focus,.btn:focus{outline:dotted thin!important;outline:-webkit-focus-ring-color auto 5px!important;outline-offset:-2px!important} .btn.focus,.btn:focus,.btn:hover{color:#4d5258;text-decoration:none} .btn.active,.btn:active{outline:0;-webkit-box-shadow:inset 0 3px 5px rgba(0,0,0,.125);box-shadow:inset 0 3px 5px rgba(0,0,0,.125)} @@ -85153,7 +85144,7 @@ a.list-group-item-danger.active,a.list-group-item-danger.active:focus,a.list-gro .well-lg{padding:24px} .well-sm{padding:9px} .close{float:right;font-size:19.5px;color:#000} -.popover,.tooltip{font-style:normal;font-weight:400;letter-spacing:normal;line-break:auto;text-transform:none;white-space:normal;word-break:normal;word-spacing:normal;word-wrap:normal;text-decoration:none} +.popover,.tooltip{font-family:"Open Sans",Helvetica,Arial,sans-serif;font-style:normal;font-weight:400;letter-spacing:normal;line-break:auto;text-shadow:none;text-transform:none;white-space:normal;word-break:normal;word-spacing:normal;word-wrap:normal;text-decoration:none} .close:focus,.close:hover{color:#000;text-decoration:none;cursor:pointer} button.close{padding:0;cursor:pointer;background:0 0;border:0;-webkit-appearance:none} .modal-content,.popover{background-clip:padding-box} @@ -85181,7 +85172,7 @@ button.close{padding:0;cursor:pointer;background:0 0;border:0;-webkit-appearance .tooltip.top-left .tooltip-arrow,.tooltip.top-right .tooltip-arrow{bottom:0;margin-bottom:-8px;border-width:8px 8px 0;border-top-color:#111} @media (min-width:992px){.modal-lg{width:900px} } -.tooltip{position:absolute;z-index:1070;display:block;text-align:left;text-align:start;text-shadow:none;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";filter:alpha(opacity=(0));opacity:0} +.tooltip{position:absolute;z-index:1070;display:block;text-align:left;text-align:start;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";filter:alpha(opacity=(0));opacity:0} .tooltip.in{-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";filter:alpha(opacity=(90));opacity:.9} .tooltip.top{margin-top:-3px;padding:8px 0} .tooltip.right{margin-left:3px;padding:0 8px} @@ -85198,7 +85189,7 @@ button.close{padding:0;cursor:pointer;background:0 0;border:0;-webkit-appearance .tooltip.bottom .tooltip-arrow{left:50%;margin-left:-8px} .tooltip.bottom-left .tooltip-arrow{right:8px;margin-top:-8px} .tooltip.bottom-right .tooltip-arrow{left:8px;margin-top:-8px} -.popover{position:absolute;top:0;left:0;z-index:1060;display:none;max-width:220px;text-align:left;text-align:start;text-shadow:none;background-color:#fff;border:1px solid #bbb;border-radius:1px} +.popover{position:absolute;top:0;left:0;z-index:1060;display:none;max-width:220px;text-align:left;text-align:start;background-color:#fff;border:1px solid #bbb;border-radius:1px} .carousel-caption,.carousel-control{color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.6);text-align:center} .popover.top{margin-top:-10px} .popover.right{margin-left:10px} @@ -85970,8 +85961,9 @@ button.close{padding:0;cursor:pointer;background:0 0;border:0;-webkit-appearance .bootstrap-select.show-menu-arrow.open>.dropdown-toggle:after,.bootstrap-select.show-menu-arrow.open>.dropdown-toggle:before{display:block} .bs-actionsbox,.bs-donebutton,.bs-searchbox{padding:4px 8px} .bs-actionsbox{float:left;width:100%;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box} +.bs-donebutton,.tile{-webkit-box-sizing:border-box} .bs-actionsbox .btn-group button{width:50%} -.bs-donebutton{float:left;width:100%;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box} +.bs-donebutton{float:left;width:100%;-moz-box-sizing:border-box;box-sizing:border-box} .bs-donebutton .btn-group button{width:100%} .bs-searchbox+.bs-actionsbox{padding:0 8px 4px} .bs-searchbox .form-control{margin-bottom:0;width:100%} @@ -86115,7 +86107,7 @@ select.mobile-device{position:absolute!important;top:0;left:0;display:block!impo .row-cards-pf{margin-left:-10px;margin-right:-10px} .c3 svg{font:10px sans-serif;font-family:"Open Sans",Helvetica,Arial,sans-serif} .c3 line,.c3 path{fill:none;stroke:#000} -.c3 text{user-select:none} +.c3 text{-webkit-user-select:none;user-select:none} .c3-bars path,.c3-event-rect,.c3-legend-item-tile,.c3-xgrid-focus,.c3-ygrid{shape-rendering:crispEdges} .c3-chart-arc text{fill:#fff;font-size:13px} .c3-grid text{fill:#aaa} @@ -86894,7 +86886,7 @@ abbr[data-original-title],abbr[title]{text-decoration:none} @media (min-width:415px){.dl-horizontal dt{float:left;width:160px;clear:left;text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .dl-horizontal dd{margin-left:180px} } -.sidebar-left .navbar-sidebar .sidebar-header:after,ul.messenger.messenger-theme-flat .messenger-message:after{clear:both} +.log-view,.sidebar-left .navbar-sidebar .sidebar-header:after,ul.messenger.messenger-theme-flat .messenger-message:after{clear:both} .gutter-top-bottom{padding:20px 0} .gutter-top-bottom.gutter-top-bottom-2x{padding:40px 0} .gutter-top{padding-top:20px} @@ -87473,8 +87465,10 @@ body,html{margin:0;padding:0} .table-mobile>tbody>tr>td:last-child{border-bottom:none} .table-mobile>tbody>tr>td:before{content:attr(data-title);position:absolute;top:8px;left:6px;width:35%;padding-right:10px;white-space:nowrap} } +.label-tags a.label,.log-header .log-actions form{display:inline-block} .table-filter-wrapper{padding:10px 10px 5px;border-top:1px solid #d1d1d1;border-left:1px solid #d1d1d1;border-right:1px solid #d1d1d1;background-color:#f9f9f9} -.tile{background:#fff;box-shadow:0 3px 1px -2px rgba(0,0,0,.15),0 2px 2px 0 rgba(0,0,0,.1),0 1px 5px 0 rgba(0,0,0,.09);padding:10px 20px;margin-bottom:20px;word-wrap:break-word;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;overflow-x:hidden} +.tile{background:#fff;box-shadow:0 3px 1px -2px rgba(0,0,0,.15),0 2px 2px 0 rgba(0,0,0,.1),0 1px 5px 0 rgba(0,0,0,.09);padding:10px 20px;margin-bottom:20px;word-wrap:break-word;-moz-box-sizing:border-box;box-sizing:border-box;overflow-x:hidden} +.log-header .log-actions .btn-link,.log-view{padding:0} .tile h1,.tile h2,.tile h3{margin:10.5px 0px} .tile h3 .tile-timestamp{color:#999;font-size:84%} @media (max-width:768px){.tile h3 .tile-timestamp:before{content:'\2014\00a0'} @@ -87495,7 +87489,7 @@ body,html{margin:0;padding:0} .tile-flex .image-icon,.tile-flex .template-icon{width:30px;margin-right:20px;font-size:33px;opacity:.38} .tile-flex:hover .image-icon,.tile-flex:hover .template-icon,.tile-flex:hover .tile-badge-icon{opacity:.75} .tile-flex h3{margin:3px 0px 2px} -.label-tags a.label{display:inline-block;margin-right:3px;margin-top:-5px} +.label-tags a.label{margin-right:3px;margin-top:-5px} .label-tags a.label:hover{color:#111;background-color:#eee!important} kubernetes-topology-graph{height:700px} .kube-topology{margin-bottom:-5px} @@ -87519,23 +87513,35 @@ kubernetes-topology-graph{height:700px} } .log-line-number,.log-link-external{text-align:right} .log-title{margin-top:0} -.log-size-warning,.log-timestamp{margin-bottom:10px} -.log-view{background-color:#101214;font-family:Menlo,Monaco,Consolas,monospace;min-height:60px;padding:0;position:relative} +.log-header{margin-bottom:3px} +.log-header label{margin-bottom:0} +.log-header .dash{color:#999;margin:0 2px} +.log-header .log-timestamps{color:#999;display:block} +@media (min-width:768px){.log-header .log-status{display:inline-block} +.log-header .log-timestamps{font-size:84%;display:inline-block;margin-left:3px} +.log-header .log-actions{float:right!important;float:right;margin-left:5px} +} +.log-size-warning{margin:0} +.log-view{background-color:#101214;font-family:Menlo,Monaco,Consolas,monospace;position:relative} +.log-end-msg,.log-view .log-scroll a{font-family:"Open Sans",Helvetica,Arial,sans-serif} .log-view pre,.log-view pre code{background-color:transparent;border:0;margin-bottom:0;overflow:visible;padding:0 10px} .log-view .log-scroll{background-color:#101214;border:1px solid #272b30;display:inline-block} .log-view .log-scroll:hover{border-color:#32383f} -.log-view .log-scroll a{display:inline-block;font-family:"Open Sans",Helvetica,Arial,sans-serif;font-size:12px;padding:4px 10px} +.log-view .log-scroll a{display:inline-block;font-size:12px;padding:4px 10px} .log-view .log-scroll a:focus,.log-view .log-scroll a:hover{background-color:#000;color:#16bfff;text-decoration:none} .log-view .log-scroll-top{position:absolute;right:0;border-right:0;border-top:0} .log-view .log-scroll-top.affix-top{position:absolute;right:0;top:0} .log-view .log-scroll-top.affix{position:fixed;right:20px;top:0} .log-view .log-scroll-top.affix.target-logger-node{position:fixed;right:45px;top:60px!important} .log-view .log-scroll-bottom{position:absolute;border-bottom:0;border-right:0;bottom:0;right:0} -.log-view .log-view-output{font-size:11px;padding:30px 0} +.log-view .log-view-output{font-size:11px;padding:40px 0} @media (min-width:768px){.log-view .log-view-output{font-size:12px} } -.log-view .log-view-output .ellipsis-loader{margin-top:30px} +@media only screen and (max-device-width:736px) and (-webkit-min-device-pixel-ratio:0){.log-view .log-view-output{padding-bottom:70px} +} .log-view .log-view-output table{table-layout:fixed;width:100%} +.log-view .log-view-output .ellipsis-loader{position:absolute;bottom:10px;margin-left:auto;margin-right:auto;left:0;right:0} +.log-end-msg{font-size:12px;color:#72767b;position:absolute;bottom:5px;left:10px} .chromeless .log-scroll-top.affix{right:0px} .chromeless .log-scroll-top.affix.target-logger-node{right:10px} .log-link-external a{margin-left:20px;margin-right:10px;white-space:nowrap}