cabinet/frontend/src/views/Console.vue

<template>
  <b-container fluid>
    <b-row>
      <b-col>
        <h1>Console</h1>
      </b-col>
    </b-row>
    <b-row>
      <b-col md="5">
        <h2>Scratchpad</h2>
        <ScratchPad />
      </b-col>
      <b-col md="5">
        <h2>Editor</h2>
        <MainEditor :slug="$route.params.slug" />
      </b-col>
      <b-col md="2">
        <h2>Search Results</h2>
        <SearchResults />
      </b-col>
    </b-row>
  </b-container>
</template>

<script>
// @ is an alias to /src
import MainEditor from "../components/MainEditor";
import ScratchPad from "../components/ScratchPad";
import SearchResults from "../components/SearchResults";

export default {
  name: 'home',
  components: {
    SearchResults,
    ScratchPad,
    MainEditor
  }
}
</script>

<style scoped>
  h2 {
    font-size: large;
  }
</style>