Панель не меняет размер после масштабирования ExtJs

Question

Код моей панели:

Ext.define('Admin.view.mypanel.SidePanel', {
    extend: 'Ext.panel.Panel',
    xtype: 'widget.side-panel',
    reference: 'SidePanel',
    controller: 'controller',
    width: '80%',
    height: '100%',
    floating: true, 
    title: 'Test',
    userCls: 'create-panel',
    modal: true,
    renderTo: Ext.getBody(),
    alignTarget: Ext.getBody(),
    hidden: true,
    defaultAlign: 'r-r',
    layout: 'fit',
    autoShow: false,    
    listeners: {
        afterrender: function (panel) {
        Ext.on('resize', function (width, height) {
            panel.setSize('80%','100%');
        });
    }
}});

Когда я начинаю масштабировать страницу в браузере, моя панель не меняет размер и теряет позицию rr http://joxi.ru/p27BjwVTo6YW4m. Как я могу исправить эту проблему?