Issue "cover image" / "preview image" for Project Board view #9965

New Issue

GiteaMirror · 2025-11-02T08:54:26-06:00

GiteaMirror commented

2025-11-02 08:54:26 -06:00

Originally created by @gnat on GitHub (Dec 11, 2022).

Feature Description

This addition would be a big benefit for design and art teams using the issue tracking.

Could be as simple as using the first image attachment, or allowing users to select one of the attachments as a cover image.

Suggestion A:

Keep the preview the height of a tag or avatar, to not break the layout.

Suggestion B:

Use background-size: cover; to make the cover image fit the background of the issue.

Also open to other layout suggestions!

Screenshots

Suggestion A:

Suggestion B:

Original photo:

Originally created by @gnat on GitHub (Dec 11, 2022). ### Feature Description This addition would be a big benefit for design and art teams using the issue tracking. Could be as simple as using the first image attachment, or allowing users to select one of the attachments as a cover image. Suggestion A: * Keep the preview the height of a tag or avatar, to not break the layout. Suggestion B: * Use `background-size: cover;` to make the cover image fit the background of the issue. Also open to other layout suggestions! ### Screenshots Suggestion A: ![image](https://user-images.githubusercontent.com/24665/206928796-07e43cbd-6bb8-4d09-a850-a5a12ede58cf.png) Suggestion B: ![image](https://user-images.githubusercontent.com/24665/206928897-5677cf48-28ba-4b76-ac7a-7ea8702ec1db.png) Original photo: ![image](https://user-images.githubusercontent.com/24665/206928417-b1c2ce29-f5d5-4ac8-8db4-a2411618cc27.png)

GiteaMirror added the type/proposal type/feature labels 2025-11-02 08:54:26 -06:00

GiteaMirror closed this issue

2025-11-02 08:54:26 -06:00

GiteaMirror commented

2025-11-02 08:54:27 -06:00

@gnat commented on GitHub (Dec 12, 2022):

I've got an incoming PR for this, the preview will be the latest "image type" attachment on an issue- simple, and allows for automatic updates of the cover image as issue progress is made!

@gnat commented on GitHub (Dec 12, 2022): I've got an incoming PR for this, the preview will be the latest "image type" attachment on an issue- simple, and allows for automatic updates of the cover image as issue progress is made!

GiteaMirror commented

2025-11-02 08:54:27 -06:00

@gnat commented on GitHub (Dec 12, 2022):

A few other variations that may be much more useful, yet take up a bit more vertical space. These would make Gitea competitive with Trello... wouldn't it be amazing to say goodbye to Atlassian products? Ha.

Suggestion C (Top), Carousel style. Good for seeing a "timeline" of multiple assets at once!
Suggestion D (Bottom), Literally could replace Trello.

Suggestion E... Could be D if one image attachment, then C if more than one.

@gnat commented on GitHub (Dec 12, 2022): A few other variations that may be much more useful, yet take up a bit more vertical space. These would make Gitea competitive with Trello... wouldn't it be amazing to say goodbye to Atlassian products? Ha. Suggestion C (Top), Carousel style. Good for seeing a "timeline" of multiple assets at once! Suggestion D (Bottom), Literally could replace Trello. Suggestion E... Could be D if one image attachment, then C if more than one. ![image](https://user-images.githubusercontent.com/24665/207045161-7b03a318-82c2-45fe-afbf-d5102acb8afc.png)

GiteaMirror commented

2025-11-02 08:54:27 -06:00

@gnat commented on GitHub (Dec 12, 2022):

This scrolling ability would be so nice, but undoubtedly, MacOS is gonna natively re-theme the scrollbar and make it look ugly as sin. 😢 Maybe something to do in the future.

https://user-images.githubusercontent.com/24665/207062329-3654d2ec-0f6e-4923-8982-9ee8de3af82a.mp4

@gnat commented on GitHub (Dec 12, 2022): This scrolling ability would be so nice, but undoubtedly, MacOS is gonna natively re-theme the scrollbar and make it look ugly as sin. :cry: Maybe something to do in the future. https://user-images.githubusercontent.com/24665/207062329-3654d2ec-0f6e-4923-8982-9ee8de3af82a.mp4

GiteaMirror commented

2025-11-02 08:54:27 -06:00

@gnat commented on GitHub (Dec 12, 2022):

The CSS will try to center-align images until it cannot, then it will left align with overflow hidden. Single images get to be slightly larger.

First image is the most recent, the SQL will fetch up to 5 latest images (URL string).

All images supported by browsers plus upcoming formats: *.avif *.bmp *.gif *.jpg *.jpeg *.jxl *.png *.svg *.webp

Current revision with light and dark themes:

@gnat commented on GitHub (Dec 12, 2022): The CSS will try to center-align images until it cannot, then it will left align with overflow hidden. Single images get to be slightly larger. First image is the most recent, the SQL will fetch up to 5 latest images (URL string). All images supported by browsers plus upcoming formats: *.avif *.bmp *.gif *.jpg *.jpeg *.jxl *.png *.svg *.webp Current revision with light and dark themes: ![image](https://user-images.githubusercontent.com/24665/207066878-58e6bf73-0c93-4caa-8d40-38f4432b3578.png) ![image](https://user-images.githubusercontent.com/24665/207066555-293f65c3-e706-4888-8516-de8ec632d638.png)

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#9965