9 files changed, 64 insertions, 28 deletions
diff --git a/web_src/css/features/codeeditor.css b/web_src/css/features/codeeditor.css
index 34a104c833..2a8accbcc8 100644
--- a/web_src/css/features/codeeditor.css
+++ b/web_src/css/features/codeeditor.css
@@ -21,6 +21,11 @@
   background-color: transparent !important;
 }
 
+.monaco-editor,
+.monaco-editor .overflow-guard {
+  border-radius: var(--border-radius);
+}
+
 /* these seem unthemeable */
 .monaco-scrollable-element > .scrollbar > .slider {
   background: var(--color-primary) !important;
diff --git a/web_src/css/modules/card.css b/web_src/css/modules/card.css
index 2406def681..d5d5e757d6 100644
--- a/web_src/css/modules/card.css
+++ b/web_src/css/modules/card.css
@@ -21,6 +21,7 @@
   border: 1px solid var(--color-secondary);
   box-shadow: none;
   word-wrap: break-word;
+  border-radius: var(--border-radius);
 }
 
 .ui.card {
diff --git a/web_src/css/modules/menu.css b/web_src/css/modules/menu.css
index e393ec5186..830e4cdbc3 100644
--- a/web_src/css/modules/menu.css
+++ b/web_src/css/modules/menu.css
@@ -799,3 +799,23 @@
 .ui.segment .ui.tabular.menu .active.item:hover {
   background: var(--color-box-body);
 }
+
+.small-menu-items {
+  min-height: 35.4px !important; /* match .small.button in height */
+  background: none !important; /* fomantic sets a color here which does not play well with active transparent color on the item, so unset and set the colors on the item */
+  user-select: none;
+}
+
+.small-menu-items .item {
+  background: var(--color-menu) !important;
+  padding-top: 6px !important;
+  padding-bottom: 6px !important;
+}
+
+.small-menu-items .item:hover {
+  background: var(--color-hover) !important;
+}
+
+.small-menu-items .item.active {
+  background: var(--color-active) !important;
+}
diff --git a/web_src/css/modules/modal.css b/web_src/css/modules/modal.css
index a2acfeaa15..427d2529c8 100644
--- a/web_src/css/modules/modal.css
+++ b/web_src/css/modules/modal.css
@@ -54,6 +54,7 @@ These inconsistent layouts should be refactored to simple ones.
 .ui.modal form > .content {
   padding: 1.5em;
   background: var(--color-body);
+  border-radius: 0 0 var(--border-radius) var(--border-radius);
 }
 
 .ui.modal > .actions,
@@ -63,6 +64,7 @@ These inconsistent layouts should be refactored to simple ones.
   border-color: var(--color-secondary);
   padding: 1rem;
   text-align: right;
+  border-radius: 0 0 var(--border-radius) var(--border-radius);
 }
 
 .ui.modal .content > .actions {
diff --git a/web_src/css/modules/segment.css b/web_src/css/modules/segment.css
index 994ac1779a..cb307dc1a3 100644
--- a/web_src/css/modules/segment.css
+++ b/web_src/css/modules/segment.css
@@ -152,7 +152,9 @@
 }
 
 .ui.attached.segment:has(+ .ui[class*="top attached"].header),
-.ui.attached.segment:last-child {
+.ui.attached.segment:last-child,
+.ui.segment:has(+ .ui.segment:not(.attached)),
+.ui.attached.segment:has(+ .ui.modal) {
   border-radius: 0 0 0.28571429rem 0.28571429rem;
 }
 
@@ -166,6 +168,10 @@
 .ui.segment[class*="top attached"]:first-child {
   margin-top: 0;
 }
+.ui[class*="top attached"].segment:last-child {
+  border-top-left-radius: 0.28571429rem;
+  border-top-right-radius: 0.28571429rem;
+}
 
 .ui.segment[class*="bottom attached"] {
   bottom: 0;
diff --git a/web_src/css/repo.css b/web_src/css/repo.css
index dacb98ddb8..0b46f6b69f 100644
--- a/web_src/css/repo.css
+++ b/web_src/css/repo.css
@@ -1586,6 +1586,7 @@ td .commit-summary {
 
 .repository .diff-file-box .file-body.file-code {
   background: var(--color-code-bg);
+  border-radius: var(--border-radius);
 }
 
 .repository .diff-file-box .file-body.file-code .lines-num {
@@ -2382,6 +2383,22 @@ tbody.commit-list {
   vertical-align: middle;
 }
 
+/* fix bottom border radius on diff files */
+.diff-file-body tr.tag-code:last-child {
+  background: none;
+}
+.diff-file-body tr.tag-code:last-child > td {
+  background: var(--color-box-body-highlight);
+}
+.diff-file-body tr.tag-code:last-child td:first-child,
+.diff-file-body tr.tag-code:last-child td:first-child * {
+  border-bottom-left-radius: 3px;
+}
+.diff-file-body tr.tag-code:last-child td:last-child,
+.diff-file-body tr.tag-code:last-child td:last-child * {
+  border-bottom-right-radius: 3px;
+}
+
 .resolved-placeholder {
   font-weight: var(--font-weight-normal) !important;
   border: 1px solid var(--color-secondary) !important;
@@ -2491,6 +2508,7 @@ tbody.commit-list {
 
 .diff-file-header {
   padding: 5px 8px !important;
+  box-shadow: 0 -1px 0 1px var(--color-body); /* prevent borders being visible behind top corners when sticky and scrolled */
 }
 
 .diff-file-box[data-folded="true"] .diff-file-body {
diff --git a/web_src/css/repo/list-header.css b/web_src/css/repo/list-header.css
index 304cfbc13c..4440bba8df 100644
--- a/web_src/css/repo/list-header.css
+++ b/web_src/css/repo/list-header.css
@@ -25,25 +25,6 @@
   flex: 1;
 }
 
-.small-menu-items {
-  min-height: 35.4px !important; /* match .small.button in height */
-  background: none !important; /* fomantic sets a color here which does not play well with active transparent color on the item, so unset and set the colors on the item */
-}
-
-.small-menu-items .item {
-  background: var(--color-menu) !important;
-  padding-top: 6px !important;
-  padding-bottom: 6px !important;
-}
-
-.small-menu-items .item:hover {
-  background: var(--color-hover) !important;
-}
-
-.small-menu-items .item.active {
-  background: var(--color-active) !important;
-}
-
 @media (max-width: 767.98px) {
   .list-header-search {
     order: 0;
diff --git a/web_src/js/features/codeeditor.js b/web_src/js/features/codeeditor.js
index f5e4e74dc6..4dfef8c2b2 100644
--- a/web_src/js/features/codeeditor.js
+++ b/web_src/js/features/codeeditor.js
@@ -98,6 +98,7 @@ export async function createMonaco(textarea, filename, editorOpts) {
       'input.foreground': getColor('--color-input-text'),
       'scrollbar.shadow': getColor('--color-shadow'),
       'progressBar.background': getColor('--color-primary'),
+      'focusBorder': '#0000', // prevent blue border
     },
   });
 
diff --git a/web_src/js/features/repo-editor.js b/web_src/js/features/repo-editor.js
index 01dc4b95aa..a5232cb4b6 100644
--- a/web_src/js/features/repo-editor.js
+++ b/web_src/js/features/repo-editor.js
@@ -7,9 +7,9 @@ import {attachRefIssueContextPopup} from './contextpopup.js';
 import {POST} from '../modules/fetch.js';
 
 function initEditPreviewTab($form) {
-  const $tabMenu = $form.find('.tabular.menu');
+  const $tabMenu = $form.find('.repo-editor-menu');
   $tabMenu.find('.item').tab();
-  const $previewTab = $tabMenu.find(`.item[data-tab="${$tabMenu.data('preview')}"]`);
+  const $previewTab = $tabMenu.find('a[data-tab="preview"]');
   if ($previewTab.length) {
     $previewTab.on('click', async function () {
       const $this = $(this);
@@ -24,13 +24,15 @@ function initEditPreviewTab($form) {
       const formData = new FormData();
       formData.append('mode', mode);
       formData.append('context', context);
-      formData.append('text', $form.find(`.tab[data-tab="${$tabMenu.data('write')}"] textarea`).val());
+      formData.append('text', $form.find('.tab[data-tab="write"] textarea').val());
       formData.append('file_path', $treePathEl.val());
       try {
         const response = await POST($this.data('url'), {data: formData});
         const data = await response.text();
-        const $previewPanel = $form.find(`.tab[data-tab="${$tabMenu.data('preview')}"]`);
-        renderPreviewPanelContent($previewPanel, data);
+        const $previewPanel = $form.find('.tab[data-tab="preview"]');
+        if ($previewPanel.length) {
+          renderPreviewPanelContent($previewPanel, data);
+        }
       } catch (error) {
         console.error('Error:', error);
       }
@@ -175,10 +177,10 @@ export function initRepoEditor() {
   })();
 }
 
-export function renderPreviewPanelContent($panelPreviewer, data) {
-  $panelPreviewer.html(data);
+export function renderPreviewPanelContent($previewPanel, data) {
+  $previewPanel.html(data);
   initMarkupContent();
 
-  const $refIssues = $panelPreviewer.find('p .ref-issue');
+  const $refIssues = $previewPanel.find('p .ref-issue');
   attachRefIssueContextPopup($refIssues);
 }