Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Prettier: Badly Formatted Code for Demo
html {
box-sizing: border-box;
font-size: 16px ;
}
*, *:before, *:after {
box-sizing: inherit ;
}
.banana > span:after {
content: attr(data-points) "pts" ;
font-size: 0.875rem;
position: absolute;
top: 50% ;
left: -40%;
background-color: var(--white-50) ;
padding: 2px 10px;
color: rgba(1, 1, 1, 1);
border-radius: 4px;
}
$("#speedPercent").on("input", event => {
$(".output").value = event.target.value + "%" ;
})
$("#grid").on("click", event => {
if (event.target && event.target.matches("button.banana")) {
const points = parseInt( event.target.dataset.points, 10 ) ;
state = { ...state, score: state.score + points };
setScoreInnerHTML(state);
const span = event.target.querySelector("span");
span.classList.add("exit-animation");
span.on('animationend', () => {
event.target.parentNode.removeChild(event.target)})
}
})
const mutationObserver = observer(state)
mutationObserver.observe($("#grid"), {attributes: false,childList: true,subtree: true});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.