minor tweaks and changes...

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

experiments/outline-editor/editor.css

@@ -250,9 +250,10 @@
 	font-size: 1em;
 }
 
+/* Lists... */
 /* XXX needs to be in the middle of the first span but with universal size... */
 .editor .outline .list-item:before,
-.editor .outline .list>[tabindex]>span:before {
+.editor .outline .list>[tabindex]>span:not(:empty):before {
 	--size: 0.5rem;
 
 	display: inline-block;
@@ -267,10 +268,16 @@
 	background: silver;
 }
 
+/* Highlightes... */
+.editor .outline .ASAP {
+	font-weight: bold;
+	background: yellow;
+}
 .editor .outline .XXX>span {
 	background: yellow;
 }
 
+/* Comments... */
 .editor.hide-comments .outline .comment {
 	display: none;
 }
@@ -279,7 +286,7 @@
 }
 
 
-/* checkboxes... */
+/* Checkboxes... */
 :root {
 	/* NOTE: this must have a unit... */
 	/* XXX move this to the config when fixed... */

experiments/outline-editor/editor.js

@@ -281,6 +281,10 @@ var Outline = {
 		var elem = {
 			collapsed: false,
 		}
+		// only whitespace -> keep element blank...
+		if(code.trim() == ''){
+			elem.text = ''
+			return elem }
 		var style = function(style, code=undefined){
 			style = [style].flat()
 			that.__styles = [...new Set([
@@ -321,13 +325,13 @@ var Outline = {
 			.replace(/^((\/\/|;)\s+.*)$/m, style('comment'))
 			.replace(/^XXX\s+(.*)$/m, style('XXX'))
 			.replace(/^(.*)\s*XXX$/m, style('XXX'))
+			.replace(/(\s*)ASAP(\s*)/m, '$1<span class="ASAP">ASAP</span>$2')
 			// elements...
 			.replace(/(\n|^)---*\h*(\n|$)/m, '$1<hr>')
 			// ToDo...
 			.replace(/^TODO\s*/m, style('todo', '<input type="checkbox">'))
 			.replace(/^DONE\s*/m, style('todo', '<input type="checkbox" checked>'))
 			// checkboxes...
-			// XXX these can not be clicked (yet)...
 			.replace(/\[_\]/gm, style('check', '<input class="check" type="checkbox">'))
 			.replace(/\[[X]\]/gm, style('check', '<input class="check" type="checkbox" checked>'))
 			// basic styling...

experiments/outline-editor/index.html

@@ -65,7 +65,7 @@ var setup = function(){
   - ~add optional text styling to nodes~
   - 
 - ## TEST
-  - Formatting:
+  - ### Formatting:
     - Styles
       - # Heading 1
       - ## Heading 2
@@ -83,6 +83,8 @@ var setup = function(){
 	  - XXX Highlight
 	- Line
 		- ---
+	- Markers
+	  - Basic "as soon as posible" (ASAP)
     - Basic inline *bold*, _italic_ and ~striked~
 	- To do items
 	  - TODO undone item
@@ -90,6 +92,8 @@ var setup = function(){
 	  - DONE done item
 	  - [_] a different way to draw a checkbox
     - Inline [X] checkboxes [_]
+	- 
+  - ### Playground for testing
     - A
       collapsed:: true
       - a