ketekny-ui-kit 1.0.107 → 1.0.109

package/package.json

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

package/src/layout/kSingleColPage.vue

@@ -1,5 +1,5 @@
 <template>
-  <main class="flex min-h-screen w-full max-w-none flex-col bg-slate-100">
+  <main class="flex min-h-0 w-full max-w-none flex-1 flex-col overflow-y-auto bg-slate-100">
     <div
       v-if="showHeaderExtraBeforeTitle"
       class="sticky z-30 border-b border-t border-slate-200 bg-slate-50 px-4 backdrop-blur sm:px-6 lg:px-8"

package/src/layout/kTwoColPage.vue

@@ -1,5 +1,5 @@
 <template>
-  <main class="flex h-screen w-full max-w-none flex-col overflow-hidden bg-slate-100">
+  <main class="flex min-h-0 w-full max-w-none flex-1 flex-col overflow-hidden bg-slate-100">
     <section
       v-if="hasTopSection"
       class="shrink-0 bg-white px-4 pb-4 pb-0 pt-8 sm:px-6 lg:px-8"
@@ -43,8 +43,8 @@
       </div>
     </div>
 
-    <div class="min-h-0 flex-1 overflow-hidden bg-slate-100 py-4">
-      <div class="mx-auto flex h-full min-h-0 w-full max-w-none gap-2">
+    <div class="flex min-h-0 flex-1 flex-col overflow-hidden bg-slate-100 py-4">
+      <div class="mx-auto flex min-h-0 w-full max-w-none flex-1 gap-2">
         <aside class="ml-8 min-h-0 shrink-0 overflow-y-auto pr-4" :style="sidebarStyle">
           <slot name="sidebar" />
         </aside>

package/src/twoColLayout/components/MultilevelSidebar.vue

@@ -117,12 +117,15 @@ export default {
       const words = this.title.trim().split(/\s+/).filter(Boolean)
       return words.slice(0, 3).map(word => word.charAt(0)).join('').toUpperCase()
     },
+    hasAccount() {
+      return Boolean(this.account)
+    },
     accountDisplayName() {
-      if (!this.account) return 'Ava Mitchell'
+      if (!this.account) return ''
       return [this.account.firstName, this.account.lastName].filter(Boolean).join(' ') || 'Account'
     },
     accountEmail() {
-      return this.account?.email || 'ava@nimbus.io'
+      return this.account?.email || ''
     },
     filteredMenu() {
       const q = this.query.trim().toLowerCase()
@@ -186,6 +189,7 @@ export default {
       return this.footerLinks.filter(link => link.id !== 'my-profile')
     },
     accountMenuLinks() {
+      if (!this.hasAccount) return []
       return [
         {
           label: 'Το προφίλ μου',
@@ -561,7 +565,10 @@ export default {
       >
         <template v-if="collapsed">
           <button
-            v-for="link in footerLinks"
+            v-for="link in hasAccount ? footerLinks : [
+              { id: 'signin', label: 'Σύνδεση', icon: 'CircleUser' },
+              { id: 'signup', label: 'Εγγραφή', icon: 'UserRound' },
+            ]"
             :key="link.id"
             type="button"
             v-tooltip.right="link.label"
@@ -575,7 +582,7 @@ export default {
                   : 'text-[var(--sidebar-text-soft)] hover:bg-[var(--sidebar-hover)] hover:text-[var(--sidebar-text)]',
             ]"
             :aria-label="link.label"
-            @click="handleFooterSelect(link.id)"
+            @click="hasAccount ? handleFooterSelect(link.id) : $emit(link.id)"
           >
             <component
               :is="link.icon"
@@ -591,7 +598,7 @@ export default {
             />
           </button>
         </template>
-        <template v-else>
+        <template v-else-if="hasAccount">
           <kMenu
             class="block w-full"
             :links="accountMenuLinks"
@@ -621,6 +628,26 @@ export default {
             </template>
           </kMenu>
         </template>
+        <template v-else>
+          <div class="flex items-center gap-2">
+            <button
+              type="button"
+              class="flex min-h-[44px] flex-1 items-center justify-center rounded-lg bg-brand px-3 py-2 text-sm font-semibold text-brand-foreground transition-opacity hover:opacity-90"
+              @click="$emit('signin')"
+            >
+              <CircleUser class="mr-2 size-4 shrink-0" :stroke-width="2" />
+              Σύνδεση
+            </button>
+            <button
+              type="button"
+              class="flex min-h-[44px] flex-1 items-center justify-center rounded-lg border border-[var(--sidebar-border)] bg-[var(--sidebar-surface)] px-3 py-2 text-sm font-semibold text-[var(--sidebar-text)] transition-colors hover:bg-[var(--sidebar-hover)]"
+              @click="$emit('signup')"
+            >
+              <UserRound class="mr-2 size-4 shrink-0" :stroke-width="2" />
+              Εγγραφή
+            </button>
+          </div>
+        </template>
       </div>
 
       <div

package/src/twoColLayout/components/TwoColLayout.vue

@@ -26,14 +26,16 @@
       </template>
     </MultilevelSidebar>
 
-    <main class="flex min-h-0 flex-1 flex-col overflow-y-auto">
+    <main class="flex min-h-0 flex-1 flex-col overflow-hidden">
       <div
         v-if="$slots.header"
         class="sticky top-0 z-20 shrink-0"
       >
         <slot name="header" />
       </div>
-      <slot />
+      <div class="flex min-h-0 flex-1 flex-col overflow-hidden">
+        <slot />
+      </div>
     </main>
 
     <button