JSFiddle - React, Tailwind, and code Playground

by alanhogan

HTML

This version of <a href="https://jsfiddle.net/alanhogan/ykjLf5yr/">this fiddle</a>  applies <code>grayscale</code> to HTML, and has a background set on BODY, but is still an unsuccessful work-around of a bug in Safari/Webkit and Chrome/Blink as of 2016-10-28.

CSS

.grayscale {
  filter: grayscale(100%);
}

body {
  background: #dfc;
  color: #32d;
  font-family: sans-serif;
}

code {
  font-family: Menlo, "Bitsteam Very Sans Mono", sans-serif;
}

JavaScript

window.setInterval(function() {
	document.getElementsByTagName('html')[0].classList.toggle('grayscale');
}, 1000);