☁️ Discourse Air Theme

Here is my CSS changes to improve the Mobile View.

I absolutely love this theme, but noticed some little minor odd bits, so I also added the following CSS to make it look a little nicer in my perspective. I hope this helps someone else with the same preferences.

Here is the Original (Unedited)

image

Note the following in the picture above:

  • The number 1 which represents the Replies is to far to the left.
  • The topic bubble is slightly overlapping the blue background.
  • There is no padding between all the content and the blue background.
  • The blue background does not look nice in the category page. I love it on the home page though.

Here is the CSS code I added in the Mobile tab.

/* Add some padding to the Category, Sub-Category, Tags, searc, latest, new topic, and notification area*/
.list-controls {
    padding: 5px;
}

/* Adds some padding to the Topics area */
div#list-area {
    padding: 6px;
}

/* Aligns the Replies number more to the right */
.full-width .contents .topic-list .topic-list-body .topic-list-item .topic-list-data.posts {
    float: right;
}

Updated (After adding the CSS)

image

If you too, prefer to remove the blue background, here is the code to only remove it from the category pages.

/* Removes the blue background for category only */
html .category .background-container {
    background: #fff;
    clip-path: none;
}

Here is what It looks like with all the changes.

image

3 Likes

Flagging Mobile Issue

On mobile, there is a Category dropdown. When clicked and either Latest, Unread, or Top is selected, you cant select Categories from the dropdown again.

1.Before

image

2.When the dropdown menu is clicked

image

3.After you click

image

4. Dropdown menu (missing Categories)

image

At this point, a user is unable to select the dropdown and choose Categories again.

Any advise on how to fix this issue?

Thanks

1 Like

@UnitedFreedom

:clap: :clap: :clap:

Thanks a ton for posting these helpful instructions for those wanting the view column to be visible.

Do you have a link to you site? I am trying this on mine locally and am unable to reproduce.

Thank for this complete polished full theme.

I am having an issue with featured topics component not showing the cards. I would like to also have the option to have it only show featured topics within specified categories. Which in theory it should or even in the variants based on the official one.

see pic below

I can if needed dm you a link to take a look. Both test topics have pics that are featured; though using custom tag pi-featured. Running test-passed

Please send a link, Ill take a look :+1:

2 Likes