feat(ui): rework category list

Author: stonebuzz

css/styles.scss

@@ -496,7 +496,7 @@ tr[data-itemtype="PluginFormcreatorCondition"] ~ tr[data-itemtype="PluginFormcre
    ul,
    li {
       list-style: none;
-      margin: 0;
+      padding-bottom: 10px;
    }
 
    ul {
@@ -597,7 +597,7 @@ tr[data-itemtype="PluginFormcreatorCondition"] ~ tr[data-itemtype="PluginFormcre
 
    li {
       background-color: inherit;
-      height: 51px;
+      height: 40px;
    }
 }
 
@@ -1044,3 +1044,14 @@ a.plugin_formcreator_formTile_title {
    padding-left: 5px;
    color: #717171;
 }
+
+.category-divider {
+   height: 0;
+   margin-bottom: 0.5rem;
+   overflow: hidden;
+   border-top: 1px solid rgba(98, 105, 118, 0.16);
+}
+
+a.category_active span {
+   font-weight: bold;
+}

inc/form.class.php

@@ -644,7 +644,9 @@ public function showServiceCatalog() : void {
 
    public function showWizard() : void {
       echo '<div id="plugin_formcreator_wizard_categories" class="card">';
+
       echo '<div><h2 class="card-title">'._n("Category", "Categories", 2, 'formcreator').'</h2></div>';
+      echo '<div class="category-divider"></div>';
       echo '<div class="slinky-menu"></div>';
       echo '<div><a href="#" id="wizard_seeall">' . __('See all', 'formcreator') . '</a></div>';
       echo '</div>';