Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Render the git graph on the server #12333

Merged
merged 14 commits into from
Aug 6, 2020

Conversation

zeripath
Copy link
Contributor

@zeripath zeripath commented Jul 26, 2020

Rendering the git graph on the server means that we can properly track flows and switch from the Canvas implementation to a SVG implementation.

  • This implementation provides a 16 limited color selection
  • The uniqued color numbers are also provided
  • And there is also a monochrome version
  • In addition is a hover highlight that allows users to highlight commits on the same flow.

Closes #12209

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

Screenshots

Color

Screenshot from 2020-07-27 18-52-37
Screenshot from 2020-07-27 21-01-30

Monochrome

Screenshot from 2020-07-26 21-44-16
Screenshot from 2020-07-26 21-43-11

Rendering the git graph on the server means that we can properly track
flows and switch from the Canvas implementation to a SVG implementation.

* This implementation provides a 16 limited color selection
* The uniqued color numbers are also provided
* And there is also a monochrome version
* In addition is a hover highlight that allows users to highlight commits on
the same flow.

Signed-off-by: Andrew Thornton <art27@cantab.net>
@zeripath zeripath added the topic/ui Change the appearance of the Gitea UI label Jul 26, 2020
@zeripath zeripath added this to the 1.13.0 milestone Jul 26, 2020
@zeripath
Copy link
Contributor Author

@silverwind I used the colors provided in #10217 (comment) but I think they don't quite match up nicely as highlights of each other - should be easily fixable though.

@GiteaBot GiteaBot added the lgtm/need 2 This PR needs two approvals by maintainers to be considered for merging. label Jul 26, 2020
@silverwind
Copy link
Member

Issue is that 16 colors of the same lightness is too much to get proper distinction. Some hand-picked ones may be better where you can also variate the lightness on them.

@silverwind
Copy link
Member

Based on those screenshots: The header could use a bit more horizontal padding so it aligns with the content below.

Not sure I like the buttons, maybe try outline variants? Could probably also add some text to them too.

@silverwind
Copy link
Member

silverwind commented Jul 27, 2020

Thought again about colors. Current ones are probably fine, but I'd put the green one first.

Signed-off-by: Andrew Thornton <art27@cantab.net>
zeripath and others added 7 commits July 27, 2020 18:39
Signed-off-by: Andrew Thornton <art27@cantab.net>
Signed-off-by: Andrew Thornton <art27@cantab.net>
Signed-off-by: Andrew Thornton <art27@cantab.net>
Signed-off-by: Andrew Thornton <art27@cantab.net>
Signed-off-by: Andrew Thornton <art27@cantab.net>
Signed-off-by: Andrew Thornton <art27@cantab.net>
@silverwind
Copy link
Member

Some suggestions in silverwind@a4a59d9 if you care to pull that in.

Signed-off-by: Andrew Thornton <art27@cantab.net>
@silverwind
Copy link
Member

silverwind commented Jul 28, 2020

I think you can delete web_src/less/vendor and the import in web_src/less/index.less and the ignoreFiles in .stylelintrc with this change.

Signed-off-by: Andrew Thornton <art27@cantab.net>
@silverwind
Copy link
Member

silverwind commented Jul 29, 2020

One last suggestion: Put all git graph related styles in web_src/less/features/gitgraph.less and then do a @import "./features/gitgraph.less"; in index.less right after the font-awesome import. We have to modularize the less more, this is a good opportunity.

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

@silverwind silverwind left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice work

@GiteaBot GiteaBot added lgtm/need 1 This PR needs approval from one additional maintainer to be merged. and removed lgtm/need 2 This PR needs two approvals by maintainers to be considered for merging. labels Jul 31, 2020
@GiteaBot GiteaBot added lgtm/done This PR has enough approvals to get merged. There are no important open reservations anymore. and removed lgtm/need 1 This PR needs approval from one additional maintainer to be merged. labels Aug 6, 2020
@lunny
Copy link
Member

lunny commented Aug 6, 2020

conflicted.

@zeripath
Copy link
Contributor Author

zeripath commented Aug 6, 2020

make lg-tm work

@zeripath zeripath merged commit 2c1ae6c into go-gitea:master Aug 6, 2020
@zeripath zeripath deleted the gitgraph-server-rendering branch August 6, 2020 08:04
@go-gitea go-gitea locked and limited conversation to collaborators Nov 24, 2020
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
lgtm/done This PR has enough approvals to get merged. There are no important open reservations anymore. topic/ui Change the appearance of the Gitea UI
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants