diff --git a/docs/_quarto.yml b/docs/_quarto.yml
index ecec24b5..909cdadd 100644
--- a/docs/_quarto.yml
+++ b/docs/_quarto.yml
@@ -15,9 +15,7 @@ website:
         text: Installation
       - file: tutorials/
         text: Tutorials
-      - file: nodes/
-        text: Node Documentation
-      - file: attributes.qmd
+      - file: documentation.qmd
       - file: examples/
         text: Examples
       - file: cite/
@@ -31,14 +29,20 @@ website:
         href: https://youtube.com/c/bradyjohnston
 
   sidebar:
-  
-    - id: nodes
-      title: Nodes
+    - id: documentation
+      title: Documentation
       style: floating
       align: left
-      contents: nodes/
-      pinned: true
-      
+      # pinned: true
+      contents: 
+        - text: Docs
+          href: documentation.qmd
+        - installation.qmd
+        - attributes.qmd
+        - text: Nodes
+          href: nodes/index.qmd
+          contents: nodes/*
+  
     
     - id: tutorials
       Title: Tutorials
diff --git a/docs/attributes.qmd b/docs/attributes.qmd
index c379ab1d..123436eb 100644
--- a/docs/attributes.qmd
+++ b/docs/attributes.qmd
@@ -4,6 +4,9 @@ Below are the attributes which are potentially created when a structure is impor
 
 more detailed explanations of type conversions can be found in the Blender documentation [here](https://docs.blender.org/manual/en/latest/modeling/geometry_nodes/attributes_reference.html)
 
+- explain about world scale (1 angstrom == 1 cm in Blender, will be changed for 5.0 to be 1 nm = 1 m)
+- write-ups about different entities, ways to interact with them
+
 When an attribute is going to be read from the geometry, it is colored red like so: `Index::Input`, `chain_id`, etc.
 
 ## Data Types
diff --git a/docs/documentation.qmd b/docs/documentation.qmd
index 9bccf047..b1e3e952 100644
--- a/docs/documentation.qmd
+++ b/docs/documentation.qmd
@@ -1,3 +1,6 @@
-# Docs
+# Documentation
 
-Some documentation goes here <-
\ No newline at end of file
+Some documentation goes here <-
+
+::: {.documentation}
+:::
\ No newline at end of file
diff --git a/docs/filters.lua b/docs/filters.lua
index 451f6b4f..5b4e3d31 100644
--- a/docs/filters.lua
+++ b/docs/filters.lua
@@ -1,5 +1,13 @@
 local keywords = {"Float", "Int", "Vector", "Geometry", "Bool", "Matrix", "Rotation", "Material", "Color", "Collection", "String", "Name", "Object", "Input"}
-local attributes = {"sec_struct", "res_id", "chain_id", "entity_id", "res_name", "atom_name", "atom_id", "occupancy", "bfactor", "atomic_number", "charge", "vdw_radii", "mass", "is_backbone", "is_side_chain", "is_alpha_carbon"}
+local attributes = {"sec_struct", "res_id", "chain_id", "entity_id", "res_name", "atom_name", "atom_id", "occupancy", "bfactor", "atomic_number", "charge", "vdw_radii", "mass", "is_backbone", "is_side_chain", "is_alpha_carbon", "Position", "Index", "Normal", "ID"}
+
+local combined = {}
+for _, v in ipairs(keywords) do
+  table.insert(combined, v)
+end
+for _, v in ipairs(attributes) do
+  table.insert(combined, v)
+end
 
 function Code(el)
   for _, keyword in ipairs(keywords) do
@@ -11,7 +19,7 @@ function Code(el)
       return el
     end
   end
-  for _, attribute in ipairs(attributes) do
+  for _, attribute in ipairs(combined) do
     if el.text == attribute then
       -- el.text = "[".. el.text .. "](attributes.qmd#" .. attribute .. ")"
       table.insert(el.classes, "custom-attribute")
diff --git a/docs/style.scss b/docs/style.scss
index adc3419c..8ac7e7be 100644
--- a/docs/style.scss
+++ b/docs/style.scss
@@ -15,7 +15,7 @@
     @return 0.2126 * $r + 0.7152 * $g + 0.0722 * $b;
     }
 
-    @function contrast-color($background-color, $light-color: #dedede, $dark-color: #2d2d2d) {
+    @function contrast-color($background-color, $light-color: #d1d1d1, $dark-color: #2d2d2d) {
     @if luminance($background-color) > 0.3 {
         @return $dark-color;
     } @else {
@@ -115,11 +115,10 @@ background-color: $node-editor-grid;
 
 // Define the mixin
 @mixin code-style($background-color) {
-    // color: contrast-color($background-color);
-    color: $body-font-color;
+    color: contrast-color($background-color);
+    // color: $body-font-color;
     text-wrap-mode: nowrap;
     background-color: rgba(darken($background-color, 0%), 0.7);
-    // padding-top: .3em;
     padding-left: .4em;
     padding-right: .4em;
     font-weight: bold;
diff --git a/molecularnodes/noodlenotes/interface.py b/molecularnodes/noodlenotes/interface.py
index bb6c5b60..0a352d9b 100644
--- a/molecularnodes/noodlenotes/interface.py
+++ b/molecularnodes/noodlenotes/interface.py
@@ -84,7 +84,7 @@ def default(self) -> str:
             return "_None_"
 
     @property
-    def label(self) -> str:
+    def socket(self) -> str:
         return "{}::{}".format(self.name, self.type)
 
     @property
@@ -134,9 +134,9 @@ def __init__(self, items: List[InterfaceItem], is_output: bool = False) -> None:
     @property
     def attributes(self) -> List[str]:
         if self._is_output:
-            return ["description", "label"]
+            return ["description", "socket"]
         else:
-            return ["label", "default", "description"]
+            return ["socket", "default", "description"]
 
     def sep(self) -> str:
         string = ""
@@ -144,7 +144,7 @@ def sep(self) -> str:
             lines = "-" * self.lengths[attribute]
             if attribute == "default":
                 string += ":{}:|".format(lines)
-            elif attribute == "label" and self._is_output:
+            elif attribute == "socket" and self._is_output:
                 string += "{}:|".format(lines)
             else:
                 string += "{}|".format(lines)