From dae3ae3f7ea9bf624bfe223209eb418940e4abc8 Mon Sep 17 00:00:00 2001
From: Mahdi <mahdi.banilohi@gmail.com>
Date: Mon, 9 Nov 2026 18:34:23 +0330
Subject: [PATCH] fix(notes): keep card titles visible when the square card is
 crowded

Co-authored-by: Cursor <cursoragent@cursor.com>
---
 apps/web/src/views/NotesView.vue | 15 +++++++++++++--
 1 file changed, 13 insertions(+), 2 deletions(-)

diff --git a/apps/web/src/views/NotesView.vue b/apps/web/src/views/NotesView.vue
index c30baac..a46e07a 100644
--- a/apps/web/src/views/NotesView.vue
+++ b/apps/web/src/views/NotesView.vue
@@ -1906,7 +1906,11 @@ onBeforeUnmount(() => {
   margin: 0 0 0.35rem;
   font-size: 0.95rem;
   font-weight: 700;
+  line-height: 1.35;
   color: #0f172a;
+  flex-shrink: 0;
+  min-width: 0;
+  overflow-wrap: anywhere;
   display: -webkit-box;
   -webkit-line-clamp: 2;
   -webkit-box-orient: vertical;
@@ -1918,7 +1922,7 @@ onBeforeUnmount(() => {
   color: #334155;
   font-size: 0.82rem;
   line-height: 1.45;
-  flex: 1;
+  flex: 1 1 2.9em;
   min-height: 0;
   overflow: hidden;
   display: -webkit-box;
@@ -1953,13 +1957,15 @@ onBeforeUnmount(() => {
   margin-top: 0.45rem;
   border-radius: var(--radius);
   overflow: hidden;
-  flex-shrink: 0;
+  flex: 0 1 72px;
+  min-height: 0;
   max-height: 72px;
 }
 .card-thumb img {
   display: block;
   width: 100%;
   height: 72px;
+  max-height: 100%;
   object-fit: cover;
 }
 
@@ -2176,11 +2182,16 @@ onBeforeUnmount(() => {
 }
 
 .title-input {
+  width: 100%;
+  min-width: 0;
+  box-sizing: border-box;
   border: 0;
   border-bottom: 1px solid #e2e8f0;
   padding: 0.35rem 0;
   font-size: 1rem;
   font-weight: 600;
+  line-height: 1.4;
+  color: #0f172a;
   outline: none;
   background: transparent;
 }