Apps lost font support

Question

@AlixVezina

Hi, I'm using the Foldable Theme in the ArcGIS Web AppBuilder.  Although the widgets offer seven font choices (see photo), one can go in to the HTML editor and change the font to something different as I have done with Roboto (see photo example shown).  This used to work before the latest AGOL update.  Now, even with the HTML coded to Roboto, the App will override the code and default the font to Times New Roman, as seen in the last photo example.  It seems as though Roboto is no longer connecting to Esri.  One of our published Apps has reverted to Times New Roman from Roboto and the two Apps I'm about to publish no longer display Roboto.  I want to use Roboto because it is a preferred font at the Department of Conservation.  Please let me know if you need any additional information.  I would love to be able to use Roboto in our Apps. Thanks.

fonts offered

html to change font

defaults to Times New Roman

DickieRigdon · Answer

@Wei_Ying  Thank you for the reply Wei.  It's curious because I have consistently used Chrome and Windows for building the web map apps and displaying them.  They used to display Roboto fine and now they don't.  Even the published app used to display Roboto fine but now it doesn't.  I'm also looking at it with Chrome and Windows.  It just seems like something changed since last AGOL major update.  Thanks

Wei_Ying · Answer

Hi @DickieRigdon , the problem you are seeing attributes to browser and OS difference.
WAB About widget only introduces 7 common fonts which are supported across all browsers. (Those font are listed in widget css file). So they can be load without any problem.

For other font, if you use HTML ways editing content in About widgets, it depends on whether the browser and OS support the certain font. 
If the browser supports, it can display without problem.
If the browser does not support but the OS supports, the browser will introduce from the OS and display well. However, if neither browser and OS support the font, the browser will display the default font. 
Currently none of the common browsers support Roboto by default. From OS aspect, not sure which OS your are using, but Windows 10 should support Roboto, while MacOS does not.

If you want make sure your end users seeing the font correctly no matter from which OS, you have to introduce the font info in the widget CSS. However, About widget is not opening for code editing. Then you have to use custom widget if you insist to show this font. Otherwise, when you set HTML with certain font in About widget, whether your end users can view the font correctly depends on his/her OS.

Thanks,

Wei

DickieRigdon · Answer

@AlixVezina Hi Alix, I'm not quite understanding your workflow.  One must click OK after editing in the HTML editor window.  That immediately closes the widget window and the font defaults to Times New Roman.  The HTML reads "Roboto" but displays Times New Roman.  Again, changing the font in the HTML to Roboto has worked fine in the past but no longer works for my organization since the AGOL update.  Further, it is not just happening to current apps in production.  We have a published web map app (July 2021) that was styled in Roboto but when I open it now online, it displays Times New Roman.
HTML edited to Roboto......but displays Times New Roman

HTML_to_Roboto.JPG

Defaults_to_TimesNewRoman.JPG

NAD27_TEST.pdf

Form 1.xlsx