<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Task 3 - Handlebars</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>
<div id="authors">
</div>
<script id="authors-template" type='text/x-handlebars-template'>
    {{#authors}}
    <div class="box {{#if this.right}} right {{/if}}">
        <div class="inner">
            <p><img alt="{{this.name}}" src="{{this.image}}" width="100" height="133"></p>
            <div>
                <h3>{{name}}</h3>
                {{#each titles}}
                <p>
                    {{{this}}}
                </p>
                {{/each}}

                <ul>
                    {{#each urls}}
                    <li><a href="{{this}}" target="_blank">{{this}}</a></li>
                    {{/each}}
                </ul>
            </div>
        </div>
    </div>
    {{/authors}}
</script>
<script src="handlebars.js"></script>
<script src="scripts.js"></script>
</body>
</html>