cstyle/transformers/ul/main.go

diff --git a/cstyle/transformers/ul/main.go b/cstyle/transformers/ul/main.go
index 4097802..ac9a3eb 100644
--- a/cstyle/transformers/ul/main.go
+++ b/cstyle/transformers/ul/main.go
@@ -3,0 +4 @@ import (
+	"fmt"
@@ -14 +15,4 @@ func Init() cstyle.Transformer {
-			// !TODO: make ul/ol stylable
+			// The reason tN (temporary Node) is used, is because we have to go through the n.Children and it makes it hard to insert/remove the old one
+			// its better to just replace it
+
+			// !ISSUE: make stylable
@@ -20 +23,0 @@ func Init() cstyle.Transformer {
-				dot.Parent = n
@@ -22 +25 @@ func Init() cstyle.Transformer {
-				dot.Style("background-color", "#000")
+				dot.Style("background", "#000")
@@ -28,9 +31,9 @@ func Init() cstyle.Transformer {
-				// content := v.CreateElement("div")
-				// element.QuickStyles(&content)
-				// content.InnerText = v.InnerText
-				//
-				// for k, v := range v.Styles() {
-				// 	content.Style(k, v)
-				// }
-				//
-				// content.Style("display", "block")
+				content := v.CreateElement("div")
+				element.QuickStyles(&content)
+				content.InnerText = v.InnerText
+
+				for k, v := range v.Styles() {
+					content.Style(k, v)
+				}
+
+				content.Style("display", "block")
@@ -38,5 +41,6 @@ func Init() cstyle.Transformer {
-				// v.Children = append(v.Children, &content)
-				// element.QuickStyles(v)
-				v.Style("display", "flex")
-				v.Style("align-items", "center")
-				
+				v.Children = append(v.Children, &content)
+
+				n.Children[i].Style("display", "flex")
+				n.Children[i].Style("align-items", "center")
+				element.QuickStyles(v)
+				v.Properties.Id = element.GenerateUniqueId(n, v.TagName)
@@ -44,2 +48 @@ func Init() cstyle.Transformer {
-				// fmt.Println(dot.Properties.Id )
-				// content.Properties.Id = element.GenerateUniqueId(v, content.TagName)
+				content.Properties.Id = element.GenerateUniqueId(v, content.TagName)
@@ -49,0 +53,2 @@ func Init() cstyle.Transformer {
+			fmt.Println(n.OuterHTML())
+

package ul

import (
	"grim/cstyle"
	"grim/element"
)

func Init() cstyle.Transformer {
	return cstyle.Transformer{
		Selector: func(n *element.Node, c *cstyle.CSS) bool {
			return n.TagName == "ul"
		},
		Handler: func(n *element.Node, c *cstyle.CSS) *element.Node {
			// !TODO: make ul/ol stylable
			for i, v := range n.Children {
				if v.TagName != "li" {
					continue
				}
				dot := v.CreateElement("div")
				dot.Parent = n
				element.QuickStyles(&dot)
				dot.Style("background-color", "#000")
				dot.Style("border-radius", "100px")
				dot.Style("width", "5px")
				dot.Style("height", "5px")
				dot.Style("margin-right", "10px")

				// content := v.CreateElement("div")
				// element.QuickStyles(&content)
				// content.InnerText = v.InnerText
				//
				// for k, v := range v.Styles() {
				// 	content.Style(k, v)
				// }
				//
				// content.Style("display", "block")
				v.Children = append(v.Children, &dot)
				// v.Children = append(v.Children, &content)
				// element.QuickStyles(v)
				v.Style("display", "flex")
				v.Style("align-items", "center")
				
				dot.Properties.Id = element.GenerateUniqueId(v, dot.TagName)
				// fmt.Println(dot.Properties.Id )
				// content.Properties.Id = element.GenerateUniqueId(v, content.TagName)
				n.Children[i] = v
				
			}

			return n
		},
	}
}