cstyle/transformers/ul/main.go

diff --git a/cstyle/transformers/ul/main.go b/cstyle/transformers/ul/main.go
index a9c048e..244e0a3 100644
--- a/cstyle/transformers/ul/main.go
+++ b/cstyle/transformers/ul/main.go
@@ -10 +10 @@ func Init() cstyle.Transformer {
-		Selector: func(n *element.Node, c *cstyle.CSS) bool {
+		Selector: func(n *element.Node) bool {
@@ -19,6 +19 @@ func Init() cstyle.Transformer {
-			tN.Properties.Id = n.Properties.Id
-			for i, v := range n.Children {
-				if v.TagName != "li" {
-					tN.AppendChild(v)
-					continue
-				}
+			for _, v := range n.Children {
@@ -25,0 +21 @@ func Init() cstyle.Transformer {
+				li.CStyle = v.CStyle
@@ -27,5 +23,5 @@ func Init() cstyle.Transformer {
-				dot.Style("background", "#000")
-				dot.Style("border-radius", "100px")
-				dot.Style("width", "5px")
-				dot.Style("height", "5px")
-				dot.Style("margin-right", "10px")
+				dot.CStyle["background"] = "#000"
+				dot.CStyle["border-radius"] = "100px"
+				dot.CStyle["width"] = "5px"
+				dot.CStyle["height"] = "5px"
+				dot.CStyle["margin-right"] = "10px"
@@ -35,6 +31,3 @@ func Init() cstyle.Transformer {
-
-				for k, v := range c.Styles[v.Properties.Id] {
-					content.Style(k, v)
-				}
-				// content.CStyle = c.QuickStyles(&content)
-				content.Style("display", "block")
+				content.CStyle = v.CStyle
+				content.CStyle = c.QuickStyles(&content)
+				content.CStyle["display"] = "block"
@@ -45,3 +38,3 @@ func Init() cstyle.Transformer {
-				n.Children[i].Style("display", "flex")
-				n.Children[i].Style("align-items", "center")
-				// li.CStyle = c.QuickStyles(&li)
+				li.CStyle["display"] = "flex"
+				li.CStyle["align-items"] = "center"
+				li.CStyle = c.QuickStyles(&li)

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 {
			// 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
			tN := n.CreateElement(n.TagName)
			tN.Properties.Id = n.Properties.Id
			for i, v := range n.Children {
				if v.TagName != "li" {
					tN.AppendChild(v)
					continue
				}
				li := n.CreateElement("li")
				dot := li.CreateElement("div")
				dot.Style("background", "#000")
				dot.Style("border-radius", "100px")
				dot.Style("width", "5px")
				dot.Style("height", "5px")
				dot.Style("margin-right", "10px")

				content := li.CreateElement("div")
				content.InnerText = v.InnerText

				for k, v := range c.Styles[v.Properties.Id] {
					content.Style(k, v)
				}
				// content.CStyle = c.QuickStyles(&content)
				content.Style("display", "block")
				li.AppendChild(&dot)
				li.AppendChild(&content)
				li.Parent = n

				n.Children[i].Style("display", "flex")
				n.Children[i].Style("align-items", "center")
				// li.CStyle = c.QuickStyles(&li)

				tN.AppendChild(&li)
			}
			n.Children = tN.Children
			return n
		},
	}
}