refactor: use gruvbox for md rendering

dhth · Jul 24, 2024 · 87f3c26 · 87f3c26
1 parent 3b38b47
commit 87f3c26
Show file tree

Hide file tree

Showing 8 changed files with 243 additions and 17 deletions.
diff --git a/cmd/guide_test.go b/cmd/guide_test.go
@@ -9,7 +9,7 @@ import (
 func TestGetContext(t *testing.T) {
 	for _, entry := range guideEntries {
 		got, err := getContext(entry.summary)
-		assert.Nil(t, err)
+		assert.NoError(t, err)
 		assert.NotEmpty(t, got)
 	}
 }
diff --git a/internal/ui/assets/gruvbox.json b/internal/ui/assets/gruvbox.json
@@ -0,0 +1,205 @@
+{
+  "document": {
+    "block_prefix": "",
+    "block_suffix": "",
+    "color": "#fbf1c7",
+    "margin": 2
+  },
+  "block_quote": {
+    "indent": 1,
+    "indent_token": "│ "
+  },
+  "paragraph": {},
+  "list": {
+    "level_indent": 2
+  },
+  "heading": {
+    "block_suffix": "\n",
+    "color": "#fe8019",
+    "bold": true
+  },
+  "h1": {
+    "prefix": "# ",
+    "suffix": "",
+    "color": "#fe8019",
+    "bold": true
+  },
+  "h2": {
+    "prefix": "## ",
+    "color": "#83a598"
+  },
+  "h3": {
+    "prefix": "### ",
+    "color": "#83a598"
+  },
+  "h4": {
+    "prefix": "#### ",
+    "color": "#83a598"
+  },
+  "h5": {
+    "prefix": "",
+    "color": "#fabd2f"
+  },
+  "h6": {
+    "prefix": "",
+    "color": "#8ec07c",
+    "bold": false
+  },
+  "text": {},
+  "strikethrough": {
+    "crossed_out": true
+  },
+  "emph": {
+    "italic": true,
+    "color": "#83a598"
+  },
+  "strong": {
+    "bold": true,
+    "color": "#fe8019"
+  },
+  "hr": {
+    "color": "#928374",
+    "format": "\n--------\n"
+  },
+  "item": {
+    "block_prefix": "• "
+  },
+  "enumeration": {
+    "block_prefix": ". "
+  },
+  "task": {
+    "ticked": "[✓] ",
+    "unticked": "[ ] "
+  },
+  "link": {
+    "color": "#83a598",
+    "underline": true
+  },
+  "link_text": {
+    "color": "#458588",
+    "bold": true
+  },
+  "image": {
+    "color": "132",
+    "underline": true
+  },
+  "image_text": {
+    "color": "245",
+    "format": "Image: {{.text}} →"
+  },
+  "code": {
+    "prefix": " ",
+    "suffix": " ",
+    "color": "#b8bb26",
+    "background_color": "#3c3836"
+  },
+  "code_block": {
+    "color": "244",
+    "margin": 2,
+    "chroma": {
+      "text": {
+        "color": "#bdae93"
+      },
+      "error": {
+        "color": "#282828",
+        "background_color": "#fb4934"
+      },
+      "comment": {
+        "color": "#928374"
+      },
+      "comment_preproc": {
+        "color": "#8ec07c"
+      },
+      "keyword": {
+        "color": "#fe8019"
+      },
+      "keyword_reserved": {
+        "color": "#8ec07c"
+      },
+      "keyword_namespace": {
+        "color": "#d3869b"
+      },
+      "keyword_type": {
+        "color": "#fabd2f"
+      },
+      "operator": {
+        "color": "#fe8019"
+      },
+      "punctuation": {
+        "color": "#928374"
+      },
+      "name": {
+        "color": "#ebdbb2"
+      },
+      "name_builtin": {
+        "color": "#fabd2f"
+      },
+      "name_tag": {
+        "color": "#fb4934"
+      },
+      "name_attribute": {
+        "color": "#b8bb26"
+      },
+      "name_class": {
+        "color": "#fe8019",
+        "bold": true
+      },
+      "name_constant": {},
+      "name_decorator": {
+        "color": "#d3869b"
+      },
+      "name_exception": {
+        "color": "#fb4934"
+      },
+      "name_function": {
+        "color": "#fabd2f"
+      },
+      "name_other": {},
+      "literal": {},
+      "literal_number": {
+        "color": "#fabd2f"
+      },
+      "literal_date": {},
+      "literal_string": {
+        "color": "#b8bb26"
+      },
+      "literal_string_escape": {
+        "color": "#83a598"
+      },
+      "generic_deleted": {
+        "color": "#fb4934",
+        "background_color": "#282828"
+      },
+      "generic_emph": {
+        "italic": true,
+        "color": "#83a598"
+      },
+      "generic_inserted": {
+        "color": "#b8bb26",
+        "background_color": "#282828"
+      },
+      "generic_strong": {
+        "bold": true,
+        "color": "#ebdbb2"
+      },
+      "generic_subheading": {
+        "color": "#b8bb26"
+      },
+      "background": {
+        "background_color": "#3c3836"
+      }
+    }
+  },
+  "table": {
+    "center_separator": "┼",
+    "column_separator": "│",
+    "row_separator": "─"
+  },
+  "definition_list": {},
+  "definition_term": {},
+  "definition_description": {
+    "block_prefix": "\n🠶 "
+  },
+  "html_block": {},
+  "html_span": {}
+}
diff --git a/internal/ui/assets/help.md b/internal/ui/assets/help.md
@@ -1,6 +1,6 @@
 ## Overview
 
-**omm** ("on-my-mind") is a keyboard-driven task manager for the command line.
+omm ("on-my-mind") is a keyboard-driven task manager for the command line.
 
 Tip: Run `omm guide` for a guided walkthrough of omm's features.
 

diff --git a/internal/ui/list_delegate.go b/internal/ui/list_delegate.go
@@ -13,7 +13,7 @@ func newListDelegate(color lipgloss.Color, showDesc bool, spacing int) list.Defa
 
 	d.Styles.NormalTitle = d.Styles.
 		NormalTitle.
-		Foreground(lipgloss.AdaptiveColor{Light: "#1a1a1a", Dark: "#ffffff"})
+		Foreground(lipgloss.AdaptiveColor{Light: "#1a1a1a", Dark: "#fbf1c7"})
 
 	d.Styles.SelectedTitle = d.Styles.
 		SelectedTitle.

diff --git a/internal/ui/markdown.go b/internal/ui/markdown.go
@@ -1,24 +1,21 @@
 package ui
 
 import (
+	_ "embed"
+
 	"github.com/charmbracelet/glamour"
 	"github.com/muesli/termenv"
 )
 
-func getMarkDownRenderer(wrap int) (*glamour.TermRenderer, error) {
-
-	var margin uint = 2
-	dracula := glamour.DraculaStyleConfig
-	dracula.Document.BlockPrefix = ""
-	dracula.H1.Prefix = ""
-	dracula.H2.Prefix = ""
-	dracula.H3.Prefix = ""
-	dracula.H4.Prefix = ""
-	dracula.Document.Margin = &margin
+var (
+	//go:embed assets/gruvbox.json
+	glamourJsonBytes []byte
+)
 
+func getMarkDownRenderer(wrap int) (*glamour.TermRenderer, error) {
 	return glamour.NewTermRenderer(
+		glamour.WithStylesFromJSONBytes(glamourJsonBytes),
 		glamour.WithColorProfile(termenv.TrueColor),
-		glamour.WithStyles(dracula),
 		glamour.WithWordWrap(wrap),
 	)
 }
diff --git a/internal/ui/markdown_test.go b/internal/ui/markdown_test.go
@@ -0,0 +1,24 @@
+package ui
+
+import (
+	"encoding/json"
+	"testing"
+
+	"github.com/charmbracelet/glamour"
+	"github.com/stretchr/testify/assert"
+)
+
+func TestGetGlamourStyleFromFile(t *testing.T) {
+	gotOption := glamour.WithStylesFromJSONBytes(glamourJsonBytes)
+	renderer, err := glamour.NewTermRenderer(gotOption)
+	assert.NoError(t, err)
+	assert.NotNil(t, renderer)
+
+	_, err = renderer.Render("a")
+	assert.NoError(t, err)
+}
+
+func TestGlamourStylesFileIsValid(t *testing.T) {
+	got := json.Valid(glamourJsonBytes)
+	assert.True(t, got)
+}
diff --git a/internal/ui/styles.go b/internal/ui/styles.go
@@ -12,13 +12,13 @@ const (
 	prefixSearchColor      = "#d3896b"
 	contextTitleColor      = "#8ec07c"
 	taskEntryTitleColor    = "#b8bb26"
-	taskDetailsTitleColor  = "#bd93f9"
+	taskDetailsTitleColor  = "#d3869b"
 	taskListHeaderColor    = "#928374"
 	formHelpColor          = "#928374"
 	formColor              = "#928374"
 	helpMsgColor           = "#928374"
 	helpViewTitleColor     = "#83a598"
-	helpTitleColor         = "#bd93f9"
+	helpTitleColor         = "#83a598"
 	sBSuccessMsgColor      = "#d3869b"
 	sBErrMsgColor          = "#fb4934"
 	footerColor            = "#928374"

diff --git a/internal/ui/view.go b/internal/ui/view.go
@@ -9,7 +9,7 @@ import (
 
 var (
 	TaskListDefaultTitle      = "omm"
-	taskDetailsWordWrap       = 80
+	taskDetailsWordWrap       = 120
 	contextWordWrapUpperLimit = 160
 )