JSFiddle - React, Tailwind, and code Playground

HTML

<body>
    <div id="info"></div>
    <label for="first"></label><input type="text" value=""><br>
    <label for="second"></label><input type="text" value=""><br>
    <button>Расчет</button>  
</body>

CSS

body {
    color: yellow;
    background: black;
}

JavaScript

// Информация о пользователе
// ! getComputedStyle не работает в старых IE

var date = (new Date).toString(),
    username = prompt('Введите ваше имя');

document.getElementById('info').innerHTML =
    "Ваше имя: " + username +
    "<br>Сейчас: " + date +
    "<br>Цвет страницы:" + getComputedStyle(document.body).backgroundColor + 
    "<br>Цвет текста:" + getComputedStyle(document.body).color;

// Форма

var checkNum = function () {
    // Проверка на цифры с помощью регулярных выражений
    if (! /^[0-9]$/.test(this.value)) {
        alert('Не одна цифра!');
    }
},
    inputs = document.getElementsByTagName('input');
// Устанавливаем проверку на событие onblur для всех инпутов
for (i = 0; i < inputs.length; ++i) {
    inputs[i].onblur = checkNum;
}
// Устанавливаем расчет на кнопку "Расчет"
document.getElementsByTagName('button')[0].onclick = function () {
    alert(parseInt(inputs[0].value, 10) + parseInt(inputs[1].value, 10));
}