stylesheets / themes

[gitmalong]

Hi!

As a lazy dev I would like to slap a kind of stylesheet to my UI to get started with a beautiful UI. Is that something that should be handled by third party component libs?

[pieterdd]

Are you perhaps looking for a UI component library?

I'm in the process of setting one up for Floem: https://github.com/pieterdd/prettygooey/tree/floem-rewrite Note that this is an unfinished development branch.

[golota60]

Hey, I've just published a library named oxytail also implementing a couple of styled widgets if you're interested.

[pieterdd]

Happy to see more choices pop up! I didn't expect the floem-themes topic to welcome its first entry so quickly after it was added to the docs 😄

[ArcExp]

are sylesheets the only way to apply a dark theme/dark mode to a floem app? trying to figure out how floem works in this regard, for an app I'm working on

[jrmoulton]

@ArcExp

I've ended up building something custom to handle light/dark mode

https://github.com/jrmoulton/floem-component/blob/96fac259133b9450c15294e035e594a70e79d6df/src/style.rs#L290C1-L337C1

The way this works is I have an RwSignal<DarkMode> (DarkMode is a type alias for bool) that I initialize at the start of my program with provide_context.

Then for all my colors I use this LightDark struct. in order to get thepeniko::Color out of it I call .color(). Calling .color will use the global DarkMode bool to determine if the LightDark should return the light or dark field. Since this uses a signal it will automatically be reactive when used in any styles.

view().style(|s| s.background(LightDark.color())//  <-- Automatic light/dark mode

[ArcExp]

Thanks! I'll be using that in my app

[jrmoulton]

Cool! You might consider just copy/paste that entire file and use the parts that you want. That repo is full of experiments that I don't necessarily maintain.

[ArcExp]

Will do :)