split view about nuxt7

[quitoman]

Don't break a sweat, I've figured it out in a non-elegant way.

mounted() {
var $$ = this.$$
function updateMainLeftMargin(eventName) {
var leftPanelWidth = 0
if (eventName != 'panel:closed') {
leftPanelWidth = $$('.panel-left').width()
}
$$('.view-main').css('margin-left', leftPanelWidth + 'px')
}
$$('.panel-left').on('panel:resize', function () {
updateMainLeftMargin('panel:resize')
});
$$('.panel-left').on('panel:opened', function () {
updateMainLeftMargin('panel:opened')
});
$$('.panel-left').on('panel:closed', function () {
updateMainLeftMargin('panel:closed')
});

  function updateMainRightMargin(eventName) {
    var rightPanelWidth = 0
    if (eventName != 'panel:closed') {
      rightPanelWidth = $$('.panel-right').width()
    }
    $$('.view-main').css('margin-right', rightPanelWidth + 'px')
  }
  $$('.panel-right').on('panel:resize', function () {
    updateMainRightMargin('panel:resize')
  });
  $$('.panel-right').on('panel:opened', function () {
    updateMainRightMargin('panel:opened')
  });
  $$('.panel-right').on('panel:closed', function () {
    updateMainRightMargin('panel:closed')
  });

  this.$f7ready(async (f7) => {

  });
}