优化样式内容

element/button.go

@@ -1,7 +1,6 @@
 package element
 
 import (
-	"git.nspix.com/golang/pgenr/internal/pool"
 	"golang.org/x/net/html/atom"
 	"html"
 )
@@ -22,16 +21,17 @@ func (element *Button) Html() string {
 }
 
 func (element *Button) String() string {
-	br := pool.Get()
-	defer pool.Put(br)
 	if element.Style == nil {
 		element.Style = make(map[string]string)
 	}
 	if element.Color != "" {
 		element.Style["color"] = element.Color
 	}
-	br.WriteString(renderTag(atom.A.String(), Attrs{"class": "button", "href": element.Url, "style": element.Style.String()}, html.EscapeString(element.Text)))
-	return br.String()
+	return renderTag(atom.A.String(), Attrs{
+		"class": "button",
+		"href":  element.Url,
+		"style": element.Style.String(),
+	}, html.EscapeString(element.Text))
 }
 
 func NewButton(label, link string, opts ...ButtonOption) *Button {

element/text.go

@@ -1,7 +1,6 @@
 package element
 
 import (
-	"git.nspix.com/golang/pgenr/internal/pool"
 	"golang.org/x/net/html/atom"
 	"html"
 )
@@ -52,8 +51,7 @@ func (text *Text) Html() string {
 }
 
 func (text *Text) String() string {
-	br := pool.Get()
-	defer pool.Put(br)
+	var className string
 	if text.Style == nil {
 		text.Style = make(map[string]string)
 	}
@@ -63,24 +61,13 @@ func (text *Text) String() string {
 	if text.Tag == 0 {
 		text.Tag = atom.Span
 	}
-	br.WriteString("<")
-	br.WriteString(text.Tag.String())
 	if text.Theme != "" {
-		br.WriteString(" class='text-")
-		br.WriteString(text.Theme)
-		br.WriteString("'")
+		className = "text-" + text.Theme
 	}
-	if len(text.Style) > 0 {
-		br.WriteString(" style='")
-		br.WriteString(text.Style.String())
-		br.WriteString("'")
-	}
-	br.WriteString(">")
-	br.WriteString(html.EscapeString(text.Content))
-	br.WriteString("</")
-	br.WriteString(text.Tag.String())
-	br.WriteString(">")
-	return br.String()
+	return renderTag(text.Tag.String(), Attrs{
+		"class": className,
+		"style": text.Style.String(),
+	}, html.EscapeString(text.Content))
 }
 
 func NewText(s string, opts ...TextOption) *Text {

render_test.go

@@ -3,6 +3,7 @@ package pgenr
 import (
 	"fmt"
 	"git.nspix.com/golang/pgenr/element"
+	"golang.org/x/net/html/atom"
 	"io/ioutil"
 	"testing"
 	"time"
@@ -22,9 +23,9 @@ func TestRender(t *testing.T) {
 	page.AddPlainOutro("Yours truly,")
 	page.AddPlainOutro("Hermes - https://google.com")
 	timeline := element.NewTimeline()
-	timeline.AddItem(time.Now().Add(-2*time.Minute), element.NewText("Event start"))
-	timeline.AddItem(time.Now().Add(-1*time.Minute), element.NewText("Event end"))
-	timeline.AddItem(time.Now().Add(time.Minute), element.NewText("Event closed"))
+	timeline.AddItem(time.Now().Add(-2*time.Minute), element.NewText("Event start", element.WithTextTag(atom.Div)))
+	timeline.AddItem(time.Now().Add(-1*time.Minute), element.NewText("Event end", element.WithTextTag(atom.Div)))
+	timeline.AddItem(time.Now().Add(time.Minute), element.NewText("Event closed", element.WithTextTag(atom.Div)))
 	page.AddTimeline(timeline)
 	table := element.NewTable(element.NewText("This year sale table", element.WithTextStyle(map[string]string{"font-size": "1.06rem", "font-weight": "550"})))
 	table.SetHead(element.NewText("Name"), element.NewText("Age"), element.NewText("Price"))

theme/default.go

@@ -25,7 +25,7 @@ func (theme *Default) Template() string {
       font-size: .96rem;
       line-height: 1.4;
       background-color: #F2F4F6;
-      color: #64687E;
+      color: #44485E;
       -webkit-text-size-adjust: none;
       font-family: Helvetica Neue, Tahoma, Arial, PingFangSC-Regular, Hiragino Sans GB, Microsoft Yahei, sans-serif;
       -webkit-font-smoothing: antialiased;
@@ -119,13 +119,12 @@ func (theme *Default) Template() string {
 	
 	.timeline {
 		margin: 0;
-		font-size: 12px;
 		list-style: none;
 	}
 
 	.timeline-item {
 		position: relative;
-    	padding-bottom: 20px;
+    	padding-bottom: 1rem;
 		box-sizing: border-box;
 	}
 
@@ -134,13 +133,13 @@ func (theme *Default) Template() string {
 		position: absolute;
 		left: 4px;
 		height: 100%;
-		border-left: 2px solid #e4e7ed;
+		border-left: 3px solid #e4e7ed;
 	}
 	
 	.timeline-item-node {
 		left: -1px;
-		width: 12px;
-		height: 12px;
+		width: 13px;
+		height: 13px;
 		position: absolute;
 		background-color: #e4e7ed;
 		border-color: #e4e7ed;
@@ -157,6 +156,14 @@ func (theme *Default) Template() string {
 		padding-left: 28px;
 		top: -3px;
 	}
+
+	.timeline-item-timestamp{
+		font-size: .89rem;
+	}
+
+	.timeline-item-content{
+		width:100%;
+	}
 	
 	.table {
       border: 1px solid #ddd;
@@ -210,12 +217,12 @@ func (theme *Default) Template() string {
 	.invite-code {
 		font-size: 32px;
     	letter-spacing: .6rem;
-		color: #454742;
+		color: #35742;
 	}
 	
 	.copyright {
 		text-align: center;
-		font-size: .9rem;
+		font-size: .86rem;
 		color: #8c8c86;
 		margin: 50px 0 10px 0;
 	}