Ticket #3988 - Artificer template (part 5): Point 3: Live search.

plugins_public/tailwind/css/tailwind.css

@@ -482,38 +482,38 @@
     }
 
     /* Common elements: Blocks, Boxes, etc. */
-    .bx-artificer .bx-def-box {
+    .bx-def-box {
         @apply flex flex-col;
     }
-    .bx-artificer .bx-def-box.bx-def-box-hor {
+    .bx-def-box.bx-def-box-hor {
         @apply flex-row;
     }
-    .bx-artificer .bx-def-color-bg-block,
-    .bx-artificer .bx-def-color-bg-box,
-    .bx-artificer .bx-popup-color-bg {
+    .bx-def-color-bg-block,
+    .bx-def-color-bg-box,
+    .bx-popup-color-bg {
         @apply bg-white dark:bg-gray-800 shadow;
     }
-    .bx-artificer .bx-def-border-block,
-    .bx-artificer .bx-def-box,
-    .bx-artificer .bx-popup-border {
+    .bx-def-border-block,
+    .bx-def-box,
+    .bx-popup-border {
         @apply ring-1 ring-gray-300 dark:ring-gray-700;
     }
-    .bx-artificer .bx-def-border-radius-block,
-    .bx-artificer .bx-def-box-round-corners,
-    .bx-artificer .bx-popup-border {
+    .bx-def-border-radius-block,
+    .bx-def-box-round-corners,
+    .bx-popup-border {
         @apply rounded-md;
     }
-    .bx-artificer .bx-content-padding-block {
+    .bx-content-padding-block {
         @apply p-3 md:p-4;
     }
-    .bx-artificer .bx-def-color-bg-box-hover {
+    .bx-def-color-bg-box-hover {
         @apply hover:bg-gray-100 dark:hover:bg-gray-700 hover:text-gray-800 dark:hover:text-gray-200;
     }
-    .bx-artificer .bx-def-color-bg-box-active {
+    .bx-def-color-bg-box-active {
         @apply bg-gray-100 dark:bg-gray-700;
     }
 
-    .bx-artificer .bx-db-title {
+    .bx-db-title {
         @apply leading-8 text-lg lg:text-xl text-gray-800 dark:text-gray-100 font-semibold align-middle;
     }
 

template/css/default.less

@@ -645,12 +645,8 @@ h3,
 }
 
 .bx-def-unit-live-search {
-    width:14.75rem;
-    overflow:hidden;
-}
-
-.bx-def-unit-live-search .bx-def-unit-info {
-    width:11.75rem;
+    text-align: left;
+    overflow: hidden;
 }
 
 .bx-def-unit-live-search .bx-def-unit-img:not(.empty) {

template/css/menu.css

@@ -236,24 +236,25 @@ ul.bx-menu-main-submenu {
     padding:0;
 }
 ul.bx-menu-toolbar li {
-	position:relative;
+    position:relative;
     float:left;
     margin:0px;
 } 
 
 ul.bx-menu-toolbar li a {
-    position:relative;
-    display:block;
-    height:48px;
-    height:3rem;
+    position: relative;
+    display: -webkit-flex;
+    display: flex;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-align-items: center;
+    align-items: center;
+    
+    height: 3rem;
 
-    line-height:48px;
-    line-height:3rem;
-    font-size:16px;
-    font-size:1rem;
+    font-size: 1rem;
     text-align: center;
-    vertical-align:middle;
-    text-decoration:none;
+    text-decoration: none;
 }
 
 ul.bx-menu-toolbar li a .sys-icon,
@@ -268,7 +269,7 @@ ul.bx-menu-toolbar li a .sys-icon-a {
 }
 
 ul.bx-menu-toolbar li img {
-	max-height:48px;
+    max-height:48px;
     max-height:3rem;
 
     background-position:center center;
@@ -277,14 +278,18 @@ ul.bx-menu-toolbar li img {
 
 ul.bx-menu-toolbar li .sys-icon-a,
 ul.bx-menu-toolbar li .sys-icon {
-    display:inline-block;
-    vertical-align:middle;
+    display: inline-block;
+    vertical-align: middle;
 
-    font-size:24px;
-    font-size:1.5rem;
-    text-align:center;
-    width:1.5rem;
-    height:1.5rem;
+    width: 1.5rem;
+
+    text-align: center;
+    font-size: 1.5rem;
+}
+
+ul.bx-menu-toolbar li img, 
+ul.bx-menu-toolbar li .sys-icon.sys-icon-svg {
+    height: 1.5rem;
 }
 
 ul.bx-menu-toolbar li .bx-menu-toolbar-item-unit {