Manage categories uses new UI

admin/manage_categories.php

@@ -37,6 +37,7 @@ define('PAGE_TITLE', 'ADMIN_CATEGORIES');
 require(HESK_PATH . 'hesk_settings.inc.php');
 require(HESK_PATH . 'inc/common.inc.php');
 require(HESK_PATH . 'inc/admin_functions.inc.php');
+require(HESK_PATH . 'inc/mail_functions.inc.php');
 hesk_load_database_functions();
 
 hesk_session_start();
@@ -49,9 +50,9 @@ hesk_checkPermission('can_man_cat');
 // Possible priorities
 $priorities = array(
     3 => array('value' => 3, 'text' => $hesklang['low'], 'formatted' => $hesklang['low']),
-    2 => array('value' => 2, 'text' => $hesklang['medium'], 'formatted' => '<font class="medium">' . $hesklang['medium'] . '</font>'),
-    1 => array('value' => 1, 'text' => $hesklang['high'], 'formatted' => '<font class="important">' . $hesklang['high'] . '</font>'),
-    0 => array('value' => 0, 'text' => $hesklang['critical'], 'formatted' => '<font class="critical">' . $hesklang['critical'] . '</font>'),
+    2 => array('value' => 2, 'text' => $hesklang['medium'], 'formatted' => '<span class="medium">' . $hesklang['medium'] . '</span>'),
+    1 => array('value' => 1, 'text' => $hesklang['high'], 'formatted' => '<span class="important">' . $hesklang['high'] . '</span>'),
+    0 => array('value' => 0, 'text' => $hesklang['critical'], 'formatted' => '<span class="critical">' . $hesklang['critical'] . '</span>'),
 );
 
 /* What should we do? */
@@ -106,13 +107,19 @@ while ($mycat = hesk_dbFetchAssoc($res)) {
     $options .= '>' . $mycat['name'] . '</option>';
 }
 ?>
-<div class="row move-down-20">
-    <div align="left" class="col-md-4">
-        <div class="panel panel-default">
-            <div class="panel-heading">
+<section class="content">
+    <div class="box collapsed-box">
+        <div class="box-header with-border">
+            <h1 class="box-title">
                 <?php echo $hesklang['add_cat']; ?>
+            </h1>
+            <div class="box-tools pull-right">
+                <button type="button" class="btn btn-box-tool" data-widget="collapse">
+                    <i class="fa fa-plus"></i>
+                </button>
+            </div>
         </div>
-            <div class="panel-body">
+        <div class="box-body">
             <form action="manage_categories.php" method="post" role="form" class="form-horizontal" data-toggle="validator">
                 <div class="form-group">
                     <p class="col-sm-4 control-label" style="font-size: .87em">
@@ -151,7 +158,7 @@ while ($mycat = hesk_dbFetchAssoc($res)) {
                                 echo '<option value="' . $value . '"' . ($_SESSION['cat_priority'] == $value ? ' selected="selected"' : '') . '>' . $info['text'] . '</option>';
                             }
                             ?>
-                            </select></p>
+                        </select>
 
                     </div>
                 </div>
@@ -210,15 +217,20 @@ while ($mycat = hesk_dbFetchAssoc($res)) {
             </form>
         </div>
     </div>
-    </div>
-    <div class="col-md-8">
-        <div class="panel panel-default">
-            <div class="panel-heading">
+    <div class="box">
+        <div class="box-header with-border">
+            <h1 class="box-title">
                 <?php echo $hesklang['manage_cat']; ?> <a href="javascript:void(0)"
                                                           onclick="javascript:alert('<?php echo hesk_makeJsString($hesklang['cat_intro']); ?>')"><i
                         class="fa fa-question-circle settingsquestionmark"></i></a>
+            </h1>
+            <div class="box-tools pull-right">
+                <button type="button" class="btn btn-box-tool" data-widget="collapse">
+                    <i class="fa fa-minus"></i>
+                </button>
+            </div>
         </div>
-            <div class="panel-body">
+        <div class="box-body">
             <?php
             /* This will handle error, success and notice messages */
             hesk_handle_messages();
@@ -365,8 +377,7 @@ while ($mycat = hesk_dbFetchAssoc($res)) {
             </table>
         </div>
     </div>
-    </div>
-</div>
+</section>
 <!-- Edit category modal -->
 <div class="modal fade" id="edit-category-modal" tabindex="-1" role="dialog" style="overflow: hidden">
     <div class="modal-dialog modal-lg" role="document">

css/colors.css

@@ -15,6 +15,18 @@
     color: orange;
 }
 
+.medium {
+    color: #FF9900;
+}
+
 .gray {
     color: grey;
 }
+
+.critical {
+    color: #9400d3;
+}
+
+.blue {
+    color: blue;
+}