bacula-web: html and css improvments in all pages

diff --git a/gui/bacula-web/style/default.css b/gui/bacula-web/style/default.css
index 57d712420600f1cf2da65f62324c69ea73042c95..2163e0a561e593dfd5fd09fa30f8c0949d547867 100644 (file)
--- a/gui/bacula-web/style/default.css
+++ b/gui/bacula-web/style/default.css
@@ -91,7 +91,7 @@ a:link, a:visited, a:hover, a:visited {
 #main_left {
  position: absolute; 
  left:10px; 
- width: 400px; 
+ width: 380px; 
  border:none; 
  margin-top: 0px; 
  background-color: #FFFFFF;
@@ -99,15 +99,15 @@ a:link, a:visited, a:hover, a:visited {
 
 #main_middle {
  position: absolute;
- left:420px;
- width: 400px;
+ left:400px;
+ width: 380px;
  border: none;
  margin-top: 0px;
 }
 #main_right {
  position: absolute; 
- left: 830px; 
- width: 350px; 
+ left: 790px; 
+ width: 300px; 
  border: none; 
  margin-top: 0px;
 }
@@ -115,8 +115,8 @@ a:link, a:visited, a:hover, a:visited {
 #main_center {
  position: absolute; 
  left:10px; 
- width: 1000px; 
- /*border: 1px solid red; */
+ min-width: 800px;
+ width: auto; 
  margin-top: 0px;
 }
 
@@ -132,20 +132,30 @@ a:link, a:visited, a:hover, a:visited {
 }
 
 .box {
- border: 1px solid black;
- width: 100%;
- margin: 10px 0px 10px 0px;
+ border: 1px solid #c8c8c8;
+ width: auto;
+ min-height: 100px;
+ margin-top: 10px;
+ margin-bottom: 10px;
  padding: 0px;
  text-align: center;
 }
 
-.box h3, .box h4 {
- text-align:left;
- margin-left: 10px;
+.box h4, .box h5 {
+ background-color: #eeeeee;
+ width: auto;
+ text-align: center;
+ font-weight: bold;
+ padding: 3px;
+ margin: 5px 0px 5px 0px;
+}
+
+.box img.graph {
+ width: 350px;
+ margin: 5px 0px;
 }
 
 .box p.title {
- /*height: 25px;*/
  text-align: center;
  vertical-align: middle;
  font-size: 11pt;
@@ -158,12 +168,15 @@ a:link, a:visited, a:hover, a:visited {
 
 .box div.footer { 
  text-align: right; 
- padding: 3px; 
+ padding: 0px;
+ margin: 3px;
+ margin-right: 20px;
 }
 
 .box div.footer a {
  text-decoration: none;
  font-size: 9pt;
+ font-weight: bold;
  vertical-align: middle;
 }
 
@@ -178,16 +191,12 @@ a:link, a:visited, a:hover, a:visited {
 }
 
 .box table tr td.label { 
- background-color: #FFFFFF;
  font-weight: bold;
  text-align: left;
- padding: 3px;
 }
 
 .box table td.info {
  text-align: right;
- background-color: #FFFFFF;
- padding: 3px 10px;
 }
 
 .box table tr td.info a { font-size: 8pt;}

diff --git a/gui/bacula-web/templates/backupjob-report.tpl b/gui/bacula-web/templates/backupjob-report.tpl
index 9867f8a7e740f8cb500e0df5bcc0d39cd9cff179..66c22e3ffaff1a4a66cf087f8f32d0575ef87b94 100644 (file)
--- a/gui/bacula-web/templates/backupjob-report.tpl
+++ b/gui/bacula-web/templates/backupjob-report.tpl
@@ -69,8 +69,8 @@
   <!-- Transfered Bytes/Files graph -->
   <div class="box">\r
        <p class="title">Transfered Bytes / Files</p>
-       <img src="{$graph_stored_bytes}" alt="" />\r
-       <img src="{$graph_stored_files}" alt="" />\r
+       <img class="graph" src="{$graph_stored_bytes}" alt="" />
+       <img class="graph" src="{$graph_stored_files}" alt="" />
   </div> <!-- end div class=box -->\r
   \r
   </div> <!-- end div id=main_center -->\r

diff --git a/gui/bacula-web/templates/client-report.tpl b/gui/bacula-web/templates/client-report.tpl
index b1c09b0dfd951b6fd31307fc3f23f6dd1bc577d4..962d61d971eccb5dfeb0dddc3b3aaee892f05afb 100644 (file)
--- a/gui/bacula-web/templates/client-report.tpl
+++ b/gui/bacula-web/templates/client-report.tpl
@@ -16,22 +16,21 @@
   
   <div class="box">
        <p class="title">Client(s) Report</p>
-
-  <h4>Client informations</h4> 
-  <table width="300px">
-       <tr>
-               <td width="100px" class="label"><b>Client name:</b></td> <td>{$client_name}</td>
-       </tr>
-       <tr>
-               <td class="label"><b>Client version:</b></td> <td>{$client_version}</td>
-       </tr>
-       <tr>
-               <td class="label"><b>Client os:</b></td> <td>{$client_os}</td>
-       </tr>
-       <tr>
-               <td class="label"><b>Client arch:</b></td> <td>{$client_arch}</td>
-       </tr>
-  </table>
+    <h4>Client informations</h4>       
+    <table width="300px">
+         <tr>
+               <td width="100px" class="label">Client name:</td> <td>{$client_name}</td>
+         </tr>
+         <tr>
+               <td class="label">Client version:</td> <td>{$client_version}</td>
+         </tr>
+         <tr>
+               <td class="label">Client os:</td> <td>{$client_os}</td>
+         </tr>
+         <tr>
+               <td class="label">Client arch:</td> <td>{$client_arch}</td>
+         </tr>
+    </table>
        
   </div> <!-- end div class=box -->
   

diff --git a/gui/bacula-web/templates/index.tpl b/gui/bacula-web/templates/index.tpl
index 2787a8b6ad365f1845fe9554ff65257545f37fa0..f04f407c33388b69ea47cd0047516874d3e31fb3 100644 (file)
--- a/gui/bacula-web/templates/index.tpl
+++ b/gui/bacula-web/templates/index.tpl
@@ -15,7 +15,7 @@
        <p class="title">
        Pools and volumes status        
        </p>
-       <img src="{$graph_pools}" alt="" />
+       <img class="graph" src="{$graph_pools}" alt="" />
        <div class="footer">
                <a href="pools.php" title="Show pools and volumes report">{t}View report{/t}</a>
        </div>
@@ -24,7 +24,7 @@
   <!-- 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="" />
+         <img class="graph" src="{$graph_stored_bytes}" alt="" />
   </div> <!-- end div box -->
 
 </div>
@@ -33,7 +33,7 @@
   <!-- Last 24 hours jobs status -->
   <div class="box">
        <p class="title" title="Last 24 hours jobs status">Jobs status</p>
-         <img src="{$graph_jobs}" alt="" />
+         <img class="graph" src="{$graph_jobs}" alt="" />
        <div class="footer">
                <a href="jobs.php" title="Show last 24 hours jobs status">View report</a>
        </div>
@@ -114,13 +114,9 @@
   
 <div class="box">
        <p class="title">Reports</p>
- 
  <!-- Custom report -->
  <form method="post" action="client-report.php">
        <table>
-               <tr>
-                       <td class="tbl_header" colspan="2"><b>Custom report</b></td>
-               </tr>
                <tr>
                        <td class="label">Client</td>
                        <td class="info">
@@ -163,12 +159,10 @@
        </table>
  </form>
  
+ <h5>{t}Backup Job report{/t}</h5>
  <!-- Backup job report form -->
  <form method="post" action="backupjob-report.php">
    <table>
-        <tr>
-          <td colspan="2" class="tbl_header"><b>{t}Backup Job report{/t}</b></td>
-        </tr>
         <tr>
                <td class="label">Select a backup job</td>
                <td class="info">

diff --git a/gui/bacula-web/templates/jobs.tpl b/gui/bacula-web/templates/jobs.tpl
index 3c7888f19f97e1902043c9b23616f5feb46b23c5..70d2884bb39390242384d5d40469fa4ee0ea0299 100644 (file)
--- a/gui/bacula-web/templates/jobs.tpl
+++ b/gui/bacula-web/templates/jobs.tpl
@@ -18,6 +18,7 @@
   <div class="box">
        <p class="title">Jobs report</p>
        <!-- Filter jobs -->
+       <h4>Filter jobs</h4>
        <form action="jobs.php" method="post">
        <table border="0">
          <tr>
@@ -33,12 +34,10 @@
                        {html_options name=status values=$job_status options=$job_status selected=$job_status_filter onChange="submit();"}
                </td>
          </tr>
-         <tr>
-               <td colspan="8">&nbsp;</td>
-         </tr>
        </table>
        </form>
        
+       <h4>Jobs result</h4>
        <table border="0">
          <tr>
                <td class="tbl_header">Status</td>