We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Bootstrap

I would be nice if your objects would receive "at least some" of the colors, fonts and some general looks from bootstrap template css!
It isn't the most important thing but if applying a new theme also reflected on your objects would be so much better for us...

Please consider it, or some tool that could connect the most important thing like colors, etc... to the bootstrap css.

Loving your Blazor suite, the most advanced on the market!

5 Replies

SU Sridurgha Uthayakumaran Syncfusion Team November 1, 2019 11:33 AM UTC

Hi Armando,

 

Greetings from Syncfusion.

 

We suggest you to use the Theme Studio for customizing styles of Blazor components. Please refer the below link for further details on Theme Studio for Syncfusion Blazor components.

 

Theme Studio: https://ej2.syncfusion.com/blazor/documentation/appearance/theme-studio/

 

For your convenience, we have created a sample referring customized styles created from theme studio and the same can be found from the below link.

 

Sample: https://www.syncfusion.com/downloads/support/forum/148727/ze/bootstrapTheme1930215781.zip

 

Please let us know if you require any further assistance on this.

 

Regards,

Sridurgha U



AC Armando Costa November 1, 2019 05:45 PM UTC

If I want to apply a different color theme from bootstrap all app change except Syncfusion objects. 

No advantage here, just double the work...



But if you receive some of the attributes from the current bootstrap theme you would at least reflect some of the appearance automatically.
Or for instance on theme generator, you could ask for a bootstrap.css you want to use and try to adapt the best way possible to your suite.


SU Sridurgha Uthayakumaran Syncfusion Team November 5, 2019 12:58 PM UTC

Hi Armando, 

We would like to let you know that the bootstrap classes are used in bootstrap.css file and  it is not possible to customize the style for Syncfusion components from bootstrap classes. Instead we can customize the styles by using bootstrap SCSS variable. Here the required bootstrap scss variable can be overridden. Please add the below code snippet in custom.scss file along with the SCSS variable which is to be overridden. 

@import "@syncfusion/bootstrap/scss/functions.scss"; 
@import "@syncfusion/bootstrap/scss/variables.scss"; 
 
/* make changes to the !default Bootstrap variables */ 
$btn-font-size: $btn-font-size-lg; 
 
/* finally, import Bootstrap to set the changes! */ 
@import "bootstrap/scss/bootstrap"; 
@import 'ej2-base/styles/bootstrap.scss'; 
@import 'ej2-buttons/styles/button/bootstrap.scss'; 

For your convenience, we have created a sample where we have overridden the color and size of button component and the same can be referred from the below link. 


However, we will document this in our blazor documentation and this will be published in one business day[11/06/19]. 

Please get back to us if you require any further assistance on this. 

Regards, 
Sridurgha U 



AC Armando Costa replied to Sridurgha Uthayakumaran November 5, 2019 08:55 PM UTC

Hi Armando, 

We would like to let you know that the bootstrap classes are used in bootstrap.css file and  it is not possible to customize the style for Syncfusion components from bootstrap classes. Instead we can customize the styles by using bootstrap SCSS variable. Here the required bootstrap scss variable can be overridden. Please add the below code snippet in custom.scss file along with the SCSS variable which is to be overridden. 

@import "@syncfusion/bootstrap/scss/functions.scss"; 
@import "@syncfusion/bootstrap/scss/variables.scss"; 
 
/* make changes to the !default Bootstrap variables */ 
$btn-font-size: $btn-font-size-lg; 
 
/* finally, import Bootstrap to set the changes! */ 
@import "bootstrap/scss/bootstrap"; 
@import 'ej2-base/styles/bootstrap.scss'; 
@import 'ej2-buttons/styles/button/bootstrap.scss'; 

For your convenience, we have created a sample where we have overridden the color and size of button component and the same can be referred from the below link. 


However, we will document this in our blazor documentation and this will be published in one business day[11/06/19]. 

Please get back to us if you require any further assistance on this. 

Regards, 
Sridurgha U 


Thank you,
 ill test that and wait for Blazor doc. update


SU Sridurgha Uthayakumaran Syncfusion Team November 6, 2019 09:22 AM UTC

Hi Armando, 

We have published the documentation for customizing the Blazor components and the same can be referred from the below link. 


Please let us know if you have any concerns. 

Regards, 
Sridurgha U 


Loader.
Live Chat Icon For mobile
Up arrow icon