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)
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)
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.
