Priorizei usar "getElementById" e "getElementsByClassName" a invés do "querySelector" para ser mais semântico.
// AULA 1
const html = document.querySelector('html');
const focoBtn = document.querySelector('.app__card-button--foco');
const curtoBtn = document.querySelector('.app__card-button--curto');
const longoBtn = document.querySelector('.app__card-button--longo');
focoBtn.addEventListener('click', () => {
html.setAttribute('data-contexto', 'foco');
})
curtoBtn.addEventListener('click', () => {
html.setAttribute('data-contexto', 'descanso-curto');
})
longoBtn.addEventListener('click', () => {
html.setAttribute('data-contexto', 'descanso-longo')
})
// EXERCÍCIO 1 - Capturando elementos com JavaScript
// EXERCÍCIO 2 - Criando variáveis no JavaScript
const timer = document.getElementById('timer');
const img = document.getElementsByClassName('app__image');
const title = document.getElementsByClassName('app__title');
console.log(timer, img, title)
// EXERCÍCIO 3 - Criando botões da aplicação (demais botões já foram criados)
constStartPause = document.getElementById('start-pause');
//EXERCÍCIO 4 - Selecionando botões com JavaScript
const timerFoco = 1500;
const timerCurto = 300;
const timerLongo = 900
