diff --git a/editor.css b/editor.css
index 6ca7b09..b149f34 100644
--- a/editor.css
+++ b/editor.css
@@ -19,7 +19,7 @@ body {
   width: 100%;
   position: fixed;
   padding-left: 10px;
-  z-index: 5;
+  z-index: 11;
   float: left;
   backdrop-filter: blur(10px);
   -webkit-backdrop-filter: blur(10px);
@@ -55,16 +55,14 @@ body {
   color: rgb(75, 151, 151);
 }
 
-#searchmenu {
-  width: 400px;
-  overflow: hidden;
-}
 
-#searchmenu #search-container {
-  /* position: fixed;
+
+.menuitem #search-container {
+  position: fixed;
   top: 0px;
-  bottom: 0px; */
-  padding: 5 5 5 5;
+  bottom: 0px;
+  width: 400px;
+  padding: 2 2 2 2;
   background-color: transparent;
   border-top: 4px solid transparent;
   border-bottom: 4px solid transparent;
@@ -74,27 +72,27 @@ body {
 }
 
 #search-container input {
-  /* height: 100%; */
-  height: 40px;
+  height: 100%;
+  /* height: 40px; */
   width: 100%;
-  border-radius: 15px;
-  border: 1px solid rgb(117, 117, 117);
-  padding-left: 10px;
-  padding-right: 38px;
+  border-radius: 10px;
+  border: .5px solid rgba(0, 0, 0, 0.123);
+  padding-left: 38px;
+  padding-right: 10px;
   outline: none;
   transition: all 100ms ease-out 50ms;
 }
 
 #search-container:hover input, #search-container input:active, #search-container input:focus {
-  border: 2px solid rgb(117, 117, 117);
-  /* box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); */
-  padding-left: 9px;
-  padding-right: 37px;
+  /* border: 2px solid rgb(117, 117, 117); */
+  box-shadow: 0 0px 10px 0 rgba(0, 0, 0, 0.12);
+  /* padding-left: 9px;
+  padding-right: 37px; */
 }
 
 #search-container input:focus {
-  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
-  transform: scale(1.02);
+  box-shadow: 0 0px 10px 0 rgba(0, 0, 0, 0.24);
+  /* transform: scale(1.02); */
 }
 
 ::selection {
@@ -111,29 +109,33 @@ body {
   align-items: center;
   position: absolute;
   cursor: pointer;
-  top: 10;
-  right: 10;
+  top: 7;
+  left: 7;
   background-color: transparent;
   transition: all 100ms ease-out 50ms;
   /* background-color: rgb(120, 120, 120); */
 }
-#search-container .search-button:hover {
-  transform: scale(1.1);
-}
 
 #search-container .search-button svg {
   stroke: rgb(117, 117, 117);
 }
 
 #search-results {
-  display: none;
-  position: relative;
-  padding: 20 20 20 20;
+  width: 400px;
+  overflow: hidden;
+}
+
+#search-options {
+  padding: 15px;
+  width: 100%;
+}
+
+#search-result-list {
   overflow-y: auto;
   overflow-x: hidden;
 }
 
-#search-results div {
+#search-result-list div {
   line-height: 2;
   padding-top: 5px;
   padding-bottom: 5px;
@@ -143,15 +145,27 @@ body {
   transition: all 100ms ease-out 50ms;
 }
 
-#search-results div:hover {
+#search-result-list div:hover {
   font-weight: 500;
   color: rgb(75, 151, 151);
 }
 
-#search-results div:active {
+#search-result-list div:active {
   font-weight: 600;
 }
 
+.checkbox {
+  /* position: relative;
+  display: block; */
+  padding-right: 10px;
+  cursor: pointer;
+}
+
+
+.checkbox input {
+  cursor: pointer;
+}
+
 .submenu {
   font-family: 'Inter';
   width: fit-content;
diff --git a/editor.html b/editor.html
index 58638d5..a320eaf 100644
--- a/editor.html
+++ b/editor.html
@@ -126,18 +126,31 @@
         <div class="submenu menu-lightmode">Visualiser & editor for Uni2work workflows</div>
       </div>
       <div class="menuitem" onclick="openSearchMenu(this)">
-        <div class="menubutton">Search</div>
-        <div id="searchmenu" class="submenu menu-lightmode" onclick="event.stopPropagation()">
-          <div id="search-container">
-            <input id="search-input" type="text" placeholder="Nodes, Edges, ..." onclick="showSearchResults()" oninput="search(this.value)">
-            <span class="search-button">
-              <svg height="18" width="18" xmlns="http://www.w3.org/2000/svg">
-                <circle cx="11" cy="7" r="6" stroke-width="2" fill="none" />
-                <polyline points="8,10 2,16" style="fill:none;stroke-width:2" stroke-linecap="round" />
-              </svg>
-            </span>
+        <div id="search-container">
+          <input id="search-input" type="text" placeholder="Search" onclick="showSearchResults()" oninput="search(this.value)">
+          <span class="search-button">
+            <svg height="18" width="18" xmlns="http://www.w3.org/2000/svg">
+              <circle cx="11" cy="7" r="6" stroke-width="2" fill="none" />
+              <polyline points="8,10 2,16" style="fill:none;stroke-width:2" stroke-linecap="round" />
+            </svg>
+          </span>
+        </div>
+        <div id="search-results" class="submenu menu-lightmode" onclick="event.stopPropagation()">
+          <div id="search-options">
+            <label class="checkbox" title="Nodes">
+              <input id="search-option-states" type="checkbox" checked="checked">
+              Nodes
+            </label>
+            <label class="checkbox" title="Edges">
+              <input id="search-option-edges" type="checkbox" checked="checked">
+              Edges
+            </label>
+            <label class="checkbox" title="Roles">
+              <input id="search-option-roles" type="checkbox">
+              Roles
+            </label>
           </div>
-          <div id="search-results"></div>
+          <div id="search-result-list"></div>
         </div>
       </div>
       <div class="menuitem">
diff --git a/editor.js b/editor.js
index 989a411..74f4ab8 100644
--- a/editor.js
+++ b/editor.js
@@ -52,6 +52,20 @@ var selectedMenuItem = null;
 
 Array.from(document.getElementsByClassName('submenu')).forEach(subMenu => subMenu.style.top = mainMenu.offsetHeight + 15);
 
+var lastSubMenu = null;
+
+function positionSubmenuBackdrop() {
+  var smRect = lastSubMenu.getBoundingClientRect();
+  submenuBackdrop.style.top = smRect.top;// sideHeading.offsetHeight + parseFloat(smStyle.paddingTop) + parseFloat(shStyle.marginTop) + parseFloat(shStyle.marginBottom);
+  submenuBackdrop.style.left = smRect.left;
+  submenuBackdrop.style.width = lastSubMenu.offsetWidth;
+  submenuBackdrop.style.height = lastSubMenu.offsetHeight;
+  // var sbStyle = window.getComputedStyle(sideButtons);
+  // sideContent.style.bottom = sideButtons.offsetHeight + parseFloat(smStyle.paddingBottom) + parseFloat(sbStyle.marginTop) + parseFloat(sbStyle.marginBottom);
+    // console.log(sideHeading.offsetHeight + shStyle.marginTop + shStyle.marginBottom);
+  // var width = 
+}
+
 /**
  * 
  * @param {HTMLElement} menuitem 
@@ -71,24 +85,11 @@ function openMenuItem(menuitem) {
   fadeOut(null, ...fadeOuts);
   menuitem.classList.add('selectedmenuitem');
   var fadeIns = [{element: submenuBackdrop, max: 1}];
-  var lastSubMenu = null;
   Array.from(menuitem.getElementsByClassName('submenu')).forEach(subMenu => {
     fadeIns.push({element: subMenu, max: 1});
     lastSubMenu = subMenu;
   });
-  function callback() {
-    var smRect = lastSubMenu.getBoundingClientRect();
-    console.log(smRect);
-    submenuBackdrop.style.top = smRect.top;// sideHeading.offsetHeight + parseFloat(smStyle.paddingTop) + parseFloat(shStyle.marginTop) + parseFloat(shStyle.marginBottom);
-    submenuBackdrop.style.left = smRect.left;
-    submenuBackdrop.style.width = lastSubMenu.offsetWidth;
-    submenuBackdrop.style.height = lastSubMenu.offsetHeight;
-    // var sbStyle = window.getComputedStyle(sideButtons);
-    // sideContent.style.bottom = sideButtons.offsetHeight + parseFloat(smStyle.paddingBottom) + parseFloat(sbStyle.marginTop) + parseFloat(sbStyle.marginBottom);
-      // console.log(sideHeading.offsetHeight + shStyle.marginTop + shStyle.marginBottom);
-    // var width = 
-  }
-  fadeIn(callback, ...fadeIns);
+  fadeIn(positionSubmenuBackdrop, ...fadeIns);
   selectedMenuItem = menuitem;
 }
 
@@ -128,59 +129,70 @@ function openAboutMenu(menuitem) {
 }
 
 function openSearchMenu(menuitem) {
-  document.getElementById('search-input').value = null;
-  while (searchResults.firstChild)
-    searchResults.removeChild(searchResults.lastChild);
+  if (selectedMenuItem === menuitem) return;
+  var val = document.getElementById('search-input').value;
+  if (val === '' || val === null)
+    while (searchResultList.firstChild)
+      searchResultList.removeChild(searchResultList.lastChild);
   openMenuItem(menuitem);
 }
 
 document.getElementById('filepanel').style.opacity = 0;
 
 //Search
-const searchIndex = new FlexSearch.Index({tokenize: 'forward'});
+const nodeIndex   = new FlexSearch.Index({tokenize: 'forward'});
+const actionIndex = new FlexSearch.Index({tokenize: 'forward'});
 // const searchDocument = new FlexSearch.Document();
 // const searchWorker = new FlexSearch.Worker();
+const soStates = document.getElementById('search-option-states');
+const soEdges = document.getElementById('search-option-edges');
 
 function search(text) {
-  while (searchResults.firstChild)
-    searchResults.removeChild(searchResults.lastChild);
-  var results = searchIndex.search(text, 10);
-  results.forEach(result => {
-    var target = null;
-    if (result.startsWith('state_name_')) {
-      result = result.replace('state_name_', '');
-      workflow.states.forEach(state => {
-        if (state.id === result)
-          target = state;
+  while (searchResultList.firstChild)
+    searchResultList.removeChild(searchResultList.lastChild);
+  var searchStates = soStates.checked;
+  var searchActions = soEdges.checked
+  var stateResults  = searchStates  ? nodeIndex.search(text, searchActions ? 5 : 10)   : null;
+  var actionResults = searchActions ? actionIndex.search(text, searchStates ? 5 : 10) : null;
+
+  function defineFocus(div, target) {
+    div.onclick = (_ => {
+      var x = y = null;
+      if (target.actionData) {
+        x = target.source.x + (target.target.x - target.source.x);
+        y = target.source.y + (target.target.y - target.source.y);
+      } else {
+        x = target.x;
+        y = target.y;
+      }
+      document.getElementById('search-input').value = null;
+      closeMenuItem();
+      wfGraph.centerAt(x, y, 400);
+      wfGraph.zoom(5, 400);
+      select(target);
+    });      
+  }
+
+  function format(possibleTargets, results, heading) {
+    var h = document.createElement('h3');
+    h.innerHTML = heading;
+    searchResultList.appendChild(h);
+    results.forEach(result => {
+      var target = null;
+      possibleTargets.forEach(stateOrEdge => {
+        if (stateOrEdge.id === result)
+          target = stateOrEdge;
       });
-     } else {
-      result = result.replace('action_name_', '');
-      workflow.actions.forEach(action => {
-        if (action.id === result)
-          target = action;
-      });
-     }
-    var r = document.createElement('div');
-    r.innerHTML = target.name;
-    searchResults.appendChild(r);
-    function defineFocus(div, target) {
-      div.onclick = (_ => {
-        var x = y = null;
-        if (target.actionData) {
-          x = target.source.x + (target.target.x - target.source.x);
-          y = target.source.y + (target.target.y - target.source.y);
-        } else {
-          x = target.x;
-          y = target.y;
-        }
-        closeMenuItem();
-        wfGraph.centerAt(x, y, 400);
-        wfGraph.zoom(5, 400);
-        select(target);
-      });      
-    }
-    defineFocus(r, target);
-  })
+      var r = document.createElement('div');
+      r.innerHTML = target.name;
+      searchResultList.appendChild(r);
+      defineFocus(r, target);
+    })
+  }
+
+  stateResults  && format(workflow.states,  stateResults,  'States');
+  actionResults && format(workflow.actions, actionResults, 'Edges');
+  positionSubmenuBackdrop();
 }
 
 function showSearchResults() {
@@ -369,8 +381,9 @@ const contextMenuBg = document.getElementById('ctmenubg'); //Click on background
 const contextMenuSt = document.getElementById('ctmenust'); //Click on state
 const contextMenuEd = document.getElementById('ctmenued'); //Click on edge
 //Search
-const searchContainer = document.getElementById('search-container');
-const searchResults   = document.getElementById('search-results');
+const searchContainer  = document.getElementById('search-container');
+const searchResults    = document.getElementById('search-results');
+const searchResultList = document.getElementById('search-result-list');
 // Counters for placeholder IDs of states/actions added via GUI
 var stateIdCounter  = 0;
 var actionIdCounter = 0;
@@ -378,6 +391,9 @@ var stateAbbreviations = [];
 var newStateCoords = {'x': 0, 'y': 0}; //Initial coordinates of the next new state
 
 sidePanel.style.top = mainMenu.offsetHeight + 15;
+searchContainer.style.left = mainMenu.offsetWidth / 2 - searchContainer.offsetWidth / 2;
+searchResults.style.left = searchContainer.style.left;
+searchResults.style.maxHeight = 0.6 * window.innerHeight;
 
 
 /**
@@ -633,7 +649,7 @@ function prepareWorkflow() {
     state.stateData.viewers.forEach(v => viewers.push(new Role(v)));
     state.stateData.viewers = viewers;
     state.stateData.payload = new Payload(state.stateData.payload);
-    searchIndex.add('state_name_' + state.id, state.name);
+    nodeIndex.add(state.id, state.name);
   })
 
   workflow.actions.forEach(action => {
@@ -650,7 +666,7 @@ function prepareWorkflow() {
     action.actionData['actor Viewers'].forEach(v => viewActors.push(new Role(v)));
     action.actionData['actor Viewers'] = viewActors;
     action.actionData.form = new Payload(action.actionData.form);
-    searchIndex.add('action_name_' + action.id, action.name);
+    actionIndex.add(action.id, action.name);
   })
 
   workflow.actions.forEach(act => act.actionData.actors.forEach(a => {