diff --git a/app/assets/javascripts/discourse/app/components/parent-category-row-optimized.hbs b/app/assets/javascripts/discourse/app/components/parent-category-row-optimized.hbs index 42446a24e46..5110e40223e 100644 --- a/app/assets/javascripts/discourse/app/components/parent-category-row-optimized.hbs +++ b/app/assets/javascripts/discourse/app/components/parent-category-row-optimized.hbs @@ -28,6 +28,16 @@ {{dir-span this.category.description_excerpt htmlSafe="true"}} </div> {{/if}} + {{#if (gt this.category.subcategories.length 0)}} + <div class="category-subcategories"> + <LinkTo @route="discovery.subcategories" @model={{this.slugPath}}> + {{i18n + "category_row.subcategory_count" + count=this.category.subcategories.length + }} + </LinkTo> + </div> + {{/if}} </td> <td class="topics"> diff --git a/app/assets/javascripts/discourse/app/templates/mobile/components/parent-category-row-optimized.hbs b/app/assets/javascripts/discourse/app/templates/mobile/components/parent-category-row-optimized.hbs index 904676369e5..f3adc964ffd 100644 --- a/app/assets/javascripts/discourse/app/templates/mobile/components/parent-category-row-optimized.hbs +++ b/app/assets/javascripts/discourse/app/templates/mobile/components/parent-category-row-optimized.hbs @@ -23,6 +23,18 @@ </td> </tr> {{/if}} + {{#if (gt this.category.subcategories.length 0)}} + <tr class="category-subcategories"> + <td colspan="3"> + <LinkTo @route="discovery.subcategories" @model={{this.slugPath}}> + {{i18n + "category_row.subcategory_count" + count=this.category.subcategories.length + }} + </LinkTo> + </td> + </tr> + {{/if}} </tbody> </table> </div> diff --git a/app/assets/stylesheets/common/base/category-list.scss b/app/assets/stylesheets/common/base/category-list.scss index 35cbf8a383e..a6daf77df12 100644 --- a/app/assets/stylesheets/common/base/category-list.scss +++ b/app/assets/stylesheets/common/base/category-list.scss @@ -314,6 +314,14 @@ overflow: hidden; color: var(--primary-high); } + .category-subcategories { + font-size: var(--font-down-1); + margin-top: 0.5em; + + a { + color: var(--primary-high); + } + } .category-logo.aspect-image { margin-top: 0.5em; } diff --git a/app/assets/stylesheets/mobile/topic-list.scss b/app/assets/stylesheets/mobile/topic-list.scss index 042e242d6a2..d174749a63d 100644 --- a/app/assets/stylesheets/mobile/topic-list.scss +++ b/app/assets/stylesheets/mobile/topic-list.scss @@ -265,6 +265,14 @@ tr.category-topic-link { padding-bottom: 15px; } + .category-subcategories td { + padding-top: 0; + } + + .category-description + .category-subcategories td { + padding-top: 0; + } + .subcategories-list { border-bottom: none; td {