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

<template>
  <div class="rules-page-root">
    <DesktopRulesView v-show="isDesktop" />
    <MobileRulesView v-show="!isDesktop" />
  </div>
</template>

<script lang="ts" setup>
import { useDesktopBreakpoint } from '@/layouts/composables/useAppLayout'
import { useRulesPage } from './composables/useRulesPage'
import DesktopRulesView from './desktop/DesktopRulesView.vue'
import MobileRulesView from './mobile/MobileRulesView.vue'

const isDesktop = useDesktopBreakpoint()

useRulesPage()
</script>

<style scoped>
.rules-page-root {
  min-height: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
</style>

<style lang="less">
.rules-page-root.main-with-bottom-chrome-inner {
  overflow: hidden;
}
</style>