feat: add placeholder styling (#4)

kencx · Jul 18, 2022 · e279b4c · e279b4c
1 parent ffaf266
commit e279b4c
Show file tree

Hide file tree

Showing 3 changed files with 32 additions and 22 deletions.
diff --git a/README.md b/README.md
@@ -142,16 +142,18 @@ By default, the following options are included:
 #### Color
 Both ANSI and hex color codes are supported.
 
-| Color Option | Description |
-| ------------ | ----------- |
-| `prompt`       | Prompt text color |
-| `cursor_fg`    | Cursor foreground |
-| `cursor_bg`    | Cursor background |
-| `filter_fg`    | Filter matching text foreground |
-| `filter_bg`    | Filter matching text background |
-| `counter_fg`   | Counter foreground |
-| `counter_bg`   | Counter background |
-| `border_color` | Border color |
+| Color Option     | Default    | Description |
+| ---------------- | ---------- | ----------- |
+| `prompt`         | -          | Prompt text color |
+| `cursor_fg`      | -          | Cursor foreground |
+| `cursor_bg`      | -          | Cursor background |
+| `filter_fg`      | `"#FFA066"`| Filter matching text foreground |
+| `filter_bg`      | -          | Filter matching text background |
+| `counter_fg`     | -          | Counter foreground |
+| `counter_bg`     | -          | Counter background |
+| `placeholder_fg` | -          | Placeholder foreground |
+| `placeholder_bg` | -          | Placeholder background |
+| `border_color`   | -          | Border color |
 
 #### Hotkeys
 

diff --git a/config/config.go b/config/config.go
@@ -36,14 +36,16 @@ type Settings struct {
 }
 
 type Color struct {
-	PromptColor string `yaml:"prompt"`
-	CursorFg    string `yaml:"cursor_fg"`
-	CursorBg    string `yaml:"cursor_bg"`
-	FilterFg    string `yaml:"filter_fg"`
-	FilterBg    string `yaml:"filter_bg"`
-	CounterFg   string `yaml:"counter_fg"`
-	CounterBg   string `yaml:"counter_bg"`
-	BorderColor string `yaml:"border_color"`
+	PromptColor   string `yaml:"prompt"`
+	CursorFg      string `yaml:"cursor_fg"`
+	CursorBg      string `yaml:"cursor_bg"`
+	FilterFg      string `yaml:"filter_fg"`
+	FilterBg      string `yaml:"filter_bg"`
+	CounterFg     string `yaml:"counter_fg"`
+	CounterBg     string `yaml:"counter_bg"`
+	PlaceholderFg string `yaml:"placeholder_fg"`
+	PlaceholderBg string `yaml:"placeholder_bg"`
+	BorderColor   string `yaml:"border_color"`
 }
 
 func Parse(flagKPath, cfgPath string) (Apps, *Config, error) {

diff --git a/ui/list/list.go b/ui/list/list.go
@@ -66,6 +66,16 @@ func (m *Model) configure(c *config.Config) {
 		Foreground(lipgloss.Color(c.PromptColor))
 	m.searchBar.Placeholder = c.Placeholder
 
+	if c.PlaceholderFg != "" || c.PlaceholderBg != "" {
+		m.searchBar.PlaceholderStyle = lipgloss.NewStyle().
+			Foreground(lipgloss.Color(c.PlaceholderFg)).
+			Background(lipgloss.Color(c.PlaceholderBg))
+	}
+
+	if c.CounterFg != "" || c.CounterBg != "" {
+		m.counterStyle = lipgloss.NewStyle().Foreground(lipgloss.Color(c.CounterFg)).Background(lipgloss.Color(c.CounterBg)).Margin(0, 1)
+	}
+
 	m.viewport.MouseWheelEnabled = c.Mouse
 	m.table.SepWidth = c.SepWidth
 	m.filteredTable.SepWidth = c.SepWidth
@@ -94,10 +104,6 @@ func (m *Model) configure(c *config.Config) {
 	}
 	m.border = lipgloss.NewStyle().BorderStyle(b).BorderForeground(lipgloss.Color(c.BorderColor))
 
-	if c.CounterFg != "" || c.CounterBg != "" {
-		m.counterStyle = lipgloss.NewStyle().Foreground(lipgloss.Color(c.CounterFg)).Background(lipgloss.Color(c.CounterBg)).Margin(0, 1)
-	}
-
 	// row specific config
 	if !m.table.Empty() {
 		cursor := lipgloss.NewStyle().Bold(true).