From 994b9152145708fbb5fd49005028519c353a8041 Mon Sep 17 00:00:00 2001
From: Daniel Pan <57362494+daniel-panhead@users.noreply.github.com>
Date: Thu, 28 Sep 2023 19:15:27 -0700
Subject: [PATCH] Add documentation for triplecolumn and remove test from
 GroupAView

---
 NOTEBOOK.md                         | 30 ++++++++++++++++++++++++++---
 src/views/enzymosome/GroupAView.vue | 10 ----------
 2 files changed, 27 insertions(+), 13 deletions(-)

diff --git a/NOTEBOOK.md b/NOTEBOOK.md
index 32b6391..f7b8a8f 100644
--- a/NOTEBOOK.md
+++ b/NOTEBOOK.md
@@ -7,7 +7,7 @@ You're welcome.
 All you need to get started is import is the `@/components/lab-notebook/Notebook.vue` file.
 The component takes two slots - `title` and `body`. Enter the section title directly into the `title` slot.
 
-For the `body` section, you can populate the content using the `SingleColumn` and `DoubleColumn` components.
+For the `body` section, you can populate the content using the `SingleColumn`, `DoubleColumn`, and `TripleColumn` components.
 Both components are already designed to be fully responsive - no need to account for resizing.
 The table of contents will also automatically populate with the titles provided to these components.
 
@@ -51,7 +51,7 @@ The `DoubleColumn` component takes a `title`, `left-title`, `left-body`, `right-
 Like `SingleColumn`, the titles require no tags, and other slots can be directly populated with just `<p>` tags.
 
 ```html
-<SingleColumn>
+<DoubleColumn>
   <template #title> Title </template>
 
   <template #left-title>Subheading 1</template>
@@ -63,7 +63,31 @@ Like `SingleColumn`, the titles require no tags, and other slots can be directly
   <template #right-body>
     <p>Right text</p>
   </template>
-</SingleColumn>
+</DoubleColumn>
+```
+
+### TripleColumn
+Now you're asking for it. FYI, I didn't implement NColumn because I'm not about to figure out how to make arbitrary-arity trees in Vue. This works the same way as `DoubleColumn`, just with a third `mid-` column.
+
+```html
+<TripleColumn>
+  <template #title> Title </template>
+
+  <template #left-title>Subheading 1</template>
+  <template #left-body>
+    <p>Left text</p>
+  </template>
+
+  <template #mid-title>Subheading 2</template>
+  <template #mid-body>
+    <p>Middle text</p>
+  </template>
+
+  <template #right-title>Subheading 3</template>
+  <template #right-body>
+    <p>Right text</p>
+  </template>
+</TripleColumn>
 ```
 
 ## CustomTable
diff --git a/src/views/enzymosome/GroupAView.vue b/src/views/enzymosome/GroupAView.vue
index fbde009..d472e2f 100644
--- a/src/views/enzymosome/GroupAView.vue
+++ b/src/views/enzymosome/GroupAView.vue
@@ -2,7 +2,6 @@
 import Notebook from '@/components/lab-notebook/Notebook.vue'
 import SingleColumn from '@/components/lab-notebook/SingleColumn.vue'
 import DoubleColumn from '@/components/lab-notebook/DoubleColumn.vue'
-import TripleColumn from '@/components/lab-notebook/TripleColumn.vue'
 import CustomTable from '@/components/CustomTable.vue'
 
 const tableData = {
@@ -102,15 +101,6 @@ const tableData = {
           </p>
         </template>
       </SingleColumn>
-      <TripleColumn>
-        <template #title>Title</template>
-        <template #left-title>Left Title</template>
-        <template #left-body>Left body stuff</template>
-        <template #mid-title>Mid Title</template>
-        <template #mid-body>Mid body stuff</template>
-        <template #right-title>Right Title</template>
-        <template #right-body>Right body stuff</template>
-      </TripleColumn>
       <SingleColumn>
         <template #title>Results</template>
         <template #graphic>