% layout 'standard', title => 'Create Blog', sb_active => 'dashboard';

<div class="mt-5">
    <div class="progress" style="height: 1px;">
        <div class="progress-bar" role="progressbar" style="width: 33%;" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
        <div class="progress-bar bg-light" role="progressbar" style="width: 34%;" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
        <div class="progress-bar bg-light" role="progressbar" style="width: 33%;" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
    </div>
    <div class="progress mt-1" style="height: 20px;">
        <div class="progress-bar bg-success" role="progressbar" style="width: 33%;" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">Domain Name</div>
        <div class="progress-bar" role="progressbar" style="width: 34%;" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100">Blog Settings</div>
        <div class="text-center progress-bar-striped" style="width: 33%">Finish</div>
    </div>
</div>

<h3 class="h3 mt-4 mb-4">Create new blog</h3>

<p>The first step of creating your new blog is to choose a domain name.</p>

<p>To use your own domain name, you'll need to set the a <span class="fw-bold">CNAME</span> record on your domain to point to <span class="fw-bold"><%= $dns_record %></span>.  Until this record exists, your blog will not be accessable from the Internet.</p>

<p>If you would like to use a domain name we provide, please <a href="<%= $c->url_for( 'show_blog_domain_hosted' ) %>">click here</a> to go back.</p>

%= include '_base/status_window';

<form autocomplete="off" class="mt-5" method="POST" action="<%= $c->url_for( 'do_blog_domain' ) %>">
    <input type="hidden" name="calling_route" value="show_blog_domain_owned">
    <div class="row">
        <div class="col-2">
        </div>
        <div class="col-8">
            <div class="input-group mb-3">
                <span class="input-group-text" id="domain-addon-1">https://</span>
                <input type="text" name="domain" class="form-control" placeholder="your.domain.com" aria-label="domain name" aria-describedby="domain-addon">
            </div>
        </div>
    </div>
    <button type="submit" class="btn btn-primary float-end mt-3">Continue &rarr;</button>
</form>