diff --git a/site/assets/js/lab/dragndrop_operations.ts b/site/assets/js/lab/dragndrop_operations.ts
index 7d4a86c..206737a 100644
--- a/site/assets/js/lab/dragndrop_operations.ts
+++ b/site/assets/js/lab/dragndrop_operations.ts
@@ -248,20 +248,20 @@ export class MoveFieldDragOperation extends DragOperation {
     this.drag_field.ele.style.width = ``;
     this.drag_field.ele.style.height = ``;
 
-    this.nb.addField(this.drag_field, this.drag_target_col, this.drag_target_row);
+    this.nb.add_field(this.drag_field, this.drag_target_col, this.drag_target_row);
 
     if (this.placeholder) {
-      this.nb.removeField(this.placeholder);
+      this.nb.remove_field(this.placeholder);
       this.placeholder = null;
     }
 
 
-    this.getTargetColumn().distributeHeight([{ index: this.drag_field.v_row, height: this.start_height }]);
+    this.getTargetColumn().distribute_height([{ index: this.drag_field.v_row, height: this.start_height }]);
   }
 
   protected commit() {
 
-    this.nb.calculateHeights();
+    this.nb.calculate_heights();
 
     this.drag_field.add_class("dragging");
     this.updateDragPos(this.drag_field);
@@ -293,7 +293,7 @@ export class MoveFieldDragOperation extends DragOperation {
 
     if (!this.swap_mode) {
 
-      if (insert_data = this.nb.mini_col.pointInside(this.curr_pos_x, this.curr_pos_y, 100)) {
+      if (insert_data = this.nb.mini_col.is_point_inside(this.curr_pos_x, this.curr_pos_y, 100)) {
         const different_col = this.drag_target_col != -1;
         const different_pos = (this.drag_target_row != insert_data.insert_row);
 
@@ -302,10 +302,10 @@ export class MoveFieldDragOperation extends DragOperation {
             this.placeholder.delete();
             this.placeholder = null;
             let target_col = this.getTargetColumn();
-            target_col.distributeHeight();
+            target_col.distribute_height();
 
             if (target_col.cell_count == 0) {
-              this.nb.removeCol(this.drag_target_col);
+              this.nb.remove_column(this.drag_target_col);
             }
           }
 
@@ -322,7 +322,7 @@ export class MoveFieldDragOperation extends DragOperation {
 
     for (const col of this.nb.columns) {
 
-      if (insert_data = col.pointInside(this.curr_pos_x, this.curr_pos_y, edge_size)) {
+      if (insert_data = col.is_point_inside(this.curr_pos_x, this.curr_pos_y, edge_size)) {
         const swap_mode = this.swap_mode
         const different_pos = (this.drag_target_col != col.index || this.drag_target_row != insert_data.insert_row);
         const insert_column = (insert_data.alignment > 0 && col.cell_count > 0);
@@ -369,10 +369,10 @@ export class MoveFieldDragOperation extends DragOperation {
 
               this.placeholder.delete();
               this.placeholder = null;
-              target_col.distributeHeight();
+              target_col.distribute_height();
 
               if (target_col.cell_count == 0) {
-                this.nb.removeCol(this.drag_target_col);
+                this.nb.remove_column(this.drag_target_col);
                 exiting_empty = true;
               }
 
@@ -382,7 +382,7 @@ export class MoveFieldDragOperation extends DragOperation {
 
             if (insert_data.alignment > 0 && !exiting_empty && !max_columns) {
               let insertion_index = insert_data.alignment == 1 ? col.index : col.index + 1;
-              this.nb.insertCol(insertion_index);
+              this.nb.insert_column(insertion_index);
               this.drag_target_col = insertion_index;
               this.drag_target_row = 0;
               new_col = true;
@@ -396,7 +396,7 @@ export class MoveFieldDragOperation extends DragOperation {
               this.placeholder = new NBBlankField(this.start_width, this.start_height);
               const height = new_col ? col.max_free() : Math.min(this.start_height, col.max_free());
               col.add(this.placeholder, this.drag_target_row);
-              col.distributeHeight([{ index: this.placeholder.r_row, height }]);
+              col.distribute_height([{ index: this.placeholder.r_row, height }]);
             }
           }
         }
@@ -529,7 +529,7 @@ export class ResizeFieldOperation extends DragOperation {
   protected end(): void {
     for (const set of this.sets) {
       set.col.latchHeights()
-      set.col.distributeHeight();
+      set.col.distribute_height();
       set.top.ele.style.transition = ""
       set.bottom.ele.style.transition = ""
     }
diff --git a/site/assets/js/lab/index.ts b/site/assets/js/lab/index.ts
index f98c101..66b9149 100644
--- a/site/assets/js/lab/index.ts
+++ b/site/assets/js/lab/index.ts
@@ -16,25 +16,25 @@ export async function init(compiler_worker_path: string) {
 
   let nb = new NB(2);
 
-  let grammar_input_field = nb.addField(new NBEditorField("Grammar"), 0)
+  let grammar_input_field = nb.add_field(new NBEditorField("Grammar"), 0)
   grammar_input_field.set_content_visible(true);
-  grammar_input_field.setText("");
-  grammar_input_field.setIcon(`<i class="fa-solid fa-chart-gantt"></i>`);
+  grammar_input_field.set_text("");
+  grammar_input_field.set_icon(`<i class="fa-solid fa-chart-gantt"></i>`);
 
-  let parser_info_field = nb.addField(new NBContentField("Parser Info"), 1);
+  let parser_info_field = nb.add_field(new NBContentField("Parser Info"), 1);
   parser_info_field.set_content_visible(false);
-  parser_info_field.setIcon(`<i class="fa-solid fa-circle-info"></i>`);
+  parser_info_field.set_icon(`<i class="fa-solid fa-circle-info"></i>`);
   let parser_info = new ParserView(parser_info_field);
 
   pipeline.GrammarDB.worker_path = compiler_worker_path;
 
-  let parser_input_field = nb.addField(new NBEditorField("Parser Input"), -1);
+  let parser_input_field = nb.add_field(new NBEditorField("Parser Input"), -1);
   parser_input_field.set_content_visible(true)
-  parser_input_field.setIcon(`<i class="fa-solid fa-quote-left"></i>`);
+  parser_input_field.set_icon(`<i class="fa-solid fa-quote-left"></i>`);
 
 
-  let ast_field = nb.addField(new NBContentField("AST Nodes"), -1);
-  ast_field.setIcon(`<i class="fa-solid fa-share-nodes"></i>`);
+  let ast_field = nb.add_field(new NBContentField("AST Nodes"), -1);
+  ast_field.set_icon(`<i class="fa-solid fa-share-nodes"></i>`);
   {
     let parent = ast_field.body;
 
@@ -45,8 +45,8 @@ export async function init(compiler_worker_path: string) {
     parent.appendChild(canvas);
   }
 
-  let cst_field = nb.addField(new NBContentField("CST Nodes"), -1);
-  cst_field.setIcon(`<i class="fa-solid fa-sitemap"></i>`);
+  let cst_field = nb.add_field(new NBContentField("CST Nodes"), -1);
+  cst_field.set_icon(`<i class="fa-solid fa-sitemap"></i>`);
   let cst_view = new CSTView(cst_field)
 
   let formatting_rules_field = new NBEditorField("Formatting Rules");
@@ -62,22 +62,22 @@ export async function init(compiler_worker_path: string) {
 
 
   let grammar_input_debounce = new Debounce(() => {
-    let text = grammar_input_field.getText();
+    let text = grammar_input_field.get_text();
     if (text) {
       setLocalValue(LocalStoreKeys.GrammarInput, text);
       grammar_input.update(text)
-      grammar_input_field.removeHighlight();
-      grammar_input_field.removeMsgs();
+      grammar_input_field.remove_highlight();
+      grammar_input_field.remove_messages();
     }
   });
 
   let parser_input_debounce = new Debounce(() => {
-    let text = parser_input_field.getText();
+    let text = parser_input_field.get_text();
     if (text) {
       setLocalValue(LocalStoreKeys.ParserInput, text);
       parser_input.update(text)
-      parser_input_field.removeHighlight();
-      parser_input_field.removeMsgs();
+      parser_input_field.remove_highlight();
+      parser_input_field.remove_messages();
     }
   });
 
@@ -90,7 +90,7 @@ export async function init(compiler_worker_path: string) {
   })
 
   parser_input_field.addListener("text_changed", parser_input => {
-    let text = parser_input.getText();
+    let text = parser_input.get_text();
     if (text) {
       setLocalValue(LocalStoreKeys.ParserInput, text);
       //parser.restart(text);
@@ -111,8 +111,8 @@ export async function init(compiler_worker_path: string) {
       if (error.origin == radlr.ErrorOrigin.Grammar) {
         //alert(error.msg);
         error_reporter.innerText = (`Unhandled Error: \n${radlr.ErrorOrigin[error.origin]}\n${error.msg}\n${error.line}:${error.col}`);
-        grammar_input_field.addHighlight(error.start_offset, error.end_offset, "red");
-        grammar_input_field.addMsg(error.start_offset, error.end_offset, error.msg);
+        grammar_input_field.add_highlight(error.start_offset, error.end_offset, "red");
+        grammar_input_field.add_message(error.start_offset, error.end_offset, error.msg);
       } else {
         //alert(error.msg);
       }
@@ -167,17 +167,17 @@ export async function init(compiler_worker_path: string) {
   parser.addListener("execute_instruction", debug_info => {
     let ctx = debug_info.ctx;
 
-    parser_input_field.removeCharacterClasses();
-    parser_input_field.addCharacterClass(ctx.input_ptr, ctx.input_ptr + 1, "dbg-input-pos");
-    parser_input_field.addCharacterClass(ctx.anchor_ptr, ctx.anchor_ptr + 1, "dbg-anchor-pos");
-    parser_input_field.addCharacterClass(ctx.begin_ptr, ctx.begin_ptr + 1, "dbg-begin-pos");
-    parser_input_field.addCharacterClass(ctx.end_ptr, ctx.end_ptr + 1, "dbg-end-pos");
+    parser_input_field.remove_character_classes();
+    parser_input_field.add_character_class(ctx.input_ptr, ctx.input_ptr + 1, "dbg-input-pos");
+    parser_input_field.add_character_class(ctx.anchor_ptr, ctx.anchor_ptr + 1, "dbg-anchor-pos");
+    parser_input_field.add_character_class(ctx.begin_ptr, ctx.begin_ptr + 1, "dbg-begin-pos");
+    parser_input_field.add_character_class(ctx.end_ptr, ctx.end_ptr + 1, "dbg-end-pos");
 
     if (debug_info.is_scanner) {
-      parser_input_field.addCharacterClass(ctx.sym_ptr, ctx.sym_ptr + 1, "dbg-sym-pos");
-      parser_input_field.addCharacterClass(ctx.sym_ptr, ctx.input_ptr, "dbg-sym");
+      parser_input_field.add_character_class(ctx.sym_ptr, ctx.sym_ptr + 1, "dbg-sym-pos");
+      parser_input_field.add_character_class(ctx.sym_ptr, ctx.input_ptr, "dbg-sym");
     } else if (ctx.sym_len > 0) {
-      parser_input_field.addCharacterClass(ctx.sym_ptr, ctx.sym_ptr + ctx.sym_len, "dbg-sym");
+      parser_input_field.add_character_class(ctx.sym_ptr, ctx.sym_ptr + ctx.sym_len, "dbg-sym");
     }
   });
 
@@ -194,7 +194,7 @@ export async function init(compiler_worker_path: string) {
   });
 
   controls.addListener("reset", () => {
-    parser_input_field.removeCharacterClasses();
+    parser_input_field.remove_character_classes();
     parser.reset();
   });
 
@@ -204,7 +204,7 @@ export async function init(compiler_worker_path: string) {
 
   await pipeline.sleep(10);
 
-  nb.calculateHeights();
+  nb.calculate_heights();
 
 
   await rad_init;
@@ -212,11 +212,11 @@ export async function init(compiler_worker_path: string) {
   let { grammar: example_grammar, input: example_input } = grammar_examples[Math.round(Math.random() * (grammar_examples.length - 1))];
 
   var text = getLocalValue(LocalStoreKeys.ParserInput) || example_input;
-  parser_input_field.setText(text);
+  parser_input_field.set_text(text);
 
 
   var text = getLocalValue(LocalStoreKeys.GrammarInput) || example_grammar;
-  grammar_input_field.setText(text);
+  grammar_input_field.set_text(text);
   grammar_input.update(text)
 
   setupConfig(config => {
diff --git a/site/assets/js/lab/notebook.ts b/site/assets/js/lab/notebook.ts
index 5500feb..24b0059 100644
--- a/site/assets/js/lab/notebook.ts
+++ b/site/assets/js/lab/notebook.ts
@@ -3,7 +3,7 @@
 import { MoveFieldDragOperation, ResizeFieldOperation } from "./dragndrop_operations";
 
 
-const TRANSITION_DURATION_MS = 100;
+const TRANSITION_DURATION_MS = 200;
 export const MIN_EXPANDED_FIELD_HEIGHT = 160;
 const COLLAPSED_FIELD_HEIGHT = 40;
 const UNASSIGNED_COLUMN = -100;
@@ -38,7 +38,7 @@ export class NB {
     }
   }
 
-  addField<T extends NBField>(field: T, col: number = 0, row: number = Infinity): T {
+  add_field<T extends NBField>(field: T, col: number = 0, row: number = Infinity): T {
     let column = this.mini_col;
 
     if (col >= 0) {
@@ -60,7 +60,7 @@ export class NB {
     return field
   }
 
-  removeField<T extends NBField>(field: T): boolean {
+  remove_field<T extends NBField>(field: T): boolean {
     let { col, v_row: row, nb_host } = field;
 
     if (nb_host != this || col <= UNASSIGNED_COLUMN) return false;
@@ -79,7 +79,7 @@ export class NB {
     return true
   }
 
-  removeCol(col_index: number) {
+  remove_column(col_index: number) {
     if (col_index >= 0 && col_index < this.columns.length && this.columns.length > 1) {
       let col = this.columns[col_index];
 
@@ -88,13 +88,13 @@ export class NB {
       }
 
       this.columns.splice(col_index, 1);
-      this.columns.forEach((col, i) => col.setIndex(i));
+      this.columns.forEach((col, i) => col.set_index(i));
       col.delete();
     }
   }
 
 
-  insertCol(col_index: number) {
+  insert_column(col_index: number) {
     let new_col = new NBColumn(this, col_index, false);
     this.columns.splice(col_index, 0, new_col);
 
@@ -102,7 +102,7 @@ export class NB {
       throw "wt"
     }
 
-    this.columns.forEach((col, i) => col.setIndex(i));
+    this.columns.forEach((col, i) => col.set_index(i));
 
     if (col_index == 0) {
       this.ele.insertBefore(new_col.ele, this.mini_col.ele.nextElementSibling);
@@ -113,10 +113,10 @@ export class NB {
   }
 
 
-  calculateHeights() {
+  calculate_heights() {
     for (const col of this.columns) {
       col.latchHeights();
-      col.distributeHeight();
+      col.distribute_height();
     }
 
     this.mini_col.latchHeights();
@@ -180,11 +180,11 @@ export class NBColumn {
       this.cells[own_index] = other_field;
       other_col.cells[other_index] = own_field;
 
-      this.setIndex();
-      other_col.setIndex();
+      this.set_index();
+      other_col.set_index();
 
-      this.distributeHeight();
-      other_col.distributeHeight();
+      this.distribute_height();
+      other_col.distribute_height();
 
       this.ele.replaceChild(temp_ele, own_ele);
       other_col.ele.replaceChild(own_ele, other_ele);
@@ -214,12 +214,12 @@ export class NBColumn {
       field.col = UNASSIGNED_COLUMN;
       field.v_row = -1;
 
-      this.setIndex()
+      this.set_index()
     }
   }
 
   add(field: NBField, row: number = Infinity, using_real_index: boolean = false) {
-    row = using_real_index ? row : this.findRealIndex(row);
+    row = using_real_index ? row : this.find_real_index(row);
 
     if (row < this.cells.length) {
       this.cells.splice(row, 0, field);
@@ -234,10 +234,10 @@ export class NBColumn {
     field.v_row = -1;
     field.is_mini = false;
 
-    this.setIndex()
+    this.set_index()
   }
 
-  setIndex(col_index: number = this.index) {
+  set_index(col_index: number = this.index) {
     this.index = col_index;
     this.cells.forEach((i, index) => { i.r_row = index; i.col = col_index });
     this.cells.filter(n => !(n instanceof NBBlankField)).forEach((i, index) => i.v_row = index);
@@ -247,7 +247,7 @@ export class NBColumn {
     return this.cells.findIndex(f => f === field);
   }
 
-  findRealIndex(virtual_index: number): number {
+  find_real_index(virtual_index: number): number {
     let index = -1;
     for (const cell of this.cells) {
       index++;
@@ -259,7 +259,7 @@ export class NBColumn {
     return this.cells.length
   }
 
-  pointInside(x: number, y: number, edge_size: number = 0): { insert_row: number, alignment: number } | null {
+  is_point_inside(x: number, y: number, edge_size: number = 0): { insert_row: number, alignment: number } | null {
 
     const { x: col_x, y: col_y, width, height } = this.ele.getBoundingClientRect();
     const col_max_x = col_x + width;
@@ -301,7 +301,7 @@ export class NBColumn {
   }
 
   latchHeights() {
-    this.cells.forEach(c => c.latchHeight())
+    this.cells.forEach(c => c.latch_height())
   }
 
   get cell_count(): number {
@@ -309,7 +309,7 @@ export class NBColumn {
   }
 
 
-  distributeHeight(fixed_heights_settings: { index: number, height: number }[] = []) {
+  distribute_height(fixed_heights_settings: { index: number, height: number }[] = []) {
 
     let real_height = this.ele.getBoundingClientRect().height;
 
@@ -319,7 +319,7 @@ export class NBColumn {
         return { f: false, h: 0 }
       }
 
-      return this.getFieldHeight(fixed_heights_settings.find(f => f.index == i), c);
+      return this.get_field_height(fixed_heights_settings.find(f => f.index == i), c);
     });
 
     let cell_height_sum = cell_heights.reduce((r, l) => {
@@ -342,11 +342,11 @@ export class NBColumn {
     }
     let normalized_value = 1 / normalized_heights.reduce((v, a) => v + a, 0);
     for (let i = 0; i < this.cells.length; i++) {
-      this.cells[i].setRelativeHeight(normalized_heights[i] * normalized_value);
+      this.cells[i].set_relative_height(normalized_heights[i] * normalized_value);
     }
   }
 
-  protected getFieldHeight(fixed_height_data: { index: number; height: number; } | undefined, c: NBField): { f: boolean, h: number } {
+  protected get_field_height(fixed_height_data: { index: number; height: number; } | undefined, c: NBField): { f: boolean, h: number } {
     if (fixed_height_data) {
       return { f: true, h: fixed_height_data.height };
     } else if (c.collapsed) {
@@ -371,7 +371,7 @@ export class MININBColumn extends NBColumn {
     field.is_mini = true;
   }
 
-  distributeHeight() { }
+  distribute_height() { }
 }
 
 export class NBField {
@@ -393,7 +393,7 @@ export class NBField {
 
   }
 
-  latchHeight() {
+  latch_height() {
     if (this.collapsed) return;
 
     const { height } = this.ele.getBoundingClientRect();
@@ -403,11 +403,11 @@ export class NBField {
   /**
    * @param height - a ratio of the parent containers height
    */
-  setRelativeHeight(height: number) {
+  set_relative_height(height: number) {
     this.ele.style.height = `${height * 100}%`;
   }
 
-  unsetRelativeHeight() {
+  unset_relative_height() {
     this.ele.style.height = ""
   }
 
@@ -418,8 +418,6 @@ export class NBField {
   remove_class(class_: string) {
     this.ele.classList.remove(class_);
   }
-
-
 }
 
 export class NBBlankField extends NBField {
@@ -445,14 +443,19 @@ export class NBBlankField extends NBField {
   delete() {
 
     this.deleting = true;
-    this.ele.style.opacity = `${0}px`
+    this.ele.style.opacity = `${0}`
+    this.ele.style.padding = `${0}`
+    this.ele.style.margin = `${0}`
+    this.set_relative_height(0);
 
     if (this.nb_host) {
       let nb_host = this.nb_host;
-      setTimeout(() => { nb_host.removeField(this); }, TRANSITION_DURATION_MS)
+      setTimeout(() => { nb_host.remove_field(this); }, TRANSITION_DURATION_MS)
     } else {
-      if (this.ele.parentElement)
-        this.ele.parentElement.removeChild(this.ele)
+      setTimeout(() => {
+        if (this.ele.parentElement)
+          this.ele.parentElement.removeChild(this.ele)
+      }, TRANSITION_DURATION_MS)
     }
   }
 }
@@ -521,7 +524,7 @@ export class NBContentField<EventObj = null, event_names = ""> extends NBField {
     return !this.ele.classList.contains("collapsed");
   }
 
-  setIcon(ele: HTMLElement | string) {
+  set_icon(ele: HTMLElement | string) {
     if (typeof ele == "string") {
       this.ele.querySelector(".nb-icon-container")!.innerHTML = ele;
     } else {
@@ -550,16 +553,16 @@ export class NBContentField<EventObj = null, event_names = ""> extends NBField {
     if (!this.nb_host) return;
 
     if (!is_collapsed) {
-      this.nb_host.calculateHeights();
+      this.nb_host.calculate_heights();
       this.pre_collapse_size = this.latched_height
       this.ele.classList.add("collapsed");
       this.collapsed = true
-      this.nb_host.calculateHeights();
+      this.nb_host.calculate_heights();
     } else {
       this.ele.classList.remove("collapsed");
       this.collapsed = false
       this.latched_height = this.pre_collapse_size
-      this.nb_host.columns[this.col].distributeHeight()
+      this.nb_host.columns[this.col].distribute_height()
     }
   }
 
@@ -592,7 +595,7 @@ export class NBContentField<EventObj = null, event_names = ""> extends NBField {
     }
   }
 
-  setRelativeHeight(height: number) {
+  set_relative_height(height: number) {
     this.relative_height = `${height * 100}%`;
     if (!this.is_fullscreen) {
       this.ele.style.height = this.relative_height
@@ -685,9 +688,7 @@ export class NBEditorField extends NBContentField<NBEditorField, "text_changed">
     });
   }
 
-
-
-  setText(text: string) {
+  set_text(text: string) {
     this.cm.dispatch(
       {
         changes: { from: 0, to: this.cm.state.doc.length, insert: text }
@@ -695,11 +696,11 @@ export class NBEditorField extends NBContentField<NBEditorField, "text_changed">
     );
   }
 
-  getText(): string {
+  get_text(): string {
     return this.cm.state.doc.toString();
   }
 
-  addHighlight(start_char: number, end_char: number, color: string) {
+  add_highlight(start_char: number, end_char: number, color: string) {
     end_char = Math.min(this.cm.state.doc.length, end_char);
     if (start_char == end_char) return;
     this.cm.dispatch({
@@ -709,7 +710,7 @@ export class NBEditorField extends NBContentField<NBEditorField, "text_changed">
     });
   }
 
-  removeHighlight() {
+  remove_highlight() {
     this.cm.dispatch({
       effects: [filter_effects.of((from, to, decoration) => {
         return !(decoration.spec.id == "highlight")
@@ -717,7 +718,7 @@ export class NBEditorField extends NBContentField<NBEditorField, "text_changed">
     });
   }
 
-  addCharacterClass(start_char: number, end_char: number, _class: string) {
+  add_character_class(start_char: number, end_char: number, _class: string) {
     end_char = Math.min(this.cm.state.doc.length, end_char);
     if (start_char == end_char) return;
     this.cm.dispatch({
@@ -727,7 +728,7 @@ export class NBEditorField extends NBContentField<NBEditorField, "text_changed">
     });
   }
 
-  removeCharacterClasses() {
+  remove_character_classes() {
     this.cm.dispatch({
       effects: [filter_effects.of((from, to, decoration) => {
         return !(decoration.spec.id == "class")
@@ -735,7 +736,7 @@ export class NBEditorField extends NBContentField<NBEditorField, "text_changed">
     });
   }
 
-  addMsg(start_char: number, end_char: number, msg: string) {
+  add_message(start_char: number, end_char: number, msg: string) {
 
     end_char = Math.min(this.cm.state.doc.length, end_char);
     if (start_char == end_char || start_char > end_char) return;
@@ -750,7 +751,7 @@ export class NBEditorField extends NBContentField<NBEditorField, "text_changed">
     this.cm.dispatch(lint.setDiagnostics(this.cm.state, this.diagnostics));
   }
 
-  removeMsgs() {
+  remove_messages() {
     this.diagnostics.length = 0;
     this.cm.dispatch(lint.setDiagnostics(this.cm.state, this.diagnostics));
   };
diff --git a/site/assets/sass/lab.sass b/site/assets/sass/lab.sass
index b3ec333..fb9c8a0 100644
--- a/site/assets/sass/lab.sass
+++ b/site/assets/sass/lab.sass
@@ -81,7 +81,7 @@
     opacity: 0
     box-sizing: border-box
     padding: 10px
-    transition: height 200ms, opacity 100ms
+    transition: height 200ms, opacity 50ms
 
     div
       width: 100%
@@ -132,6 +132,7 @@
       .nb-header-left-side
         display: flex
         flex-direction: row
+        margin-left: 20px
 
         .nb-collapsed-indicator
           opacity: 0
@@ -262,11 +263,25 @@
     display: none !important
 
 .nb-column.mini
-  flex-basis: content;
+  flex-basis: 60px;
+
+  @include mobile-screens
+    padding: 0
+    flex-basis: 40px;
+    margin: 0 5px
+
   .nb-field
     padding: 0
     padding-bottom: 20px
 
+
+    &.nb-blank-field
+      height: 0
+      opacity: 0
+      box-sizing: border-box
+      padding: 0
+      margin-bottom: 20px
+
     
     .nb-icon-container
       display: flex
@@ -282,9 +297,7 @@
       border-radius: 5px
       .nb-header-left-side
         display: none !important
-    .nb-body
-      display: none !important
-    .nb-resize-handle-area, .nb-collapsed-indicator
+    .nb-body, .nb-resize-handle-area, .nb-expand-button
       display: none !important
     .nb-icon 
       display: block
@@ -299,8 +312,12 @@
   padding: 0 30px
   z-index: 1000
 
+  @include mobile-screens
+    top: $header-height * 2 + 10
+
   .nb-header
     cursor: default !important
+    padding: 0 5px
 
   .nb-resize-handle-area, .nb-collapsed-indicator
     display: none !important
diff --git a/site/layouts/page/lab.html b/site/layouts/page/lab.html
index c8c0db4..9afa0ed 100644
--- a/site/layouts/page/lab.html
+++ b/site/layouts/page/lab.html
@@ -234,7 +234,6 @@ <h1>Data Usage and Local Resources </h1>
     <div class="nb-content-field">
       <div class="nb-header">
         <div class="nb-header-left-side">
-          <div class="nb-collapsed-indicator">+</div>
           <div class="nb-label"></div>
         </div>
         <div class="nb-loader">