Commit Graph

6 Commits

Author SHA1 Message Date
Jarek Radosz bf9fe07f67 DEV: Update linting config and run gjs-codemod (#177) 2025-06-06 12:15:57 +01: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
Jarek Radosz c2b71c04a8 DEV: Update linting (#153) 2025-05-06 16:53:12 +01:00
Kris e53184ac28 UX: fix experimental new new positioning (#151)
These styles were added for bulk select positioning, but turns out they
weren't needed anyway

before:

![image](https://github.com/user-attachments/assets/bf752846-cb51-4872-9cb7-2d98ab7f5c8f)

after:

![image](https://github.com/user-attachments/assets/4a25c776-b88c-4be6-b186-31973c6b5e05)
2025-04-25 11:35:00 -04:00
Kris d67ec3ac5f FIX: remove SCSS mixed declarations (#143)
This fixes the SCSS mixed declaration errors (most noticeable while
running rspec)
2025-04-17 17:27:13 -04:00
Martin Brennan b23c4764a2 DEV: Put full width styles into their own file (#132)
Followup f1d5b69293

We want to make it super clear that this is to be removed when we merge
full width into core, keeping it in desktop.scss together with other
styles will make that harder.
2025-04-15 13:46:20 +10:00