diff --git a/components/modals/CommitHistoryModal.tsx b/components/modals/CommitHistoryModal.tsx
index d64a21c..b334cb1 100644
--- a/components/modals/CommitHistoryModal.tsx
+++ b/components/modals/CommitHistoryModal.tsx
@@ -345,7 +345,7 @@ const CommitHistoryModal: React.FC<CommitHistoryModalProps> = ({ isOpen, reposit
             <p className="text-center text-gray-500">{debouncedSearchQuery ? `No commits found for "${debouncedSearchQuery}".` : 'No commits found.'}</p>
           ) : (
             <>
-              <ul className="space-y-3">
+              <ul className="space-y-3 list-none p-0">
                 {commits.map(commit => {
                   const isExpanded = expandedCommits.has(commit.hash);
                   const diffFiles = diffCache[commit.hash] || [];
@@ -362,6 +362,7 @@ const CommitHistoryModal: React.FC<CommitHistoryModalProps> = ({ isOpen, reposit
                   const noFilesMessage = diffFiles.length === 0 && filter === 'all'
                     ? 'No files changed in this commit.'
                     : 'No files match the selected filter.';
+                  const sanitizedMessage = commit.message.trimStart();
 
                   return (
                     <li key={commit.hash} className="p-3 bg-gray-50 dark:bg-gray-900/50 rounded-lg border border-gray-200 dark:border-gray-700">
@@ -374,8 +375,8 @@ const CommitHistoryModal: React.FC<CommitHistoryModalProps> = ({ isOpen, reposit
                           {isExpanded ? <ChevronDownIcon className="h-5 w-5" /> : <ChevronRightIcon className="h-5 w-5" />}
                         </span>
                         <div className="flex-1">
-                          <div className="font-sans whitespace-pre-wrap text-gray-900 dark:text-gray-100">
-                            <HighlightedText text={commit.message} highlight={debouncedSearchQuery} />
+                          <div className="font-sans text-gray-900 dark:text-gray-100">
+                            <span className="block whitespace-pre-line"><HighlightedText text={sanitizedMessage} highlight={debouncedSearchQuery} /></span>
                           </div>
                         </div>
                       </button>
diff --git a/components/modals/RepoFormModal.tsx b/components/modals/RepoFormModal.tsx
index 4768baa..d1b57de 100644
--- a/components/modals/RepoFormModal.tsx
+++ b/components/modals/RepoFormModal.tsx
@@ -1856,15 +1856,19 @@ interface CommitListItemProps {
 
 const CommitListItem: React.FC<CommitListItemProps> = ({ commit, highlight }) => {
   const commitHashTooltip = useTooltip(commit.hash);
+  const sanitizedMessage = commit.message.trimStart();
+
   return (
     <li className="p-3 bg-gray-50 dark:bg-gray-900/50 rounded-lg border border-gray-200 dark:border-gray-700">
-        <pre className="font-sans whitespace-pre-wrap text-gray-900 dark:text-gray-100">
-          <HighlightedText text={commit.message} highlight={highlight} />
-        </pre>
-        <div className="flex items-center justify-between text-xs text-gray-500 dark:text-gray-400 mt-2 pt-2 border-t border-gray-200 dark:border-gray-700">
-            <span>{commit.author}</span>
-            <span {...commitHashTooltip} className="font-mono">{commit.shortHash} &bull; {commit.date}</span>
-        </div>
+      <div className="font-sans text-gray-900 dark:text-gray-100">
+        <span className="block whitespace-pre-line leading-relaxed">
+          <HighlightedText text={sanitizedMessage} highlight={highlight} />
+        </span>
+      </div>
+      <div className="flex items-center justify-between text-xs text-gray-500 dark:text-gray-400 mt-2 pt-2 border-t border-gray-200 dark:border-gray-700">
+        <span>{commit.author}</span>
+        <span {...commitHashTooltip} className="font-mono">{commit.shortHash} &bull; {commit.date}</span>
+      </div>
     </li>
   );
 };
@@ -3483,7 +3487,11 @@ const RepoEditView: React.FC<RepoEditViewProps> = ({ onSave, onCancel, repositor
                             <p className="text-center text-gray-500">{debouncedHistorySearch ? `No commits found for "${debouncedHistorySearch}".` : 'No commits found.'}</p>
                         ) : (
                             <>
-                                {commits.map(commit => <CommitListItem key={commit.hash} commit={commit} highlight={debouncedHistorySearch} />)}
+                                <ul className="space-y-3 list-none p-0 m-0">
+                                    {commits.map(commit => (
+                                        <CommitListItem key={commit.hash} commit={commit} highlight={debouncedHistorySearch} />
+                                    ))}
+                                </ul>
                                 {hasMoreHistory && (
                                     <div className="text-center">
                                         <button onClick={() => fetchHistory(true)} disabled={isMoreHistoryLoading} className="px-4 py-2 text-sm font-medium text-white bg-blue-600 rounded-md hover:bg-blue-700 disabled:bg-gray-500">
diff --git a/docs/history-tab-preview.html b/docs/history-tab-preview.html
new file mode 100644
index 0000000..7f097c5
--- /dev/null
+++ b/docs/history-tab-preview.html
@@ -0,0 +1,42 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>History Tab Preview</title>
+    <script src="https://cdn.tailwindcss.com"></script>
+  </head>
+  <body class="bg-gray-100 min-h-screen flex items-start justify-center p-10">
+    <div class="bg-white shadow-xl rounded-lg max-w-3xl w-full">
+      <div class="p-4 border-b flex items-center gap-3">
+        <div class="bg-blue-100 text-blue-600 rounded-full h-10 w-10 flex items-center justify-center font-bold">H</div>
+        <div>
+          <h1 class="text-xl font-bold">Commit History</h1>
+          <p class="text-sm text-gray-500">for 'git-automation'</p>
+        </div>
+      </div>
+      <div class="p-4">
+        <ul class="space-y-3 list-none p-0">
+          <li class="p-3 bg-gray-50 rounded-lg border border-gray-200">
+            <div class="font-sans text-gray-900">
+              <span class="commit-message block whitespace-pre-line">Merge pull request #10 from beNative/codex/add-sqljs-support-and-configuration</span>
+            </div>
+            <div class="flex flex-col gap-2 text-xs text-gray-500 mt-2 pt-2 border-t border-gray-200 sm:flex-row sm:items-center sm:justify-between">
+              <span>Tim Sinaeve</span>
+              <span class="font-mono">7986e7f • 6 weeks ago</span>
+            </div>
+          </li>
+          <li class="p-3 bg-gray-50 rounded-lg border border-gray-200">
+            <div class="font-sans text-gray-900">
+              <span class="commit-message block whitespace-pre-line">Use bundled sql.js assets for offline operation</span>
+            </div>
+            <div class="flex flex-col gap-2 text-xs text-gray-500 mt-2 pt-2 border-t border-gray-200 sm:flex-row sm:items-center sm:justify-between">
+              <span>Tim Sinaeve</span>
+              <span class="font-mono">44e8c63 • 6 weeks ago</span>
+            </div>
+          </li>
+        </ul>
+      </div>
+    </div>
+  </body>
+</html>