JSFiddle - React, Tailwind, and code Playground

by cswing

HTML

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/dojo/1.9.0/dojo/resources/dojo.css">
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/dojo/1.9.0/dijit/themes/claro/claro.css">
 <div id="toolbar1" data-dojo-type="dijit/Toolbar" style="background-color:inherit;background-image:none;border-bottom:0px;">
     <span data-dojo-type="dijit/form/ToggleButton" data-dojo-props="disabled: true, 'class':'test'">Buttons:</span>
     <div data-dojo-type="dijit/form/Button" id="toolbar1.pan" data-dojo-props="iconClass:'PanIcon', showLabel:false">פאן</div>
                <div data-dojo-type="dijit/form/Button" id="toolbar1.copy" data-dojo-props="iconClass:'dijitEditorIcon dijitEditorIconCopy', showLabel:false">Copy</div>
                <div data-dojo-type="dijit/form/Button" id="toolbar1.paste" data-dojo-props="iconClass:'dijitEditorIcon dijitEditorIconPaste', showLabel:false">Paste</div>
                <!-- The following adds a line between toolbar sections-->
                <span data-dojo-type="dijit/ToolbarSeparator"></span>
                <div data-dojo-type="dijit/form/ToggleButton" id="toolbar1.bold" data-dojo-props="iconClass:'dijitEditorIcon dijitEditorIconBold', showLabel:false">Bold</div>
            </div>

CSS

.claro .test.dijitToggleButtonDisabled .dijitButtonNode {
    color:red;
}

JavaScript

require(["dojo/parser"], function(parser) {

});