Added ItemDetail to Theme engine

config/config.go

@@ -57,8 +57,14 @@ type Config struct {
 				Blurred ThemeItemConfig
 			}
 			Item struct {
-				Focused ThemeItemConfig
+				Focused  ThemeItemConfig
-				Blurred ThemeItemConfig
+				Blurred  ThemeItemConfig
+				Selected ThemeItemConfig
+			}
+			ItemDetail struct {
+				Focused  ThemeItemConfig
+				Blurred  ThemeItemConfig
+				Selected ThemeItemConfig
 			}
 		}
 
@@ -117,31 +123,55 @@ func Load() (Config, error) {
 		lipgloss.AdaptiveColor{Light: "#cccccc", Dark: "#333333"})
 
 	// PostsList Item:Focused
-	viper.SetDefault("Theme.PostsList.Item.Focused.Margin",
-		[]int{0, 0, 0, 0})
 	viper.SetDefault("Theme.PostsList.Item.Focused.Padding",
-		[]int{1, 1, 1, 1})
+		[]int{0, 0, 0, 2})
-	viper.SetDefault("Theme.PostsList.Item.Focused.Border.Border",
+	viper.SetDefault("Theme.PostsList.Item.Focused.Foreground",
-		lipgloss.RoundedBorder())
-	viper.SetDefault("Theme.PostsList.Item.Focused.Border.Sides",
-		[]bool{true, true, true, true},
-	)
-	viper.SetDefault("Theme.PostsList.Item.Focused.Border.Foreground",
 		lipgloss.AdaptiveColor{Light: "#333333", Dark: "#cccccc"})
 
 	// PostsList Item:Blurred
-	viper.SetDefault("Theme.PostsList.Item.Blurred.Margin",
-		[]int{0, 0, 0, 0})
 	viper.SetDefault("Theme.PostsList.Item.Blurred.Padding",
-		[]int{1, 1, 1, 1})
+		[]int{0, 0, 0, 2})
-	viper.SetDefault("Theme.PostsList.Item.Blurred.Border.Border",
+	viper.SetDefault("Theme.PostsList.Item.Blurred.Foreground",
-		lipgloss.RoundedBorder())
-	viper.SetDefault("Theme.PostsList.Item.Blurred.Border.Sides",
-		[]bool{true, true, true, true},
-	)
-	viper.SetDefault("Theme.PostsList.Item.Blurred.Border.Foreground",
 		lipgloss.AdaptiveColor{Light: "#cccccc", Dark: "#333333"})
 
+	// PostsList Item:Selected
+	viper.SetDefault("Theme.PostsList.Item.Selected.Padding",
+		[]int{0, 0, 0, 1})
+	viper.SetDefault("Theme.PostsList.Item.Selected.Border.Border",
+		lipgloss.NormalBorder())
+	viper.SetDefault("Theme.PostsList.Item.Selected.Border.Sides",
+		[]bool{false, false, false, true},
+	)
+	viper.SetDefault("Theme.PostsList.Item.Selected.Border.Foreground",
+		lipgloss.AdaptiveColor{Light: "#000000", Dark: "#FFFFFF"})
+	viper.SetDefault("Theme.PostsList.Item.Selected.Foreground",
+		lipgloss.AdaptiveColor{Light: "#000000", Dark: "#FFFFFF"})
+
+	// PostsList ItemDetail:Focused
+	viper.SetDefault("Theme.PostsList.ItemDetail.Focused.Padding",
+		[]int{0, 0, 0, 2})
+	viper.SetDefault("Theme.PostsList.ItemDetail.Focused.Foreground",
+		lipgloss.AdaptiveColor{Light: "#333333", Dark: "#cccccc"})
+
+	// PostsList ItemDetail:Blurred
+	viper.SetDefault("Theme.PostsList.ItemDetail.Blurred.Padding",
+		[]int{0, 0, 0, 2})
+	viper.SetDefault("Theme.PostsList.ItemDetail.Blurred.Foreground",
+		lipgloss.AdaptiveColor{Light: "#cccccc", Dark: "#333333"})
+
+	// PostsList ItemDetail:Selected
+	viper.SetDefault("Theme.PostsList.ItemDetail.Selected.Padding",
+		[]int{0, 0, 0, 1})
+	viper.SetDefault("Theme.PostsList.ItemDetail.Selected.Border.Border",
+		lipgloss.NormalBorder())
+	viper.SetDefault("Theme.PostsList.ItemDetail.Selected.Border.Sides",
+		[]bool{false, false, false, true},
+	)
+	viper.SetDefault("Theme.PostsList.ItemDetail.Selected.Border.Foreground",
+		lipgloss.AdaptiveColor{Light: "#000000", Dark: "#FFFFFF"})
+	viper.SetDefault("Theme.PostsList.ItemDetail.Selected.Foreground",
+		lipgloss.AdaptiveColor{Light: "#000000", Dark: "#FFFFFF"})
+
 	// DialogBox Window
 	viper.SetDefault("Theme.DialogBox.Window.Margin",
 		[]int{0, 0, 0, 0})

ui/theme/theme.go

@@ -20,6 +20,12 @@ type Theme struct {
 		Item struct {
 			Focused lipgloss.Style
 			Blurred lipgloss.Style
+			Selected lipgloss.Style
+		}
+		ItemDetail struct {
+			Focused lipgloss.Style
+			Blurred lipgloss.Style
+			Selected lipgloss.Style
 		}
 	}
 
@@ -35,14 +41,6 @@ type Theme struct {
 
 func New(cfg *config.Config) (*Theme) {
 	t := new(Theme)
-	// viewportStyle = lipgloss.NewStyle().
-	// 		Margin(0, 0, 0, 0).
-	// 		Padding(0, 0).
-	// 		BorderTop(false).
-	// 		BorderLeft(false).
-	// 		BorderRight(false).
-	// 		BorderBottom(false)
-	//
 
 	t.PostsList.List.Focused = lipgloss.NewStyle().
 		Margin(cfg.Theme.PostsList.List.Focused.Margin...).
@@ -80,6 +78,42 @@ func New(cfg *config.Config) (*Theme) {
 		Foreground(cfg.Theme.PostsList.Item.Blurred.Foreground).
 		Background(cfg.Theme.PostsList.Item.Blurred.Background)
 
+	t.PostsList.Item.Selected = lipgloss.NewStyle().
+		Margin(cfg.Theme.PostsList.Item.Selected.Margin...).
+		Padding(cfg.Theme.PostsList.Item.Selected.Padding...).
+		Border(cfg.Theme.PostsList.Item.Selected.Border.Border, cfg.Theme.PostsList.Item.Selected.Border.Sides...).
+		BorderForeground(cfg.Theme.PostsList.Item.Selected.Border.Foreground).
+		BorderBackground(cfg.Theme.PostsList.Item.Selected.Border.Background).
+		Foreground(cfg.Theme.PostsList.Item.Selected.Foreground).
+		Background(cfg.Theme.PostsList.Item.Selected.Background)
+
+	t.PostsList.ItemDetail.Focused = lipgloss.NewStyle().
+		Margin(cfg.Theme.PostsList.ItemDetail.Focused.Margin...).
+		Padding(cfg.Theme.PostsList.ItemDetail.Focused.Padding...).
+		Border(cfg.Theme.PostsList.ItemDetail.Focused.Border.Border, cfg.Theme.PostsList.ItemDetail.Focused.Border.Sides...).
+		BorderForeground(cfg.Theme.PostsList.ItemDetail.Focused.Border.Foreground).
+		BorderBackground(cfg.Theme.PostsList.ItemDetail.Focused.Border.Background).
+		Foreground(cfg.Theme.PostsList.ItemDetail.Focused.Foreground).
+		Background(cfg.Theme.PostsList.ItemDetail.Focused.Background)
+
+	t.PostsList.ItemDetail.Blurred = lipgloss.NewStyle().
+		Margin(cfg.Theme.PostsList.ItemDetail.Blurred.Margin...).
+		Padding(cfg.Theme.PostsList.ItemDetail.Blurred.Padding...).
+		Border(cfg.Theme.PostsList.ItemDetail.Blurred.Border.Border, cfg.Theme.PostsList.ItemDetail.Blurred.Border.Sides...).
+		BorderForeground(cfg.Theme.PostsList.ItemDetail.Blurred.Border.Foreground).
+		BorderBackground(cfg.Theme.PostsList.ItemDetail.Blurred.Border.Background).
+		Foreground(cfg.Theme.PostsList.ItemDetail.Blurred.Foreground).
+		Background(cfg.Theme.PostsList.ItemDetail.Blurred.Background)
+
+	t.PostsList.ItemDetail.Selected = lipgloss.NewStyle().
+		Margin(cfg.Theme.PostsList.ItemDetail.Selected.Margin...).
+		Padding(cfg.Theme.PostsList.ItemDetail.Selected.Padding...).
+		Border(cfg.Theme.PostsList.ItemDetail.Selected.Border.Border, cfg.Theme.PostsList.ItemDetail.Selected.Border.Sides...).
+		BorderForeground(cfg.Theme.PostsList.ItemDetail.Selected.Border.Foreground).
+		BorderBackground(cfg.Theme.PostsList.ItemDetail.Selected.Border.Background).
+		Foreground(cfg.Theme.PostsList.ItemDetail.Selected.Foreground).
+		Background(cfg.Theme.PostsList.ItemDetail.Selected.Background)
+
 	t.DialogBox.Window = lipgloss.NewStyle().
 		Margin(cfg.Theme.DialogBox.Window.Margin...).
 		Padding(cfg.Theme.DialogBox.Window.Padding...).

ui/views/posts/posts.go

@@ -67,14 +67,22 @@ func (m Model) Init() tea.Cmd {
 
 func NewModel(c *ctx.Ctx) Model {
 	m := Model{
+		ctx:     c,
 		keymap:  DefaultKeyMap,
 		focused: "list",
 	}
 
-	m.list = list.New(m.items, list.NewDefaultDelegate(), 0, 0)
+	listDelegate := list.NewDefaultDelegate()
+	listDelegate.Styles.NormalTitle = m.ctx.Theme.PostsList.Item.Focused
+	listDelegate.Styles.DimmedTitle = m.ctx.Theme.PostsList.Item.Blurred
+	listDelegate.Styles.SelectedTitle = m.ctx.Theme.PostsList.Item.Selected
+	listDelegate.Styles.NormalDesc = m.ctx.Theme.PostsList.ItemDetail.Focused
+	listDelegate.Styles.DimmedDesc = m.ctx.Theme.PostsList.ItemDetail.Blurred
+	listDelegate.Styles.SelectedDesc = m.ctx.Theme.PostsList.ItemDetail.Selected
+
+	m.list = list.New(m.items, listDelegate, 0, 0)
 	m.list.SetShowTitle(false)
 	m.list.SetShowStatusBar(false)
-	m.ctx = c
 	m.a, _ = aggregator.New(m.ctx)
 
 	return m