JSFiddle - React, Tailwind, and code Playground

by joshuatz

HTML

<!DOCTYPE html>
<html>

<head>
    <script>
        function setCookie(cname, cvalue, exdays) { // sets the cookie
            var d = new Date();
            d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000));
            var expires = "expires=" + d.toGMTString();
            document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
        }

        function getCookie(cname) {
            var name = cname + "=";
            var decodedCookie = decodeURIComponent(document.cookie);
            var ca = decodedCookie.split(';');
            for (var i = 0; i < ca.length; i++) {
                var c = ca[i];
                while (c.charAt(0) == ' ') {
                    c = c.substring(1);
                }
                if (c.indexOf(name) == 0) {
                    return c.substring(name.length, c.length);
                }
            }
            return "";
        }

        function checkCookie() {
            var user = getCookie("username");
            if (user != "") {
                alert("Welcome again " + user);
            } else {
                user = document.getElementById("username").value;
                if (user != "" && user != null) {
                    setCookie("username", user, 30);
                }
            }
        }
    </script>
    <style>
        html,
        body {
            width: 100%;
            height: 100%;
            font-family: "Helvetica Neue", Helvetica, sans-serif;
            color: #444;
            -webkit-font-smoothing: antialiased;

            background-image: url("bg.jpg");
        }

        #container {
            position: fixed;
            width: 500px;
            height: 395px;
            top: 25%;
            left: 30%;
            margin-top: -5px;
            margin-left: -200x;
            background: #fff;
            border-radius: 30px;
            border: 1px solid #ccc;
            box-shadow: 0 1px 2px rgba(0, 0, 0, .1);

        }

        form {
        ...