Browse Source

Trying to make it flex

main
Julio Biason 2 years ago
parent
commit
41f6bb0a8d
  1. 49
      index.html

49
index.html

@ -1,12 +1,31 @@
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset=utf-8>
<title>HUE HUE Name Generator</title>
<style type="text/css">
#content {
display: flex;
justify-content: space-around;
flex-direction: row;
}
#content>.block {
flex: auto;
}
</style>
</head>
<body>
<div>
<button id="generator">
Mais!
</button>
</div>
<div id="content"></div>
</body>
</html>
<script>
@ -17,6 +36,7 @@
["Androide", 0],
["Andróide", 1],
["Apóstolo", 0],
["Baseado", 0],
["Betoneira", 1],
["Bruxa", 1],
["Bruxo", 0],
@ -44,6 +64,8 @@
["Socialite", 1],
["Síndica", 1],
["Síndico", 0],
["Soldado", 0],
["Soldada", 1],
["Viking", 0],
["Viking", 1],
];
@ -75,6 +97,11 @@
["Da Rua", "Da Rua"],
["Da Semana", "Da Semana"],
["Da Terra", "Da Terra"],
["Da Zona Leste", "Da Zone Leste"],
["Da Zona Oeste", "Da Zona Oeste"],
["Da Zona Sul", "Da Zona Sul"],
["Da Zona", "Da Zona"],
["Da Zone Norte", "Da Zona Norte"],
["Das Estrelas", "Das Estrelas"],
["De Carne", "De Carne"],
["De Dados", "De Dados"],
@ -90,6 +117,7 @@
["Do Pão", "Do Pão"],
["Do Rio", "Do Rio"],
["Do Sul", "Do Sul"],
["Dos Dados", "Dos Dados"],
["Fluminense", "Fluminense"],
["Furacão", "Furacão"],
["Gaúcho", "Gaúcha"],
@ -97,7 +125,7 @@
["Júnior", "Júnior"],
["Maranhense", "Maranhese"],
["Mineiro", "Mineira"],
["Nordestino", "Nordestino"],
["Nordestino", "Nordestina"],
["Novato", "Novata"],
["Paraense", "Paraense"],
["Paraibano", "Paraibana"],
@ -120,16 +148,31 @@
function generate() {
const initial = first[getRandomInt(first.length)];
const final = last[getRandomInt(last.length)];
const name = initial[0] + " " + final[initial[1]];
return initial[0] + " " + final[initial[1]];
if (name.length > 19) {
return generate();
}
return name;
}
function show() {
let base = document.createElement("div");
base.className = "block";
for (let i = 0; i < 5; i++) {
let name = document.createElement("p");
name.innerHTML = generate();
document.getElementById("content").append(name);
base.append(name);
}
document.getElementById("content").append(base);
}
const btn = document.getElementById("generator");
btn.addEventListener("click", () => show());
show();
})();
</script>
Loading…
Cancel
Save