current community

your communities

more stack exchange communities

Stack Exchange
tour help
stack overflow careers
Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
up vote 0 down vote favorite

I'm working on a project with this template http://themeforest.net/item/angulr-bootstrap-admin-web-app-with-angularjs/8437259

The template is written in AngularJs + Bootstrap-UI (bootstrap for angular) and I would like to include some Material Design elements like cards and others.

It's possible to do that? it's recommended? My thing is we already love this template and way to many elements of it, but Material Design have Cards for example which are AMAZING and some dropdown or text inputs with the label animation which are amazing.

So my question is:

AngularJS + Bootstrap for Angular + Material Design for Angular = Awesomeness or Disaster?

Any opinion on this?

Thanks for your feedback

share|improve this question
    
Yes possible to do –  Sajeetharan Mar 28 at 6:39

2 Answers 2

up vote 4 down vote

If you add both bootstrap & angular-material this is what will happen

  1. Both have css which will target yr front end elements like - input
    element, buttons, more..

    Each have their own look & feel.

    For example, Bootstrap input element is different from Material input element. So, yr overall proj wont have one single look & feel.

  2. If you add both u will have to take care of one css over writing other for common parts.

    For example, font size & font family.

  3. Angular-material handles front end elements in angular way ( directive) So when they release a new version (29 releases so far), you will have to spent some time testing yr earlier code.

    For example, they changed $media to $mdMedia for handling sideMenu (i spent a lot of time finding why my sideMenu stopped working!).

  4. Yr overall size of project dependencies will increase if u r using two front end frameworks.

    Angular-material needs its own dependencies like 'angular-animate' & 'angular-aria'.

Talking about yr "md cards" there are "panels" in bootstrap u might wanna have a look here

I would recommend you stick to one thing either bootstrap or angular-material. Both are awesome just dont mix them.

share|improve this answer
    
Thanks man, that's what I want to hear, a clear and explained answer! –  Felipe Millan Mar 30 at 7:15
up vote 0 down vote

I just recently wrote a blog post on how to replace Bootstrap with Angular-Material. Its based on the kickstarter framework of choice I'm using, but it'll do the job you are after.

Much like @nitin said, it will be challenging to implement both. What I'd actually ask you to think about, regardless of whether its possible, is why you would want both?

The purpose of both is to provide an overall common UI style, but they are conceptually apposed to each other, rather than something that could work in tandem.

I'd recommend you start reading more about material design from the google guides before jumping right in.

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.