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

Convert issue list checkboxes to native (#23596)

Browse source 
Use native instead of fomantic checkboxes in issue list. Benefits
include no more JS pop-in on load and perfect a11y.

Before, with JS pop-in:

<img width="92" alt="Screenshot 2023-03-20 at 17 02 02"
src="https://user-images.githubusercontent.com/115237/226398955-99029a1c-1150-449c-821b-e4165e7446a8.png">

After, Firefox on macOS:

<img width="126" alt="Screenshot 2023-03-20 at 17 01 26"
src="https://user-images.githubusercontent.com/115237/226399018-58df2c32-c2b2-4c78-b7df-7b76523abe21.png">

After, Chrome on macOS:

<img width="79" alt="Screenshot 2023-03-20 at 17 01 42"
src="https://user-images.githubusercontent.com/115237/226399074-947e6279-8dc3-42c2-90b5-b106c471b23d.png">

I opted to not do styling yet but I see that the inconsistency between
browsers may already be reason enough on doing it. I think if we style
them, there should be one global style, including markdown ones which
currently have custom styling.
This commit is contained in:
silverwind 2023-03-30 17:02:47 +02:00 • committed by GitHub
parent 964a057a76
commit 525b7382d3
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 8 additions and 29 deletions
Download patch file Download diff file Expand all files Collapse all files

1
web_src/css/helpers.css
View file

@ -24,6 +24,7 @@
.gt-relative { position: relative !important; }
.gt-overflow-x-scroll { overflow-x: scroll !important; }
.gt-cursor-default { cursor: default !important; }
.gt-items-start { align-items: flex-start !important; }
.gt-mono {
font-family: var(--fonts-monospace) !important;

4
web_src/css/shared/issuelist.css
View file

@ -7,10 +7,6 @@
color: var(--color-primary) !important;
}
.issue.list > .item .issue-checkbox {
margin-top: 1px;
}
.issue.list > .item .issue-item-icon svg {
margin-right: 0.75rem;
margin-top: 1px;