boursecu_user/src/views/base/physicalReceive/index.vue

<template>
  <div class="physical-receive-page-root" :class="{ 'physical-receive-page-root--desktop': isDesktop }">
    <MobilePhysicalReceiveChrome v-show="!isDesktop" />

    <div :class="isDesktop ? 'dpr' : ''">
      <div :class="isDesktop ? 'dpr__container' : 'physical-receive-page-root__content'">
        <DesktopPhysicalReceiveChrome v-show="isDesktop" />
        <router-view />
      </div>
    </div>
  </div>
</template>

<script lang="ts" setup>
import { usePhysicalReceiveShell } from './composables/usePhysicalReceiveShell'
import DesktopPhysicalReceiveChrome from './desktop/DesktopPhysicalReceiveChrome.vue'
import MobilePhysicalReceiveChrome from './mobile/MobilePhysicalReceiveChrome.vue'

const { isDesktop } = usePhysicalReceiveShell()
</script>

<style scoped>
.physical-receive-page-root {
  min-height: 100%;
  height: 100%;
}

.physical-receive-page-root__content {
  min-height: 0;
}

.physical-receive-page-root--desktop {
  height: auto;
  min-height: 0;
}
</style>