index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="./Keyboard/keyboard.css">
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
    <title>Virtual Keyboard</title>
</head>
<body> 
    <h1>Virtual Keyboard</h1>
    <h3>Features</h3>
    <ul>
        <li>Easy to responsive</li>
        <li>responsive</li>
        <li>Vanilla JS (<strong>no libs reqd!</strong>)</li>
    </ul>
    <textarea class="use-keyboard-input" style="position: absolute; top: 130px; right: 30px; width: 300px;"></textarea>
    <!-- <div class="keyboard">
        <div class="keyboard__keys">
            <button type="button" class="keyboard__key">a</button>
            <button type="button" class="keyboard__key keyboard__key--wide">
                <i class="material-icons">backspace</i>
            </button>
            <button type="button" class="keyboard__key keyboard__key--wide">
                <i class="material-icons">space_bar</i>
            </button>
            <button type="button" class="keyboard__key keyboard__key--wide">
                <i class="material-icons">keyboard_capslock</i>
            </button>
            <button type="button" class="keyboard__key keyboard__key--wide">
                <i class="material-icons">check_circle</i>
            </button>
        </div>
    </div> -->

    <script src="keyboard/keyboard.js"></script>
</body>
</html>