Dark theme with block posts

themes-discussion
dark-theme

(Jeff Wong) #1

Heavily influenced by the Dark Material Design, I decided to update and share my theme results here.

I don’t claim to be a designer at all, and I realize the colors aren’t perfect, but for those looking for a classic post-in-block feel, this might get you started.

Most of my changes were focused on the categories view, as it inspired me to make large rounded pills for each categories, rather than cards. I’ve also pulled up the categories to have a more ‘classic’ look so that transitions between dark background PHP themes and discourse will be less jarring.

https://raw.githubusercontent.com/featheredtoast/discourse-as-dark-theme/master/screenshots/categories.png

I also did my best to get rid of the grey feeling that generally comes with dark themes. Making the banners and quote gutters bright helped a bunch.


Never wanting to go back
An alternate dark theme
(@SenpaiMass) #2

Are the contrast of text+background fine with this? I faced that problem on dark material design. Also can you provide me a live demo via pm atleast would love to see it in action.


(Jeff Wong) #3

I doubt that it’ll pass a contrast test any better than yours; I know very little about colors and constrasts, tbh. I was mostly concerned with not shocking PHPbb users who were used to viewing posts in blocks.

I’ll PM you about a live demo soon


#4

Still debating a solution for a private forum I’m setting up, but this is the most promising forum style I’ve seen. I actively in pushed away from phpBB because the visual clutter is really hard for my brain to filter. Discourse has been really good looking and I’m basically going to steal your dark theme, unless I find something better <3.

Going to look and see if I can find some way to toggle between light/dark themes for users who don’t appreciate dark themes.


(Jeff Wong) #5

Hey thanks for the feedback! :slight_smile:

The screenshots there are a little out of date – I added a background to posts only, so it’s less blocky, and got rid of some of the padding on the categories view (they are thinner, healthier pills now) that work on mobile, too.

My community also came from a phpbb background, so I wanted to get them on fairly familiar ground, theme-wise, but without all the cruft. Let me know how it works out.


#6

Ooooh… Can I see a newer screenshot?

Still looking for other options besides Discourse, as I’m not sure I’ll have the skill set to manage my own server. I’m pretty tech savvy, I did study some programming and ran my parent’s small computer shop for a few years. My current budget is close to $0 until 2017/2018 when I’ll officially have this non-profit set up. Luckily, my brother -might- be able to help, he access to couple different hosting servers and does this kind of stuff for a living.To be able to read this forum, I have to invert colors using a chrome extension. (quick screenshot with snipping tool attached)


(Jeff Wong) #7

Topic screen:

Category screen:


#9

Whoops, deleted my post, going to try out the theme you posted to github :slight_smile:


#10

Our forums have been progressing wonderfully, but does have suggestions for a web template I could use that keeps a similar color scheme/vibe for my general use website that these forums are going to be attached to?

I think I had an easier time wrapping my head around teaching myself linux from scratch and setting up a SSL Discourse server, doing something other people on discourse said wouldn’t work (getting Dreamhost SMTP to work) than I will building my own site without someone to point me in the correct direction.

@awole20 you’ve spoiled me with such a wonderfully designed dark theme, I have no idea where to look for a similar quality web template. I need a couple static information pages/drop downs for my non-profit, a calendar page for events, and a home screen that I can update regularly as I announce new events.

Thanks to a ton of content generated on our forums for our non-profit, I now have stuff to post on a website/facebook, but it won’t come across as well without the bolding, bulleting, etc. that I use on our forums.


(Jeff Wong) #11

I’m not sure what sort of ‘web template’ you’re building (be it wordpress, tumblr, or something else) but I’m sure it wouldn’t be too difficult to implement the color themes on top of whatever you’re building in.

The main thing to match from here is the background color #202020, post background color #333333, text color #efefef and whatever you want as hilight #069069.