bacula-web: css improved and dashboard customisation

 - cleaned css file
 - changed colors for main dashboard
 - cleaned html code in index.tpl

diff --git a/gui/bacula-web/style/default.css b/gui/bacula-web/style/default.css
index 284c03722df4f8f2e8983c6de17f0a1021283597..936bdb6b2efa6d1d76682cdae9907dd9bc714519 100644 (file)
--- a/gui/bacula-web/style/default.css
+++ b/gui/bacula-web/style/default.css
@@ -131,7 +131,6 @@ a:link, a:visited, a:hover, a:visited {
  text-align: center;
  vertical-align: middle;
  font-size: 11pt;
- /*background-color: #1E90FF;*/
  background-color: #888888;
  color: white;
  font-weight: bold;
@@ -139,41 +138,34 @@ a:link, a:visited, a:hover, a:visited {
  margin: 0px;
 }
 
-.box p.title a {
- color: #FFFFFF;
+.box div.footer { 
+ text-align: right; 
+ padding: 3px; 
+}
+
+.box div.footer a {
  text-decoration: none;
  font-size: 9pt;
- float: right;
  vertical-align: middle;
 }
 
-.box table tr td
-{
+.box table tr td {
  padding: 3px;
  font-size: 8pt;
  height: 20px;
 }
 
-.box table tr td.label
-{
- /*font-weight: bold;*/
- background-color: #E0E0E0;
- /*width: 150px;*/
+.box table tr td.label { 
+ background-color: #FFFFFF;
+ font-weight: bold;
  text-align: left;
- padding-left: 15px;
- padding: 5px;
- margin: 2px;
+ padding: 3px 3px 3px 15px;
 }
 
-.box table td.info
-{
+.box table td.info {
  text-align: right;
- font-weight: bold;
- background-color: #E0E0E0;
- height: auto;
- padding: 2px;
- padding-right: 10px;
- margin: 0px;
+ background-color: #FFFFFF;
+ padding: 3px 15px 3px 3px;
 }
 
 .box table tr td.info a { font-size: 8pt;}

diff --git a/gui/bacula-web/templates/index.tpl b/gui/bacula-web/templates/index.tpl
index 0d49ab7d3fc6c941eb2297e537628e65a9d3eaed..5df7a3c7e297705bc1a47d79715c88dde035e660 100644 (file)
--- a/gui/bacula-web/templates/index.tpl
+++ b/gui/bacula-web/templates/index.tpl
@@ -10,16 +10,18 @@
 
 <div id="main_left">
 
-
   <!-- Pools and Volumes Status -->
   <div class="box">
        <p class="title">
-       Pools and volumes status
-       <a href="pools.php" title="Show pools and volumes report">View report</a>
+       Pools and volumes status        
        </p>
-         <img src="{$graph_pools}" alt="" />
+       <img src="{$graph_pools}" alt="" />
+       <div class="footer">
+               <a href="pools.php" title="Show pools and volumes report">View report</a>
+       </div>
   </div> <!-- end div box -->
   
+  <!-- Stored Bytes for last 7 days -->
   <div class="box">
        <p class="title" title="Stored bytes for last 7 days (GB)">Stored Bytes</p>
          <img src="{$graph_stored_bytes}" alt="" />
@@ -28,13 +30,13 @@
 </div>
 
 <div id="main_middle">
-  
+  <!-- Last 24 hours jobs status -->
   <div class="box">
-       <p class="title">
-       Job Status Report
-       <a href="jobs.php" title="Show last 24 hours jobs status">View report</a>
-       </p>
+       <p class="title" title="Last 24 hours jobs status">Job Status Report</p>
          <img src="{$graph_jobs}" alt="" />
+       <div class="footer">
+               <a href="jobs.php" title="Show last 24 hours jobs status">View report</a>
+       </div>
   </div> <!-- end div box -->
   
   <div class="box">
@@ -95,16 +97,10 @@
                                <td class="label">Waiting jobs</td> 
                                <td class="info">{$waiting_jobs}</td>
                        </tr> 
-                       <tr>
-                               <td colspan="2" class="label"><hr></td>
-                       </tr>
                        <tr>
                                <td class="label">Job Level (Incr / Diff / Full)</td>
                                <td class="info">{$incr_jobs} / {$diff_jobs} / {$full_jobs}</td>
                        </tr>
-                       <tr>
-                               <td colspan="2" class="label"><hr></td>
-                       </tr>
                        <tr>
                                <td class="label">Transferred Bytes</td> 
                                <td class="info">{$bytes_last}</td>