How to switch from bootstrap with custom css to ng-bootstrap

[Githamza]

In my company we have already custom boostrap CSS .

Now we are working with Angular so I would switch to ng-bootstrap.

The problem is that we would use our graphic identity with ng-bootstrap.

Should we reedit ng-bootstrap CSS or there is a solution to switch our scss files to new ng-bootstrap ?

Thanks.

Angular: 6

ng-bootstrap: 4

Bootstrap: 4

[maxokorokov]

Hey, @Githamza!

We have two types of components:

1. bootstrap components → ex. alert, tabset, pagiation, etc. They exist in bootstrap and we completely reuse HTML markup and CSS classes provided by bootstrap. These should work fine with your custom theme, as we don't invent anything on top of standard Bootstrap.

2. non-bootstrap components → ex. datepicker, rating, timepicker. They do not exist in bootstrap, we have some custom styles for them, but we also try using standard bootstrap CSS classes in their markup. All out components have encapsulation: ViewEncapsulation.None, so you should be able override these styles quite easily. Ex. for datepicker you have custom .ngb-dp-xxx classes that you could tweak.

Now, there is also a PR #2947 in works for releasing CSS/SASS files for the second group of components as a part of the library (with variables based on the bootstrap variables, etc). But I can't make any commitments on dates for this at the moment.