JSFiddle - React, Tailwind, and code Playground

by Frank Liu

JavaScript

javascript:void function(){(function(){function a(){var a=document.createElement("style"),b=[];b.push("[data-content-id]:after {"),b.push("  content: \"Launch CMS\" !important;"),b.push("  cursor: pointer;"),b.push("  text-align: center;"),b.push("  display: block;"),b.push("  font-size: 14px;"),b.push("  padding-top: 5px;"),b.push("  padding-bottom: 5px;"),b.push("  z-index: 3000;"),b.push("  box-shadow: unset;"),b.push("  transform: unset;"),b.push("  font-weight: bold;"),b.push("  color: %23ffffff;"),b.push("}"),b.push("[data-content-id] {"),b.push("  padding: 5px;"),b.push("  padding-bottom: 0;"),b.push("  position: relative;"),b.push("  background-image: none;"),b.push("  margin: 20px;"),b.push("  background-color: %23ff00a5a1;"),b.push("  border: 1px solid %23611d49;"),b.push("}"),b.push("[data-content-id]:hover::after {"),b.push("  text-decoration: underline;"),b.push("}"),b.push("[data-content-id] .metadata {"),b.push("  text-align: center;"),b.push("  font-size: 14px;"),b.push("  font-weight: bold;"),b.push("  color: %23ffffff;"),b.push("  border-top: 1px dashed;"),b.push("  padding-top: 5px;"),b.push("  margin-bottom: -5px;"),b.push("}"),b.push("html {"),b.push("  overflow: scroll;"),b.push("}"),a.innerHTML=b.join("\n"),document.head.appendChild(a)}function b(a){var b=a.getAttribute("data-content-id");if(b){var c=b.split(".");if(2<=c.length){var e=d["core-content-v2"],f=c[0],g=c[1];3===c.length%26%26(e=d[c[0]]||c[0],f=c[1],g=c[2]),window.open(`https://app.contentstack.com/%23!/stack/${e}/content-type/${f}/en-gb/entry/${g}/edit`,"_blank")}}}function c(){var a=document.querySelectorAll("[data-content-id]");a.forEach(a=>{var b=a.getAttribute("data-content-metadata");if(b){var c=a.querySelector("div.metadata")||document.createElement("div");c.innerHTML=b,c.setAttribute("class","metadata"),a.appendChild(c)}})}const...