Rework Fork Page

[JakobDev]

This is a rework of the Fork Page. It is currently WIP, that's why I don't use translations at the time and the code could maybe be improved. All features are working. It is inspired by the new GitHub Fork Page, but I had the Plans for doing a rework a little bit longer. Just tell me what you think and what features are you missing. The design is not considered final at the Moment, because I will like there are things that could be done better, but I can't say exactly what. Ideas how to make this better are very welcome.

btw:
I noticed that the translation of the title (the one you see in your browser tab) does not work, but that is not cursed by this PR.

[techknowlogick]

@JakobDev are you in our discord chat?

[JakobDev]

No, why?

[silverwind]

Seems better than the barebones page that was before, but alignment and margins in the screenshot definite need tuning. I'd also consider making actual boxes like GH, with rounded corner and all. If you get a basic layout done, I'm sure we can fine-tune CSS.

[silverwind]

Idea: Make a shareable template with the repo list from the /explore/repos. A list of forks is a list of repos, so they can share the template.

More similar lists in org page, user page repo tab etc. Could all share a template.

[JakobDev]

Idea: Make a shareable template with the repo list from the /explore/repos. A list of forks is a list of repos, so they can share the template.

This will not work. While it looks overall the same (what it should do), there a little differences. e.g the List of the Org/User Page does not cnatin the Owner for obvious reason. For the Fork Page, we don't want to show the "this is a Fork icon" for each Repo.

Seems better than the barebones page that was before, but alignment and margins in the screenshot definite need tuning.

What do you have in mind?

I'd also consider making actual boxes like GH, with rounded corner and all.

I thinks it's the best the keep the Design of a List of Repos overall the same in Gitea.

[silverwind]

Based on:

• Make margins equal top and bottom, and probably reduce them a small bite.
• Vertically center repo name on avatar, best done with flexbox.
• Put a interpunct between created and updated.
• Add margin or single space character around "/"

[JakobDev]

* Make margins equal top and bottom, and probably reduce them a small bite.

If you mean the 2 above and below, hey are the same size

* Vertically center repo name on avatar, best done with flexbox.

Done

* Put a interpunct between created and updated.

The already have a space. Do you mean something like ;?

* Add margin or single space character around "/"

Done

New Design:

[silverwind]

If you mean the 2 above and below, hey are the same size

They looked differently, but might be a misgauge from me. Will verify later myself.

The already have a space. Do you mean something like ;?

I mean · aka the Interpunct. It's in use in a few places and I think a good fit there.

New Design:

Please add gt-mr-3 or even gt-mr-4 to the avatar to provide needed spacing

[JakobDev]

New Screenshot:

[silverwind]

Thanks, will review soon.

[lunny]

The forks list page should have a similar ui like /explore/repos, so that some templates could be reused.

[lunny]

Thanks for the contribution. This PR is outdated. It could be replaced by #34784