Fix all rounded borders, change affected tab menus to pills (#30707) (#30769)

Backport #30707 by @silverwind

Fixes https://github.com/go-gitea/gitea/issues/30673, all 23 issues.
Notes:

- Tab bar menus had to change to pills because of unsolvable issue with
the border-radius as tab bar renders a overlapping border onto the box
below. And I think pills look better.
- Added padding to code editor empty preview message
- Hide monaco's built-in blue focus border, we don't need it and it
never showed before either.
- Label add menu is simplified, removing the nested segment.

<img width="1322" alt="Screenshot 2024-04-25 at 22 26 19"
src="https://github.com/go-gitea/gitea/assets/115237/7e394e0c-b7ad-417d-8e9f-12f1dea93ed1">
<img width="1326" alt="Screenshot 2024-04-25 at 22 28 00"
src="https://github.com/go-gitea/gitea/assets/115237/66c8499f-aa9f-4d95-8cca-ef13dfa82c65">
<img width="997" alt="Screenshot 2024-04-25 at 22 36 53"
src="https://github.com/go-gitea/gitea/assets/115237/07896102-c71d-4246-8173-c2bc2e1d3cae">
<img width="832" alt="Screenshot 2024-04-25 at 22 56 09"
src="https://github.com/go-gitea/gitea/assets/115237/d83afc96-08ca-4adc-baf4-3d02804be57c">
<img width="361" alt="Screenshot 2024-04-25 at 22 57 12"
src="https://github.com/go-gitea/gitea/assets/115237/c7371a68-00b5-47d8-84d0-ddc5268b2b2c">

Co-authored-by: silverwind <me@silverwind.io>
Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>

diff --git a/routers/web/repo/editor.go b/routers/web/repo/editor.go
index 474f7ff1da42895e63862c3f9bd762661a6e3604..474d7503e4c7abfb6ecbc39d9316cb5b8f2ad30e 100644 (file)
--- a/routers/web/repo/editor.go
+++ b/routers/web/repo/editor.go
@@ -419,11 +419,9 @@ func DiffPreviewPost(ctx *context.Context) {
                return
        }
 
-       if diff.NumFiles == 0 {
-               ctx.PlainText(http.StatusOK, ctx.Locale.TrString("repo.editor.no_changes_to_show"))
-               return
+       if diff.NumFiles != 0 {
+               ctx.Data["File"] = diff.Files[0]
        }
-       ctx.Data["File"] = diff.Files[0]
 
        ctx.HTML(http.StatusOK, tplEditDiffPreview)
 }

diff --git a/templates/org/team/members.tmpl b/templates/org/team/members.tmpl
index 7e9a59a6bfb45a1a9586ad32359d070ac0e8fba2..5433f01530ff340743faa69afaf9404051c1ba09 100644 (file)
--- a/templates/org/team/members.tmpl
+++ b/templates/org/team/members.tmpl
@@ -8,7 +8,7 @@
                        <div class="ui ten wide column">
                                {{template "org/team/navbar" .}}
                                {{if .IsOrganizationOwner}}
-                                       <div class="ui attached segment">
+                                       <div class="ui top attached segment">
                                                <form class="ui form ignore-dirty tw-flex tw-flex-wrap tw-gap-2" action="{{$.OrgLink}}/teams/{{$.Team.LowerName | PathEscape}}/action/add" method="post">
                                                        {{.CsrfTokenHtml}}
                                                        <input type="hidden" name="uid" value="{{.SignedUser.ID}}">
@@ -21,7 +21,7 @@
                                                </form>
                                        </div>
                                {{end}}
-                               <div class="ui attached segment">
+                               <div class="ui{{if not .IsOrganizationOwner}} top{{end}} attached segment">
                                        <div class="flex-list">
                                                {{range .Team.Members}}
                                                        <div class="flex-item tw-items-center">

diff --git a/templates/org/team/navbar.tmpl b/templates/org/team/navbar.tmpl
index 8f2571e1f6a9df149c97c73bd757344092e6a0d9..9704f63f6fb5150318eb75eecf54a995b8783b06 100644 (file)
--- a/templates/org/team/navbar.tmpl
+++ b/templates/org/team/navbar.tmpl
@@ -1,4 +1,4 @@
-<div class="ui top attached tabular menu org-team-navbar">
+<div class="ui compact small menu small-menu-items org-team-navbar">
        <a class="item{{if .PageIsOrgTeamMembers}} active{{end}}" href="{{.OrgLink}}/teams/{{.Team.LowerName | PathEscape}}">{{svg "octicon-person"}} <strong>{{.Team.NumMembers}}</strong>&nbsp; {{ctx.Locale.Tr "org.lower_members"}}</a>
        <a class="item{{if .PageIsOrgTeamRepos}} active{{end}}" href="{{.OrgLink}}/teams/{{.Team.LowerName | PathEscape}}/repositories">{{svg "octicon-repo"}} <strong>{{.Team.NumRepos}}</strong>&nbsp; {{ctx.Locale.Tr "org.lower_repositories"}}</a>
 </div>

diff --git a/templates/org/team/repositories.tmpl b/templates/org/team/repositories.tmpl
index f5d68ce41633d5d0000db26d17c85f8224a604ed..502cf97992a7da9e0612caf1013e80d9d0e554ea 100644 (file)
--- a/templates/org/team/repositories.tmpl
+++ b/templates/org/team/repositories.tmpl
@@ -25,7 +25,7 @@
                                                </div>
                                        </div>
                                {{end}}
-                               <div class="ui attached segment">
+                               <div class="ui{{if not $canAddRemove}} top{{end}} attached segment">
                                        <div class="flex-list">
                                                {{range .Team.Repos}}
                                                        <div class="flex-item tw-items-center">

diff --git a/templates/repo/commit_page.tmpl b/templates/repo/commit_page.tmpl
index 938d93b323ae0ac84da1a15024ec1aa51085cf79..b8195ac544983d0d37542654c56d06a09e7c4910 100644 (file)
--- a/templates/repo/commit_page.tmpl
+++ b/templates/repo/commit_page.tmpl
@@ -139,7 +139,7 @@
                        {{end}}
                        {{template "repo/commit_load_branches_and_tags" .}}
                </div>
-               <div class="ui attached segment tw-flex tw-items-center tw-justify-between tw-py-1 commit-header-row tw-flex-wrap {{$class}}">
+               <div class="ui{{if not .Commit.Signature}} bottom{{end}} attached segment tw-flex tw-items-center tw-justify-between tw-py-1 commit-header-row tw-flex-wrap {{$class}}">
                                <div class="tw-flex tw-items-center author">
                                        {{if .Author}}
                                                {{ctx.AvatarUtils.Avatar .Author 28 "tw-mr-2"}}

diff --git a/templates/repo/editor/diff_preview.tmpl b/templates/repo/editor/diff_preview.tmpl
index e2e922be343ca27be93ba39b83b31229283f6fd2..fd543a5ab968fb4487f6e17a0134aa56b2618117 100644 (file)
--- a/templates/repo/editor/diff_preview.tmpl
+++ b/templates/repo/editor/diff_preview.tmpl
@@ -1,3 +1,4 @@
+{{if .File}}
 <div class="diff-file-box">
        <div class="ui attached table segment">
                <div class="file-body file-code code-diff code-diff-unified unicode-escaped">
@@ -9,3 +10,8 @@
                </div>
        </div>
 </div>
+{{else}}
+<div class="tw-p-6 tw-text-center">
+       {{ctx.Locale.Tr "repo.editor.no_changes_to_show"}}
+</div>
+{{end}}

diff --git a/templates/repo/editor/edit.tmpl b/templates/repo/editor/edit.tmpl
index d52e5a047ab26478f3fdf467b89029aa01e03fb9..ae3f12669c252c54655f52db1f6ce5acb41f0f2c 100644 (file)
--- a/templates/repo/editor/edit.tmpl
+++ b/templates/repo/editor/edit.tmpl
@@ -26,14 +26,14 @@
                                </div>
                        </div>
                        <div class="field">
-                               <div class="ui top attached tabular menu" data-write="write" data-preview="preview" data-diff="diff">
+                               <div class="ui compact small menu small-menu-items repo-editor-menu">
                                        <a class="active item" data-tab="write">{{svg "octicon-code"}} {{if .IsNewFile}}{{ctx.Locale.Tr "repo.editor.new_file"}}{{else}}{{ctx.Locale.Tr "repo.editor.edit_file"}}{{end}}</a>
                                        <a class="item" data-tab="preview" data-url="{{.Repository.Link}}/markup" data-context="{{.RepoLink}}/src/{{.BranchNameSubURL}}" data-markup-mode="file">{{svg "octicon-eye"}} {{ctx.Locale.Tr "preview"}}</a>
                                        {{if not .IsNewFile}}
                                        <a class="item" data-tab="diff" hx-params="context,content" hx-vals='{"context":"{{.BranchLink}}"}' hx-include="#edit_area" hx-swap="innerHTML" hx-target=".tab[data-tab='diff']" hx-indicator=".tab[data-tab='diff']" hx-post="{{.RepoLink}}/_preview/{{.BranchName | PathEscapeSegments}}/{{.TreePath | PathEscapeSegments}}">{{svg "octicon-diff"}} {{ctx.Locale.Tr "repo.editor.preview_changes"}}</a>
                                        {{end}}
                                </div>
-                               <div class="ui bottom attached active tab segment" data-tab="write">
+                               <div class="ui active tab segment tw-rounded" data-tab="write">
                                        <textarea id="edit_area" name="content" class="tw-hidden" data-id="repo-{{.Repository.Name}}-{{.TreePath}}"
                                                data-url="{{.Repository.Link}}/markup"
                                                data-context="{{.RepoLink}}"
@@ -41,10 +41,10 @@
                                                data-line-wrap-extensions="{{.LineWrapExtensions}}">{{.FileContent}}</textarea>
                                        <div class="editor-loading is-loading"></div>
                                </div>
-                               <div class="ui bottom attached tab segment markup" data-tab="preview">
+                               <div class="ui tab segment markup tw-rounded" data-tab="preview">
                                        {{ctx.Locale.Tr "loading"}}
                                </div>
-                               <div class="ui bottom attached tab segment diff edit-diff" data-tab="diff">
+                               <div class="ui tab segment diff edit-diff" data-tab="diff">
                                        <div class="tw-p-16"></div>
                                </div>
                        </div>

diff --git a/templates/repo/editor/patch.tmpl b/templates/repo/editor/patch.tmpl
index ff5c09667fcc218d92fa76dc9cb6936273addd6d..a29021fa47bafc44c0d13b740058995181ddb29e 100644 (file)
--- a/templates/repo/editor/patch.tmpl
+++ b/templates/repo/editor/patch.tmpl
@@ -19,10 +19,10 @@
                                </div>
                        </div>
                        <div class="field">
-                               <div class="ui top attached tabular menu" data-write="write">
+                               <div class="ui compact small menu small-menu-items repo-editor-menu">
                                        <a class="active item" data-tab="write">{{svg "octicon-code" 16 "tw-mr-1"}}{{ctx.Locale.Tr "repo.editor.new_patch"}}</a>
                                </div>
-                               <div class="ui bottom attached active tab segment" data-tab="write">
+                               <div class="ui active tab segment tw-rounded tw-p-0" data-tab="write">
                                        <textarea id="edit_area" name="content" class="tw-hidden" data-id="repo-{{.Repository.Name}}-patch"
                                                data-context="{{.RepoLink}}"
                                                data-line-wrap-extensions="{{.LineWrapExtensions}}">

diff --git a/templates/repo/issue/labels/label_load_template.tmpl b/templates/repo/issue/labels/label_load_template.tmpl
index 0499afea19fbfa58371194a3910c7a1c6e152b7d..3cb2442a1d05e2cf0f7b1765be6f745d86a1123c 100644 (file)
--- a/templates/repo/issue/labels/label_load_template.tmpl
+++ b/templates/repo/issue/labels/label_load_template.tmpl
@@ -1,24 +1,21 @@
 <div class="ui centered grid">
        <div class="twelve wide computer column">
-               <div class="ui attached left aligned segment">
-                       <p>{{ctx.Locale.Tr "repo.issues.label_templates.info"}}</p>
-                       <br>
-                       <form class="ui form center" action="{{.Link}}/initialize" method="post">
-                               {{.CsrfTokenHtml}}
-                               <div class="field">
-                                       <div class="ui selection dropdown">
-                                               <input type="hidden" name="template_name" value="Default">
-                                               <div class="default text">{{ctx.Locale.Tr "repo.issues.label_templates.helper"}}</div>
-                                               <div class="menu">
-                                                       {{range .LabelTemplateFiles}}
-                                                               <div class="item" data-value="{{.DisplayName}}">{{.DisplayName}}<br><i>({{.Description}})</i></div>
-                                                       {{end}}
-                                               </div>
-                                               {{svg "octicon-triangle-down" 18 "dropdown icon"}}
+               <p>{{ctx.Locale.Tr "repo.issues.label_templates.info"}}</p>
+               <form class="ui form center" action="{{.Link}}/initialize" method="post">
+                       {{.CsrfTokenHtml}}
+                       <div class="field">
+                               <div class="ui selection dropdown">
+                                       <input type="hidden" name="template_name" value="Default">
+                                       <div class="default text">{{ctx.Locale.Tr "repo.issues.label_templates.helper"}}</div>
+                                       <div class="menu">
+                                               {{range .LabelTemplateFiles}}
+                                                       <div class="item" data-value="{{.DisplayName}}">{{.DisplayName}}<br><i>({{.Description}})</i></div>
+                                               {{end}}
                                        </div>
+                                       {{svg "octicon-triangle-down" 18 "dropdown icon"}}
                                </div>
-                               <button type="submit" class="ui primary button">{{ctx.Locale.Tr "repo.issues.label_templates.use"}}</button>
-                       </form>
-               </div>
+                       </div>
+                       <button type="submit" class="ui primary button">{{ctx.Locale.Tr "repo.issues.label_templates.use"}}</button>
+               </form>
        </div>
 </div>

diff --git a/templates/repo/tag/list.tmpl b/templates/repo/tag/list.tmpl
index a63c94cd8eaf210c91f533f00fb180837ee63a57..b3ad3a7c4727812ad875421def6143ea0e77cdbc 100644 (file)
--- a/templates/repo/tag/list.tmpl
+++ b/templates/repo/tag/list.tmpl
@@ -4,6 +4,7 @@
        <div class="ui container">
                {{template "base/alert" .}}
                {{template "repo/release_tag_header" .}}
+               {{if .Releases}}
                <h4 class="ui top attached header">
                        <div class="five wide column tw-flex tw-items-center">
                                {{svg "octicon-tag" 16 "tw-mr-1"}}{{ctx.Locale.Tr "repo.release.tags"}}
@@ -57,6 +58,7 @@
                                </tbody>
                        </table>
                </div>
+               {{end}}
 
                {{template "base/paginate" .}}
        </div>

diff --git a/templates/user/notification/notification_subscriptions.tmpl b/templates/user/notification/notification_subscriptions.tmpl
index a5a965ca5251f95a56d4202855800abd26570d00..b92a32a9571ec55022528b09172d2a51cbfb5d9b 100644 (file)
--- a/templates/user/notification/notification_subscriptions.tmpl
+++ b/templates/user/notification/notification_subscriptions.tmpl
@@ -1,7 +1,7 @@
 {{template "base/head" .}}
 <div role="main" aria-label="{{.Title}}" class="page-content user notification">
        <div class="ui container">
-               <div class="ui top attached tabular menu">
+               <div class="ui compact small menu small-menu-items">
                        <a href="{{AppSubUrl}}/notifications/subscriptions" class="{{if eq .Status 1}}active {{end}}item">
                                {{ctx.Locale.Tr "notification.subscriptions"}}
                        </a>
@@ -9,7 +9,7 @@
                                {{ctx.Locale.Tr "notification.watching"}}
                        </a>
                </div>
-               <div class="ui bottom attached active tab segment">
+               <div class="ui top attached segment">
                        {{if eq .Status 1}}
                                <div class="tw-flex tw-justify-between">
                                        <div class="tw-flex">

diff --git a/templates/user/settings/account.tmpl b/templates/user/settings/account.tmpl
index 040f46e48b24b52280c854d41117bddcbf6b4f07..2aaf8535d12002f719de0bf36858218ee569982d 100644 (file)
--- a/templates/user/settings/account.tmpl
+++ b/templates/user/settings/account.tmpl
@@ -111,7 +111,7 @@
                                {{end}}
                        </div>
                </div>
-               <div class="ui attached bottom segment">
+               <div class="ui bottom attached segment">
                        <form class="ui form" action="{{AppSubUrl}}/user/settings/account/email" method="post">
                                {{.CsrfTokenHtml}}
                                <div class="required field {{if .Err_Email}}error{{end}}">

diff --git a/templates/user/settings/applications.tmpl b/templates/user/settings/applications.tmpl
index 8baa07c90b0ed1f7e8e61bdc74d901cabefeaa93..8c67653e589324b02209690c5d9ba46a567c3b2e 100644 (file)
--- a/templates/user/settings/applications.tmpl
+++ b/templates/user/settings/applications.tmpl
@@ -49,7 +49,7 @@
                                {{end}}
                        </div>
                </div>
-               <div class="ui attached bottom segment">
+               <div class="ui bottom attached segment">
                        <h5 class="ui top header">
                                {{ctx.Locale.Tr "settings.generate_new_token"}}
                        </h5>

diff --git a/templates/user/settings/applications_oauth2_edit_form.tmpl b/templates/user/settings/applications_oauth2_edit_form.tmpl
index 199d43a65c4e7b473280ed07266ca8ac870dce1b..e62115d2267836257ec00ac5dcdab47ee0a5026e 100644 (file)
--- a/templates/user/settings/applications_oauth2_edit_form.tmpl
+++ b/templates/user/settings/applications_oauth2_edit_form.tmpl
@@ -30,7 +30,7 @@
                </form>
        </div>
 </div>
-<div class="ui attached bottom segment">
+<div class="ui bottom attached segment">
        <form class="ui form ignore-dirty" action="{{.FormActionPath}}" method="post">
                {{.CsrfTokenHtml}}
                <div class="field {{if .Err_AppName}}error{{end}}">

diff --git a/templates/user/settings/applications_oauth2_list.tmpl b/templates/user/settings/applications_oauth2_list.tmpl
index c75cbd532e223a60da4505c3c77215fabf8aff68..e9e02179f51b4c47d48519bbd416a07c9776e465 100644 (file)
--- a/templates/user/settings/applications_oauth2_list.tmpl
+++ b/templates/user/settings/applications_oauth2_list.tmpl
@@ -47,7 +47,7 @@
        </div>
 </div>
 
-<div class="ui attached bottom segment">
+<div class="ui bottom attached segment">
        <h5 class="ui top header">
                {{ctx.Locale.Tr "settings.create_oauth2_application"}}
        </h5>

diff --git a/templates/user/settings/security/openid.tmpl b/templates/user/settings/security/openid.tmpl
index b0473c9df503440a81f0abdf6019b0edc0c3069c..87ba953e79eb913d03c131c49d0f05e57dc5fad6 100644 (file)
--- a/templates/user/settings/security/openid.tmpl
+++ b/templates/user/settings/security/openid.tmpl
@@ -38,7 +38,7 @@
                {{end}}
        </div>
 </div>
-<div class="ui attached bottom segment">
+<div class="ui bottom attached segment">
        <form class="ui form" action="{{AppSubUrl}}/user/settings/security/openid" method="post">
                {{.CsrfTokenHtml}}
                <div class="required field {{if .Err_OpenID}}error{{end}}">

diff --git a/web_src/css/features/codeeditor.css b/web_src/css/features/codeeditor.css
index 34a104c8338372253bab05d876f0939552ac6b71..2a8accbcc8eaa30a35fd4fea18759f0968c1468f 100644 (file)
--- 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 2406def681e9ac85c668d29361f9613d0f86c8a9..d5d5e757d6ea266af3099098b6a316e42b149993 100644 (file)
--- 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 e393ec5186b9fee5872d89ef4dfaa458a5674b0e..830e4cdbc30f95e6f5c665fc7db62c19f8f330bb 100644 (file)
--- 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 a2acfeaa150e69d4bc1c4a76d0b62dcd91d330aa..427d2529c8a7b4a7b0660f1ee2006e2cc3f205ca 100644 (file)
--- 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 994ac1779a28936e3385c0155975749beda05275..cb307dc1a3752084b28b3deab56fe083f8dc670b 100644 (file)
--- 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 dacb98ddb828861109968c63cda2531b04b3d21e..0b46f6b69f7e8d1dbfe0028ebee3d639871301cf 100644 (file)
--- 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 304cfbc13c9ed969003aaee714769609864e70cb..4440bba8df625894058b9f006afa6b8ff923c209 100644 (file)
--- 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 f5e4e74dc61503e39def9b3d2bd219826c297370..4dfef8c2b2788e98adbf60f58785cdfd94fb99c3 100644 (file)
--- 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 01dc4b95aaa47fb03072a8b11d4e34b2dcf69cc5..a5232cb4b659d2e18851283d7fbc5a6518ec9f06 100644 (file)
--- 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);
 }