added link support + minor tweaks...

Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>

experiments/outline-editor/editor.css

@@ -105,6 +105,11 @@
 	overflow: hidden;
 	resize: none;
 }
+/* clickable things in view */
+.editor .outline [tabindex]>span a,
+.editor .outline [tabindex]>span input {
+	pointer-events: auto;
+}
 
 
 /* focus... */
@@ -305,9 +310,6 @@ editor .outline [tabindex]:focus {
 	* 	element -- can's seem to figure out a way to avoid this */
 	--checkbox-margin: 0em;
 }
-.editor .outline input {
-	pointer-events: auto;
-}
 .editor .outline [tabindex].todo>span {
 	width: calc(100% - var(--checkbox-size));
 	/* align todo checkboxes to indnt (otherwise they are on the indent) */
@@ -355,6 +357,7 @@ editor .outline [tabindex]:focus {
 .editor.show-click-zones .outline [tabindex]>span:before,
 .editor.show-click-zones .outline [tabindex]>span:after {
 	background: rgba(0,0,0,0.03);
+	border: solid 1px silver;
 }
 .editor.show-click-zones .outline [tabindex]:hover>span:before,
 .editor.show-click-zones .outline [tabindex]:hover>span:after {

experiments/outline-editor/editor.js

@@ -633,7 +633,6 @@ var Outline = {
 					// click: left of elem (outside)
 					if(evt.offsetX < 0){
 						// XXX item menu?
-						console.log('---', elem)
 					
 					// click: right of elem (outside)
 					} else if(elem.offsetWidth < evt.offsetX){

experiments/outline-editor/index.html

@@ -67,7 +67,8 @@ var setup = function(){
     - edit node
   - markdown: tables
   - empty item height is a bit off...
-  - ~serialize~/deserialize
+  - handle links gracefully
+  - ~serialize/deserialize~
   - ~add optional text styling to nodes~
   - 
 - ## TEST
@@ -116,7 +117,7 @@ var setup = function(){
 	<!-- outline -->
 	<div class="outline"></div>
 	<!-- toolbar (optional) -->
-	<div class="toolbar">
+	<!--div class="toolbar">
 		<button onclick="editor.deindent().focus()">&lt;</button>
 		<button onclick="editor.indent().focus()">&gt;</button>
 		<button onclick="editor.Block('before').focus()" class="add-row">+</button>
@@ -124,7 +125,7 @@ var setup = function(){
 		<button onclick="editor.Block('after').focus()" class="add-row">+</button>
 		<button onclick="editor.toggleCollapse()?.focus()">&#709;&#708;</button>
 		<button onclick="editor.remove()">&times;</button>
-	</div>
+	</div-->
 </div>
 
 <hr>