redray
2008-12-02 2e272f91b070da8c5cbc4f475838bedfe3128ff1
some css enhancements for the sysmonitor
3 files modified
208 ■■■■ changed files
interface/web/monitor/show_sys_state.php 6 ●●●● patch | view | raw | blame | history
interface/web/monitor/tools.inc.php 32 ●●●● patch | view | raw | blame | history
interface/web/themes/default/css/screen/content_ispc.css 170 ●●●●● patch | view | raw | blame | history
interface/web/monitor/show_sys_state.php
@@ -139,9 +139,9 @@
        _processDbState($record['type'], $serverId, &$serverState, &$messages);
    }
    $res .= '<div class="systemmonitor-state systemmonitor-state-' . $serverState . '">';
    $res .= '<div class="systemmonitor-serverstate">';
    $res .= '<div class="systemmonitor-state-' . $serverState . '-icon">';
    $res .= '<div class="systemmonitor-state state-'.$serverState.'">';
    $res .= '<div class="systemmonitor-device device-server">';
    $res .= '<div class="systemmonitor-content icons32 ico-'.$serverState.'">';
    $res .= 'Server: ' . $serverName . '<br />';
    $res .= 'State: ' . $serverState . '<br />';
    //        $res .= sizeof($messages['ok']) . ' ok | ';
interface/web/monitor/tools.inc.php
@@ -39,8 +39,8 @@
        Format the data
        */
        $html =
           '<div class="systemmonitor-state systemmonitor-state-' . $record['state'] . '">
            <div class="systemmonitor-state-' . $record['state'] . '-icon">
           '<div class="systemmonitor-state state-'.$record['state'].'">
            <div class="systemmonitor-content icons32 ico-'.$record['state'].'">
            <table>
            <tr>
            <td>' . $app->lng("Server online since").':</td>
@@ -85,8 +85,8 @@
        Format the data
        */
        $html =
           '<div class="systemmonitor-state systemmonitor-state-' . $record['state'] . '">
            <div class="systemmonitor-state-' . $record['state'] . '-icon">
           '<div class="systemmonitor-state state-'.$record['state'].'">
            <div class="systemmonitor-content icons32 ico-'.$record['state'].'">
            <table>
            <tr>
            <td>Filesystem</td>
@@ -128,8 +128,8 @@
        Format the data
        */
        $html =
           '<div class="systemmonitor-state systemmonitor-state-' . $record['state'] . '">
            <div class="systemmonitor-state-' . $record['state'] . '-icon">
           '<div class="systemmonitor-state state-'.$record['state'].'">
            <div class="systemmonitor-content icons32 ico-'.$record['state'].'">
            <table>';
        foreach($data as $key => $value){
@@ -164,8 +164,8 @@
        Format the data
        */
        $html = 
           '<div class="systemmonitor-state systemmonitor-state-' . $record['state'] . '">
            <div class="systemmonitor-state-' . $record['state'] . '-icon">
           '<div class="systemmonitor-state state-'.$record['state'].'">
            <div class="systemmonitor-content icons32 ico-'.$record['state'].'">
            <table>';
        foreach($data as $key => $value){
            if ($key != '') {
@@ -198,8 +198,8 @@
        Format the data
        */
        $html =
           '<div class="systemmonitor-state systemmonitor-state-' . $record['state'] . '">
            <div class="systemmonitor-state-' . $record['state'] . '-icon">
           '<div class="systemmonitor-state state-'.$record['state'].'">
            <div class="systemmonitor-content icons32 ico-'.$record['state'].'">
            <table>';
        if($data['webserver'] != -1) {
@@ -306,8 +306,8 @@
    if(isset($record['data'])) {
        $html =
           '<div class="systemmonitor-state systemmonitor-state-' . $record['state'] . '">
            <div class="systemmonitor-state-' . $record['state'] . '-icon">';
           '<div class="systemmonitor-state state-'.$record['state'].'">
            <div class="systemmonitor-content icons32 ico-'.$record['state'].'">';
        /*
         * First, we have to detect, if there is any monitoring-data.
         * If not (because the destribution is not supported) show this.
@@ -336,8 +336,8 @@
    if(isset($record['data'])) {
        $html =
           '<div class="systemmonitor-state systemmonitor-state-' . $record['state'] . '">
            <div class="systemmonitor-state-' . $record['state'] . '-icon">';
           '<div class="systemmonitor-state state-'.$record['state'].'">
            <div class="systemmonitor-content icons32 ico-'.$record['state'].'">';
        /*
         * First, we have to detect, if there is any monitoring-data.
@@ -368,8 +368,8 @@
    if(isset($record['data'])) {
        $html =
           '<div class="systemmonitor-state systemmonitor-state-' . $record['state'] . '">
            <div class="systemmonitor-state-' . $record['state'] . '-icon">';
           '<div class="systemmonitor-state state-'.$record['state'].'">
            <div class="systemmonitor-content icons32 ico-'.$record['state'].'">';
        /*
         * First, we have to detect, if there is any monitoring-data.
interface/web/themes/default/css/screen/content_ispc.css
@@ -24,32 +24,32 @@
    
    /* Tab-Box */
    .tabbox_tabs {
    border-bottom: 1px solid #d3d3d3;
        border-bottom: 1px solid #d3d3d3;
    }
    .tabbox_tabs ul {
    list-style: none;
    padding: 0;
    margin: 0;
        list-style: none;
        padding: 0;
        margin: 0;
    }
    .tabbox_tabs li {
    display: inline;
    margin: 0 2px 0 0;
        display: inline;
        margin: 0 2px 0 0;
    }
    .tabbox_tabs a {
    padding: 0 1em;
    text-decoration: none;
    color: black;
    background: #d3d3d3;
    border: 1px solid #d3d3d3;
        padding: 0 1em;
        text-decoration: none;
        color: black;
        background: #d3d3d3;
        border: 1px solid #d3d3d3;
    }
    .tabbox_tabs a:hover {
    background: #fc0;
    color: #540;
        background: #fc0;
        color: #540;
    }
    .tabbox_tabs .active a {
    font-weight: bold;
    color: #ff6600;
    background: #ffffff;
        font-weight: bold;
        color: #ff6600;
        background: #ffffff;
    }
    
    .pnl_toolsarea fieldset, .pnl_listarea fieldset, .pnl_formarea fieldset {
@@ -68,7 +68,7 @@
    }
    .box_error { border: 4px solid #CC0000; }
    .box_error h1 { color: #CC0000; }
    .box_support {    border: 1px solid #6495ed; }
    .box_support { border: 1px solid #6495ed; }
    .box_support h1 { color: #6495ed; }
    .box_msg { border: 2px solid #6495ed; }
    .box_msg h1 { color: #6495ed; }
@@ -82,18 +82,6 @@
        font-size: 0.9em;
    }
    
    /* Password Strength */
    #passBar {
      width: 101px; height: 10px;
    background: url(../../images/meter_bg.gif) repeat-x bottom left;
    margin: 2px 0;
    float: left;
  }
    #passText {
      padding: 0 8px;
    float: left;
  }
    /* Lists */
    table.list {
        width: 100%;
@@ -105,94 +93,88 @@
    table.list .tbl_row_even { background: #fcfcfc; }
    table.list .tbl_row_uneven { background: #f0f8ff; }
    table.list tr:hover { background: #fffacd; }
    /* Password Strength */
    #passBar {
        width: 101px; height: 10px;
        background: url(../../images/meter_bg.gif) repeat-x bottom left;
        margin: 2px 0;
        float: left;
    }
    #passText {
        padding: 0 8px;
        float: left;
    }
    /* Systemmonitor */
    .systemmonitor-state {
        margin:20px 0;
        margin: 10px 0;
        font-family: Consolas, "Lucida Console", "Courier New", monospace;
        font-size: 0.9em;
    }
    .systemmonitor-state-no_state {
        border: 1px solid #30302e;
    .systemmonitor-state.state-no_state {
        border-top: 4px solid #95A19F;
        background-color: #FBF6EE;
    }
    .systemmonitor-state.state-unknown {
        border-top: 4px solid #30302e;
        background-color: #cecfc5;
    }
    .systemmonitor-state-unknown {
        border: 1px solid #30302e;
        background-color: #cecfc5;
    }
    .systemmonitor-state-ok {
        border: 1px solid #23fb00;
    .systemmonitor-state.state-ok {
        border-top: 4px solid #23fb00;
        background-color: #adffa2;
    }
    .systemmonitor-state-info {
        border: 1px solid #fdff00;
    .systemmonitor-state.state-info {
        border-top: 4px solid #fdff00;
        background-color: #fdffa2;
    }
    .systemmonitor-state-warning {
        border: 1px solid #ffa800;
    .systemmonitor-state.state-warning {
        border-top: 4px solid #ffa800;
        background-color: #ffda93;
    }
    .systemmonitor-state-critical {
        border: 1px solid #ff0000;
    .systemmonitor-state.state-critical {
        border-top: 4px solid #ff0000;
        background-color: #ffb9b9;
    }
    .systemmonitor-state-error {
        border: 1px solid #ff0000;
    .systemmonitor-state.state-error {
        border-top: 4px solid #ff0000;
        background-color: #ff7f7f;
    }
    .systemmonitor-systemstate {
        background-image:url("../../icons/x64/network.png");
        background-repeat: no-repeat;
        }
    .systemmonitor-serverstate {
        background-image:url("../../icons/x64/server.png");
        background-repeat: no-repeat;
        }
    .systemmonitor-state-no_state-icon {
        padding:2px 10px 2px 80px;
        /*ackground-image:url("../../icons/x32/state_unknown.png"); */
        background-repeat: no-repeat;
    }
    .systemmonitor-state-unknown-icon {
        padding:2px 10px 2px 80px;
        background-image:url("../../icons/x32/state_unknown.png");
        background-repeat: no-repeat;
    }
    .systemmonitor-state-ok-icon {
        padding:2px 10px 2px 80px;
        background-image:url("../../icons/x32/state_ok.png");
        background-repeat: no-repeat;
    }
    .systemmonitor-state-info-icon {
        padding:2px 10px 2px 80px;
        background-image:url("../../icons/x32/state_info.png");
        background-repeat: no-repeat;
    }
    .systemmonitor-state-warning-icon {
        padding:2px 10px 2px 80px;
        background-image:url("../../icons/x32/state_warning.png");
        background-repeat: no-repeat;
    }
    .systemmonitor-state-critical-icon {
        padding:2px 10px 2px 80px;
        background-image:url("../../icons/x32/state_critical.png");
        background-repeat: no-repeat;
    }
    .systemmonitor-state-error-icon {
        padding:2px 10px 2px 80px;
        background-image:url("../../icons/x32/state_error.png");
        background-repeat: no-repeat;
    }
    .systemmonitor table {
    .systemmonitor-device {
        background-repeat: no-repeat;
        background-position: 12px 4px;
        min-height: 80px;
    }
    .systemmonitor-device.device-system { background-image: url("../../icons/x64/network.png"); }
    .systemmonitor-device.device-server { background-image: url("../../icons/x64/server.png"); }
    .systemmonitor-content.icons32 {
        padding:2px 10px 2px 80px;
        background-repeat: no-repeat;
        background-position: 12px 4px;
    }
    .systemmonitor-content.icons32.ico-no_state { /*background-image:url("../../icons/x32/state_no.png"); */ }
    .systemmonitor-content.icons32.ico-unknown { background-image:url("../../icons/x32/state_unknown.png"); }
    .systemmonitor-content.icons32.ico-ok { background-image:url("../../icons/x32/state_ok.png"); }
    .systemmonitor-content.icons32.ico-info { background-image:url("../../icons/x32/state_info.png"); }
    .systemmonitor-content.icons32.ico-warning { background-image:url("../../icons/x32/state_warning.png"); }
    .systemmonitor-content.icons32.ico-critical { background-image:url("../../icons/x32/state_critical.png"); }
    .systemmonitor-content.icons32.ico-error { background-image:url("../../icons/x32/state_error.png"); }
    .systemmonitor-content table {
        border: none;
        margin-top: 10px;
    }
    .online {
        background-color: #c6d880;
    .systemmonitor-content * .online {
        border: 1px solid #ffffff;
        background-color: #E3FFB8;
        color: #000000;
        padding:0px 5px;
    }
    .offline {
    .systemmonitor-content * .offline {
        border: 1px solid #ffffff;
        background-color: #d12f19; 
        color:#ffffff;
        padding:0px 5px;