Font family issue in Layer List Widget and jimu.css

5175
18
07-27-2016 11:14 PM
AnninaHirschi_Wyss1
Occasional Contributor III

Dear all,

I don't know if that is already a known issue, but I personally don't like the font-family used in the LayerList widget, after the update of WAB 2.1 (online and dev).

So (for dev version only) I searched a bit in the CSS's and found some font-family definitions like Avenir-Medium, instead of Avenir Medium.

Basically I replaced all the appearances of that "-" in the following files, which fixes it.

- \LayerList\css\style.css (Lines 4, 30, 459, 493)

- \jimu.js\css\jimu.css (Lines 3597, 3746, 3776) (affects other widgets, e.g. “Robert’s eSearch Widget”)

I also informed the Esri Support Team about it.

Regards,

Annina

PS: Just got a note from support that they already logged a bug: BUG-000097347: The font used for items in the Layer List widget doe..

18 Replies
RobertScheitlin__GISP
MVP Emeritus

Annina,

  Thanks for sharing this info.

0 Kudos
AnninaHirschi_Wyss1
Occasional Contributor III

You're welcome!

BTW the Select Widget is also concerned

\widgets\Select\css\style.css:

Lines 19, 37, 40, 182

0 Kudos
TrentReeder
Occasional Contributor

In the jimu-theme.css file, change these two lines and most of the font reverts back to the previous WAB release.  At least that is what I have found so far...

  • Line 13 (.jimu-main-font), uncomment
  • Line 65 (.jimu-widget), change color to #838383
0 Kudos
AnninaHirschi_Wyss1
Occasional Contributor III

Hi Trent,

I tried your solution, but this doesn't work for me... It modifies only the title fonts of the widget, but not the layer list itself.

For the select widget there is another one to fix it on the config window:

Select\setting\css\style.css on lines 9 & 28

0 Kudos
TrentReeder
Occasional Contributor

Yeah, shortly after posting I noticed that my "simple" fix didn't catch all the widget fonts. 

Thanks for the tip for the select widget!

0 Kudos
BarnabyRockwell
Occasional Contributor III

This is great!  Thank you, Annina! 

0 Kudos
AnninaHirschi_Wyss1
Occasional Contributor III

You're welcome, Barnaby.

It looks like that in the meantime the online Version of WAB is fixed.

0 Kudos
BarnabyRockwell
Occasional Contributor III

Annina,

I am having a very strange issue with the font fix. The issue doesn't involve your fix, but.....

1) The fix works perfectly using IE11, Firefox, and Chrome when the fixed app is hosted on an internal server (Win Server 2012).  The fix also works fine when an app with it is viewed from within WAB Dev using IE11.

2) When an app with the fix is hosted on a public server (Win Server 2008), the fix works in Edge, Firefox, and Chrome, but NOT in IE11.  You can see for yourself with this app:

ArcGIS Web Application 

This is very odd, and I am stumped.  I cleared my IE11 cache many times, and still the fonts are bad after the app is reloaded.

Cheers,

Barnaby

0 Kudos
RobertScheitlin__GISP
MVP Emeritus

Barnaby,


  Does your browsers network traffic say anything about missing font or .wof files?

0 Kudos