ketekny-ui-kit 1.0.93 → 1.0.95

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "ketekny-ui-kit",
   "type": "module",
-  "version": "1.0.93",
+  "version": "1.0.95",
   "description": "A Vue 3 UI component library with Tailwind CSS styling",
   "main": "index.js",
   "files": [

package/src/twoColLayout/components/MultilevelSidebar.vue

@@ -118,6 +118,9 @@ export default {
       collect(this.filteredMenu)
       return all
     },
+    expandedFooterLinks() {
+      return this.footerLinks.filter(link => link.id !== 'my-profile')
+    },
   },
   watch: {
     mainMenu: {
@@ -352,29 +355,27 @@ export default {
     </nav>
 
     <div class="p-3 mt-auto border-t border-sidebar-border">
-      <div
-        class="flex items-center py-2 rounded-md hover:bg-sidebar-accent"
-        :class="collapsed ? 'justify-center px-0' : 'gap-2.5 px-2'"
-      >
-        <CircleUser class="size-8 shrink-0 text-sidebar-muted" :stroke-width="1.75" />
-        <div v-if="!collapsed" class="flex-1 min-w-0">
-          <p class="text-sm font-medium truncate text-sidebar-foreground">{{ accountDisplayName }}</p>
-          <p class="text-xs truncate text-sidebar-muted">{{ accountEmail }}</p>
+      <div :class="collapsed ? 'flex flex-col items-center gap-1' : 'space-y-1'">
+        <div v-if="!collapsed" class="flex items-center gap-2">
+          <button
+            type="button"
+            class="sidebar-footer-item flex min-h-[38px] flex-1 items-center gap-2.5 rounded-md bg-transparent px-2 py-2 text-left text-sm font-medium text-sidebar-foreground/80 outline-none transition-colors duration-150 hover:bg-sidebar-accent hover:text-sidebar-foreground"
+            @click="handleFooterSelect('my-profile')"
+          >
+            <CircleUser class="sidebar-footer-item-icon size-4 shrink-0" :stroke-width="1.9" />
+            <span class="min-w-0 flex-1">
+              <span class="block truncate">Το προφίλ μου</span>
+              <span class="block truncate text-xs font-normal text-sidebar-muted">{{ accountEmail }}</span>
+            </span>
+          </button>
+          <button
+            type="button"
+            class="rounded-md p-1.5 text-sidebar-muted hover:bg-sidebar-accent hover:text-sidebar-foreground"
+            aria-label="Notifications"
+          >
+            <Bell class="size-4" :stroke-width="2" />
+          </button>
         </div>
-        <button
-          v-if="!collapsed"
-          type="button"
-          class="rounded-md p-1.5 text-sidebar-muted hover:bg-sidebar-accent hover:text-sidebar-foreground"
-          aria-label="Notifications"
-        >
-          <Bell class="size-4" :stroke-width="2" />
-        </button>
-      </div>
-
-      <div
-        class="pt-2 mt-2 border-t border-sidebar-border/70"
-        :class="collapsed ? 'flex flex-col items-center gap-1' : 'space-y-1'"
-      >
         <button
           v-for="link in footerLinks"
           :key="link.id"
@@ -407,7 +408,7 @@ export default {
           />
         </button>
         <button
-          v-for="link in footerLinks"
+          v-for="link in expandedFooterLinks"
           :key="`${link.id}-expanded`"
           v-else
           type="button"

package/src/ui/kTable.vue

@@ -115,7 +115,7 @@ export default {
 }
 
 .table-custom--card th {
-  @apply px-6 py-4 text-lg font-semibold text-left text-white bg-primary border-b border-primary;
+  @apply px-4 py-2.5 text-sm font-semibold text-left text-white bg-primary border-b border-primary;
 }
 
 .table-custom--plain th {
@@ -127,15 +127,15 @@ export default {
 }
 
 .table-custom--card td {
-  @apply h-[3.2rem] px-6 py-4 text-base text-slate-800 dark:text-slate-200;
+  @apply h-10 px-4 py-2.5 text-sm text-slate-800 dark:text-slate-200;
 }
 
 .table-custom--plain td {
-  @apply h-[3.2rem] px-2 py-2 text-base text-slate-800 dark:text-slate-200;
+  @apply h-10 px-2 py-2 text-sm text-slate-800 dark:text-slate-200;
 }
 
 .table-custom--flat td {
-  @apply h-[3.2rem] px-4 py-2 text-base text-slate-900 dark:text-slate-200 align-middle;
+  @apply h-10 px-3 py-2 text-sm text-slate-900 dark:text-slate-200 align-middle;
 }
 
 .table-custom tr {

package/src/ui/themes/kButton.theme.js

@@ -6,10 +6,10 @@ export const K_BUTTON_BASE = "inline-flex flex-row items-center justify-center f
 export const K_BUTTON_SIZE_STYLES = {
   normal: {
     regular: "h-9 px-4 text-sm",
-    iconOnly: "h-10 w-10 p-0",
-    icon: "w-5 h-5",
-    loader: "w-5 h-5",
-    gap: "mr-2",
+    iconOnly: "h-9 w-9 p-0",
+    icon: "w-4 h-4",
+    loader: "w-4 h-4",
+    gap: "mr-1.5",
   },
   small: {
     regular: "h-8 px-3 text-sm",
@@ -28,10 +28,10 @@ export const K_BUTTON_SIZE_STYLES = {
   // Backward compatibility aliases
   default: {
     regular: "h-9 px-4 text-sm",
-    iconOnly: "h-10 w-10 p-0",
-    icon: "w-5 h-5",
-    loader: "w-5 h-5",
-    gap: "mr-2",
+    iconOnly: "h-9 w-9 p-0",
+    icon: "w-4 h-4",
+    loader: "w-4 h-4",
+    gap: "mr-1.5",
   },
 };