diff --git a/glances/outputs/bottle/base.tpl b/glances/outputs/bottle/base.tpl new file mode 100644 index 00000000..c0fec737 --- /dev/null +++ b/glances/outputs/bottle/base.tpl @@ -0,0 +1,59 @@ + + + + + + + Glances + + + + + + +
+
+
+
+ % include('plugin_text', plugin_name="system", stats=stats['system']) +
+
+ % include('plugin_text', plugin_name="uptime", stats=stats['uptime']) +
+
+
+
+
+ % include('plugin_table', plugin_name="cpu", stats=stats['cpu']) +
+
+ % include('plugin_table', plugin_name="load", stats=stats['load']) +
+
+ % include('plugin_table', plugin_name="mem", stats=stats['mem']) +
+
+ % include('plugin_table', plugin_name="memswap", stats=stats['memswap']) +
+
+
+
+ % include('plugin_table', plugin_name="network", stats=stats['network']) + % include('plugin_table', plugin_name="diskio", stats=stats['diskio']) + % include('plugin_table', plugin_name="fs", stats=stats['fs']) + % include('plugin_table', plugin_name="sensors", stats=stats['sensors']) +
+
+ % include('plugin_table', plugin_name="alert", stats=stats['alert']) + % include('plugin_text', plugin_name="processcount", stats=stats['processcount']) +
+
+ % include('plugin_table', plugin_name="monitor", stats=stats['monitor']) +
+
+ % include('plugin_table', plugin_name="processlist", stats=stats['processlist']) +
+
+
+ + \ No newline at end of file diff --git a/glances/outputs/bottle/footer.tpl b/glances/outputs/bottle/footer.tpl deleted file mode 100644 index 8e71992e..00000000 --- a/glances/outputs/bottle/footer.tpl +++ /dev/null @@ -1,4 +0,0 @@ - - - \ No newline at end of file diff --git a/glances/outputs/bottle/header.tpl b/glances/outputs/bottle/header.tpl deleted file mode 100644 index 59eb928a..00000000 --- a/glances/outputs/bottle/header.tpl +++ /dev/null @@ -1,11 +0,0 @@ - - - - - -Glances - - - - - diff --git a/glances/outputs/bottle/newline.tpl b/glances/outputs/bottle/newline.tpl deleted file mode 100644 index 021d9935..00000000 --- a/glances/outputs/bottle/newline.tpl +++ /dev/null @@ -1 +0,0 @@ -
diff --git a/glances/outputs/bottle/plugin_table.tpl b/glances/outputs/bottle/plugin_table.tpl new file mode 100644 index 00000000..e49bc368 --- /dev/null +++ b/glances/outputs/bottle/plugin_table.tpl @@ -0,0 +1,30 @@ +% if stats['msgdict'] != []: +
+ + + + % for msg in stats['msgdict']: + % if msg['msg'].startswith('\n'): + + + % else: + % if stats['display']: + % if plugin_name == 'processlist': + % if not msg['splittable'] or msg['splittable'] and msg['decoration'] == 'PROCESS': + + % end + % else: + + % end + % end + % end + % end + + +
+ {{ msg['msg'] }} + + {{ msg['msg'] }} +
+
+% end \ No newline at end of file diff --git a/glances/outputs/bottle/plugin_text.tpl b/glances/outputs/bottle/plugin_text.tpl new file mode 100644 index 00000000..990e7478 --- /dev/null +++ b/glances/outputs/bottle/plugin_text.tpl @@ -0,0 +1,11 @@ +% if stats['msgdict'] != []: +
+% for msg in stats['msgdict']: + % if stats['display']: + + {{ msg['msg'] }} + + % end +% end +
+% end \ No newline at end of file diff --git a/glances/outputs/glances_bottle.py b/glances/outputs/glances_bottle.py index 9f456fe5..35214139 100644 --- a/glances/outputs/glances_bottle.py +++ b/glances/outputs/glances_bottle.py @@ -56,27 +56,6 @@ class GlancesBottle(object): # Path where the statics files are stored self.STATIC_PATH = os.path.join(os.path.dirname(os.path.realpath(__file__)), 'static') - # Define the style (CSS) list (hash table) for stats - self.__style_list = { - 'DEFAULT': '', - 'UNDERLINE': 'underline', - 'BOLD': 'bold', - 'SORT': 'sort', - 'OK': 'ok', - 'FILTER': 'filter', - 'TITLE': 'title', - 'CAREFUL': 'careful', - 'WARNING': 'warning', - 'CRITICAL': 'critical', - 'OK_LOG': 'ok_log', - 'CAREFUL_LOG': 'careful_log', - 'WARNING_LOG': 'warning_log', - 'CRITICAL_LOG': 'critical_log', - 'NICE': 'nice', - 'STATUS': 'status', - 'PROCESS': '' - } - def _route(self): """Define route.""" self._app.route('/', method="GET", callback=self._index) @@ -269,78 +248,23 @@ class GlancesBottle(object): stats: Stats database to display """ - html = template('header', refresh_time=refresh_time) - html += '
' - html += self.display_plugin('system', self.stats.get_plugin('system').get_stats_display(args=self.args)) - html += self.display_plugin('uptime', self.stats.get_plugin('uptime').get_stats_display(args=self.args)) - html += '
' - html += template('newline') - html += '
' - html += self.display_plugin('cpu', self.stats.get_plugin('cpu').get_stats_display(args=self.args)) - load_msg = self.stats.get_plugin('load').get_stats_display(args=self.args) - if load_msg['msgdict'] != []: - # Load is not available on all OS - # Only display if stat is available - html += self.display_plugin('load', load_msg) - html += self.display_plugin('mem', self.stats.get_plugin('mem').get_stats_display(args=self.args)) - html += self.display_plugin('memswap', self.stats.get_plugin('memswap').get_stats_display(args=self.args)) - html += '
' - html += template('newline') - html += '
' - html += '' - html += '
' - html += self.display_plugin('alert', self.stats.get_plugin('alert').get_stats_display(args=self.args)) - html += self.display_plugin('processcount', self.stats.get_plugin('processcount').get_stats_display(args=self.args)) - html += self.display_plugin('monitor', self.stats.get_plugin('monitor').get_stats_display(args=self.args)) - html += self.display_plugin('processlist', self.stats.get_plugin('processlist').get_stats_display(args=self.args)) - html += '
' - html += '
' - html += template('newline') - html += template('footer') - return html + stats = { + 'system': self.stats.get_plugin('system').get_stats_display(args=self.args), + 'uptime': self.stats.get_plugin('uptime').get_stats_display(args=self.args), + 'cpu': self.stats.get_plugin('cpu').get_stats_display(args=self.args), + 'load': self.stats.get_plugin('load').get_stats_display(args=self.args), + 'mem': self.stats.get_plugin('mem').get_stats_display(args=self.args), + 'memswap': self.stats.get_plugin('memswap').get_stats_display(args=self.args), + 'network': self.stats.get_plugin('network').get_stats_display(args=self.args), + 'diskio': self.stats.get_plugin('diskio').get_stats_display(args=self.args), + 'fs': self.stats.get_plugin('fs').get_stats_display(args=self.args), + 'raid': self.stats.get_plugin('raid').get_stats_display(args=self.args), + 'sensors': self.stats.get_plugin('sensors').get_stats_display(args=self.args), + 'alert': self.stats.get_plugin('alert').get_stats_display(args=self.args), + 'processcount': self.stats.get_plugin('processcount').get_stats_display(args=self.args), + 'monitor': self.stats.get_plugin('monitor').get_stats_display(args=self.args), + 'processlist': self.stats.get_plugin('processlist').get_stats_display(args=self.args) + } - def display_plugin(self, plugin_name, plugin_stats): - """Generate the Bottle template for the plugin_stats.""" - # Template header - tpl = """ \ - %#Template for Bottle - """ - tpl += '
' % plugin_name - - tpl += '
' - tpl += '
' - for m in plugin_stats['msgdict']: - # New line - if m['msg'].startswith('\n'): - tpl += '
' - tpl += '
' - continue - if plugin_name == 'processlist' and m['splittable']: - # Processlist: Display first 20 chars of the process name - if m['msg'].split(' ', 1)[0] != '': - tpl += ' %s' % \ - (self.__style_list[m['decoration']], - m['msg'].split(' ', 1)[0].replace(' ', ' ')[:20]) - elif m['optional']: - # Manage optional stats (responsive design) - tpl += '%s' % \ - (self.__style_list[m['decoration']], m['msg'].replace(' ', ' ')) - else: - # Display stat - tpl += '%s' % \ - (self.__style_list[m['decoration']], m['msg'].replace(' ', ' ')) - tpl += '
' - tpl += '
' - - tpl += """ \ -
- %#End Template for Bottle - """ - return template(tpl) + return template('base', refresh_time=refresh_time, stats=stats) diff --git a/glances/outputs/static/css/bootstrap.min.css b/glances/outputs/static/css/bootstrap.min.css new file mode 100644 index 00000000..4740475f --- /dev/null +++ b/glances/outputs/static/css/bootstrap.min.css @@ -0,0 +1,10 @@ +/*! + * Bootstrap v3.3.1 (http://getbootstrap.com) + * Copyright 2011-2014 Twitter, Inc. + * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) + */ + +/*! + * Generated using the Bootstrap Customizer (http://getbootstrap.com/customize/?id=ef7da19b0162dfe4a82a) + * Config saved to config.json and https://gist.github.com/ef7da19b0162dfe4a82a + *//*! normalize.css v3.0.2 | MIT License | git.io/normalize */html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:bold}dfn{font-style:italic}h1{font-size:2em;margin:0.67em 0}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-0.5em}sub{bottom:-0.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace, monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type="checkbox"],input[type="radio"]{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;padding:0}input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{height:auto}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em}legend{border:0;padding:0}textarea{overflow:auto}optgroup{font-weight:bold}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}*:before,*:after{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}html{font-size:10px;-webkit-tap-highlight-color:rgba(0,0,0,0)}body{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:14px;line-height:1.42857143;color:#333;background-color:#fff}input,button,select,textarea{font-family:inherit;font-size:inherit;line-height:inherit}a{color:#337ab7;text-decoration:none}a:hover,a:focus{color:#23527c;text-decoration:underline}a:focus{outline:thin dotted;outline:5px auto -webkit-focus-ring-color;outline-offset:-2px}figure{margin:0}img{vertical-align:middle}.img-responsive{display:block;max-width:100%;height:auto}.img-rounded{border-radius:6px}.img-thumbnail{padding:4px;line-height:1.42857143;background-color:#fff;border:1px solid #ddd;border-radius:4px;-webkit-transition:all .2s ease-in-out;-o-transition:all .2s ease-in-out;transition:all .2s ease-in-out;display:inline-block;max-width:100%;height:auto}.img-circle{border-radius:50%}hr{margin-top:20px;margin-bottom:20px;border:0;border-top:1px solid #eee}.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0, 0, 0, 0);border:0}.sr-only-focusable:active,.sr-only-focusable:focus{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto}.container{margin-right:auto;margin-left:auto;padding-left:15px;padding-right:15px}@media (min-width:768px){.container{width:750px}}@media (min-width:992px){.container{width:970px}}@media (min-width:1200px){.container{width:1170px}}.container-fluid{margin-right:auto;margin-left:auto;padding-left:15px;padding-right:15px}.row{margin-left:-15px;margin-right:-15px}.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12{position:relative;min-height:1px;padding-left:15px;padding-right:15px}.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12{float:left}.col-xs-12{width:100%}.col-xs-11{width:91.66666667%}.col-xs-10{width:83.33333333%}.col-xs-9{width:75%}.col-xs-8{width:66.66666667%}.col-xs-7{width:58.33333333%}.col-xs-6{width:50%}.col-xs-5{width:41.66666667%}.col-xs-4{width:33.33333333%}.col-xs-3{width:25%}.col-xs-2{width:16.66666667%}.col-xs-1{width:8.33333333%}.col-xs-pull-12{right:100%}.col-xs-pull-11{right:91.66666667%}.col-xs-pull-10{right:83.33333333%}.col-xs-pull-9{right:75%}.col-xs-pull-8{right:66.66666667%}.col-xs-pull-7{right:58.33333333%}.col-xs-pull-6{right:50%}.col-xs-pull-5{right:41.66666667%}.col-xs-pull-4{right:33.33333333%}.col-xs-pull-3{right:25%}.col-xs-pull-2{right:16.66666667%}.col-xs-pull-1{right:8.33333333%}.col-xs-pull-0{right:auto}.col-xs-push-12{left:100%}.col-xs-push-11{left:91.66666667%}.col-xs-push-10{left:83.33333333%}.col-xs-push-9{left:75%}.col-xs-push-8{left:66.66666667%}.col-xs-push-7{left:58.33333333%}.col-xs-push-6{left:50%}.col-xs-push-5{left:41.66666667%}.col-xs-push-4{left:33.33333333%}.col-xs-push-3{left:25%}.col-xs-push-2{left:16.66666667%}.col-xs-push-1{left:8.33333333%}.col-xs-push-0{left:auto}.col-xs-offset-12{margin-left:100%}.col-xs-offset-11{margin-left:91.66666667%}.col-xs-offset-10{margin-left:83.33333333%}.col-xs-offset-9{margin-left:75%}.col-xs-offset-8{margin-left:66.66666667%}.col-xs-offset-7{margin-left:58.33333333%}.col-xs-offset-6{margin-left:50%}.col-xs-offset-5{margin-left:41.66666667%}.col-xs-offset-4{margin-left:33.33333333%}.col-xs-offset-3{margin-left:25%}.col-xs-offset-2{margin-left:16.66666667%}.col-xs-offset-1{margin-left:8.33333333%}.col-xs-offset-0{margin-left:0}@media (min-width:768px){.col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12{float:left}.col-sm-12{width:100%}.col-sm-11{width:91.66666667%}.col-sm-10{width:83.33333333%}.col-sm-9{width:75%}.col-sm-8{width:66.66666667%}.col-sm-7{width:58.33333333%}.col-sm-6{width:50%}.col-sm-5{width:41.66666667%}.col-sm-4{width:33.33333333%}.col-sm-3{width:25%}.col-sm-2{width:16.66666667%}.col-sm-1{width:8.33333333%}.col-sm-pull-12{right:100%}.col-sm-pull-11{right:91.66666667%}.col-sm-pull-10{right:83.33333333%}.col-sm-pull-9{right:75%}.col-sm-pull-8{right:66.66666667%}.col-sm-pull-7{right:58.33333333%}.col-sm-pull-6{right:50%}.col-sm-pull-5{right:41.66666667%}.col-sm-pull-4{right:33.33333333%}.col-sm-pull-3{right:25%}.col-sm-pull-2{right:16.66666667%}.col-sm-pull-1{right:8.33333333%}.col-sm-pull-0{right:auto}.col-sm-push-12{left:100%}.col-sm-push-11{left:91.66666667%}.col-sm-push-10{left:83.33333333%}.col-sm-push-9{left:75%}.col-sm-push-8{left:66.66666667%}.col-sm-push-7{left:58.33333333%}.col-sm-push-6{left:50%}.col-sm-push-5{left:41.66666667%}.col-sm-push-4{left:33.33333333%}.col-sm-push-3{left:25%}.col-sm-push-2{left:16.66666667%}.col-sm-push-1{left:8.33333333%}.col-sm-push-0{left:auto}.col-sm-offset-12{margin-left:100%}.col-sm-offset-11{margin-left:91.66666667%}.col-sm-offset-10{margin-left:83.33333333%}.col-sm-offset-9{margin-left:75%}.col-sm-offset-8{margin-left:66.66666667%}.col-sm-offset-7{margin-left:58.33333333%}.col-sm-offset-6{margin-left:50%}.col-sm-offset-5{margin-left:41.66666667%}.col-sm-offset-4{margin-left:33.33333333%}.col-sm-offset-3{margin-left:25%}.col-sm-offset-2{margin-left:16.66666667%}.col-sm-offset-1{margin-left:8.33333333%}.col-sm-offset-0{margin-left:0}}@media (min-width:992px){.col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12{float:left}.col-md-12{width:100%}.col-md-11{width:91.66666667%}.col-md-10{width:83.33333333%}.col-md-9{width:75%}.col-md-8{width:66.66666667%}.col-md-7{width:58.33333333%}.col-md-6{width:50%}.col-md-5{width:41.66666667%}.col-md-4{width:33.33333333%}.col-md-3{width:25%}.col-md-2{width:16.66666667%}.col-md-1{width:8.33333333%}.col-md-pull-12{right:100%}.col-md-pull-11{right:91.66666667%}.col-md-pull-10{right:83.33333333%}.col-md-pull-9{right:75%}.col-md-pull-8{right:66.66666667%}.col-md-pull-7{right:58.33333333%}.col-md-pull-6{right:50%}.col-md-pull-5{right:41.66666667%}.col-md-pull-4{right:33.33333333%}.col-md-pull-3{right:25%}.col-md-pull-2{right:16.66666667%}.col-md-pull-1{right:8.33333333%}.col-md-pull-0{right:auto}.col-md-push-12{left:100%}.col-md-push-11{left:91.66666667%}.col-md-push-10{left:83.33333333%}.col-md-push-9{left:75%}.col-md-push-8{left:66.66666667%}.col-md-push-7{left:58.33333333%}.col-md-push-6{left:50%}.col-md-push-5{left:41.66666667%}.col-md-push-4{left:33.33333333%}.col-md-push-3{left:25%}.col-md-push-2{left:16.66666667%}.col-md-push-1{left:8.33333333%}.col-md-push-0{left:auto}.col-md-offset-12{margin-left:100%}.col-md-offset-11{margin-left:91.66666667%}.col-md-offset-10{margin-left:83.33333333%}.col-md-offset-9{margin-left:75%}.col-md-offset-8{margin-left:66.66666667%}.col-md-offset-7{margin-left:58.33333333%}.col-md-offset-6{margin-left:50%}.col-md-offset-5{margin-left:41.66666667%}.col-md-offset-4{margin-left:33.33333333%}.col-md-offset-3{margin-left:25%}.col-md-offset-2{margin-left:16.66666667%}.col-md-offset-1{margin-left:8.33333333%}.col-md-offset-0{margin-left:0}}@media (min-width:1200px){.col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12{float:left}.col-lg-12{width:100%}.col-lg-11{width:91.66666667%}.col-lg-10{width:83.33333333%}.col-lg-9{width:75%}.col-lg-8{width:66.66666667%}.col-lg-7{width:58.33333333%}.col-lg-6{width:50%}.col-lg-5{width:41.66666667%}.col-lg-4{width:33.33333333%}.col-lg-3{width:25%}.col-lg-2{width:16.66666667%}.col-lg-1{width:8.33333333%}.col-lg-pull-12{right:100%}.col-lg-pull-11{right:91.66666667%}.col-lg-pull-10{right:83.33333333%}.col-lg-pull-9{right:75%}.col-lg-pull-8{right:66.66666667%}.col-lg-pull-7{right:58.33333333%}.col-lg-pull-6{right:50%}.col-lg-pull-5{right:41.66666667%}.col-lg-pull-4{right:33.33333333%}.col-lg-pull-3{right:25%}.col-lg-pull-2{right:16.66666667%}.col-lg-pull-1{right:8.33333333%}.col-lg-pull-0{right:auto}.col-lg-push-12{left:100%}.col-lg-push-11{left:91.66666667%}.col-lg-push-10{left:83.33333333%}.col-lg-push-9{left:75%}.col-lg-push-8{left:66.66666667%}.col-lg-push-7{left:58.33333333%}.col-lg-push-6{left:50%}.col-lg-push-5{left:41.66666667%}.col-lg-push-4{left:33.33333333%}.col-lg-push-3{left:25%}.col-lg-push-2{left:16.66666667%}.col-lg-push-1{left:8.33333333%}.col-lg-push-0{left:auto}.col-lg-offset-12{margin-left:100%}.col-lg-offset-11{margin-left:91.66666667%}.col-lg-offset-10{margin-left:83.33333333%}.col-lg-offset-9{margin-left:75%}.col-lg-offset-8{margin-left:66.66666667%}.col-lg-offset-7{margin-left:58.33333333%}.col-lg-offset-6{margin-left:50%}.col-lg-offset-5{margin-left:41.66666667%}.col-lg-offset-4{margin-left:33.33333333%}.col-lg-offset-3{margin-left:25%}.col-lg-offset-2{margin-left:16.66666667%}.col-lg-offset-1{margin-left:8.33333333%}.col-lg-offset-0{margin-left:0}}.clearfix:before,.clearfix:after,.container:before,.container:after,.container-fluid:before,.container-fluid:after,.row:before,.row:after{content:" ";display:table}.clearfix:after,.container:after,.container-fluid:after,.row:after{clear:both}.center-block{display:block;margin-left:auto;margin-right:auto}.pull-right{float:right !important}.pull-left{float:left !important}.hide{display:none !important}.show{display:block !important}.invisible{visibility:hidden}.text-hide{font:0/0 a;color:transparent;text-shadow:none;background-color:transparent;border:0}.hidden{display:none !important;visibility:hidden !important}.affix{position:fixed}@-ms-viewport{width:device-width}.visible-xs,.visible-sm,.visible-md,.visible-lg{display:none !important}.visible-xs-block,.visible-xs-inline,.visible-xs-inline-block,.visible-sm-block,.visible-sm-inline,.visible-sm-inline-block,.visible-md-block,.visible-md-inline,.visible-md-inline-block,.visible-lg-block,.visible-lg-inline,.visible-lg-inline-block{display:none !important}@media (max-width:767px){.visible-xs{display:block !important}table.visible-xs{display:table}tr.visible-xs{display:table-row !important}th.visible-xs,td.visible-xs{display:table-cell !important}}@media (max-width:767px){.visible-xs-block{display:block !important}}@media (max-width:767px){.visible-xs-inline{display:inline !important}}@media (max-width:767px){.visible-xs-inline-block{display:inline-block !important}}@media (min-width:768px) and (max-width:991px){.visible-sm{display:block !important}table.visible-sm{display:table}tr.visible-sm{display:table-row !important}th.visible-sm,td.visible-sm{display:table-cell !important}}@media (min-width:768px) and (max-width:991px){.visible-sm-block{display:block !important}}@media (min-width:768px) and (max-width:991px){.visible-sm-inline{display:inline !important}}@media (min-width:768px) and (max-width:991px){.visible-sm-inline-block{display:inline-block !important}}@media (min-width:992px) and (max-width:1199px){.visible-md{display:block !important}table.visible-md{display:table}tr.visible-md{display:table-row !important}th.visible-md,td.visible-md{display:table-cell !important}}@media (min-width:992px) and (max-width:1199px){.visible-md-block{display:block !important}}@media (min-width:992px) and (max-width:1199px){.visible-md-inline{display:inline !important}}@media (min-width:992px) and (max-width:1199px){.visible-md-inline-block{display:inline-block !important}}@media (min-width:1200px){.visible-lg{display:block !important}table.visible-lg{display:table}tr.visible-lg{display:table-row !important}th.visible-lg,td.visible-lg{display:table-cell !important}}@media (min-width:1200px){.visible-lg-block{display:block !important}}@media (min-width:1200px){.visible-lg-inline{display:inline !important}}@media (min-width:1200px){.visible-lg-inline-block{display:inline-block !important}}@media (max-width:767px){.hidden-xs{display:none !important}}@media (min-width:768px) and (max-width:991px){.hidden-sm{display:none !important}}@media (min-width:992px) and (max-width:1199px){.hidden-md{display:none !important}}@media (min-width:1200px){.hidden-lg{display:none !important}}.visible-print{display:none !important}@media print{.visible-print{display:block !important}table.visible-print{display:table}tr.visible-print{display:table-row !important}th.visible-print,td.visible-print{display:table-cell !important}}.visible-print-block{display:none !important}@media print{.visible-print-block{display:block !important}}.visible-print-inline{display:none !important}@media print{.visible-print-inline{display:inline !important}}.visible-print-inline-block{display:none !important}@media print{.visible-print-inline-block{display:inline-block !important}}@media print{.hidden-print{display:none !important}} \ No newline at end of file diff --git a/glances/outputs/static/css/style.css b/glances/outputs/static/css/style.css index 59c9ae80..3fcd08d5 100644 --- a/glances/outputs/static/css/style.css +++ b/glances/outputs/static/css/style.css @@ -2,162 +2,93 @@ body { background: black; color: #BBB; font-family: "Lucida Sans Typewriter", "Lucida Console", Monaco, "Bitstream Vera Sans Mono", monospace; - font-size: 100%; } -header,footer, -article,section, -hgroup,nav, -figure,div,aside { - display: block; +.plugin { + margin-bottom: 20px; } -section { - text-align: justify; -} -section > article { - display: inline-block; - vertical-align: top; - *display: inline; - zoom: 1; -} -section:after { - content: ""; +.plugin table { width: 100%; - display: inline-block; } -aside { - float: left; - margin-right: 2%; +.plugin table tr td:not(:first-child) { + text-align: right; } -div#newline{ - clear: both; - height: 1em; -} -#underline{ + +.underline{ text-decoration: underline } -#bold{ +.bold{ font-weight: bold; } -#sort{ +.sort{ font-weight: bold; } -#sort:after{ +.sort:after{ content: '\25BC' } -/*Theme*/ -#title{ +.text-right { + text-align: right; +} + +/* Theme */ + +.title{ font-weight: bold; color: white; } -#table { - display: table; -} -.row { - display: table-row; -} -.cell { - display: table-cell; -} -#ok { +.ok { color: green; } -#filter { +.filter { color: cyan; } -#ok_log { +.ok_log { background-color: green; color: white; } -#careful { +.careful { color: blueviolet; } -#careful_log { +.careful_log { background-color: blueviolet; color: white; } -#warning { +.warning { color: orange; } -#warning_log { +.warning_log { background-color: orange; color: white; } -#critical { +.critical { color: red; } -#critical_log { +.critical_log { background-color: red; color: white; } -#nice { +.nice { color: magenta; } -#status { +.status { color: green; } -/*Plugins*/ -#system { - float: left; +.process { + color: green; } -#uptime { - float: right; + +/* Plugins */ +#cpu table tr td:nth-child(3), +#mem table tr td:nth-child(3), +#monitor table tr td:nth-child(3) { + text-align: left; + padding-left: 20px; } -#cpu {} -#load {} -#mem {} -#memswap {} -#leftstats {} -#network { - margin-bottom: 1em; -} -#diskio { - margin-bottom: 1em; -} -#fs { - margin-bottom: 1em; -} -#raid { - margin-bottom: 1em; -} -#sensors {} -#rightstats {} -#alert { - display: block; -} -#processcount { - display: block; - margin: 1em; -} -#monitor { - display: block; - margin: 1em; -} -#processlist {} -/* -article#processlist>div>div>span:last-child { - visibility: hidden; +#processlist table tr td { + padding: 0px 5px 0px 5px; white-space: nowrap; + text-align: right; } -*/ -#now {} -/*Responsive design*/ -@media only screen and (max-width: 1600px) { - body { font-size:90%; } -} -@media only screen and (max-width: 1280px) { - body { font-size:80%; } -} -@media only screen and (max-width: 1024px) { - body { font-size:80%; } - #processlist .hide { display: none; } -} -@media only screen and (max-width: 768px) { - body { font-size:70%; } - aside { margin-right: 1%; } - .hide { display: none; } -} -@media only screen and (max-width: 480px) { - body { font-size:60%; } - aside { margin-right: 1%; } - .hide { display: none; } -} +#processlist table tr td:nth-child(6), +#processlist table tr td:nth-child(12) { + text-align: left; +} \ No newline at end of file