<div class="card m-0 border-info">
    <div class="card-header text-center">
        EXAMPLE: creating a new contest
    </div>
    <div class="card-body text-end">
        <div class="row mb-1">
            <label class="col form-label" for="example-title">contest title</label>
            <input type="text" id="example-title" class="col form-control form-control-sm" readonly>
        </div>
        <div class="row mb-1">
            <label class="col form-label" for="example-title">instructions</label>
            <input type="text" id="example-instructions" class="col form-control form-control-sm" readonly>
        </div>
        <div class="row mb-1">
            <label class="col form-label" for="example-owner">contest owner</label>
            <input type="text" id="example-owner" class="col form-control form-control-sm" readonly>
        </div>
        <div class="row mb-1">
            <label class="col form-label" for="example-expires">expires after</label>
            <input type="text" id="example-expires" class="col form-control form-control-sm" readonly>
        </div>
        <div class="row mb-1">
            <label class="col form-label" for="example-winners">winners</label>
            <input type="text" id="example-winners" class="col form-control form-control-sm" readonly>
        </div>
        <div class="row mb-1">
            <label class="col form-label" for="example-entrants">max entrants</label>
            <input type="text" id="example-entrants" class="col form-control form-control-sm" readonly>
        </div>
        <div class="text-center">
            <button id="example-button" class="btn btn-outline-primary btn-sm" disabled>submit</button>
        </div>
    </div>
</div>
