Viewer inset outline

[JethroLeevers]

The new viewer seems to have a style on focus ( .esri-view-surface--inset-outline ), this adds a border to the viewer, is there any way to stop this from happening, I tried removing it from the dom on view.when but it seemed to re-add the style on focus.

[Egge-Jan_Pollé · Accepted solution]

Hi Jethro Leevers,

Did you see this thread? [arcgis js api 4.*] remove blue frame/outline around MapView 

There Robert Scheitlin, GISP‌ suggests the following solution, using CSS:

.esri-view .esri-view-surface--inset-outline:focus::after {
  outline: none !important;
}‍‍‍

HTH,

Egge-Jan

[Nicolas_]

I think this solution stopped working in version 4.27

[MiroslavUmlauf]

Indeed it stopped working due to change of DOM inside view from version 4.26 to 4.27. Updated CSS adjusted by this change:

.esri-view .esri-view-surface--touch-none:focus::after {
  outline: none !important;
}

[miro_aus]

Version 5.0

.esri-view .esri-view-surface:focus::after,
.esri-view .esri-view-surface:focus-visible::after { 
  outline: none !important; 
}

Or use a subtle outline instead, as removing focus outlines is not ideal for accessibility.

.esri-view .esri-view-surface:focus::after, 
.esri-view .esri-view-surface:focus-visible::after { 
  outline: 4px solid rgba(255, 255, 255, 0.25); 
  outline-offset: -4px; 
}