Skip to content
New issue

Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? # to your account

refactor(colors): update to lipgloss alpha #168

Draft
wants to merge 1 commit into
base: main
Choose a base branch
from
Draft

refactor(colors): update to lipgloss alpha #168

wants to merge 1 commit into from

Conversation

bashbunni
Copy link
Member

@bashbunni bashbunni commented Aug 22, 2024

TODO

  • update the lipgloss branch to the latest v2-exp

Example Usage:

Divides into Light and Dark colour palettes. In your app, you can switch which colour palette depending on the TerminalBackgroundMsg

func NewStyle(isDark bool) Styles {
	color := colors.Light
	if isDark {
    	color = colors.Dark
	}
	return Styles{
    	Normal:        	lipgloss.NewStyle().Foreground(color.Normal),
    	NormalDim:     	lipgloss.NewStyle().Foreground(color.NormalDim),
    	Keyword:       	lipgloss.NewStyle().Foreground(color.Green),
    	KeywordDim:    	lipgloss.NewStyle().Foreground(color.GreenDim),
    	Item:          	lipgloss.NewStyle().PaddingLeft(3),
    	DeletingItem:  	lipgloss.NewStyle().Foreground(color.Red),
    	SelectedItem:  	lipgloss.NewStyle().Foreground(lipgloss.Color("170")),
    	Accent:        	lipgloss.NewStyle().Foreground(color.Fuschia),
}}

In your model’s Update:

	case tea.BackgroundColorMsg:
    	isDark := lipgloss.IsDarkColor(msg)
    	// Update styles
    	m.Styles = NewStyle(isDark)
    	m.setBubbleStyles() // sets the styles for all of the submodels/bubbles used by this model

@bashbunni bashbunni self-assigned this Aug 22, 2024
@bashbunni
Copy link
Member Author

bashbunni commented Oct 16, 2024

Need to redo this with whatever outcome we decide on in charmbracelet/lipgloss#397

@meowgorithm
Copy link
Member

Almost there!

@meowgorithm
Copy link
Member

So I think the workflow will look something like this:

// Background color detection (standalone Lip Gloss only)
hasDarkBG, err := lipgloss.HasDarkBackground(os.Stdin, os.Stdout)
if err != nil {
    log.Fatal("Uh oh:", err)
}

// Adaptive color helper.
lightDark := lipgloss.LightDark(hasDarkBG)
c := lightDark.Color(lightDark(0x212121, 0xf1f1f1))

After contemplating it a bit I think LightDark will ultimately be clearer to new users (versus Adapt) and it mirrors the new-ish CSS light-dark specification.

# for free to join this conversation on GitHub. Already have an account? # to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants