nune/gitea
nune/gitea
0
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 1

Various code view improvements (#30014)

Browse source 
1. Restore missing styles for message close icon
2. Move `code-line-button` so that it does not go off-screen on small
viewports
3. Make `code-line-button` look and behave like other buttons
4. Make `code-line-button` work in blame
5. Make the active selection span the whole line, not just the code part
6. Tweak colors, make dark theme code bg darker, make line numbers same
color in diff and file view.
7. Move code background to parent, fixing border radius and other
problems
8. Enable code wrap in blame
9. Improve blame responsiveness
10. Remove `--color-code-sidebar-bg` in blame, now it uses same
background as code
11. Rename `--color-active-line` to `--color-highlight-bg`
12. Add `--color-highlight-bg`
13. Fix button group borders on hover and border-right on last button.

<img width="1343" alt="Screenshot 2024-03-23 at 22 34 13"
src="fcbb919f-5dc3-43f0-97f6-870d6f412554">
<img width="1334" alt="Screenshot 2024-03-23 at 22 34 26"
src="ca44c3b7-4328-4645-ba49-b0dc6a5ac06d">

<img width="1338" alt="Screenshot 2024-03-23 at 22 34 57"
src="00eb0b5a-1ec7-4669-a94a-4602b9d1c1ac">
<img width="1337" alt="Screenshot 2024-03-23 at 22 34 42"
src="752edc4a-064f-413c-9dff-c086187fcd85">

Fixes: https://github.com/go-gitea/gitea/issues/18074
This commit is contained in:
silverwind 2024-03-24 13:14:03 +01:00 • committed by GitHub
parent 9c6e6f4d1b
commit db01bf6cc8
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
12 changed files with 145 additions and 103 deletions
Download patch file Download diff file Expand all files Collapse all files

12
web_src/css/modules/button.css
View file

@ -11,6 +11,7 @@
.ui.button:hover {
background: var(--color-hover);
color: var(--color-text);
border-color: var(--color-secondary-dark-2);
}
.page-content .ui.button {
@ -61,11 +62,17 @@ It needs some tricks to tweak the left/right borders with active state */
border-right: none;
}
.ui.buttons .button:first-child {
.ui.buttons .button:hover + .button {
border-left: 1px solid var(--color-secondary-dark-2);
}
.ui.buttons .button:first-child,
.ui.buttons .button.gt-hidden:first-child + .button {
border-left: 1px solid var(--color-light-border);
}
.ui.buttons .button:last-child {
.ui.buttons .button:last-child,
.ui.buttons .button:nth-last-child(2):has(+ .button.gt-hidden) {
border-right: 1px solid var(--color-light-border);
}
@ -105,6 +112,7 @@ It needs some tricks to tweak the left/right borders with active state */
.ui.basic.button:hover {
color: var(--color-text);
background: var(--color-hover);
border-color: var(--color-secondary-dark-2);
}
.ui.basic.buttons .button:active,