This is a migrated thread and some comments may be shown as answers.

Bootstrap + material theme

2 Answers 323 Views
General Discussions
This is a migrated thread and some comments may be shown as answers.
Mike
Top achievements
Rank 1
Mike asked on 02 Dec 2018, 01:57 PM

I'm using bootstrap with a material theme for bootstrap in my project.  I want my kendo controls to look material as well.  Currently for bootstrap v4 I must use the kendo bootstrap v4 file to keep my regular bootstrap formatting working, this means my kendo controls look nothing like I want them to look. Bootstrap should not be a "theme".  Are there any new "fixes" that can be applied to make this scenario work?  Is there a way to modify the current material theme in a way that doesn't break bootstrap?  The theme builder doesn't give anywhere near enough customization to achieve a material look.

 

It would be good if in the future you could separate theming from the layout system so your bootstrap file is additive to any theme the user wants to use. Right now we are frantically evaluating all options and that includes eliminating Kendo UI completely unfortunately.  I am hoping there is a solution because kendo is already in, but more work has been invested in the overall app design.

 

Thank you in advance

2 Answers, 1 is accepted

Sort by
0
Ivan Danchev
Telerik team
answered on 05 Dec 2018, 08:56 AM
Hello Mike,

We offer a number of built-in themes with Bootstrap v3 and Bootstrap v4 themes specifically designed to replicate the look and feel of Bootstrap. The other LESS themes apply different dimensions to the widgets so they need to use a different base file (kendo.common.css) and not kendo.common-bootstrap.min.css.
There are differences in the layout used by Kendo UI and that of Bootstrap, which requires additional CSS to be applied, see the following documentation sections for more details: As for the Material theme, do you use the LESS or SASS Material theme (the latter follows the Material Design Guidelines)? Could you link a dojo example, which demonstrates the scenario in which the Material theme breaks Bootstrap? This will give us a better idea of the issue you are facing and we will try to come up with a workaround.

Regards,
Ivan Danchev
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
0
Mike
Top achievements
Rank 1
answered on 05 Dec 2018, 02:45 PM

Thanks for the reply. 

At the moment I was using the all.css which is in the kendo-theme-material/dist folder as i was having some issues with the sass import in my project. I believe my co-worker tried all the fixes he came across in the existing documentation, but I will try and get a scaled down example sooner than later.  Thanks again.

Tags
General Discussions
Asked by
Mike
Top achievements
Rank 1
Answers by
Ivan Danchev
Telerik team
Mike
Top achievements
Rank 1
Share this question
or