Problem/Motivation
When loading entity browser in iframe and if Claro is active as an admin theme and loaded iframe is in admin path Claro will load it system.admin library which will load next CSS file `css/layout/system-admin--layout.css` which has next CSS rules:
.layout-container {
margin-right: 1em;
margin-left: 1em;
}
...
@media screen and (min-width: 38em) {
.toolbar-tray-open:not(.toolbar-vertical) .layout-container,
body:not(.toolbar-tray-open) .layout-container {
margin-right: 3em;
margin-left: 3em;
}
...
EB iframe content is also in div.layout-container wrapper. EB also has margin reset rules for this in `/entity_browser/css/entity_browser.entity_browser.css`:
.layout-container {
margin: 0;
}
But the problem is that Claro rules are for margins are much stronger and will override EB reset rules.
Steps to reproduce
Use EB in iframe, for example the next screenshot is produced with paragraph media add action which uses EB media browser in iframe:
Proposed resolution
There are two ways to fix this:
1. Easy fix is to just add `!important` CSS declaration to EB margin reset rule.
2. It seems that EB iframe does not need any of the Claro `system.admin` library CSS rules. We could try to disable loading of this library for EB iframe routes.