finn/forgejo
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Fine tune more downdrop settings, use SVG for labels, improve Repo Topic Edit form (#23626)

Browse source 
Although it seems that some different purposes are mixed in this PR,
however, they are all related, and can be tested together, so I put them
together to save everyone's time.

Diff: `+79 −84`, everything becomes much better.

### Improve the dropdown settings.

Move all fomantic-init related code into our `fomantic.js`

Fine-tune some dropdown global settings, see the comments.

Also help to fix the first problem in #23625 , cc: @yp05327 

The "language" menu has been simplified, and it works with small-height
window better.

### Use SVG instead of `<i class="delete icon">`

It's also done by `$.fn.dropdown.settings.templates.label` , cc:
@silverwind

### Remove incorrect `tabable` CSS class

It doesn't have CSS styles, and it was only in Vue. So it's totally
unnecessary, remove it by the way.

### Improve the Repo Topic Edit form

* Simplify the code
* Add a "Cancel" button
* Align elements

Before:

<details>

![image](https://user-images.githubusercontent.com/2114189/223325782-f09532de-0c38-4742-ba86-ed35cc9a858d.png)

</details>

After:

![image](https://user-images.githubusercontent.com/2114189/226796347-207feb0a-b3cd-4820-8a3e-01930bab1069.png)
This commit is contained in:
wxiaoguang 2023-03-26 19:31:26 +08:00 • committed by GitHub
parent ac64c82974
commit 12fff36d05
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
10 changed files with 80 additions and 86 deletions
Download patch file Download diff file Expand all files Collapse all files

14
web_src/js/index.js
View file

@ -88,21 +88,15 @@ import {initFormattingReplacements} from './features/formatting.js';
import {initCopyContent} from './features/copycontent.js';
import {initCaptcha} from './features/captcha.js';
import {initRepositoryActionView} from './components/RepoActionView.vue';
import {initAriaCheckboxPatch} from './modules/aria/checkbox.js';
import {initAriaDropdownPatch} from './modules/aria/dropdown.js';
import {initGlobalTooltips} from './modules/tippy.js';
import {initGiteaFomantic} from './modules/fomantic.js';
// Run time-critical code as soon as possible. This is safe to do because this
// script appears at the end of <body> and rendered HTML is accessible at that point.
// TODO: replace them with CustomElements
initFormattingReplacements();
// Silence fomantic's error logging when tabs are used without a target content element
$.fn.tab.settings.silent = true;
// Disable the behavior of fomantic to toggle the checkbox when you press enter on a checkbox element.
$.fn.checkbox.settings.enableEnterKey = false;
// Use the patches to improve accessibility, these patches are designed to be as independent as possible, make it easy to modify or remove in the future.
initAriaCheckboxPatch();
initAriaDropdownPatch();
// Init Gitea's Fomantic settings
initGiteaFomantic();
$(document).ready(() => {
initGlobalCommon();