JSFiddle - React, Tailwind, and code Playground

by justin0022

HTML

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>emoji-feedback</title>
</head>

<body>
  <div id="entry"></div>
</html>

JavaScript

!function(n){var t={};function e(o){if(t[o])return t[o].exports;var r=t[o]={i:o,l:!1,exports:{}};return n[o].call(r.exports,r,r.exports,e),r.l=!0,r.exports}e.m=n,e.c=t,e.d=function(n,t,o){e.o(n,t)||Object.defineProperty(n,t,{enumerable:!0,get:o})},e.r=function(n){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(n,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(n,"__esModule",{value:!0})},e.t=function(n,t){if(1&t&&(n=e(n)),8&t)return n;if(4&t&&"object"==typeof n&&n&&n.__esModule)return n;var o=Object.create(null);if(e.r(o),Object.defineProperty(o,"default",{enumerable:!0,value:n}),2&t&&"string"!=typeof n)for(var r in n)e.d(o,r,function(t){return n[t]}.bind(null,r));return o},e.n=function(n){var t=n&&n.__esModule?function(){return n.default}:function(){return n};return e.d(t,"a",t),t},e.o=function(n,t){return Object.prototype.hasOwnProperty.call(n,t)},e.p="",e(e.s=5)}([function(n,t,e){var o=e(1);"string"==typeof o&&(o=[[n.i,o,""]]);var r={hmr:!0,transform:void 0,insertInto:void 0};e(3)(o,r);o.locals&&(n.exports=o.locals)},function(n,t,e){(n.exports=e(2)(!1)).push([n.i,".wrapper {\n  display: grid;\n  grid-gap: 2px;\n  width: 60px;\n  grid-template-columns: [col] 60px [col] 60px [col] 60px [col] 60px [col] 60px;\n  grid-template-rows: [row] auto [row] auto [row];\n}\n\n.feedback-text {\n  grid-column: col / span 6;\n  grid-row: row;\n  text-align: center;\n  font-weight: bold;\n}\n\n.button {\n  text-align: center;\n  background-color: white;\n  border: 1px solid #D3D3D3;\n  -webkit-transition-duration: 0.1s;\n  transition-duration: 0.1s;\n  border-radius: 5px;\n  cursor: pointer;\n}\n\n.button:hover {\n  border: 1px solid #40B4E5;\n}\n\n.active {\n  background-color: #40B4E5;\n  font-style: bold;\n}\n\nspan.emoji {\n  font-size: 30px;\n}\n\n.hidden {\n  display: none;\n}\n\n.feedback-form {\n  grid-row: row 4;\n  grid-column: col / span 6;\n  -webkit-animation: slide-down .3s ease-out;\n  -moz-animation: slide-down .3s...