Keep language statistics shown when viewport width is small #9669

New Issue

GiteaMirror · 2025-11-02T08:46:02-06:00

GiteaMirror commented

2025-11-02 08:46:02 -06:00

Originally created by @ell1e on GitHub (Oct 9, 2022).

Description

With a too small page width, the language statistics appear to be unreachable: the bar with the colorful language break-up below the "Commits"/"Branches"/"Tags"/"Storage" bar just disappears. With that, both the coarse statistics represented by it, as well as the click area to reach the detailed breakdown, seem to be just gone. I haven't found any other way to reach them, so that seems bad.

Maybe a fix would be to just not have it disappear?

Gitea Version

1.18.0+dev-421-geaa561145

Can you reproduce the bug on the Gitea demo site?

Yes

Log Gist

No response

Screenshots

Screencast from 10-09-2022 07:40:02 PM.webm

Git Version

No response

Operating System

No response

How are you running Gitea?

It reproduces on someone else's instance as well as the official demo site, I don't run it myself

Database

No response

Originally created by @ell1e on GitHub (Oct 9, 2022). ### Description With a too small page width, the language statistics appear to be unreachable: the bar with the colorful language break-up below the "Commits"/"Branches"/"Tags"/"Storage" bar just disappears. With that, both the coarse statistics represented by it, as well as the click area to reach the detailed breakdown, seem to be just gone. I haven't found any other way to reach them, so that seems bad. Maybe a fix would be to just not have it disappear? ### Gitea Version 1.18.0+dev-421-geaa561145 ### Can you reproduce the bug on the Gitea demo site? Yes ### Log Gist _No response_ ### Screenshots [Screencast from 10-09-2022 07:40:02 PM.webm](https://user-images.githubusercontent.com/64124388/194771570-87ad4976-c529-4e5f-8428-e5eb663b9c8e.webm) ### Git Version _No response_ ### Operating System _No response_ ### How are you running Gitea? It reproduces on someone else's instance as well as the official demo site, I don't run it myself ### Database _No response_

GiteaMirror added the type/enhancement topic/ui labels 2025-11-02 08:46:02 -06:00

GiteaMirror closed this issue

2025-11-02 08:46:02 -06:00

GiteaMirror commented

2025-11-02 08:46:02 -06:00

@wxiaoguang commented on GitHub (Oct 10, 2022):

It's hidden when width is small. That's done by purpose, unless there is a new UI design.

@wxiaoguang commented on GitHub (Oct 10, 2022): It's hidden when width is small. That's done by purpose, unless there is a new UI design.

GiteaMirror commented

2025-11-02 08:46:03 -06:00

@ell1e commented on GitHub (Oct 10, 2022):

Hm, but if there is no other way to reach the same content, maybe it just shouldn't be hidden? It doesn't seem like hiding it gains much screen space anyway.

Or could there be another button or tab added to reach the language statistics on a dedicated page maybe?

@ell1e commented on GitHub (Oct 10, 2022): Hm, but if there is no other way to reach the same content, maybe it just shouldn't be hidden? It doesn't seem like hiding it gains much screen space anyway. Or could there be another button or tab added to reach the language statistics on a dedicated page maybe?

GiteaMirror commented

2025-11-02 08:46:03 -06:00

@wxiaoguang commented on GitHub (Oct 10, 2022):

I could agree if there would be a better solution which enough people like. Not only the language bar, but also many other elements are hidden when width is small. That's a UI decision in history, and that's what I mean unless there is a new UI design.

@wxiaoguang commented on GitHub (Oct 10, 2022): I could agree if there would be a better solution which enough people like. Not only the language bar, but also many other elements are hidden when width is small. That's a UI decision in history, and that's what I mean `unless there is a new UI design`.

GiteaMirror commented

2025-11-02 08:46:03 -06:00

@ell1e commented on GitHub (Oct 10, 2022):

Surely if an element disappears it should still have some other way or spot to still trigger it? (Like a hamburger menu?) And otherwise simply be left in place?

Edit: Okay, so after playing around some more, it seems like 99% or even 100% of all other stuff disappearing has some other way to get to it. E.g. while all the info on the latest commit disappears, the "X Commits" button still gets you to the list of commits. Or for the per file commit message, you click the file, then "History", and there, still reachable. The language stats seem about one of the only things that just go away with no replacement.

Why not just leave everything as it is but make the language bar not disappear?

@ell1e commented on GitHub (Oct 10, 2022): Surely if an element disappears it should still have some other way or spot to still trigger it? (Like a hamburger menu?) And otherwise simply be left in place? Edit: Okay, so after playing around some more, it seems like 99% or even 100% of all other stuff disappearing has some other way to get to it. E.g. while all the info on the latest commit disappears, the "X Commits" button still gets you to the list of commits. Or for the per file commit message, you click the file, then "History", and there, still reachable. The language stats seem about one of the only things that just go away with no replacement. Why not just leave everything as it is but make the language bar *not* disappear?

GiteaMirror commented

2025-11-02 08:46:04 -06:00

@ell1e commented on GitHub (Oct 16, 2022):

Okay, so I think this CSS section should simply be removed:

@media (max-width: 767px) {
 .repository .repository-summary .segment.language-stats {
  display:none;
 }
}

How it looks like with that section gone:

Currently/without that removed:

@ell1e commented on GitHub (Oct 16, 2022): Okay, so I think this CSS section should simply be removed: ``` @media (max-width: 767px) { .repository .repository-summary .segment.language-stats { display:none; } } ``` How it looks like with that section gone: ![Screenshot from 2022-10-16 08-56-39](https://user-images.githubusercontent.com/64124388/196022706-f96cc51f-f78e-40a2-a486-6dbc0444c690.png) Currently/without that removed: ![Screenshot from 2022-10-16 08-55-55](https://user-images.githubusercontent.com/64124388/196022719-76298dbc-271e-4913-a6e0-b97a56676f6a.png)

GiteaMirror commented

2025-11-02 08:46:04 -06:00

@wxiaoguang commented on GitHub (Oct 1, 2023):

It should have been fixed by " Improve "language stats" UI #26968 " (although the UI is not perfect)

@wxiaoguang commented on GitHub (Oct 1, 2023): It should have been fixed by " Improve "language stats" UI #26968 " (although the UI is not perfect)

Sign in to join this conversation.

Branches Tags

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: github-starred/gitea#9669