Commit Graph

8 Commits

Author SHA1 Message Date
chapoi 2bcd04d4f4 UX: topic cards v3 (#182)
* Bringing back the OP
* Removed reason why topic appears (again) in topic list (="activity")
* Removed likes
* New layout with indention + moved all elements left (on desktop)

| Mobile | Desktop |
|--------|--------|
| ![CleanShot 2025-06-13 at 11 00
19@2x](https://github.com/user-attachments/assets/f43a773d-c8ba-4573-b16a-940e9fc3d901)
| ![CleanShot 2025-06-13 at 11 05
10@2x](https://github.com/user-attachments/assets/6bb152df-9ed3-4866-8c0a-95ddf94cd773)
|
| ![CleanShot 2025-06-13 at 11 02
25@2x](https://github.com/user-attachments/assets/3d9fb41c-a894-4b07-8737-6bd03e513f2f)
| ![CleanShot 2025-06-13 at 11 06
59@2x](https://github.com/user-attachments/assets/c54b9efe-fd1d-40aa-b8ad-2e4eab54eb90)
|
| ![CleanShot 2025-06-13 at 11 03
28@2x](https://github.com/user-attachments/assets/cdad49e8-ae6d-4f2c-9ef5-f6fa42705764)
| ![CleanShot 2025-06-13 at 11 07
10@2x](https://github.com/user-attachments/assets/91fee5ad-71b7-400c-a2c7-80339438b8de)
|
| ![CleanShot 2025-06-13 at 11 04
09@2x](https://github.com/user-attachments/assets/85296a16-f052-4787-a260-81fa54cd6191)
| ![CleanShot 2025-06-13 at 11 07
24@2x](https://github.com/user-attachments/assets/ffcaecb0-767a-4a72-8244-a3baa56d3cc2)
|
| ![CleanShot 2025-06-13 at 11 04
26@2x](https://github.com/user-attachments/assets/48a05ef5-366f-4543-bf0e-441ecae39877)
| ![CleanShot 2025-06-13 at 11 04
48@2x](https://github.com/user-attachments/assets/50499b4d-60bf-4b41-8a42-6fba8e0a41d8)
|

---------

Co-authored-by: Jordan Vidrine <jordan@jordanvidrine.com>
2025-06-13 11:08:57 +02:00
chapoi b72a3c1e95 UX: Topic cards v2 (#173)
This is the second iteration on the topic card design, in which we bring
back the OP and change the layout.

**Changes**:
* Show OP avatar
* Remove activity avatar and replace by reply icon
* Remove activity icon background
* Move category tag to top left
* Replace long activity copy ("…replied at…") with dot separator
* Change date formatting to `tiny`
* Adjust bulk select styling to new layout + align checkbox to top on
mobile VS keep centred on desktop

* Why: On desktop, the avatar is taking 2 lines (usually) and aligning
the checkbox vertically looks nice. Exception for excerpts, but since
that's only available for pinned topics atm that's a low occurrence. On
mobile, the topic card is 3 lines, with a smaller avatar, which makes
the checkbox "float" around a bit when centred. Hence aligning it to the
top, which for solid avatars aligns nicely too.

* CSS refactor: grid, breakpoints

Messages/bookmarks have not been changed.

| Description | Visual |
|--------|--------|
| Large topic list | ![CleanShot 2025-06-02 at 17 37
35@2x](https://github.com/user-attachments/assets/f232058e-dbf6-4689-abe3-65970464a3e3)|
| Large bulk edit | ![CleanShot 2025-06-02 at 17 37
17@2x](https://github.com/user-attachments/assets/03d86b5f-d62b-4449-9c0b-452ceb8be60c)
|
| Medium topic list | ![CleanShot 2025-06-02 at 17 39
01@2x](https://github.com/user-attachments/assets/80739641-cf8f-4095-938f-9781cac57a7d)
|
| Medium bulk edit | ![CleanShot 2025-06-02 at 17 39
24@2x](https://github.com/user-attachments/assets/6e9045af-734a-4f3f-830a-e03a2f06fdd8)
|
| Small topic list | ![CleanShot 2025-06-02 at 17 39
44@2x](https://github.com/user-attachments/assets/eeca80bc-6863-4026-8f19-b1b5cf6848f3)
|
| Small bulk edit | ![CleanShot 2025-06-02 at 17 40
00@2x](https://github.com/user-attachments/assets/cde7be08-cde2-4ff2-b81b-328d3d7be848)
|
| Messages page (remains unchanged) | ![CleanShot 2025-06-02 at 17 20
37@2x](https://github.com/user-attachments/assets/6512bfe9-a699-4c67-b709-166540ee6fde)
|
| Bookmark page (remains unchanged) | ![CleanShot 2025-06-02 at 17 21
01@2x](https://github.com/user-attachments/assets/f8f43638-e911-49cb-a0d5-ebcb51ccfba4)
|
2025-06-04 14:50:41 +02:00
David Taylor fe1cb262dc UX: Allow clicking anywhere on the topic-list card (#166) 2025-05-21 13:37:21 +01:00
Jordan Vidrine 18ffe04242 UX: New PM design (#125) 2025-04-11 13:43:17 -05:00
Jordan Vidrine 2046f525d4 UX: More logic for title columns (#87) 2025-03-28 10:49:28 -05:00
Jordan Vidrine e7de006a23 UX: Topic list layout changes (#85) 2025-03-27 16:31:46 -05:00
Jordan Vidrine d300cf9d0f UX: New topic card layout (#79) 2025-03-26 10:47:52 -05:00
Jordan Vidrine 41ee5a5358 DEV: Merge topic list card component (#17)
This PR merges the topic-list-item card component into the nextgen theme.

Also does the following cleanup:

* Use template-only ember components
* Use `fire` instead of deprecated `fa-fire` icon
* Lower version requirement for node to 18 to match core
* Add english locale strings for topic status column
* Remove dummy theme settings

---------

Co-authored-by: Martin Brennan <martin@discourse.org>
2025-03-06 13:35:27 +10:00