JSFiddle - React, Tailwind, and code Playground

by firegroove

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>
<script src="https://www.cyberselfie.fr/wp2/wp-content/uploads/2018/03/jquery.kontrol.js"></script>
<script src="https://getfirebug.com/firebug-lite-debug.js"></script>

<!DOCTYPE html>
<html>
<head>
    <title>jQuery Kontrol</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>
    <script src="jquery.kontrol.js"></script>
    <script>
        $(function() {
            var $all = $(".dial, .bars1, .bars2, .pad")
                    , $body = $("body");

            $(".bars1").bars({
                fgColor:"#222222"
                , bgColor:"#EEEEEE"
                /*, change : function (value) {
                 console.log("change : ", value);
                 }*/
                /*, draw : function () {
                 console.log(this.o);
                 }*/
            });

            /*$(".bars2").bars({
             fgColor:"#222222"
             , bgColor:"#EEEEEE"
             });*/

            var $pad = $(".pad")
                    .xy({
                        displayPrevious:false
                        , min : -100
                        , max : 100
                        , fgColor:"#222222"
                        , bgColor:"#EEEEEE"
                        , change : function (value) {
                         console.log("change : ", value);
                         }
                    })
                    .css({'border':'5px solid #BBB'});

            $(".dial")
                    .dial({
                        fgColor:"#222222"
                        , bgColor:"#EEEEEE"
                        , thickness : .3
                        , change : function (value) {
                         console.log("change : ", value);
                         }
                    })
                    .css({display:'inline',padding:'0px 10px'});

            var skins = {
                skin0 : {
      ...