app/layouts/parameters.vue

<template>
  <div>
    <!-- Show the loading page -->
    <client-only placeholder-tag="client-only-placeholder" placeholder=" " />

    <v-app>
      <LayoutLoadingScreen />

      <LayoutHeader />

      <LayoutParametersMenu />

      <v-main class="main">
        <LayoutSubheader />

        <LayoutAlertBar />

        <!-- Page will be rendered here-->
        <div class="inner-container">
          <h3 class="mt-8 mb-4">{{ pageTitle }}</h3>

          <slot />
        </div>
      </v-main>

      <LazyLayoutAlertContainer />
    </v-app>
  </div>
</template>

<script setup lang="ts">
import { useLayoutStore } from '~/stores/layout'

const layoutStore = useLayoutStore()
layoutStore.name = 'parameters'

const route = useRoute()
const i18n = useI18n()

const pageTitle = computed(() => i18n.t(route.name || 'parameters_page'))

</script>

<style scoped lang="scss">
:deep(.parameters-page-card) {
  background-color: rgb(var(--v-theme-neutral-very-soft));
  color: rgb(var(--v-theme-on-neutral-very-soft));
  padding: 24px;
  margin: 28px auto;
  max-width: 1200px;
}

.inner-container {
  max-width: 1200px;
  margin: 0 auto;
}
</style>