Add base-root template recipe

[jacobtylerwalls]

describe the issue

We should add this example from archesproject/arches#11002 to the docs:

There is a new template that can be extended in projects: base-root.htm. It can be extended like so:

```
{% extends "base-root.htm" %}

 {% block title %}

 {% endblock title %}

 {% block body %}
 <div id="foo"></div>
 {% endblock body %}
```

with a corresponding .js file, eg:

```
    import BarComponent from '@/BarComponent.vue';
    import createVueApplication from 'arches/arches/app/media/js/utils/create-vue-application';

    createVueApplication(BarComponent).then(vueApp => {
        vueApp.mount('#foo');
    });

```

and vue file:

<template>
    <div class="hello">
        <h1>{{ message }}</h1>
    </div>
</template>

<script setup>
import { ref } from 'vue';

const message = ref('Hello, World!');
</script>

<style scoped>
.hello {
    font-family: Avenir, Helvetica, Arial, sans-serif;
    text-align: center;
    color: #2c3e50;
    margin-top: 60px;
}
</style>

we are now able to load Vue applications without the Arches chrome, and with optional custom theming via the PrimeVue api.

please add links to existing docs or code (if relevant)

which release does this issue concern?

7.6