From ae751bfb915c513b811e34d9a25da430a89a7e13 Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Sat, 11 Apr 2026 13:20:22 +0300
Subject: [PATCH] feat(delete): improve layout of the note path

---
 apps/client/src/widgets/dialogs/delete_notes.css | 16 ++++++++++++++--
 apps/client/src/widgets/dialogs/delete_notes.tsx |  4 +---
 2 files changed, 15 insertions(+), 5 deletions(-)

diff --git a/apps/client/src/widgets/dialogs/delete_notes.css b/apps/client/src/widgets/dialogs/delete_notes.css
index 9a648cc474..864fcc2e0c 100644
--- a/apps/client/src/widgets/dialogs/delete_notes.css
+++ b/apps/client/src/widgets/dialogs/delete_notes.css
@@ -8,11 +8,23 @@
 
 .delete-notes-dialog .preview-list {
     margin: 0;
-    padding-left: 20px;
+    padding: 0;
+    list-style: none;
     max-height: 200px;
     overflow: auto;
 }
 
 .delete-notes-dialog .preview-list li {
-    margin-bottom: 4px;
+    padding: 6px 16px;
+    border-bottom: 1px solid var(--main-border-color);
+}
+
+.delete-notes-dialog .preview-list li:last-child {
+    border-bottom: none;
+}
+
+.delete-notes-dialog .preview-list small {
+    margin-inline-start: 8px;
+    font-size: 0.8em;
+    color: var(--muted-text-color);
 }
diff --git a/apps/client/src/widgets/dialogs/delete_notes.tsx b/apps/client/src/widgets/dialogs/delete_notes.tsx
index 5bc0c8b528..a159194c0a 100644
--- a/apps/client/src/widgets/dialogs/delete_notes.tsx
+++ b/apps/client/src/widgets/dialogs/delete_notes.tsx
@@ -124,8 +124,6 @@ export default function DeleteNotesDialog() {
                         deleteAllClones={deleteAllClones}
                         setDeleteAllClones={setDeleteAllClones}
                     />
-                </CardSection>
-                <CardSection>
                     <OptionsRow
                         name="erase-notes"
                         label={t("delete_notes.erase_notes_label")}
@@ -184,7 +182,7 @@ function DeleteAllClonesOption({ cloneInfo, deleteAllClones, setDeleteAllClones
 function DeletedNotes({ noteIdsToBeDeleted }: { noteIdsToBeDeleted: DeleteNotesPreview["noteIdsToBeDeleted"] }) {
     return (
         <Card heading={t("delete_notes.notes_to_be_deleted", { notesCount: noteIdsToBeDeleted.length })}>
-            <CardSection>
+            <CardSection noPadding={noteIdsToBeDeleted.length > 0}>
                 {noteIdsToBeDeleted.length ? (
                     <ul className="preview-list">
                         {noteIdsToBeDeleted.map((noteId) => (