diff --git a/src/lib/components/chat/ChatPlaceholder.svelte b/src/lib/components/chat/ChatPlaceholder.svelte
index f13770b316..346395b2f1 100644
--- a/src/lib/components/chat/ChatPlaceholder.svelte
+++ b/src/lib/components/chat/ChatPlaceholder.svelte
@@ -36,7 +36,7 @@
 </script>
 
 {#key mounted}
-	<div class="m-auto w-full max-w-[52rem] px-8 lg:px-20">
+	<div class="m-auto w-full max-w-[58rem] px-8 lg:px-20">
 		<div class="flex justify-start">
 			<div class="flex -space-x-4 mb-0.5" in:fade={{ duration: 200 }}>
 				{#each models as model, modelIdx}
diff --git a/src/lib/components/chat/MessageInput.svelte b/src/lib/components/chat/MessageInput.svelte
index 79cd710dfa..85b47f2f6f 100644
--- a/src/lib/components/chat/MessageInput.svelte
+++ b/src/lib/components/chat/MessageInput.svelte
@@ -1286,7 +1286,7 @@
 			<div
 				class="flex flex-col px-3 {($settings?.widescreenMode ?? null)
 					? 'max-w-full'
-					: 'max-w-[52rem]'} w-full"
+					: 'max-w-[58rem]'} w-full"
 			>
 				<div class="relative">
 					{#if autoScroll === false && history?.currentId}
@@ -1323,7 +1323,7 @@
 			<div
 				class="{($settings?.widescreenMode ?? null)
 					? 'max-w-full'
-					: 'max-w-[52rem]'} px-2.5 mx-auto inset-x-0"
+					: 'max-w-[58rem]'} px-2.5 mx-auto inset-x-0"
 			>
 				<div class="">
 					<input
diff --git a/src/lib/components/chat/Messages/Message.svelte b/src/lib/components/chat/Messages/Message.svelte
index 447a5b0554..5fb9a399da 100644
--- a/src/lib/components/chat/Messages/Message.svelte
+++ b/src/lib/components/chat/Messages/Message.svelte
@@ -50,7 +50,7 @@
 	role="listitem"
 	class="flex flex-col justify-between px-5 mb-3 w-full {($settings?.widescreenMode ?? null)
 		? 'max-w-full'
-		: 'max-w-[52rem]'} mx-auto rounded-lg group message-listitem"
+		: 'max-w-[58rem]'} mx-auto rounded-lg group message-listitem"
 >
 	{#if history.messages[messageId]}
 		{#if history.messages[messageId].role === 'user'}
diff --git a/src/lib/components/chat/Placeholder.svelte b/src/lib/components/chat/Placeholder.svelte
index ff2bae8869..38522abb37 100644
--- a/src/lib/components/chat/Placeholder.svelte
+++ b/src/lib/components/chat/Placeholder.svelte
@@ -80,7 +80,7 @@
 		$selectedFolder.permission !== 'write';
 </script>
 
-<div class="m-auto w-full max-w-[52rem] px-2 @2xl:px-20 translate-y-6 py-24 text-center">
+<div class="m-auto w-full max-w-[58rem] px-2 @2xl:px-20 translate-y-6 py-24 text-center">
 	{#if $temporaryChatEnabled}
 		<Tooltip
 			content={$i18n.t("This chat won't appear in history and your messages will not be saved.")}
diff --git a/src/lib/components/notes/Notes.svelte b/src/lib/components/notes/Notes.svelte
index c8b5cbf36e..d8fa0973c4 100644
--- a/src/lib/components/notes/Notes.svelte
+++ b/src/lib/components/notes/Notes.svelte
@@ -521,87 +521,85 @@
 									>
 										{#each notesList as note, idx (note.id)}
 											<div
-												class="flex cursor-pointer w-full px-3 py-2 bg-transparent hover:bg-gray-50/70 dark:hover:bg-gray-850/50 rounded-2xl transition"
+												class="group flex min-h-8 w-full items-center gap-2 rounded-lg px-2 py-1 text-left transition hover:bg-gray-50 focus-within:bg-gray-50 dark:hover:bg-gray-900 dark:focus-within:bg-gray-900"
 											>
-												<a href={`/notes/${note.id}`} class="w-full flex flex-col justify-between">
-													<div class="flex-1">
-														<div class="  flex items-center gap-2 self-center justify-between">
-															<Tooltip
-																content={note.title}
-																className="flex-1"
-																placement="top-start"
-															>
-																<div class="text-sm capitalize flex-1 w-full line-clamp-1">
-																	{note.title}
-																</div>
-															</Tooltip>
-
-															<div class="flex shrink-0 items-center text-xs gap-2.5">
-																<Tooltip content={dayjs(note.updated_at / 1000000).format('LLLL')}>
-																	<div>
-																		{dayjs(note.updated_at / 1000000).fromNow()}
-																	</div>
-																</Tooltip>
-																<Tooltip
-																	content={note?.user?.email ?? $i18n.t('Deleted User')}
-																	className="flex shrink-0"
-																	placement="top-start"
-																>
-																	<div class="shrink-0 text-gray-500">
-																		{$i18n.t('By {{name}}', {
-																			name: capitalizeFirstLetter(
-																				note?.user?.name ??
-																					note?.user?.email ??
-																					$i18n.t('Deleted User')
-																			)
-																		})}
-																	</div>
-																</Tooltip>
-
-																<div>
-																	<NoteMenu
-																		onDownload={(type) => {
-																			selectedNote = note;
-
-																			downloadHandler(type);
-																		}}
-																		onCopyLink={async () => {
-																			const baseUrl = window.location.origin;
-																			const res = await copyToClipboard(
-																				`${baseUrl}/notes/${note.id}`
-																			);
-
-																			if (res) {
-																				toast.success($i18n.t('Copied link to clipboard'));
-																			} else {
-																				toast.error($i18n.t('Failed to copy link'));
-																			}
-																		}}
-																		onDelete={() => {
-																			selectedNote = note;
-																			showDeleteConfirm = true;
-																		}}
-																		isPinned={note.is_pinned ?? false}
-																		onPin={async () => {
-																			await toggleNotePinnedStatusById(localStorage.token, note.id);
-																			pinnedNotes.set(
-																				await getPinnedNoteList(localStorage.token).catch(() => [])
-																			);
-																			init();
-																		}}
-																	>
-																		<button
-																			class="self-center w-fit text-sm p-1 text-gray-500 hover:text-gray-900 dark:text-gray-300 dark:hover:text-gray-100 rounded-xl"
-																			type="button"
-																		>
-																			<EllipsisHorizontal className="size-5" />
-																		</button>
-																	</NoteMenu>
-																</div>
-															</div>
+												<a
+													href={`/notes/${note.id}`}
+													class="flex min-w-0 flex-1 items-center gap-3"
+												>
+													<Tooltip
+														content={note.title}
+														className="min-w-0 flex-1"
+														placement="top-start"
+													>
+														<div
+															class="truncate text-[13px] leading-5 text-gray-800 dark:text-gray-200"
+														>
+															{note.title}
 														</div>
+													</Tooltip>
+
+													<div
+														class="hidden shrink-0 items-center gap-2 text-[11px] leading-5 text-gray-500 dark:text-gray-500 sm:flex"
+													>
+														<Tooltip content={dayjs(note.updated_at / 1000000).format('LLLL')}>
+															<div>{dayjs(note.updated_at / 1000000).fromNow()}</div>
+														</Tooltip>
+
+														<Tooltip
+															content={note?.user?.email ?? $i18n.t('Deleted User')}
+															className="flex min-w-0 shrink"
+															placement="top-start"
+														>
+															<div class="flex min-w-0 items-center gap-2">
+																<span class="text-gray-300 dark:text-gray-700">·</span>
+																<span class="max-w-28 truncate">
+																	{capitalizeFirstLetter(
+																		note?.user?.name ?? note?.user?.email ?? $i18n.t('Deleted User')
+																	)}
+																</span>
+															</div>
+														</Tooltip>
 													</div>
 												</a>
+
+												<NoteMenu
+													onDownload={(type) => {
+														selectedNote = note;
+
+														downloadHandler(type);
+													}}
+													onCopyLink={async () => {
+														const baseUrl = window.location.origin;
+														const res = await copyToClipboard(`${baseUrl}/notes/${note.id}`);
+
+														if (res) {
+															toast.success($i18n.t('Copied link to clipboard'));
+														} else {
+															toast.error($i18n.t('Failed to copy link'));
+														}
+													}}
+													onDelete={() => {
+														selectedNote = note;
+														showDeleteConfirm = true;
+													}}
+													isPinned={note.is_pinned ?? false}
+													onPin={async () => {
+														await toggleNotePinnedStatusById(localStorage.token, note.id);
+														pinnedNotes.set(
+															await getPinnedNoteList(localStorage.token).catch(() => [])
+														);
+														init();
+													}}
+												>
+													<button
+														class="flex size-6 items-center justify-center rounded-lg text-gray-400 transition hover:bg-gray-100 hover:text-gray-700 dark:text-gray-500 dark:hover:bg-gray-800 dark:hover:text-gray-200"
+														type="button"
+														aria-label={$i18n.t('Note Menu')}
+													>
+														<EllipsisHorizontal className="size-4" />
+													</button>
+												</NoteMenu>
 											</div>
 										{/each}
 									</div>
@@ -613,96 +611,91 @@
 									>
 										{#each notesList as note, idx (note.id)}
 											<div
-												class="flex space-x-4 cursor-pointer w-full px-3 py-2.5 bg-transparent hover:bg-gray-50/70 dark:hover:bg-gray-850/50 rounded-2xl transition"
+												class="group flex min-h-32 w-full flex-col rounded-lg bg-gray-50/40 p-2.5 text-left transition hover:bg-gray-100/60 focus-within:bg-gray-100/60 dark:bg-gray-900/30 dark:hover:bg-gray-900 dark:focus-within:bg-gray-900"
 											>
-												<div class=" flex flex-1 space-x-4 cursor-pointer w-full">
-													<a
-														href={`/notes/${note.id}`}
-														class="w-full -translate-y-0.5 flex flex-col justify-between"
+												<div class="flex items-start gap-2">
+													<a href={`/notes/${note.id}`} class="min-w-0 flex-1">
+														<Tooltip content={note.title} placement="top-start">
+															<div
+																class="truncate text-[13px] leading-5 text-gray-800 dark:text-gray-200"
+															>
+																{note.title}
+															</div>
+														</Tooltip>
+													</a>
+
+													<NoteMenu
+														onDownload={(type) => {
+															selectedNote = note;
+
+															downloadHandler(type);
+														}}
+														onCopyLink={async () => {
+															const baseUrl = window.location.origin;
+															const res = await copyToClipboard(`${baseUrl}/notes/${note.id}`);
+
+															if (res) {
+																toast.success($i18n.t('Copied link to clipboard'));
+															} else {
+																toast.error($i18n.t('Failed to copy link'));
+															}
+														}}
+														onDelete={() => {
+															selectedNote = note;
+															showDeleteConfirm = true;
+														}}
+														isPinned={note.is_pinned ?? false}
+														onPin={async () => {
+															await toggleNotePinnedStatusById(localStorage.token, note.id);
+															pinnedNotes.set(
+																await getPinnedNoteList(localStorage.token).catch(() => [])
+															);
+															init();
+														}}
 													>
-														<div class="flex-1">
-															<div
-																class="  flex items-center gap-2 self-center mb-1 justify-between"
-															>
-																<div class="line-clamp-1 capitalize">
-																	{note.title}
-																</div>
+														<button
+															class="flex size-6 items-center justify-center rounded-lg text-gray-400 transition hover:bg-gray-100 hover:text-gray-700 dark:text-gray-500 dark:hover:bg-gray-800 dark:hover:text-gray-200"
+															type="button"
+															aria-label={$i18n.t('Note Menu')}
+														>
+															<EllipsisHorizontal className="size-4" />
+														</button>
+													</NoteMenu>
+												</div>
 
-																<div>
-																	<NoteMenu
-																		onDownload={(type) => {
-																			selectedNote = note;
+												<a href={`/notes/${note.id}`} class="mt-1 flex min-h-0 flex-1 flex-col">
+													<div
+														class="line-clamp-3 text-xs leading-5 text-gray-500 dark:text-gray-500"
+													>
+														{#if note.data?.content?.md}
+															{note.data?.content?.md}
+														{:else}
+															{$i18n.t('No content')}
+														{/if}
+													</div>
 
-																			downloadHandler(type);
-																		}}
-																		onCopyLink={async () => {
-																			const baseUrl = window.location.origin;
-																			const res = await copyToClipboard(
-																				`${baseUrl}/notes/${note.id}`
-																			);
-
-																			if (res) {
-																				toast.success($i18n.t('Copied link to clipboard'));
-																			} else {
-																				toast.error($i18n.t('Failed to copy link'));
-																			}
-																		}}
-																		onDelete={() => {
-																			selectedNote = note;
-																			showDeleteConfirm = true;
-																		}}
-																		isPinned={note.is_pinned ?? false}
-																		onPin={async () => {
-																			await toggleNotePinnedStatusById(localStorage.token, note.id);
-																			pinnedNotes.set(
-																				await getPinnedNoteList(localStorage.token).catch(() => [])
-																			);
-																			init();
-																		}}
-																	>
-																		<button
-																			class="self-center w-fit text-sm p-1 text-gray-500 hover:text-gray-900 dark:text-gray-300 dark:hover:text-gray-100 rounded-xl"
-																			type="button"
-																		>
-																			<EllipsisHorizontal className="size-5" />
-																		</button>
-																	</NoteMenu>
-																</div>
-															</div>
-
-															<div
-																class=" text-xs text-gray-500 dark:text-gray-500 mb-3 line-clamp-3 min-h-10"
-															>
-																{#if note.data?.content?.md}
-																	{note.data?.content?.md}
-																{:else}
-																	{$i18n.t('No content')}
-																{/if}
-															</div>
-														</div>
-
-														<div class=" text-xs px-0.5 w-full flex justify-between items-center">
-															<div>
+													<div
+														class="mt-auto flex w-full items-center justify-between gap-2 pt-3 text-[11px] leading-4 text-gray-500 dark:text-gray-500"
+													>
+														<Tooltip content={dayjs(note.updated_at / 1000000).format('LLLL')}>
+															<div class="shrink-0">
 																{dayjs(note.updated_at / 1000000).fromNow()}
 															</div>
-															<Tooltip
-																content={note?.user?.email ?? $i18n.t('Deleted User')}
-																className="flex shrink-0"
-																placement="top-start"
-															>
-																<div class="shrink-0 text-gray-500">
-																	{$i18n.t('By {{name}}', {
-																		name: capitalizeFirstLetter(
-																			note?.user?.name ??
-																				note?.user?.email ??
-																				$i18n.t('Deleted User')
-																		)
-																	})}
-																</div>
-															</Tooltip>
-														</div>
-													</a>
-												</div>
+														</Tooltip>
+
+														<Tooltip
+															content={note?.user?.email ?? $i18n.t('Deleted User')}
+															className="min-w-0"
+															placement="top-start"
+														>
+															<div class="truncate">
+																{capitalizeFirstLetter(
+																	note?.user?.name ?? note?.user?.email ?? $i18n.t('Deleted User')
+																)}
+															</div>
+														</Tooltip>
+													</div>
+												</a>
 											</div>
 										{/each}
 									</div>
diff --git a/src/routes/(app)/automations/+page.svelte b/src/routes/(app)/automations/+page.svelte
index c6d927d4d7..9f64b12f3e 100644
--- a/src/routes/(app)/automations/+page.svelte
+++ b/src/routes/(app)/automations/+page.svelte
@@ -546,17 +546,19 @@
 						<div class="gap-y-0.5 grid my-1">
 							{#each automations as automation (automation.id)}
 								<a
-									class="flex space-x-4 text-left w-full px-3 py-2 bg-transparent hover:bg-gray-50/70 dark:hover:bg-gray-850/50 transition rounded-2xl"
+									class="group flex min-h-10 w-full items-center gap-2 rounded-lg px-2 py-1 text-left transition hover:bg-gray-50 focus:bg-gray-50 dark:hover:bg-gray-900 dark:focus:bg-gray-900"
 									href={`/automations/${automation.id}`}
 								>
-									<div class="flex-1">
-										<div class="line-clamp-1 text-sm">{automation.name}</div>
-										<div class="text-xs text-gray-500 line-clamp-1">
+									<div class="min-w-0 flex-1">
+										<div class="truncate text-[13px] leading-5 text-gray-800 dark:text-gray-200">
+											{automation.name}
+										</div>
+										<div class="truncate text-[11px] leading-4 text-gray-500 dark:text-gray-500">
 											{formatRRule(automation.data.rrule)}
 										</div>
 									</div>
 
-									<div class="flex flex-row gap-0.5 self-center">
+									<div class="flex shrink-0 flex-row items-center gap-0.5 self-center">
 										<AutomationMenu
 											editHandler={() => {
 												goto(`/automations/${automation.id}`);
@@ -573,14 +575,16 @@
 											}}
 										>
 											<button
-												class="self-center w-fit text-sm p-1.5 text-gray-500 hover:text-gray-900 dark:text-gray-300 dark:hover:text-gray-100 rounded-xl"
+												class="flex size-6 items-center justify-center rounded-lg text-gray-400 transition hover:bg-gray-100 hover:text-gray-700 dark:text-gray-500 dark:hover:bg-gray-800 dark:hover:text-gray-200"
 												type="button"
+												aria-label={$i18n.t('Automation Menu')}
 											>
-												<EllipsisHorizontal className="size-5" />
+												<EllipsisHorizontal className="size-4" />
 											</button>
 										</AutomationMenu>
 
 										<button
+											class="flex h-6 items-center"
 											on:click={(e) => {
 												e.stopPropagation();
 												e.preventDefault();