как разместить svg-баннер поверх холста в приложении Sencha extjs6

Question

Я хочу поместить изображение баннера svg поверх моего приложения Sencha ExtJs6.

С помощью приведенных ниже кодов я мог бы добиться этого хотя бы для окна входа в систему, но не для самой главной панели.

svg-pnale сверху

Нужно ли использовать другой элемент класса в приложении ExtJs, например (.ext-element-1 .x-scroller .x-border-box x-panel .x-panel-navigation), или мне нужно поместить новый элемент где-нибудь в application.js scaffholder, какое приложение sencha генерирует?

   .x-border-box::before {
background-image: url(../images/_horizontal.svg) !important;
background-position: 0 -100px;
background-repeat: no-repeat;
background-size: cover;
content: "";
height: 15px;
position: absolute;
top: 0;
left: 0;
width: 100%;}

`

Изображение баннера не должно переопределятьсясуществующие элементы.Это должно быть исправление дополнительного элемента сверху при каждом действии, которое выполняет пользователь.

Оценивая любые подсказки.Большое спасибо заранее.

Answer 1

Вы можете попробовать использовать компонент Ext.Img для отображения изображения, хотя я не уверен на 100%, что он поддерживает SVG.

Вы также можете попробовать добавить svg в виде HTML на панели:

  {
        title: 'My SVG',
        html: '<img src=./resources/images/1.svg />'
  }