Description of the category is not displayed at mobile version

Contribute Feature
1

Hi, the descriptions of our categories aren´t shown at mobile version. Could you please help me. I´m not very familiar with CSS, but learning every day a little bit more

Dektop
Dektop

Mobile

Screenshot_20200508_091835
Screenshot_20200508_0918351080×1262 59.2 KB

Thanks for your support

2

U can try add this code to css:

@media only screen and (max-width: 601px){
    .category-list.with-topics .category-list-item .category-description {
        display: table-row;
    }
}
2 Likes
Category descriptions not showing up on mobile
3

Great, thanks so much!

May I ask two questions more?

  • Is it possible to include the description right besides the icon?
    +H ow can I change the color of the font in the blue button? I couldn’t find this button in the color settings of the theme

Screenshot_20200511_094100
Screenshot_20200511_0941001080×1110 117 KB

Thank you!

4

These two are separated, so it is very difficult to change them using only CSS. Alternatively, doing so might break other components.
Generally, this is a temporary change.
Since the button’s background color has changed, we can use a CSS class to adjust the text color:

.list-controls .container #create-topic {
    color: #fff;
}

Variable color: Developing Discourse Themes & Theme Components

5

This helps! Thanks so much!

6

Hi @Bcat thank you for the useful CSS code to add descriptions for mobile.

Is it possible on mobile to have the description appear on the right side of the image, not underneath the image?

Just like this?
image

1 Like
7

Should be possible with simple css.
Float the image to left and make parent div’s position relative.

1 Like
8

bless your soul for this one

1 Like