JSFiddle - React, Tailwind, and code Playground

by edwardsharp

HTML

<button class="round-button" id="trust-button">TRUST</button>

CSS

html {
    font-size: 2em;
}
.round-button {
    width: 50%;
    height: 80%;
    font-size: 100%;
    padding-bottom: 10%;
    padding-top: 8%;
    border-radius: 50%;
    border: 2px solid #f5f5f5;
    overflow: hidden;
    background: #ff6600;
    box-shadow: 0 0 3px gray;
}
.round-button:hover {
    background-color: #FF6600;
    background-image: -webkit-gradient(linear, left, right, from(#FF6600), to(#FFFF00));
    background-image: -webkit-linear-gradient(top, #FF6600, #FFFF00);
    background-image: -moz-linear-gradient(top, #FF6600, #FFFF00);
    background-image: -ms-linear-gradient(top, #FF6600, #FFFF00);
    background-image: -o-linear-gradient(top, #FF6600, #FFFF00);
    background-image: linear-gradient(to bottom, #FF6600, #FFFF00);
    filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#FF6600, endColorstr=#FFFF00);
}
button:focus {
    outline:0;
}

JavaScript

var tMots = [
    "obscure", "root", "executable", "header", "the",
    "problem", "with", "universals", "anti-forensics",
    "embedded", "malware", "plastic", "pill", "jars",
    "slamming", "our", "doors", "trapped", "under",
    "the", "rubble", "pile", "the", "boundaries", "as",
    "my", "own", "emotion", "rocks", "&", "dust", "on",
    "my", "face", "and", "where", "i", "sleep", "at",
    "night", "my", "own", "private", "achromatic",
    "prison", "dark", "alleyways", "and", "elevators",
    "used", "as", "negotiating", "spaces", "for",
    "my", "self", "which", "is", "under", "realistic",
    "scrutiny", "anyway", "personal", "property",
    "architected", "on", "pleasure", "profit",
    "principals", "do", "not", "give", "that", "guy",
    "money",
    "of",
    "a",
    "situation",
    "or",
    "condition",
    "extremely",
    "bad",
    "unpleasant",
    "and",
    "degrading",
    "abject",
    "poverty",
    "synonyms",
    "wretched",
    "miserable",
    "hopeless",
    "pathetic",
    "pitiful",
    "pitiable",
    "piteous",
    "sorry",
    "woeful",
    "lamentable",
    "degrading",
    "appalling",
    "atrocious",
    "awful",
    "abject",
    "poverty",
    "of",
    "an",
    "unhappy",
    "state",
    "of",
    "mind",
    "experienced",
    "to",
    "the",
    "maximum",
    "degree",
    "his",
    "letter",
    "plunged",
    "her",
    "into",
    "abject",
    "misery",
    "of",
    "a",
    "person",
    "or",
    "their",
    "behavior",
    "completely",
    "without",
    "pride",
    "or",
    "dignity",
    "self",
    "abasing",
    "an",
    "abject",
    "apology",
    "synonyms",
    "contemptible",
    "base",
    "low",
    "vile",
    "worthless",
    "debased",
    "degraded",
    "despicable",
    "ignominious",
    "mean",
    "unworthy",
    "ignoble",
    "an",
    "abject",
    "sinner",
    "obsequious",
    "groveling",
    "fawning",
    "toadyish",
    "servile",
    "cringing",
    "sycophantic",
   ...