mirror of
1
Fork 0
Commit Graph

77 Commits

Author SHA1 Message Date
0ko 145f7624ca feat(ui): add a bullet symbol between author and committer (#5518)
Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/5518
Reviewed-by: Otto <otto@codeberg.org>
2024-10-11 18:52:25 +00:00
emilylange c1f85ce27b
feat(performance): remove `BranchName` in `/:owner/:repo/commit/:commit`
`BranchName` provides the nearest branch of the requested `:commit`.

It's plenty fast on smaller repositories.
On larger repositories like nixpkgs, however, this can easily take 2-3
seconds on a modern machine on a NVMe.

For context, at the time of writing, nixpkgs has over 650k commits and
roughly 250 branches.

`BranchName` is used once in the whole view:
The cherry-pick target branch default selection.

And I believe that's a logic error, which is why this patch is so small.

The nearest branch of a given commit will always be a branch the commit
is already part of. The branch you most likely *don't* want to
cherry-pick to.

Sure, one can technically cherry-pick a commit onto the same branch, but
that simply results in an empty commit.

I don't believe this is intended and even less so worth the compute.

Instead, the cherry-pick branch selection suggestion now always uses
the default branch, which used to be the fallback.

If a user wants to know which branches contain the given commit,
`load-branches-and-tags` exists and should be used instead.

Also, to add insult to injury, `BranchName` was calculated for both
logged-in and not logged-in users, despite its only consumer, the
cherry-pick operation, only being rendered when a given user has
write/commit permissions.

But this isn't particularly surprising, given this happens a lot in
Forgejo's codebase.
2024-08-08 22:29:42 +02:00
silverwind a527f5a3e7
Various improvements for long file and commit names (#30374)
Fixes: https://github.com/go-gitea/gitea/issues/29438

This contains numerous enhancements for how large commit messages and
large filenames render. Another notable change is that the file path is
no longer cut off by backend at 30 chars, but rendered in full with
wrapping.

<img width="1329" alt="Screenshot 2024-04-09 at 21 53 57"
src="https://github.com/go-gitea/gitea/assets/115237/5ccbb3d6-643a-4f60-ba79-3572b36d5182">
<hr>
<img width="711" alt="Screenshot 2024-04-09 at 21 44 24"
src="https://github.com/go-gitea/gitea/assets/115237/6ffe8fbb-407c-4aa7-b591-3d80daea7d57">
<hr>
<img width="439" alt="Screenshot 2024-04-09 at 21 19 03"
src="https://github.com/go-gitea/gitea/assets/115237/1ec7f6e9-2fd8-4841-87eb-6ca02ab9cd61">
<hr>
<img width="444" alt="Screenshot 2024-04-09 at 21 18 52"
src="https://github.com/go-gitea/gitea/assets/115237/70931b9e-5841-477e-b3bc-98f8d2662964">

---------

Co-authored-by: Giteabot <teabot@gitea.io>
(cherry picked from commit 50099d7af436785daf66a3a9f27bd5c009f90684)

Conflicts:
	- templates/repo/diff/box.tmpl
          Picked Gitea's version, because it appears we missed a
          gt-gap-1 => tw-gap-1 conversion
	- web_src/css/repo.css
          Conflict due to tag signature highlighting, resolved by
          adding the Gitea changes on top of ours manually.
2024-04-15 20:01:35 +02:00
silverwind 3408bcd294
Remove fomantic list module (#30281)
Likely still some unnecessary CSS but any combinations with the `ui
list` classes are covered. There was only on instance of `horizontal
list` which I removed. It was this part of the commit page:

<img width="396" alt="image"
src="https://github.com/go-gitea/gitea/assets/115237/c49ec4f5-93c3-41d6-a907-cdbedf8abc44">

(cherry picked from commit 649aada3664f5adccdaecc7dd24b8252ae070220)
2024-04-07 15:40:31 +02:00
silverwind c82bef515e
Migrate margin and padding helpers to tailwind (#30043)
This will conclude the refactor of 1:1 class replacements to tailwind,
except `gt-hidden`. Commands ran:

```bash
perl -p -i -e 's#gt-(p|m)([lrtbxy])?-0#tw-$1$2-0#g'   {web_src/js,templates,routers,services}/**/*
perl -p -i -e 's#gt-(p|m)([lrtbxy])?-1#tw-$1$2-0.5#g' {web_src/js,templates,routers,services}/**/*
perl -p -i -e 's#gt-(p|m)([lrtbxy])?-2#tw-$1$2-1#g'   {web_src/js,templates,routers,services}/**/*
perl -p -i -e 's#gt-(p|m)([lrtbxy])?-3#tw-$1$2-2#g'   {web_src/js,templates,routers,services}/**/*
perl -p -i -e 's#gt-(p|m)([lrtbxy])?-4#tw-$1$2-4#g'   {web_src/js,templates,routers,services}/**/*
perl -p -i -e 's#gt-(p|m)([lrtbxy])?-5#tw-$1$2-8#g'   {web_src/js,templates,routers,services}/**/*
```

(cherry picked from commit 68ec9b48592fe88765bcc3a73093d43c98b315de)

Conflicts:
	routers/web/repo/view.go
	templates/base/head_navbar.tmpl
	templates/repo/code/recently_pushed_new_branches.tmpl
	templates/repo/diff/box.tmpl
	templates/repo/diff/compare.tmpl
	templates/repo/diff/conversation.tmpl
	templates/repo/header.tmpl
	templates/repo/issue/filter_list.tmpl
	templates/repo/issue/view_content/conversation.tmpl
	templates/repo/issue/view_content/sidebar.tmpl
	templates/repo/settings/options.tmpl
	templates/repo/view_file.tmpl
	templates/shared/user/blocked_users.tmpl
	templates/status/500.tmpl
	web_src/js/components/DashboardRepoList.vue
	resolved by prefering Forgejo version and applying the
	commands to all files
2024-03-30 07:17:29 +01:00
silverwind 3ea7437fa6
Fix incorrect tailwind migration (#30007)
Fixes https://github.com/go-gitea/gitea/issues/30005. Regression from
https://github.com/go-gitea/gitea/pull/29945.

There was only once instance of `tw-content-center` before that PR, so I
just ran below command and reverted that one instance.

```sh
perl -p -i -e 's#tw-content-center#tw-items-center#g' web_src/js/**/* templates/**/* models/**/* tests/**/*
```

(cherry picked from commit 04f9ad056882fc3f21b247b16f84437adf0f36d8)

Conflicts:
	templates/repo/diff/conversation.tmpl
	templates/repo/header.tmpl
	templates/repo/issue/filter_list.tmpl
	templates/repo/issue/view_content/conversation.tmpl
	templates/repo/wiki/view.tmpl
	web_src/js/components/DashboardRepoList.vue
	re-ran the command after discarding the Gitea changes to
	ensure all Forgejo files are also covered
2024-03-26 19:04:27 +01:00
silverwind 2befd9a3cf
Replace 10 more gt- classes with tw- (#29945)
Likely the biggest change of the tailwind refactors. Only thing of note
is that `tw-flex-1` resolves to `flex: 1 1 0%` while our `gt-f1` was
`flex: 1 1 0`, I don't think it will make any difference. Commands I've
ran:

```sh
perl -p -i -e 's#gt-vm#tw-align-middle#g' web_src/js/**/* templates/**/* models/**/*
perl -p -i -e 's#gt-fw#tw-flex-wrap#g' web_src/js/**/* templates/**/* models/**/*
perl -p -i -e 's#gt-f1#tw-flex-1#g' web_src/js/**/* templates/**/* models/**/*
perl -p -i -e 's#gt-fc#tw-flex-col#g' web_src/js/**/* templates/**/* models/**/*
perl -p -i -e 's#gt-sb#tw-justify-between#g' web_src/js/**/* templates/**/* models/**/*
perl -p -i -e 's#gt-je#tw-justify-end#g' web_src/js/**/* templates/**/* models/**/*
perl -p -i -e 's#gt-jc#tw-justify-center#g' web_src/js/**/* templates/**/* models/**/*
perl -p -i -e 's#gt-ac#tw-content-center#g' web_src/js/**/* templates/**/* models/**/* tests/**/*
perl -p -i -e 's#gt-df#tw-flex#g' web_src/js/**/* templates/**/* models/**/* tests/**/*
perl -p -i -e 's#gt-dib#tw-inline-block#g' web_src/js/**/* templates/**/* models/**/* tests/**/*

Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
(cherry picked from commit f88ad5424f381bf2a45fd863b551c5a72891bb68)

Conflicts:
	templates/repo/diff/conversation.tmpl
	templates/repo/header.tmpl
	templates/repo/issue/filter_actions.tmpl
	templates/repo/issue/filter_list.tmpl
	templates/repo/issue/view_content/conversation.tmpl
	templates/repo/release/list.tmpl
	templates/repo/wiki/view.tmpl
	web_src/js/components/DashboardRepoList.vue
	discard the proposed changes and prefer Forgejo. A followup
	commit will apply the same commands.
2024-03-26 19:04:27 +01:00
silverwind 907c3d0c20
Replace more `gt-` with `tw-`, update frontend docs (#29595)
Tested a few things, all working fine. Not sure if the chinese machine
translation is good.

---------

Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
(cherry picked from commit 7e8c1c5ba18e1ac8861f429b825163b8210fd178)

Conflicts:
	docs/content/contributing/guidelines-frontend.zh-cn.md
	Gitea docs
2024-03-11 23:36:58 +07:00
silverwind 2e9ca0597d
Replace some `gt-` classes with `tw-` (#29570)
Replace 18 `gt-` prefixes with `tw-` with perl replacement. I manually
checked them all with `rg` afterwards.

(cherry picked from commit a2e90014ec20a1085449a66061389cfe0d12260f)

Conflicts:
	templates/repo/header.tmpl
	because some of the header moved to header_fork.tmpl
2024-03-11 23:36:57 +07:00
wxiaoguang 2892aaab02
Rename Str2html to SanitizeHTML and clarify its behavior (#29516)
Str2html was abused a lot. So use a proper name for it: SanitizeHTML

And add some tests to show its behavior.

(cherry picked from commit fb42972c057364a1dc99dfb528554e7a94415be7)

Conflicts:
	docs/content/administration/mail-templates.en-us.md
	docs/content/administration/mail-templates.zh-cn.md
	prefer their version always
2024-03-06 12:10:45 +08:00
wxiaoguang 90a62b87c0
Refactor Safe modifier (#29392)
After this PR: no need to play with the Safe/Escape tricks anymore. See
the changes for more details.

(cherry picked from commit f9207b09479df964872d68842469991042b5497f)

Conflicts:
	templates/repo/issue/view_title.tmpl
	templates/user/settings/applications.tmpl
	context
2024-02-26 22:30:27 +01:00
silverwind aefc747ccb
Clean up diff header css and reduce global textarea min-height (#29232)
1. Tweak diff header and remove a numbe of unneeded CSS for it:

Before:
<img width="433" alt="Screenshot 2024-02-18 at 01 08 09"
src="https://github.com/go-gitea/gitea/assets/115237/d8b377c0-57bc-44d5-bb57-a582c7d4b3b4">

After:
<img width="463" alt="Screenshot 2024-02-18 at 01 07 56"
src="https://github.com/go-gitea/gitea/assets/115237/d08c17e7-5b86-4d07-81da-6371f4754325">

3. Reduce height of review textarea and also reduce fomantic's CSS from
12em to 8em. Now fits better on my screen:

<img width="1352" alt="image"
src="https://github.com/go-gitea/gitea/assets/115237/5c658d13-295e-4929-94da-13ade888020d">

---------

Co-authored-by: delvh <dev.lh@web.de>
(cherry picked from commit 39f8ab591c18a65cf783ecd17ddc1a5914ceff7a)
2024-02-19 22:58:33 +01:00
wxiaoguang bdf470785d
Use "Safe" modifier for manually constructed safe HTML strings in templates (#29227)
Follow #29165. These HTML strings are safe to be rendered directly, to
avoid double-escaping.

(cherry picked from commit a784ed3d6c6946fd9bf95f2e910f52f549326fe2)
2024-02-19 22:58:32 +01:00
silverwind a062725758
Update JS and PY dependencies, build for `es2020` browsers (#28977)
- Update all JS dependencies minus @mcaptcha/vanilla-glue
- Fix new lint errors
- Regenerate SVGs
- Switch to maintained stylelint stylistic plugin
- Tested Mermaid, Citation, Swagger, sorting
- Raise ESBuild target to `es2020` as dictated by `pretty-ms`
dependency.
2024-02-02 09:36:32 +00:00
KN4CK3R 637451a45e
Rework markup link rendering (#26745)
Fixes #26548

This PR refactors the rendering of markup links. The old code uses
`strings.Replace` to change some urls while the new code uses more
context to decide which link should be generated.

The added tests should ensure the same output for the old and new
behaviour (besides the bug).

We may need to refactor the rendering a bit more to make it clear how
the different helper methods render the input string. There are lots of
options (resolve links / images / mentions / git hashes / emojis / ...)
but you don't really know what helper uses which options. For example,
we currently support images in the user description which should not be
allowed I think:

<details>
  <summary>Profile</summary> 

https://try.gitea.io/KN4CK3R

![grafik](https://github.com/go-gitea/gitea/assets/1666336/109ae422-496d-4200-b52e-b3a528f553e5)

</details>

---------

Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
2024-01-15 08:49:24 +00:00
Lauris BH bfacb5c501
Fix margin in server signed signature verification view (#28379)
Before:

![image](https://github.com/go-gitea/gitea/assets/165205/e2e2256d-03c5-4ab8-8ed9-08ef68571a43)

After:

![image](https://github.com/go-gitea/gitea/assets/165205/804132ef-18f9-4ab8-949d-f6c71e7f4d24)
2023-12-07 01:51:39 +00:00
yp05327 dcb648ee71
Add `Hide/Show all checks` button to commit status check (#26284)
Step one for a GitHub like commit status check ui:

![image](https://github.com/go-gitea/gitea/assets/18380374/22953b88-1f91-4d19-bc57-ad92d33fa11f)

![image](https://github.com/go-gitea/gitea/assets/18380374/78572a49-c9b0-472b-86a8-8293197e807b)

![image](https://github.com/go-gitea/gitea/assets/18380374/bc5c8d1c-2ab5-4b03-b8c6-20c34b86d856)

Step two:

![image](https://github.com/go-gitea/gitea/assets/18380374/938b359e-8823-4192-b82d-55fa40b986fd)

![image](https://github.com/go-gitea/gitea/assets/18380374/2de5bb8f-40f5-462a-8d6d-bac13a32bc2a)

The design now will list all commit status checks which takes too much
space.
This is a pre-improve for #26247

---------

Co-authored-by: delvh <dev.lh@web.de>
Co-authored-by: silverwind <me@silverwind.io>
Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
2023-11-02 14:49:02 +00:00
JakobDev ebe803e514
Penultimate round of `db.DefaultContext` refactor (#27414)
Part of #27065

---------

Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
2023-10-11 04:24:07 +00:00
wxiaoguang 93bd4351bf
Fix more "locale" usages (#27259) 2023-09-25 20:42:40 +08:00
delvh 7960ba7e2b
Always use `ctx.Locale.Tr` inside templates (#27231) 2023-09-25 08:56:50 +00:00
silverwind 8099238618
Change green buttons to primary color (#27099)
I think it's better if the primary actions have primary color instead of
green which fits better into the overall single-color UI design. This PR
currently replaces every green button with primary:

<img width="141" alt="Screenshot 2023-09-16 at 14 07 59"
src="https://github.com/go-gitea/gitea/assets/115237/843c1e50-4fb2-4ec6-84ba-0efb9472dcbe">
<img width="161" alt="Screenshot 2023-09-16 at 14 07 51"
src="https://github.com/go-gitea/gitea/assets/115237/9442195a-a3b2-4a42-b262-8377d6f5c0d1">

Modal actions now use uncolored/primary instead of previous green/red
colors. I also removed the box-shadow on all basic buttons:

<img width="259" alt="Screenshot 2023-09-16 at 14 16 39"
src="https://github.com/go-gitea/gitea/assets/115237/5beea529-127a-44b0-8d4c-afa7b034a490">
<img width="261" alt="Screenshot 2023-09-16 at 14 17 42"
src="https://github.com/go-gitea/gitea/assets/115237/4757f7b2-4d46-49bc-a797-38bb28437b88">

The change currently includes the "Merge PR" button, for which we might
want to make an exception to match the icon color there:

<img width="442" alt="Screenshot 2023-09-16 at 14 33 53"
src="https://github.com/go-gitea/gitea/assets/115237/993ac1a5-c94d-4895-b76c-0d872181a70b">
2023-09-18 22:05:31 +00:00
KN4CK3R f3f445862e
Use `print` instead of `printf` (#27093)
A bit more performant when we only use it for appending strings.
2023-09-16 03:51:54 +00:00
wxiaoguang 682552378f
More fixes for the "commit-body" (#26898)
The changes for "commit-body" in #26877 are not ideal.

The reason is: the "commit-body" is usually a `<pre>`, it has default
margins. In most cases, we do not need that large margin. So, this PR
introduces a general but small margin for all "commit-body" elements.
Then these `gt-m-0` could be removed.

The `:not` selector is not needed, because the `.timeline-item` selector
is already clear enough.
2023-09-04 13:38:59 +00:00
wxiaoguang a370efc13f
Use template context function for avatar rendering (#26385)
Introduce `AvatarUtils`, no need to pass `$.Context` to every
sub-template, and simplify the template helper functions.
2023-08-10 11:19:39 +08:00
delvh bd6ef71854
Show branches and tags that contain a commit (#25180)
Now, you can see for a commit which existing branches and tags contain it.
You first have to click on the `load branches and tags` button, they are not preloaded by default.
All branches and tags are ordered descending by creation date.
You can even see without much hassle if the given commit is already part of the default branch.

Closes #25152 

## Screenshots

### Initial

![image](https://github.com/go-gitea/gitea/assets/51889757/84db2c0b-aaef-4f69-ab92-0b812793d2ad)

### Loaded

![image](https://github.com/go-gitea/gitea/assets/51889757/a9b84e66-8e44-4c55-b017-c37f4a45f41b)

---------

Co-authored-by: silverwind <me@silverwind.io>
Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
2023-07-27 12:47:41 +02:00
wxiaoguang cc00fd50f3
Clarify "text-align" CSS helpers, fix clone button padding (#25763)
Changes:

* Rename gt-tl/gt-tc/gt-tr to gt-text-left/gt-text-center/gt-text-right
* The gt-ab and gt-br-0 are removed because they are not needed anymore
* Fix the clone dropdown button padding by ":not(.icon)"

Before:

<details>


![image](https://github.com/go-gitea/gitea/assets/2114189/eb030633-622c-4ca7-8e88-ce010d9f51a6)

</details>

After:

<details>


![image](https://github.com/go-gitea/gitea/assets/2114189/64c09403-bf21-439c-88f1-780b34ccab6b)

</details>

Fixes #25758

Co-authored-by: Giteabot <teabot@gitea.io>
2023-07-08 11:53:56 +02:00
wxiaoguang 323c6cba20
Fine tune "dropdown button" icon (#25442)
![image](https://github.com/go-gitea/gitea/assets/2114189/143e043d-85c9-43a4-85ae-ca55f507f738)

----

![image](https://github.com/go-gitea/gitea/assets/2114189/bcba03a5-732e-4139-bc35-96a7f8bfcb88)
2023-06-25 02:40:41 +00:00
silverwind e24f651c86
Add template linting via djlint (#25212)
So I found this [linter](https://github.com/Riverside-Healthcare/djlint)
which features a mode for go templates, so I gave it a try and it did
find a number of valid issue, like unbalanced tags etc. It also has a
number of bugs, I had to disable/workaround many issues.

Given that this linter is written in python, this does add a dependency
on `python` >= 3.8 and `poetry` to the development environment to be
able to run this linter locally.

- `e.g.` prefixes on placeholders are removed because the linter had a
false-positive on `placeholder="e.g. cn=Search"` for the `attr=value`
syntax and it's not ideal anyways to write `e.g.` into a placeholder
because a placeholder is meant to hold a sample value.
- In `templates/repo/settings/options.tmpl` I simplified the logic to
not conditionally create opening tags without closing tags because this
stuff confuses the linter (and possibly the reader as well).
2023-06-14 18:17:58 +00:00
wxiaoguang 75c62054a6
Improve some modal action buttons (#24289)
Follow #24097 and #24285

And add a devtest page for modal action button testing.
http://localhost:3000/devtest/fomantic-modal

Now the `modal_actions_confirm.tmpl` could support: green / blue /
yellow positive buttons, the negative button is "secondary".

ps: this PR is only a small improvement, there are still a lot of
buttons not having proper colors. In the future these buttons could be
improved by this approach.

These buttons could also be improved according to the conclusion of
#24285 in the future.



![image](https://user-images.githubusercontent.com/2114189/233847773-a6d6b29b-7b5c-490e-8425-40dfd0ad2529.png)


And add GitHub-like single danger button (context:
https://github.com/go-gitea/gitea/issues/24285#issuecomment-1519100312)


![image](https://user-images.githubusercontent.com/2114189/233891566-055d7611-894d-4d5a-baf5-f6369180bf8d.png)

---------

Co-authored-by: silverwind <me@silverwind.io>
2023-04-24 07:08:59 -04:00
Hester Gong 476a043a5f
Refactor delete_modal_actions template and use it for project column related actions (#24097)
Co-Author: @wxiaoguang 

This PR is to fix
https://github.com/go-gitea/gitea/issues/23318#issuecomment-1506275446 .
The way to fix this in this PR is to use `delete_modal_actions.tmpl`
here both to fix this issue and keep ui consistency (as suggested by
[TODO
here](4299c3b7db/templates/projects/view.tmpl (L161)))

And this PR also refactors `delete_modal_actions.tmpl` and its related
styles, and use the template for more modal actions:

1. Added template attributes:
* locale
* ModalButtonStyle: "yes" (default) or "confirm"
* ModalButtonCancelText
* ModalButtonOkText

2. Rename `delete_modal_actions.tmpl` template to
`modal_actions_confirm.tmpl` because it is not only used for action
modals deletion now.

3. Refactored css related to modals into `web_src/css/modules/modal.css`
and improved the styles.

4. Also use the template for PR deletion modal and remove issue
dependency modal.

5. Some modals should also use the template, but not sure how to open
them, so mark these modal actions by `{{/* TODO: Convert to
base/modal_actions_confirm */}}`

After (Also tested on arc green):

Hovering on the left buttons

<img width="711" alt="Screen Shot 2023-04-23 at 15 17 12"
src="https://user-images.githubusercontent.com/17645053/233825650-76307e65-9255-44bb-80e8-7062f58ead1b.png">

<img width="786" alt="Screen Shot 2023-04-23 at 15 17 21"
src="https://user-images.githubusercontent.com/17645053/233825652-4dc6f7d1-a180-49fb-a468-d60950eaee0d.png">

Test for functionalities:

https://user-images.githubusercontent.com/17645053/233826857-76376fda-022c-42d0-b0f3-339c17ca4e59.mov

---------

Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
2023-04-23 17:24:19 +08:00
wxiaoguang 31ab331b23
Remove incorrect HTML self close tag (#23748)
HTML is not XML.
2023-03-27 18:05:51 +02:00
wxiaoguang 8d5fbeb7a2
Use data-tooltip-content for tippy tooltip (#23649)
Follow:
* #23574
* Remove all ".tooltip[data-content=...]"

Major changes:

* Remove "tooltip" class, use "[data-tooltip-content=...]" instead of
".tooltip[data-content=...]"
* Remove legacy `data-position`, it's dead code since last Fomantic
Tooltip -> Tippy Tooltip refactoring
* Rename reaction attribute from `data-content` to
`data-reaction-content`
* Add comments for some `data-content`: `{{/* used by the form */}}`
* Remove empty "ui" class
* Use "text color" for SVG icons (a few)
2023-03-24 18:35:38 +08:00
silverwind 12ddc48c5c
Use octicon-verified for gpg signatures (#23529)
Before:
<img width="292" alt="Screenshot 2023-03-16 at 23 40 47"
src="https://user-images.githubusercontent.com/115237/225768871-43e11ced-e340-4c88-b756-25f9f7076fd2.png">
<img width="288" alt="Screenshot 2023-03-16 at 23 51 05"
src="https://user-images.githubusercontent.com/115237/225770071-b51f3ed6-ef14-421b-a5bc-6a26e808d404.png">


After:
<img width="291" alt="Screenshot 2023-03-16 at 23 40 37"
src="https://user-images.githubusercontent.com/115237/225768864-ea4956c7-8c57-4148-9d89-c818991a7538.png">
<img width="281" alt="image"
src="https://user-images.githubusercontent.com/115237/225769978-0b9c6c52-9a13-4c23-b13e-8a8a692abf43.png">
2023-03-17 01:12:40 -04:00
delvh 81fe5d6185
Convert `<div class="button">` to `<button class="button">` (#23337)
This improves a lot of accessibility shortcomings.
Every possible instance of `<div class="button">` matching the command
`ag '<[^ab].*?class=.*?[" ]button[ "]' templates/ | grep -v 'dropdown'`
has been converted when possible.
divs with the `dropdown` class and their children were omitted as
1. more analysis must be conducted whether the dropdowns still work as
intended when they are a `button` instead of a `div`.
2. most dropdowns have `div`s as children. The HTML standard disallows
`div`s inside `button`s.
3. When a dropdown child that's part of the displayed text content is
converted to a `button`, the dropdown can be focused twice

Further changes include that all "gitea-managed" buttons with JS code
received an `e.preventDefault()` so that they don't accidentally submit
an underlying form, which would execute instead of cancel the action.
Lastly, some minor issues were fixed as well during the refactoring.

## Future improvements

As mentioned in
https://github.com/go-gitea/gitea/pull/23337#discussion_r1127277391,
`<a>`s without `href` attribute are not focusable.
They should later on be converted to `<button>`s.

---------

Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
Co-authored-by: silverwind <me@silverwind.io>
Co-authored-by: techknowlogick <techknowlogick@gitea.io>
Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
2023-03-14 11:34:09 +08:00
wxiaoguang 75022f8b1a
Refactor branch/tag selector dropdown (first step) (#23394)
Follow: 
* #23345

The branch/tag selector dropdown mixes jQuery/Fomantic UI/Vue together,
it's very diffcult to maintain and causes unfixable a11y problems. It
also causes problems like #19851 #21314 #21952

This PR is the first step for the refactoring, move `data-` attributes
to JS object and use Vue data as much as possible.

The old selector `'.choose.reference .dropdown'` was also wrong, it hits
`<div class="choose reference"><svg class="dropdown icon">` and would
cause undefined behaviors.

I have done some quick tests and it works. After this PR gets merged, I
will move the code into a Vue SFC in next PR.



![image](https://user-images.githubusercontent.com/2114189/224099638-378a8a86-0865-47d1-bcba-f972506374c7.png)


![image](https://user-images.githubusercontent.com/2114189/224099690-70276cf5-b1e4-404a-b0c6-582448abf40e.png)

---------

Co-authored-by: techknowlogick <techknowlogick@gitea.io>
2023-03-11 12:47:09 +02:00
wxiaoguang 1b950b98cf
Use `gt-relative` class instead of the ambiguous `gt-pr` class (#23008)
`.gt-relative` is also `position: relative !important;`

There are `gt-pr-?` styles below (line 140) for `padding-right`, which
makes `.gt-pr` ambiguous

Co-authored-by: delvh <leon@kske.dev>
Co-authored-by: John Olheiser <john.olheiser@gmail.com>
Co-authored-by: techknowlogick <techknowlogick@gitea.io>
2023-02-20 19:16:56 -05:00
gempir d9c6cb71e1
Always go full width in PR view (#22844)
This is an alternative solution to #22824 
and would also close #22781

This makes the PR diff view always full width.
It makes sense to make use of that screen real estate. If you want a
more narrow view you can always resize your browser.
It also avoids cluttering the UI with another button + the database with
another column for the setting.

This is also how github and gitlab do it.
2023-02-16 13:25:00 -06:00
Lunny Xiao bd820aa9c5
Add context cache as a request level cache (#22294)
To avoid duplicated load of the same data in an HTTP request, we can set
a context cache to do that. i.e. Some pages may load a user from a
database with the same id in different areas on the same page. But the
code is hidden in two different deep logic. How should we share the
user? As a result of this PR, now if both entry functions accept
`context.Context` as the first parameter and we just need to refactor
`GetUserByID` to reuse the user from the context cache. Then it will not
be loaded twice on an HTTP request.

But of course, sometimes we would like to reload an object from the
database, that's why `RemoveContextData` is also exposed.

The core context cache is here. It defines a new context
```go
type cacheContext struct {
	ctx  context.Context
	data map[any]map[any]any
        lock sync.RWMutex
}

var cacheContextKey = struct{}{}

func WithCacheContext(ctx context.Context) context.Context {
	return context.WithValue(ctx, cacheContextKey, &cacheContext{
		ctx:  ctx,
		data: make(map[any]map[any]any),
	})
}
```

Then you can use the below 4 methods to read/write/del the data within
the same context.

```go
func GetContextData(ctx context.Context, tp, key any) any
func SetContextData(ctx context.Context, tp, key, value any)
func RemoveContextData(ctx context.Context, tp, key any)
func GetWithContextCache[T any](ctx context.Context, cacheGroupKey string, cacheTargetID any, f func() (T, error)) (T, error)
```

Then let's take a look at how `system.GetString` implement it.

```go
func GetSetting(ctx context.Context, key string) (string, error) {
	return cache.GetWithContextCache(ctx, contextCacheKey, key, func() (string, error) {
		return cache.GetString(genSettingCacheKey(key), func() (string, error) {
			res, err := GetSettingNoCache(ctx, key)
			if err != nil {
				return "", err
			}
			return res.SettingValue, nil
		})
	})
}
```

First, it will check if context data include the setting object with the
key. If not, it will query from the global cache which may be memory or
a Redis cache. If not, it will get the object from the database. In the
end, if the object gets from the global cache or database, it will be
set into the context cache.

An object stored in the context cache will only be destroyed after the
context disappeared.
2023-02-15 21:37:34 +08:00
zeripath 51383ec084
Move helpers to be prefixed with `gt-` (#22879)
As discussed in #22847 the helpers in helpers.less need to have a
separate prefix as they are causing conflicts with fomantic styles

This will allow us to have the `.gt-hidden { display:none !important; }`
style that is needed to for the reverted PR.

Of note in doing this I have noticed that there was already a conflict
with at least one chroma style which this PR now avoids.

I've also added in the `gt-hidden` style that matches the tailwind one
and switched the code that needed it to use that.

Signed-off-by: Andrew Thornton <art27@cantab.net>

---------

Signed-off-by: Andrew Thornton <art27@cantab.net>
Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
2023-02-13 17:59:59 +00:00
Felipe Leopoldo Sologuren Gutiérrez 15c035775a
Add main landmark to templates and adjust titles (#22670)
* Add main aria landmark to templates
 * Adjust some titles to improve understanding of location in navigation

Contributed by @Forgejo
2023-02-01 22:56:10 +00:00
Jason Song 8fb1e53ca2
Rename actions to operations on UI (#22067)
Use "operations" to indicate "some something can be done", to prevent
users from confusing it with CICD.

Releated to: #13539.

Snapshots:

<img width="389" alt="image"
src="https://user-images.githubusercontent.com/9418365/206409797-a99bac25-2d38-4066-b9ab-27a4f6fe67e7.png">
<img width="398" alt="image"
src="https://user-images.githubusercontent.com/9418365/206410099-bbd258a9-54d9-4664-8d95-31d29cb35209.png">
<img width="442" alt="image"
src="https://user-images.githubusercontent.com/9418365/206410218-009a3103-a9b9-4d0c-86b6-540dda5bce89.png">

I'm not a native English speaker, but I think "operations" may be good
enough, and Gitea already uses this word:

<img width="1440" alt="image"
src="https://user-images.githubusercontent.com/9418365/206410671-4a718b14-0603-40cb-bdcb-f6f84d1f5e24.png">
2022-12-08 21:14:09 +08:00
Mark Ormesher 665d02efaf
Remove duplicate "Actions" label in mobile view (#21974)
Closes #21973.

The "Actions" button on the commit view page is labelled twice in mobile
view. No other buttons on the page have a `mobile-only` extra label, so
this PR removes it.

Before:


![before](https://user-images.githubusercontent.com/6496999/204540002-75baa08a-6c06-4b39-847b-34272e09d71e.PNG)

After:


![after](https://user-images.githubusercontent.com/6496999/204539991-a0607765-d5e2-4b1a-84c9-a3e16cbc674e.PNG)

Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
2022-12-01 22:39:19 -05:00
May f311d15a0b
Added space between avatar and username (#21825)
Added space between avatar and username which is missing on verified
commit message and avatar is too close to username which is don't look
nice.

Current state

![image](https://user-images.githubusercontent.com/3164256/202007728-d7d6ecac-f754-454c-a67f-e422f4aac5a5.png)


This is how it looks after change

![image](https://user-images.githubusercontent.com/3164256/202007984-d4a38a1c-7c24-4278-aa0f-9aa51c10f772.png)

Co-authored-by: zeripath <art27@cantab.net>
Co-authored-by: silverwind <me@silverwind.io>
Co-authored-by: techknowlogick <techknowlogick@gitea.io>
2022-11-15 16:36:53 -05:00
Gusted 6b712465a8
Revert increased width on pull pages (#21470)
- Revert a behavior from #21012, which liberally added `fluid padded` to
non-split style pull pages, this caused it to take up the whole
screen(such in split-style pull pages) on pull pages where the diff was
shown.
- Resolves #21460


### Before

![image](https://user-images.githubusercontent.com/25481501/196005545-bb8370c1-330d-4d47-be52-6d0c93e61583.png)

![image](https://user-images.githubusercontent.com/25481501/196005546-0022198e-6ef7-45d1-958c-77a042e5f80b.png)

### After

![image](https://user-images.githubusercontent.com/25481501/196005572-76a38309-9a41-412a-854f-24eae2b9ae4f.png)

![image](https://user-images.githubusercontent.com/25481501/196005551-2495b93d-ad08-4f59-abba-c327dadcc915.png)
2022-10-19 15:48:29 +01:00
sebastian-sauer 31f934c1d8
Add filetree on left of diff view (#21012)
This PR adds a filetree to the left side of the files/diff view.

Initially the filetree will not be shown and may be shown via a new
"Show file tree" button.

Showing and hiding is using the same icon as github. Folders are
collapsible. On small devices (max-width 991 PX) the file tree will be
hidden.

Close #18192

Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
2022-09-27 13:22:19 +08:00
silverwind 6c4688e1b1
Add whitespace removal inside template curly brackes (#20853) 2022-08-25 17:55:52 -04:00
zeripath 11bae50484
Pad GPG Key ID with preceding zeroes (#20878) 2022-08-21 02:50:15 -04:00
Gusted d55a0b7238
Refactor `i18n` to `locale` (#20153)
* Refactor `i18n` to `locale`

- Currently we're using the `i18n` variable naming for the `locale`
struct. This contains locale's specific information and cannot be used
for general i18n purpose, therefore refactoring it to `locale` makes
more sense.
- Ref: https://github.com/go-gitea/gitea/pull/20096#discussion_r906699200

* Update routers/install/install.go
2022-06-27 15:58:46 -05:00
Gusted 5d3f99c7c6
Make better use of i18n (#20096)
* Prototyping

* Start work on creating offsets

* Modify tests

* Start prototyping with actual MPH

* Twiddle around

* Twiddle around comments

* Convert templates

* Fix external languages

* Fix latest translation

* Fix some test

* Tidy up code

* Use simple map

* go mod tidy

* Move back to data structure

- Uses less memory by creating for each language a map.

* Apply suggestions from code review

Co-authored-by: delvh <dev.lh@web.de>

* Add some comments

* Fix tests

* Try to fix tests

* Use en-US as defacto fallback

* Use correct slices

* refactor (#4)

* Remove TryTr, add log for missing translation key

* Refactor i18n

- Separate dev and production locale stores.
- Allow for live-reloading in dev mode.

Co-authored-by: zeripath <art27@cantab.net>

* Fix live-reloading & check for errors

* Make linter happy

* live-reload with periodic check (#5)

* Fix tests

Co-authored-by: delvh <dev.lh@web.de>
Co-authored-by: 6543 <6543@obermui.de>
Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
Co-authored-by: zeripath <art27@cantab.net>
2022-06-26 22:19:22 +08:00
silverwind 9da3d78e74
Replace blue button and label classes with primary (#19763)
* make blue really blue

* replace blue button and label classes with primary

* add --color-blue-dark

* add light color variants, tweak a few colors

* fix colors

* add comment

Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
2022-05-20 00:08:08 +02:00