Increase font size globally

[David]

Your components all use a fairly small font size and I would like to increase them (along with icon sizes and padding) to match the standard 16pt used by angular material and bootstrap.

I've been hacking at the css for individual components, inspecting the elements one by one and fiddling with them but I'm sure there must be a better way?

[David]

Just to add, I can see that we can change the colour values via scss variables but I see nothing about sizes etc.  Is that possible?

I also cannot find any mention of CSS classes in the documentation that might effect sizes eg ".btn-large" or something like that.  Is there any?

[Jesus Arockia Sankaran S]

Hi David, 

Thanks for contacting Syncfusion support.  

We have checked your requirement and suggest that you use classes “.e-icons” and “.e-control” to increase the icon size and font size as shown in the code snippet below. But while increasing the font size of icons, it affects other component padding. 

Code Snippet: 

.e-icons { 

  font-family: "e-icons"; 

  font-style: normal; 

  font-variant: normal; 

  font-weight: normal; 

  font-size: 20px; 

  line-height: 1; 

  speak: none; 

  text-transform: none; 

} 

Sample: http://www.syncfusion.com/downloads/support/forum/144845/ze/angular-font934698234.zip 

If you need further assistance in this, please come back to us. 

Regards, 

Jesus Arockia Sankaran S