mirror of
https://github.com/netdata/netdata.git
synced 2025-04-25 13:33:48 +00:00
builat
Chris Akritidis
parent
77e830ad95
commit
d96b649d6e
3 changed files with 196 additions and 211 deletions
web/gui
|
|
@ -16,23 +16,6 @@
|
|||
<link rel="stylesheet" type="text/css" href="main.css?v=5">
|
||||
|
||||
<link rel="icon" href="data:image/x-icon;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAP9JREFUeNpiYBgFo+A/w34gpiZ8DzWzAYgNiHGAA5UdgA73g+2gcyhgg/0DGQoweB6IBQYyFCCOGOBQwBMd/xnW09ERDtgcoEBHB+zHFQrz6egIBUasocDAcJ9OxWAhE4YQI8MDILmATg7wZ8QRDfQKhQf4Cie6pAVGPA4AhQKo0BCgZRAw4ZSBpIWJNI6CD4wEKikBaFqgVSgcYMIrzcjwgcahcIGRiPYCLUPBkNhWUwP9akVcoQBpatG4MsLviAIqWj6f3Absfdq2igg7IIEKDVQKEzN5ofAenJCp1I8gJRTug5tfkGIdR1FDniMI+QZUjF8Amn5htOdHCAAEGACE6B0cS6mrEwAAAABJRU5ErkJggg==" />
|
||||
<!-- <link rel="apple-touch-icon" sizes="57x57" href="images/apple-icon-57x57.png">
|
||||
<link rel="apple-touch-icon" sizes="60x60" href="images/apple-icon-60x60.png">
|
||||
<link rel="apple-touch-icon" sizes="72x72" href="images/apple-icon-72x72.png">
|
||||
<link rel="apple-touch-icon" sizes="76x76" href="images/apple-icon-76x76.png">
|
||||
<link rel="apple-touch-icon" sizes="114x114" href="images/apple-icon-114x114.png">
|
||||
<link rel="apple-touch-icon" sizes="120x120" href="images/apple-icon-120x120.png">
|
||||
<link rel="apple-touch-icon" sizes="144x144" href="images/apple-icon-144x144.png">
|
||||
<link rel="apple-touch-icon" sizes="152x152" href="images/apple-icon-152x152.png">
|
||||
<link rel="apple-touch-icon" sizes="180x180" href="images/apple-icon-180x180.png">
|
||||
<link rel="icon" type="image/png" sizes="192x192" href="images/android-icon-192x192.png">
|
||||
<link rel="icon" type="image/png" sizes="32x32" href="images/favicon-32x32.png">
|
||||
<link rel="icon" type="image/png" sizes="96x96" href="images/favicon-96x96.png">
|
||||
<link rel="icon" type="image/png" sizes="16x16" href="images/favicon-16x16.png">
|
||||
<link rel="manifest" href="manifest.json">
|
||||
<meta name="msapplication-TileColor" content="#ffffff">
|
||||
<meta name="msapplication-TileImage" content="images/ms-icon-144x144.png">
|
||||
<meta name="theme-color" content="#ffffff"> -->
|
||||
|
||||
<meta property="og:locale" content="en_US" />
|
||||
<meta property="og:url" content="https://my-netdata.io" />
|
||||
|
|
@ -80,23 +63,6 @@
|
|||
</script>
|
||||
<nav class="navbar navbar-default navbar-fixed-top" role="banner">
|
||||
<div class="container">
|
||||
<!-- <nav id="mynetdata_nav" class="collapse navbar-collapse navbar-left" role="navigation" style="padding-right: 20px;">
|
||||
<ul class="nav navbar-nav">
|
||||
<li data-placement="right" style="line-height: 50px; margin-right: 15px" title="Netdata Agent">
|
||||
<img src="images/netdata-logomark.svg" height="32"/>
|
||||
</li>
|
||||
<li class="dropdown" id="myNetdataDropdownParent" title="your other netdata servers" data-toggle="tooltip" data-placement="right">
|
||||
<a href="#" id="hostname" class="dropdown-toggle" data-toggle="dropdown">my-netdata <strong class="caret"></strong></a>
|
||||
<div id="my-netdata-dropdown-content" class="dropdown-menu scrollable-menu inpagemenu">
|
||||
<div class="agent-item" style="white-space: nowrap">
|
||||
<i class="fas fa-hourglass-half"></i>
|
||||
Loading, please wait...
|
||||
<div></div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</nav> -->
|
||||
<div class="navbar-header">
|
||||
<button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".navbar-collapse">
|
||||
<span class="sr-only">Toggle navigation</span>
|
||||
|
|
@ -104,13 +70,14 @@
|
|||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</button>
|
||||
<!-- <a href="/" class="navbar-brand" id="1hostname" title="server hostname<br/>click it to reload the dashboard" data-toggle="tooltip" data-placement="bottom">netdata</a> -->
|
||||
<ul class="nav navbar-nav" style="display: inline-block">
|
||||
<li data-placement="right" class="hidden-xs hidden-sm" style="line-height: 50px; margin-right: 15px" title="Netdata Agent">
|
||||
<img src="images/netdata-logomark.svg" height="32"/>
|
||||
</li>
|
||||
<li class="dropdown" id="myNetdataDropdownParent" title="your other netdata servers" data-toggle="tooltip" data-placement="right">
|
||||
<a href="#" id="hostname" class="dropdown-toggle" data-toggle="dropdown">my-netdata <strong class="caret"></strong></a>
|
||||
<a href="#" id="hostname" class="dropdown-toggle" data-toggle="dropdown">
|
||||
my-netdata
|
||||
<strong class="caret"></strong></a>
|
||||
<div id="my-netdata-dropdown-content" class="dropdown-menu scrollable-menu inpagemenu">
|
||||
<div class="agent-item" style="white-space: nowrap">
|
||||
<i class="fas fa-hourglass-half"></i>
|
||||
|
|
@ -135,26 +102,6 @@
|
|||
<li title="print this dashboard to PDF" data-toggle="tooltip" data-placement="bottom" id="printButton"><a href="#" class="btn" data-toggle="modal" data-target="#printPreflightModal"><i class="fas fa-print"></i> <span class="hidden-sm hidden-md hidden-lg">Print</span></a></li>
|
||||
<li title="get help on using the charts" data-toggle="tooltip" data-placement="bottom" class="hidden-sm"><a href="#" class="btn" data-toggle="modal" data-target="#helpModal"><i class="fas fa-question-circle"></i> <span class="hidden-sm hidden-md">Help</span></a></li>
|
||||
<li id="account-menu-container" class="dropdown" data-toggle="tooltip"></li>
|
||||
<!--
|
||||
<li class="dropdown hidden-sm hidden-md hidden-lg" id="myNetdataDropdownParent" title="your other netdata servers" data-toggle="tooltip" data-placement="right">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">my-netdata <strong class="caret"></strong></a>
|
||||
<div id="my-netdata-dropdown-content" class="dropdown-menu scrollable-menu inpagemenu">
|
||||
<div class="agent-item" style="white-space: nowrap">
|
||||
<i class="fas fa-hourglass-half"></i>
|
||||
Loading, please wait...
|
||||
<div></div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
-->
|
||||
<!--
|
||||
<li class="dropdown hidden-sm hidden-md hidden-lg">
|
||||
<a href="#" class="dropdown-toggle" data-toggle="dropdown">My Nodes <strong class="caret"></strong></a>
|
||||
<ul id="mynetdata_servers2" class="dropdown-menu scrollable-menu inpagemenu" role="menu">
|
||||
<li><a href="#" onclick="return false;" style="color: #999;">loading...</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
-->
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
|
|
|
|||
344
web/gui/main.css
344
web/gui/main.css
|
|
@ -151,12 +151,6 @@ body.modal-open {
|
|||
/*width: 220px;*/
|
||||
}
|
||||
|
||||
/*
|
||||
.affix-top {
|
||||
width: 220px;
|
||||
}
|
||||
*/
|
||||
|
||||
.dashboard-sidebar {
|
||||
max-height: calc(100% - 70px) !important;
|
||||
overflow-y: auto;
|
||||
|
|
@ -168,12 +162,6 @@ body.modal-open {
|
|||
position: static;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.dashboard-sidebar {
|
||||
padding-left: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
/* First level of nav */
|
||||
.dashboard-sidenav {
|
||||
margin-top: 20px;
|
||||
|
|
@ -353,146 +341,6 @@ body.modal-open {
|
|||
user-select: none;
|
||||
}
|
||||
|
||||
@media print {
|
||||
body {
|
||||
overflow: visible !important;
|
||||
-webkit-print-color-adjust: exact;
|
||||
page-break-inside: auto;
|
||||
page-break-before: auto;
|
||||
page-break-after: auto;
|
||||
}
|
||||
|
||||
.dashboard-section {
|
||||
page-break-inside: auto;
|
||||
page-break-before: auto;
|
||||
page-break-after: auto;
|
||||
}
|
||||
|
||||
.dashboard-subsection {
|
||||
page-break-before: avoid;
|
||||
page-break-after: auto;
|
||||
page-break-inside: auto;
|
||||
}
|
||||
|
||||
.charts-body {
|
||||
padding-left: 0%;
|
||||
padding-right: 0%;
|
||||
display: block;
|
||||
page-break-inside: auto;
|
||||
page-break-before: auto;
|
||||
page-break-after: auto;
|
||||
}
|
||||
|
||||
.back-to-top,
|
||||
.dashboard-theme-toggle {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.charts-body {
|
||||
padding-left: 0%;
|
||||
padding-right: 0%;
|
||||
}
|
||||
|
||||
.back-to-top,
|
||||
.dashboard-theme-toggle {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
/* Show and affix the side nav when space allows it */
|
||||
@media (min-width: 992px) {
|
||||
.container {
|
||||
padding-left: 0% !important;
|
||||
}
|
||||
|
||||
.charts-body {
|
||||
width: calc(100% - 213px) !important;
|
||||
padding-left: 1% !important;
|
||||
padding-right: 0% !important;
|
||||
}
|
||||
|
||||
.sidebar-body {
|
||||
display: inline-block !important;
|
||||
width: 213px !important;
|
||||
}
|
||||
|
||||
.dashboard-sidebar .nav > .active > ul {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* Widen the fixed sidebar */
|
||||
.dashboard-sidebar.affix,
|
||||
.dashboard-sidebar.affix-top,
|
||||
.dashboard-sidebar.affix-bottom {
|
||||
width: 213px !important;
|
||||
}
|
||||
|
||||
.dashboard-sidebar.affix {
|
||||
position: fixed; /* Undo the static from mobile first approach */
|
||||
top: 20px;
|
||||
}
|
||||
|
||||
.dashboard-sidebar.affix-bottom {
|
||||
position: absolute; /* Undo the static from mobile first approach */
|
||||
}
|
||||
|
||||
.dashboard-sidebar.affix-bottom .dashboard-sidenav,
|
||||
.dashboard-sidebar.affix .dashboard-sidenav {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
.container {
|
||||
padding-left: 2% !important;
|
||||
}
|
||||
|
||||
.charts-body {
|
||||
width: calc(100% - 233px) !important;
|
||||
padding-left: 1% !important;
|
||||
padding-right: 1% !important;
|
||||
}
|
||||
|
||||
.sidebar-body {
|
||||
display: inline-block !important;
|
||||
width: 233px !important;
|
||||
}
|
||||
|
||||
/* Widen the fixed sidebar again */
|
||||
.dashboard-sidebar.affix,
|
||||
.dashboard-sidebar.affix-top,
|
||||
.dashboard-sidebar.affix-bottom {
|
||||
width: 233px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1360px) {
|
||||
.container {
|
||||
padding-left: 3% !important;
|
||||
}
|
||||
|
||||
.charts-body {
|
||||
width: calc(100% - 263px) !important;
|
||||
padding-left: 1% !important;
|
||||
padding-right: 2% !important;
|
||||
}
|
||||
|
||||
.sidebar-body {
|
||||
display: inline-block !important;
|
||||
width: 263px !important;
|
||||
}
|
||||
|
||||
/* Widen the fixed sidebar again */
|
||||
.dashboard-sidebar.affix,
|
||||
.dashboard-sidebar.affix-top,
|
||||
.dashboard-sidebar.affix-bottom {
|
||||
width: 263px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.action-button {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
|
|
@ -664,8 +512,23 @@ body.modal-open {
|
|||
right: 19px;
|
||||
}
|
||||
|
||||
#myNetdataDropdownParent {
|
||||
float: left;
|
||||
}
|
||||
|
||||
#hostname {
|
||||
font-size: 18px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
max-width: 220px;
|
||||
}
|
||||
|
||||
#hostnametext {
|
||||
white-space: pre;
|
||||
float: left;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
max-width: 160px;
|
||||
}
|
||||
|
||||
.sign-in-btn {
|
||||
|
|
@ -718,3 +581,180 @@ body.modal-open {
|
|||
.beta {
|
||||
color:#FFCC00;
|
||||
}
|
||||
|
||||
|
||||
@media (min-width: 1400px) {
|
||||
#hostname {
|
||||
max-width: 600px !important;
|
||||
}
|
||||
|
||||
#hostnametext {
|
||||
max-width: 540px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1360px) {
|
||||
.container {
|
||||
padding-left: 3% !important;
|
||||
}
|
||||
|
||||
#hostname {
|
||||
max-width: 280px !important;
|
||||
}
|
||||
|
||||
#hostnametext {
|
||||
max-width: 220px !important;
|
||||
}
|
||||
|
||||
.charts-body {
|
||||
width: calc(100% - 263px) !important;
|
||||
padding-left: 1% !important;
|
||||
padding-right: 2% !important;
|
||||
}
|
||||
|
||||
.sidebar-body {
|
||||
display: inline-block !important;
|
||||
width: 263px !important;
|
||||
}
|
||||
|
||||
/* Widen the fixed sidebar again */
|
||||
.dashboard-sidebar.affix,
|
||||
.dashboard-sidebar.affix-top,
|
||||
.dashboard-sidebar.affix-bottom {
|
||||
width: 263px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
#hostname {
|
||||
max-width: 100px;
|
||||
}
|
||||
|
||||
#hostnametext {
|
||||
max-width: 40px;
|
||||
}
|
||||
.container {
|
||||
padding-left: 2% !important;
|
||||
}
|
||||
|
||||
|
||||
.charts-body {
|
||||
width: calc(100% - 233px) !important;
|
||||
padding-left: 1% !important;
|
||||
padding-right: 1% !important;
|
||||
}
|
||||
|
||||
.sidebar-body {
|
||||
display: inline-block !important;
|
||||
width: 233px !important;
|
||||
}
|
||||
|
||||
/* Widen the fixed sidebar again */
|
||||
.dashboard-sidebar.affix,
|
||||
.dashboard-sidebar.affix-top,
|
||||
.dashboard-sidebar.affix-bottom {
|
||||
width: 233px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.container {
|
||||
padding-left: 0% !important;
|
||||
}
|
||||
|
||||
.charts-body {
|
||||
width: calc(100% - 213px) !important;
|
||||
padding-left: 1% !important;
|
||||
padding-right: 0% !important;
|
||||
}
|
||||
|
||||
.sidebar-body {
|
||||
display: inline-block !important;
|
||||
width: 213px !important;
|
||||
}
|
||||
|
||||
.dashboard-sidebar .nav > .active > ul {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* Widen the fixed sidebar */
|
||||
.dashboard-sidebar.affix,
|
||||
.dashboard-sidebar.affix-top,
|
||||
.dashboard-sidebar.affix-bottom {
|
||||
width: 213px !important;
|
||||
}
|
||||
|
||||
.dashboard-sidebar.affix {
|
||||
position: fixed; /* Undo the static from mobile first approach */
|
||||
top: 20px;
|
||||
}
|
||||
|
||||
.dashboard-sidebar.affix-bottom {
|
||||
position: absolute; /* Undo the static from mobile first approach */
|
||||
}
|
||||
|
||||
.dashboard-sidebar.affix-bottom .dashboard-sidenav,
|
||||
.dashboard-sidebar.affix .dashboard-sidenav {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 860px) {
|
||||
.dashboard-sidebar {
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.dashboard-sidebar {
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
.charts-body {
|
||||
padding-left: 0%;
|
||||
padding-right: 0%;
|
||||
}
|
||||
|
||||
.back-to-top,
|
||||
.dashboard-theme-toggle {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
@media print {
|
||||
body {
|
||||
overflow: visible !important;
|
||||
-webkit-print-color-adjust: exact;
|
||||
page-break-inside: auto;
|
||||
page-break-before: auto;
|
||||
page-break-after: auto;
|
||||
}
|
||||
|
||||
.dashboard-section {
|
||||
page-break-inside: auto;
|
||||
page-break-before: auto;
|
||||
page-break-after: auto;
|
||||
}
|
||||
|
||||
.dashboard-subsection {
|
||||
page-break-before: avoid;
|
||||
page-break-after: auto;
|
||||
page-break-inside: auto;
|
||||
}
|
||||
|
||||
.charts-body {
|
||||
padding-left: 0%;
|
||||
padding-right: 0%;
|
||||
display: block;
|
||||
page-break-inside: auto;
|
||||
page-break-before: auto;
|
||||
page-break-after: auto;
|
||||
}
|
||||
|
||||
.back-to-top,
|
||||
.dashboard-theme-toggle {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1775,8 +1775,6 @@ function renderPage(menus, data) {
|
|||
if (urlOptions.mode === 'print') {
|
||||
chtml += '</div>';
|
||||
}
|
||||
|
||||
// console.log(' \------- ' + chart.id + ' (' + chart.priority + '): ' + chart.context + ' height: ' + menus[menu].submenus[submenu].height);
|
||||
}
|
||||
|
||||
head += '</div>';
|
||||
|
|
@ -2747,7 +2745,7 @@ function initializeDynamicDashboardWithData(data) {
|
|||
}
|
||||
|
||||
// update the dashboard hostname
|
||||
document.getElementById('hostname').innerHTML = options.hostname + ((netdataSnapshotData !== null) ? ' (snap)' : '').toString() + ' <strong class="caret">';
|
||||
document.getElementById('hostname').innerHTML = '<span id="hostnametext">' + options.hostname + ((netdataSnapshotData !== null) ? ' (snap)' : '').toString() + '</span> <strong class="caret">';
|
||||
document.getElementById('hostname').href = NETDATA.serverDefault;
|
||||
document.getElementById('netdataVersion').innerHTML = options.version;
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue