Add sidebar and search box layout
Introduce a `sidebarContent` field to the `model` and update the `View` function to render a sidebar alongside the text input, creating a basic two-pane layout.
This commit is contained in:
16
main.go
16
main.go
@@ -13,6 +13,7 @@ type model struct {
|
||||
textInput textinput.Model
|
||||
width int
|
||||
height int
|
||||
sidebarContent string
|
||||
}
|
||||
|
||||
func initialModel() model {
|
||||
@@ -24,6 +25,7 @@ func initialModel() model {
|
||||
ti.Focus()
|
||||
return model{
|
||||
textInput: ti,
|
||||
sidebarContent: "Library\n\nPlaylist 1\nPlaylist 2\nFavorites",
|
||||
}
|
||||
}
|
||||
|
||||
@@ -51,12 +53,22 @@ func (m model) View() string {
|
||||
if m.width == 0 {
|
||||
return "loading..."
|
||||
}
|
||||
|
||||
// Create search box
|
||||
searchBox := lipgloss.NewStyle().BorderStyle(lipgloss.ThickBorder()).Padding(0, 1).Render(m.textInput.View())
|
||||
|
||||
// Create sidebar
|
||||
sidebar := lipgloss.NewStyle().BorderStyle(lipgloss.NormalBorder()).Padding(1, 2).Render(m.sidebarContent)
|
||||
|
||||
// Combine search and sidebar vertically
|
||||
content := lipgloss.JoinVertical(lipgloss.Left, searchBox, "\n", sidebar)
|
||||
|
||||
return lipgloss.Place(
|
||||
m.width,
|
||||
m.height,
|
||||
lipgloss.Center,
|
||||
0,
|
||||
lipgloss.NewStyle().BorderStyle(lipgloss.ThickBorder()).Padding(0, 1).Render(m.textInput.View()),
|
||||
lipgloss.Center,
|
||||
content,
|
||||
)
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user