HTML Console

A really simple console that can show log results in HTML

by Retsam19

HTML

<pre id="out">
  
</pre>

CSS

html, body {
  height: 100%;
  margin: 0;
}
#out {
  height: 100%;
  margin: 0;
  background-color: black;
  color: white;
}

Babel + JSX

//LOG UTILITY
function logItem(text) {
  const outEl = document.getElementById("out");
	const line = document.createElement("div");
  line.classList.add("out-line");
  const outText = (typeof text === "object") ? JSON.stringify(text) : text;
  line.textContent = `> ${outText}`;
	outEl.appendChild(line)
}

function log(...items) {
    items.forEach(logItem);
}