[nodebb-theme-material] Theme for NodeBB using Material Design elements

[pichalite]

Theme for NodeBB using Material Design elements. Right now the theme uses button styles (raised buttons) from material design concepts. I will be adding more material design concepts later.

Screenshots

Installation

npm install nodebb-theme-material

Github

GitHub - pichalite/nodebb-theme-material: Theme for NodeBB using Google Material Design

Theme for NodeBB using Google Material Design. Contribute to pichalite/nodebb-theme-material development by creating an account on GitHub.

GitHub (github.com)

Demo

[Schamper]

@pichalite have you looked into the various Material CSS frameworks? I expect a full on ripple for the buttons

Here is one of those frameworks.

[pichalite]

@Schamper I am actually using this framework
https://fezvrasta.github.io/bootstrap-material-design/

Adding ripples to buttons is the next thing on my list to add to the theme.

[julian]

Beautiful! I know @psychobunny has been falling in love with material design recently, so he'll have some thoughts for sure

Edit: Funny how cyclical these things are, eh? Bootstrap 2 had buttons with gradients, Bootstrap 3 eschewed gradients for a flatter design, and now material design is coming back with raised buttons, drop shadows, and skeuomorphic concepts!

[Mega]

Yeah, everything new is well-forgotten old.

[pichalite]

@Schamper get the latest version. Ripple effect works for the buttons now.

[pichalite]

demo link added to first post

[pichalite]

Updated to add Material Design style check boxes.

Demo

Checkboxes sample can be found in "Unread" page or user settings page.

[pichalite]

When I changed the checkboxes to material design style, I lost the option to hold shift and check multiple checkboxes. Any suggestion on if and how I can make this work again?

@julian @baris @psychobunny

[baris]

The topic select module relies on fa-check-square-o and fa-check-square classes. We need to change those so it works for other icons.

[trevor]

Are you planning on making the theme completely material or just using certain elements here and there to make it have the material feel?

[pichalite]

@trevor I wanted to make it completely material but right now I could only find time to add certain elements to get the material feel.

[trevor]

@pichalite said:

@trevor I wanted to make it completely material but right now I could only find time to add certain elements to get the material feel.

Ah okay, cool stuff so far man. Keep up the good work!

[pichalite]

@trevor said:

Ah okay, cool stuff so far man. Keep up the good work!

Thanks man. I am not a UI designer but I am trying to learn in the process.