Dear Dojo 2+ users,
I’m looking for a way to manually set the background color for a Button widget. Using a static stylesheet is not an option.
The color is stored as RGB value in a database and might be different for all buttons on the same widget.
Thanks,
Thomas
In the meantime, I found two solutions:
#1: put a div inside the button and use the “style” attribute, as my button requires multiple lines, put another div inside which contains the lines. This is required to handle vertical centering.
Drawback is, that on iOS, buttons have rounded corners, and only the div inside has the correct background color
#2: create a new button class duplicating all of the old button class, add a style attribute and use it. Duplication is something, I’d really like to avoid, but because of all methods being private, this is required.
None of the solutions make me happy.
Just another question: Is there anyone here trying to use Dojo2? Or am I completely alone in this world?..
Sorry for the very slow replies Thomas… honestly most of us are on Discord, but since you started asking here, it sounds like you’ve found your way over there.
Thomas, I assume you have read through https://github.com/dojo/framework/blob/master/src/widget-core/README.md#styling--theming ? In particular, have you looked at the styles option?
Dear Dylon,
yes, I’ve read through this document and unfortunately did not find anything I could use with a @dojo/widets/button. The styles option seems to be supported for VNodes only. Am I missing something here?
Thanks,
Thomas
Ok, I see what you are saying. Unlike in Dojo 1.x, creating widgets in modern Dojo is quite a bit easier to achieve. So it should be pretty easy to either extend the existing button to add the ability to accept background color as a property, or write your own button. You should also open an issue in the @dojo/widgets repo for this feature.
Keep in mind it took many years for Dojo 1.x to get feature complete. The goal with modern Dojo is to add features that users need rather than add every feature we can conceive in advance. This allows us to stay small and focused rather than becoming the kitchen sink. 
-Dylan
Filed an issue in the repo now, hope it is ok.
Maybe I’m doing something wrong, but extending the button won’t work for me. Will have to pass the styles to the v() in render(), but this requires access to the private functions…
Thomas
Hi Dylan,
filed the issue, had a (very interesting) discussion in the issue tracker and it seems that a Button widget should not be customizable in the way I need it.
Thanks for your help.
Hi Thomas,
In reading through the discussions, I think it’s important to note that one of the primary design goals with modern Dojo is to keep things lean and small and avoid some of the decisions from Dojo 1 which led to quite a lot of performance and maintenance bloat. In general the goal is to provide the extension points that meet the most common 80% of use cases, and for the less common 20%, make it possible, but don’t necessarily build that into everything. In the case of modern Dojo, widgets are effectively cheap to create (whereas in Dojo 1.x creating a new widget was often a substantial undertaking). As a result of that change, the idea is that rather than building the world’s most advanced widget library, instead provide a widget system that makes it much easier to create your own widgets. It’s substantially more challenging to create a lean, flexible, perfect set of reusable widgets than it is to make it easier to extend and write your own.
I understand this is not an ideal answer when something that just worked with Dojo 1.x does not work with modern Dojo, but this is the direction the web community is going (keep things small and lean, rather than including the kitchen sink). It’s often the “my one feature is small and simple, please just add it” but combine that with 100 others, and then you end up with a 50KB button widget.