diff options
author | silverwind <me@silverwind.io> | 2024-04-29 22:53:15 +0200 |
---|---|---|
committer | GitHub <noreply@github.com> | 2024-04-29 20:53:15 +0000 |
commit | a3d9f0d9151dbdcd77bf68f70b8e9497da5f2d3f (patch) | |
tree | ea09e31d9d83f29ab749698dacb8b74fb3968785 /web_src/js | |
parent | 4daea7c603c085eeda7017ac7188de7828824ed4 (diff) | |
download | gitea-a3d9f0d9151dbdcd77bf68f70b8e9497da5f2d3f.tar.gz gitea-a3d9f0d9151dbdcd77bf68f70b8e9497da5f2d3f.zip |
Fix all rounded borders, change affected tab menus to pills (#30707)
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: wxiaoguang <wxiaoguang@gmail.com>
Co-authored-by: Giteabot <teabot@gitea.io>
Diffstat (limited to 'web_src/js')
-rw-r--r-- | web_src/js/features/codeeditor.js | 1 | ||||
-rw-r--r-- | web_src/js/features/repo-editor.js | 18 |
2 files changed, 11 insertions, 8 deletions
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); } |