I’m not sure exactly when I want to start on this, but I expect sometime in the coming months...
> On Feb 10, 2026, at 10:13 AM, Yishay Weiss <[email protected]> wrote: > > I don't know enough about the compiler part, but there's a chance that with > the right ICSSImpl you could do that. Or maybe simpler to just add 'vertical' > on another line and let the bead decide on the default behavior. > ________________________________ > From: Harbs <[email protected]> > Sent: Monday, February 9, 2026 8:15 PM > To: Apache Royale Development <[email protected]> > Subject: Re: Utility classes > > There’s one thing I’m unsure of: > > In “Royale” css, is there any way to declare default properties to be > assigned to bead classes? > > i.e. something like this (ignore the exact syntax) > > IBeadLayout: > ClassReference("org.apache.royale.html.beads.layouts.FlexLayout”),vertical:true; > > The idea being it would create a FlexLayout, set the vertical property to > true and add the bead. > > Being able to declare properties on beads would allow reusing beads for > declaring CSS defaults with slight differences in different cases. > >> On Feb 9, 2026, at 8:09 PM, Harbs <[email protected]> wrote: >> >> I’ve been spending a lot of time thinking about how to improve styling >> capabilities in Royale. I have some ideas and I wanted to get others’ >> thoughts. >> >> Styling HTML is probably one of the big pain points. >> >> Tailwind CSS has solved the problem very nicely, but there’s some problems >> with Tailwind: >> >> 1. Getting the Tailwind CSS generated for a Royale app. Tailwind is built to >> read HTML, find the classes and populate CSS at build time. That doesn’t fit >> perfectly with the Royale build process. >> 2. You need to “know” Tailwind to specify the utilities. There’s no easy way >> to get code completion in MXML etc. >> 3. It doesn’t mesh perfectly with the Royale architecture of getting >> functionality and styling. >> >> I was thinking: >> >> The big advantage of Tailwind is that it makes it very easy to compose CSS >> functionality using a lot of small utility classes and only the classes used >> will be used in the end result. >> >> We have a very similar concept in Royale: Beads. >> >> That set me thinking about how we can accomplish the same thing in Royale >> and here’s what I’m thinking: >> >> - I want to create a new component set (I’m thinking of calling it “Style” >> which would have a large set of styling beads. >> - Each bead would encapsulate a specific function in CSS. >> - We already have the ability to add CSS classes dynamically >> - There would be a global utility class lookup >> - Each time a utility class (in a bead) is applied, the class will be >> checked against the lookup and dynamically added if it doesn’t exist. >> - There would be a standard naming convention for the classes so each >> utility which does a specific thing would be created exactly once. >> >> The end result would be that all the CSS would be completely dynamic and >> would not be needed to be added to statically loaded CSS files. >> - The actual code for creating the CSS should be quite concise and barely >> add weight to the app. >> - I have no done profiling on dynamically added CSS stylesheets, but I think >> it’s very performant. >> - CSS would be lazy loading which could further improve load times. >> - It should certainly add less weight than constantly declaring inline >> styling as is currently very common. >> - Using stylesheets might be more performant. (Not sure about that.) >> - Using stylesheets give much more flexibility for styling >> - It addresses pain points like hover behavior. >> >> Thoughts? >
