doctype html
html(lang="en-gb")
    head
        meta(charset="utf-8")
        title pixsy
        link(rel="stylesheet" href="includes/style.css")
    body
        h1
            | pixsy
            //img(alt="tilesy" src="includes/tilesy.png")
        p
            span.background convert images to Bitsy rooms
        .pages
            .page#start
                button.normal.pagination.next#new create a new bitsy game
                button.normal.pagination.next#load load an existing bitsy game
            .page.game-data
                h2 game data
                input#game(type="file" autocomplete="off")
                br
                textarea#game-data(
                    placeholder="Paste your game data here or use the file chooser button above"
                    autocomplete="off"
                )
                button.pagination.prev previous
                button.pagination.next#game-data-next(disabled=true) next
            .page.image
                h2 image
                .image-container
                    input#image(type="file" autocomplete="off")
                    img#preview
                button.pagination.prev previous
                button.pagination.next next
            .page.extras
                h2 tiles
                label
                    | tile name (optional)
                    input#prefix(type="text" placeholder="e.g. 'forest'" autocomplete="off")

                button.pagination.prev#back-to-image previous
                button.pagination.next#import next
            .page.download
                h2 download
                textarea#output(autocomplete="off")
                br
                button#download download
                button.pagination.prev#add add another image
                button.pagination.start#reset start again
        script(type="module")
            include script.js