highlighted rrd periods

Author: serghey-rodin

web/templates/admin/menu_rrd.html

@@ -1,10 +1,10 @@
 <table class="sub-menu">
 <tr >
     <td style="padding: 24px 0 16px 24px">
-        <a class="add" href="?period=daily">Daily</a>
-        <a class="add" href="?period=weekly">Weekly</a>
-        <a class="add" href="?period=monthly">Monthly</a>
-        <a class="add" href="?period=yearly">Yearly</a>
+        <a class="add" <?php if ((empty($_GET['period'])) || ($_GET['period'] == 'daily')) echo "style='color: #34536A'" ?> href="?period=daily">Daily</a>
+        <a class="add" <?php if ($_GET['period'] == 'weekly') echo "style='color: #34536A'" ?> href="?period=weekly">Weekly</a>
+        <a class="add" <?php if ($_GET['period'] == 'monthly') echo "style='color: #34536A'" ?> href="?period=monthly">Monthly</a>
+        <a class="add" <?php if ($_GET['period'] == 'yearly') echo "style='color: #34536A'" ?> href="?period=yearly">Yearly</a>
     </td>
     <td style="text-align: right;" ><input type="text" size="30" style="padding: 3px 80px 3px 0;"> <button> Search </button></td>
 </tr>

web/templates/header.html

@@ -496,20 +496,32 @@
     }
 
     .add-textinput {
+        background-color: #FFFFFF;
+        border: 1px solid #999999;
+        border-radius: 3px 3px 3px 3px;
+        color: #555555;
+        font-family: Arial,sans-serif;
+        font-size: 14pt;
+        padding: 6px;
         width: 360px;
         height: 120px;
-        padding: 4px;
-        font-size: 12pt;
-        color: #555;
-        font-family: Arial, sans-serif;
+    }
+    .add-textinput:disabled {
+        background-color: #F1F1F1;
     }
 
     .add-input {
-        width: 360px;
-        padding: 4px;
+        background-color: #FFFFFF;
+        border: 1px solid #999999;
+        border-radius: 3px 3px 3px 3px;
+        color: #555555;
+        font-family: Arial,sans-serif;
         font-size: 14pt;
-        color: #555;
-        font-family: Arial, sans-serif;
+        padding: 6px;
+        width: 360px;
+    }
+    .add-input:disabled {
+        background-color: #F1F1F1;
     }
 
     .add-list {
@@ -525,7 +537,7 @@
 
     .add-button {
         cursor: pointer;
-        background-color: #F1F1F1;
+        background-color: #f6f6f6;
         border: 1px solid #ACACAC;
         border-radius: 3px 3px 3px 3px;
         color: #555555;
@@ -537,17 +549,31 @@
         margin: 0 6px 0 0;
     }
 
+    .add-button:hover {
+        background-color: #f0f0f0;
+    }
+
+    .add-button:active {
+        background-color: #EBE9DC;
+    }
+
     button {
         cursor: pointer;
-        background-color: #F1F1F1;
+        color: #333333;
+        background-color: #f6f6f6;
         border: 1px solid #ACACAC;
         border-radius: 3px 3px 3px 3px;
-        color: #555555;
         font-size: 12px;
-        font-weight: bold;
         padding: 3px 16px;
         width: 105px;
     }
+    button:hover {
+        background-color: #f0f0f0;
+
+    }
+    button:active {
+        background-color: #EBE9DC;
+    }
 
     .genpass {
         color: #34536A;