Skip to content

Add a button to select a new word in tabu game #7

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
williammizuta wants to merge 1 commit into
base: master
Choose a base branch
from
Open

Add a button to select a new word in tabu game #7

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 11 additions & 1 deletion tabu/cartas.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -81,7 +81,17 @@ li:first-child {
.instructions p em {
display: block;
margin-top: 1em;
text-align: right;
}

.instructions p button {
background-color: #ff6946;
border: none;
border-radius: 1em;
box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.2);
display: block;
margin-top: 1em;
padding: 0.5em 1em;
cursor: pointer;
}

.contribute {
Expand Down
20 changes: 16 additions & 4 deletions tabu/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,8 @@ <h1>Jogo do Tabú</h1>
<p>
<strong>O jogo é simples:</strong> o objetivo é descrever a palavra no alto do cartão para os outros jogadores -- mas sem usar nenhuma das outras palavras do cartão sorteado!

<em>Já usou sua palavra, recarregue a página para receber outra! ↻</em>
<em>Já usou sua palavra, clique neste botão para receber outra!</em>
<button>Nova palavra</button>
</p>
</div>

Expand Down Expand Up @@ -7990,9 +7991,20 @@ <h1>Jogo do Tabú</h1>

<a href="https://github.com/ceci/ceci.github.io/tree/master/tabu" class="contribute" target="_blank">Contribua no Github</a>
<script>
let cards = document.getElementsByTagName("ul");
var selected = Math.round(Math.random()*cards.length);
cards[selected].className = "show";
(function() {
function selectCard(cards) {
var selected = Math.round(Math.random()*cards.length);
cards.forEach(card => card.classList.remove("show"));
cards[selected].classList.add("show");
}

const cards = document.querySelectorAll("ul");
selectCard(cards);

document.querySelector("button").addEventListener("click", function() {
selectCard(cards);
});
})();
</script>

</body>
Expand Down