Prophecy Cards

by Vindexus

HTML

<span id="num-cards"></span>
<textarea id="ta"></textarea>
<div id="list"></div>

CSS

div {
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

#list {
  display: flex;
  flex-wrap: wrap;
}

textarea {
  width: 100%;
  height: 80px;
}

.card {
  border: 1px solid #333;
  padding: 0.75em 1em;
  margin: 1em;
  flex: 0 0 200px;
  font-size: 11px;
  height: 350px;
}

.card .image {
  background: black;
  width: 150px;
  height: 150px;
  margin: 10px auto;
}

.text {
}

.image img {
  width: 100%;
}

.card h4 {
  margin: 0px 0 0px 0;
  font-size: 14px;
}

.tags {
  font-style: italic;
  margin: 0 0 10px 0;
}

.bonus {
  margin-top: 5px;
}

JavaScript

const numBoons = 30
const numActions = 50
const numCurses = 20

function shuffle(a) {
    var j, x, i;
    for (i = a.length - 1; i > 0; i--) {
        j = Math.floor(Math.random() * (i + 1));
        x = a[i];
        a[i] = a[j];
        a[j] = x;
    }
    return a;
}

Array.prototype.random = function () {
  return this[Math.floor((Math.random()*this.length))];
}

function getRandomInt(min, max) {
    min = Math.ceil(min);
    max = Math.floor(max);
    return Math.floor(Math.random() * (max - min + 1)) + min;
}

function alwaysArray (input) {
	if (Array.isArray(input)) {
  	return input
  }
  
  return [input]
}
function newCard () {
  const name = names.random()
	const card = {
    name: prefixes.random() + ' ' + name.name,
    tag: name.tag,
    image: skullImages.random(),
    discipline: ''
  }
  return card
}

const skullImages =...