<% content_for "header" do %>
<title><%= translate(locale, "change_username") %> - Invidious</title>
<% end %>

<div class="pure-g">
    <div class="pure-u-1 pure-u-lg-1-5"></div>
    <div class="pure-u-1 pure-u-lg-3-5">
        <div class="h-box">
            <form class="pure-form pure-form-aligned" action="/change_username?referer=<%= URI.encode_www_form(referer) %>" method="post">
                <legend><%= translate(locale, "") %></legend>

                <fieldset>
                    <label for="new_username"><%= translate(locale, "new_username") %> :</label>
                    <input required class="pure-input-1" name="new_username" type="text" placeholder="<%= translate(locale, "new_username") %>">

                    <button type="submit" name="action" value="change_username" class="pure-button pure-button-primary">
                        <%= translate(locale, "change_username") %>
                    </button>

                    <input type="hidden" name="csrf_token" value="<%= HTML.escape(csrf_token) %>">
                </fieldset>
            </form>
        </div>
    </div>
    <div class="pure-u-1 pure-u-lg-1-5"></div>
</div>
