@it-enterprise/forcebpm-ui-kit 1.0.2-beta.33 → 1.0.2-beta.34

package/package.json

@@ -1,7 +1,7 @@
 {
   "type": "module",
   "name": "@it-enterprise/forcebpm-ui-kit",
-  "version": "1.0.2-beta.33",
+  "version": "1.0.2-beta.34",
   "description": "FBPM UI Kit",
   "author": "it-enterprise",
   "license": "MIT",

package/src/FAvatar.vue

@@ -72,7 +72,7 @@ const errorHandler = () => {
 <template>
   <div class="f-avatar cursor-pointer" :style="sizeStyle">
     <!-- GROUP -->
-    <v-tooltip v-if="group" :text="group.name" location="top right" :disabled="disabled">
+    <v-tooltip v-if="group" :text="group.name" location="top left" :disabled="disabled">
       <template #activator="{ props: propsTooltip }">
         <div v-bind="propsTooltip" :style="sizeStyle" :class="avatarClass">
           <i class="f-icon group-star bg-secondary text-center" :style="sizeStyle">

package/src/FDialog.vue

@@ -259,6 +259,7 @@ watch(modelValue, val => {
   .f-dialog-actions {
     flex-shrink: 0; // Action section does not shrink
     gap: 8px 24px;
+    padding-inline: 14px;
   }
 }
 

package/src/FSearchPanel.vue

@@ -181,6 +181,7 @@ const keydownEsc = () => {
 
     .v-field {
       .v-field__input {
+        min-height: 20px;
         padding-left: 8px;
         padding-top: 8px;
         padding-bottom: 4px;

package/src/assets/icons/group-star.svg

@@ -0,0 +1,3 @@
+<svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path d="M11.1848 0.831629L11 0.628796L10.8152 0.831629L8.85259 2.98575L6.07586 2.10153L5.8144 2.01827L5.75577 2.28633L5.13316 5.13316L2.28633 5.75577L2.01827 5.8144L2.10153 6.07586L2.98575 8.85259L0.831629 10.8152L0.628796 11L0.831629 11.1848L2.98575 13.1474L2.10153 15.9241L2.01827 16.1856L2.28633 16.2442L5.13316 16.8668L5.75577 19.7137L5.8144 19.9817L6.07586 19.8985L8.85259 19.0143L10.8152 21.1684L11 21.3712L11.1848 21.1684L13.1474 19.0142L15.9241 19.8985L16.1856 19.9817L16.2442 19.7137L16.8668 16.8668L19.7137 16.2442L19.9817 16.1856L19.8985 15.9241L19.0142 13.1474L21.1684 11.1848L21.3712 11L21.1684 10.8152L19.0143 8.85259L19.8985 6.07586L19.9817 5.8144L19.7137 5.75577L16.8668 5.13316L16.2442 2.28633L16.1856 2.01827L15.9241 2.10153L13.1474 2.98575L11.1848 0.831629Z" fill="#97A7C8" stroke="#C9CBD2" stroke-width="0.5"/>
+</svg>

package/src/assets/icons/user-line.svg

@@ -0,0 +1,4 @@
+<svg width="48" height="54" viewBox="0 0 48 54" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M41.5201 16.5496C41.5201 25.8097 33.547 33.0993 23.9886 33.0993C14.4301 33.0993 6.45703 25.8097 6.45703 16.5496C6.45703 7.28953 14.4301 0 23.9886 0C33.547 0 41.5201 7.28953 41.5201 16.5496ZM39.5352 16.5496C39.5352 24.5935 32.5747 31.1144 23.9886 31.1144C15.4024 31.1144 8.44191 24.5935 8.44191 16.5496C8.44191 8.50574 15.4024 1.98488 23.9886 1.98488C32.5747 1.98488 39.5352 8.50574 39.5352 16.5496Z" fill="#C9CBD2"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M32.1501 29.5571L32.9589 29.8346C37.2615 31.3104 40.9489 33.7148 43.5867 36.3705C46.1545 38.9557 48 42.0663 48 44.9964C48 45.9496 47.5655 46.7327 47.1116 47.2943C46.6492 47.8665 46.0421 48.3672 45.3866 48.8045C44.0711 49.6819 42.2773 50.4897 40.1889 51.1782C35.9916 52.562 30.2769 53.5708 24 53.5708C17.7238 53.5708 12.0091 52.562 7.81165 51.1782C5.72316 50.4897 3.92925 49.6819 2.61367 48.8045C1.9581 48.3673 1.35096 47.8665 0.888504 47.2944C0.434558 46.7328 0 45.9497 0 44.9964C0 42.0663 1.84546 38.9556 4.41304 36.3703C7.05064 33.7146 10.7378 31.3101 15.0398 29.8345L15.8484 29.5572L16.6054 29.9541C18.7901 31.0995 21.309 31.7584 23.9993 31.7584C26.6905 31.7584 29.2099 31.0994 31.3929 29.9543L32.1501 29.5571ZM46.0151 44.9964C46.0151 47.6682 36.1596 51.586 24 51.586C11.8418 51.586 1.98488 47.6682 1.98488 44.9964C1.98488 40.6801 7.64922 34.4678 15.6838 31.7121C18.1477 33.0038 20.9822 33.7433 23.9993 33.7433C27.0171 33.7433 29.8523 33.0038 32.3149 31.7121C40.3508 34.4685 46.0151 40.6801 46.0151 44.9964Z" fill="#C9CBD2"/>
+</svg>

package/src/assets/scss/icons.scss

@@ -281,6 +281,20 @@
     mask-size: contain;
     mask-position: center;
   }
+  &.group-star {
+    background-color: rgb(var(--v-theme-primary));
+    -webkit-mask: url('./../icons/group-star.svg') no-repeat;
+    mask: url('./../icons/group-star.svg') no-repeat;
+    mask-size: contain;
+    mask-position: center;
+  }
+  &.user-line {
+    background-color: rgb(var(--v-theme-primary));
+    -webkit-mask: url('./../icons/user-line.svg') no-repeat;
+    mask: url('./../icons/user-line.svg') no-repeat;
+    mask-size: contain;
+    mask-position: center;
+  }
 }
 
 @media screen and (max-width: 1280px) {

package/src/assets/scss/input.scss

@@ -75,10 +75,10 @@
     }
     .v-field__input {
       padding-top: 16px;
-      padding-bottom: 10px;
+      padding-bottom: 6px;
       padding-inline: 12px 12px;
-      min-height: 20px;
-      font-size: 0.95em;
+      min-height: 40px;
+      font-size: 0.85em;
       line-height: 1em;
       color: rgb(var(--v-theme-subTitle));
       &:is(:-webkit-autofill, :autofill) {
@@ -98,7 +98,7 @@
       }
     }
     input::placeholder {
-      font-size: 0.9em;
+      font-size: 0.85em;
       opacity: 0.9;
       color: rgb(var(--v-theme-subTitle));
     }
@@ -197,13 +197,6 @@
       transform: rotate(180deg);
     }
   }
-  .v-field {
-    .v-field__input {
-      padding-inline: 12px 8px;
-      font-size: 0.85em;
-      min-height: 45px;
-    }
-  }
 }
 
 // Autocomplete
@@ -214,7 +207,7 @@
     }
   }
   .v-autocomplete__selection {
-    height: 20px;
+    height: 16px;
     .f-chip.v-chip {
       --v-chip-height: 20px;
       padding: 0;

package/src/assets/scss/overlay.scss

@@ -48,21 +48,26 @@
   }
 }
 
-.f-menu .v-overlay__content.v-autocomplete__content {
-  .v-list {
-    .v-list-item {
-      min-height: 28px;
-      .f-checkbox {
-        .f-icon {
-          height: 16px;
-          width: 16px;
-          min-width: 16px;
-          min-height: 16px;
-        }
+.f-menu .v-overlay__content {
+  &.v-autocomplete__content,
+  &.v-select__content {
+    .v-list {
+      .v-list-item {
+        min-height: 28px;
       }
-      .v-list-item__content {
-        display: flex;
-        align-items: center;
+    }
+  }
+  &.v-autocomplete__content {
+    .v-list {
+      .v-list-item {
+        .f-checkbox {
+          .f-icon {
+            height: 16px;
+            width: 16px;
+            min-width: 16px;
+            min-height: 16px;
+          }
+        }
       }
     }
   }

package/src/assets/scss/tables.scss

@@ -29,6 +29,13 @@
       font-size: 0.85em;
     }
     table {
+      thead {
+        tr {
+          th {
+            line-height: 1.1em;
+          }
+        }
+      }
       tbody {
         font-size: 0.85em;
         tr:not(:last-child) {