Skip to content
New issue

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

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

Already on GitHub? Sign in 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.

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

Successfully merging this pull request may close these issues.

2 participants