I find that the widgets are placed too far away from the ui borders consuming precious screen real estate.
I was hopping that it would be easy to customize using the scss theme files but not really. Below is the markup:
<div class="esri-ui" style="inset: 0px;">
<div class="esri-ui-inner-container esri-ui-corner-container" style="inset: 15px 15px 30px;">
<div class="esri-ui-top-left esri-ui-corner">
[...]
The margins from the ui borders to the widgets is defined by `style=inset: 15px ...` making it harder to override.
Why is the rationale of having this hardcoded ? Should it be moved to the styles instead ?
One workaround is to use the infamous `!important` on one of the class but the inner-container class is also used at some other location and it messes with the UI layout. Is the corner-container class the one to update ? I haven't found it used anywhere else. If it is the cases what about moving the positions (inset) there ?
Thanks
Victor,
Because the esri-ui-corner-container div has an inline style with the inset you can not do anything without the !important to override it.
Thanks for trying to help Robert but unless I miss something it doesn't really answer my questions - which might not be very clear:
1) Is esri-ui-corner-container the right class to override (or is it possibly used at some other places) ?
2) (to the ESRI team) Why is there an inline "inset" style instead of it being defined by the theme. It would make it easier to document and override this style.