# 🔥 Roast my Theme Component: Advanced Topic Cards

**URL:** https://meta.discourse.org/t/roast-my-theme-component-advanced-topic-cards/391984
**Category:** Development
**Tags:** topic-cards
**Created:** [December 23, 2025, 10:17am UTC](https://meta.discourse.org/t/roast-my-theme-component-advanced-topic-cards/391984 "2025-12-23T10:17:40Z")
**Posts on this page:** 5
**Page:** 1

<div class="post-metadata">

### Author: ![jrgong](https://avatars.discourse-cdn.com/v4/letter/j/c57346/32.png) [@jrgong](https://meta.discourse.org/u/jrgong)
#### Post date: [December 23, 2025, 10:17am UTC](https://meta.discourse.org/t/roast-my-theme-component-advanced-topic-cards/391984/1 "2025-12-23T10:17:40Z")

</div>

Hey guys

> Disclaimer: No AI was hurt in building this theme component 😃

Yes guys, I am guilty of shamelessly vibe-coding a rip off of the [Topic Cards](https://meta.discourse.org/t/topic-cards/296048) theme component. Hence a huge shoutout to the original authors and contributors for the great work!

While at first this was a fork, over 80% of the code and structure was completely rewritten. We added a ton of new features and on first glance all the various settings can be quite overwhelming.

## Advanced Topic Cards - Preliminary Release

With our rewrite you get:

- more granular control where topic cards are displayed
- Two different topic card layouts
- Featured Cards Carousel at top of Latest page

For a full list detailed scroll down below ⬇

Feel free to test it, run it, copy it and roast it here in the thread! I am really excited about getting feedback on the result:

[https://github.com/jrgong420/advanced-topic-cards](https://github.com/jrgong420/advanced-topic-cards)

## Known Issues:

- Redundant TC settings: Some of the features regarding thumbnail and card height are redundant/not of value anymore
- Desktop view lacks horizontal scrolling via touchpad/mousewheel (Embla provides a plugin for that, we haven’t had
- Action Buttons are not as “polished”, need better visual rework

## **Summary of the improvements and features:**

> - **Per‑category, per‑device layouts**  
> Configure cards separately for desktop and mobile as **list** (image left, content right) or **grid** (image above, content below). You can choose exactly which categories use which layout on each platform.
> 
> - **Subcategory layout inheritance**  
> Optionally inherit card layouts from a parent category so you don’t have to configure every subcategory by hand.
> 
> - **Home page featured topics carousel (Embla)**  
> A featured topics carousel you can place on discovery routes (home/latest/top/categories), powered by **Embla Carousel** , with settings for slides per view, looping, alignment, drag behavior, and more.
> 
> - **Subcategory carousel on category pages**  
> Turn the subcategory list on a category page into a horizontal carousel, with controls for which parent categories and how many children are required before it shows.
> 
> - **Visual customization options**
> 
> - **Richer card components**  
> New card structure with:
> 
> - **Compatible with other Theme Components/Plugins** :
> 
> - **Features planned:**

---

<div class="post-metadata">

### Author: ![denvergeeks](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/denvergeeks/32/327671_2.png) [@denvergeeks](https://meta.discourse.org/u/denvergeeks)
#### Post date: [December 23, 2025, 12:05pm UTC](https://meta.discourse.org/t/roast-my-theme-component-advanced-topic-cards/391984/2 "2025-12-23T12:05:50Z")

</div>

Thank you so much for sharing - this is terrific!

---

<div class="post-metadata">

### Author: ![RGJ](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/rgj/32/523185_2.png) [@RGJ](https://meta.discourse.org/u/RGJ)
#### Post date: [December 23, 2025, 3:53pm UTC](https://meta.discourse.org/t/roast-my-theme-component-advanced-topic-cards/391984/3 "2025-12-23T15:53:11Z")

</div>

Very nice!! Great work 👍

Remarks:

- Does not work on non-category discovery routes like /latest or tag selections without category.

- The images don’t always align well

 ![image](https://global.discourse-cdn.com/meta/original/4X/d/d/e/dde2fba643c827766319596814a9e69e828ebf9e.jpeg)

even when there are no images

 ![image](https://global.discourse-cdn.com/meta/original/4X/9/6/a/96a03f43c84b9ee3f692e04bb531b7faa2a7027e.png)

- The carousel is VERY nice but shouldn’t it be a separate component?

- Would be nice to be able to exempt topics without a picture from the carousel.

---

<div class="post-metadata">

### Author: ![jrgong](https://avatars.discourse-cdn.com/v4/letter/j/c57346/32.png) [@jrgong](https://meta.discourse.org/u/jrgong)
#### Post date: [December 23, 2025, 5:33pm UTC](https://meta.discourse.org/t/roast-my-theme-component-advanced-topic-cards/391984/4 "2025-12-23T17:33:47Z")

</div>

Thx for the feedback!

> [@RGJ](#):
>
> - The images don’t always align well

Images look indeed whacky, same goes for the topic excerpt text being cut off

Would it be better from UX UI perspective to add padding around images in list layout?

> [@RGJ](#):
>
> - The carousel is VERY nice but shouldn’t it be a separate component?

That’s a fair point. Albeit my intention was to basically share same CSS styles for the carousel and regular topic cards.

> [@RGJ](#):
>
> - Would be nice to be able to exempt topics without a picture from the carousel.

👍

---

<div class="post-metadata">

### Author: ![gilles](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/gilles/32/549022_2.png) [@gilles](https://meta.discourse.org/u/gilles)
#### Post date: [August 27, 2026, 10:31am UTC](https://meta.discourse.org/t/roast-my-theme-component-advanced-topic-cards/391984/5 "2026-08-27T10:31:58Z")

</div>

Hi, your code needs a little update 😉

![image](https://cdck-file-uploads-global.s3.dualstack.us-west-2.amazonaws.com/meta/optimized/4X/9/c/f/9cf81b1e1920a45b0057d9e43f7d21d32159e65c_2_690x29.png)
