Olá, Cristian! Entendo que você quer melhorar a usabilidade do seu projeto, e isso é ótimo! Vamos lá.
Primeiro, para fazer com que o cursor vá automaticamente para a textArea quando você clicar em "Adicionar nova tarefa", você pode usar o método focus()
do JavaScript. Este método, quando aplicado a um elemento do DOM, faz com que o cursor vá direto para esse elemento. Aqui está um exemplo:
document.getElementById("meuTextArea").focus();
Neste exemplo, "meuTextArea" seria o id do seu elemento textArea. Você pode colocar essa linha de código no evento de clique do botão "Adicionar nova tarefa".
Agora, para fazer com que a barra de rolagem vá automaticamente para o final da página quando o textArea for selecionado, você pode usar o método scrollIntoView()
do JavaScript. Este método, quando aplicado a um elemento do DOM, faz com que o elemento seja exibido na janela. Aqui está um exemplo:
document.getElementById("meuTextArea").scrollIntoView(false);
Neste exemplo, "meuTextArea" seria o id do seu elemento textArea. O parâmetro false
faz com que o elemento seja exibido na parte inferior da janela. Você pode colocar essa linha de código logo após a linha que aplica o método focus()
.
Lembre-se de substituir "meuTextArea" pelo id real do seu elemento textArea.
Espero ter ajudado e bons estudos!