% layout 'default';
% title 'CAPTCHA';
% content_for open_graph => begin
  <meta property="og:type" content="website">
  <meta property="og:title" content="<%= title %>">
  <meta property="og:description" content="What are you?">
% end
% content_for twitter_card => begin
  <meta name="twitter:title" content="<%= title %>">
  <meta name="twitter:description" content="What are you?">
% end
<h2 class="page-title"><%= title %></h2>
<form method="post" class="form-body">
  <div class="form-field">
    <% if (my $error = validation->error('answer')) { =%>
    <p class="field-with-error">Should be a single number between
      <%= $error->[2] %> and <%= $error->[3] %>.</p>
    <% } =%>
    <%= label_for answer => "What Roman numeral is this?: $roman_numeral" %>
    <%= number_field 'answer', (
        id        => 'answer',
        min       => 1,
        max       => 9,
        required  => undef,
        autofocus => undef
    ) %>
  </div>
  <%= hidden_field number => $roman_numeral, id => 'number' %>
  <%= csrf_field %>
  <button type="submit" class="form-button">Answer</button>
</form>
