No option to change font size in defaultStyleOptions.js

[Cam-ster]

I am trying to change the font size of my chat's messages (both from the user and the bot) but there does not seem to be any option to do so in the styleOptions.

I have seen a way to change the font size using the window.WebChat.createStyleSet method.

However, my bot will be used on IE11 as well of modern browsers, and this way is not supported on IE11.

[Cam-ster]

I was able to find a work around for this:

.bubble {
font-size: 24px !important;
}

[corinagum]

Hi @Cam-ster, you can set your font-size in either the body of your HTML or in the root container of Web Chat via css. Here is my example:

body { 
   margin: 0;
   font-size: 18px;
 }

The intent here is that Web Chat will inherit whatever font size is set by the parent and calculate the small font from there. However, connectivityStatus, perhaps mistakenly, does have a setable font in defaultStyleOptions which might lead to further confusion.

@compulim, @cwhitten, should we update defaultStyleOptions to calculate the connectivity status font based off the inherited font? I think adding a comment inside defaultStyleOptions explaining that the font size is inherited is also warranted here.

[compulim]

Today, we are using absolute pixel size for the font. See defaultStyleOptions.js.

connectivityTextSize: 12,

I think we should use percentage. If our base font is '16px', this one should be '75%'.

[hcyang]

Hi @stevkan, since you were assigned to this issue, any updates? Thanks.

[tdurnford]

@hcyang

The connectivityTextSize should be updated to 75% in PR #2384

https://github.com/microsoft/BotFramework-WebChat/pull/2384/files#diff-59602d7073278fd31a720eee0c05c565R133