general.hbs

<header class="settings-view-header">
    {{#link-to "settings" class="btn btn-default btn-back"}}Back{{/link-to}}
    <h2 class="page-title">General</h2>
    <section class="page-actions">
        <button type="button" class="btn btn-blue" {{action "save"}}>Save
        </button>
    </section>
</header>

<section class="content settings-general">
    <form id="settings-general" novalidate="novalidate">
        <fieldset>

            <div class="form-group">
                <label for="blog-title">Blog Title</label>
                {{input id="blog-title" name="general[title]" type="text" value=model.title}}
                <p>The name of your blog</p>
            </div>

            <div class="form-group description-container">
                <label for="blog-description">Blog Description</label>
                {{textarea id="blog-description" name="general[description]" value=model.description}}
                <p>
                    Describe what your blog is about
                    {{gh-count-characters model.description}}
                </p>

            </div>
        </fieldset>

        <div class="form-group">
            <label>Blog Logo</label>
            {{#if model.logo}}
                <img class="blog-logo" src="{{model.logo}}" alt="logo" role="button" {{action "openModal" "upload" this "logo"}}>
            {{else}}
                <button type="button" class="btn btn-green js-modal-logo" {{action "openModal" "upload" this "logo"}}>Upload Image</button>
            {{/if}}
            <p>Display a sexy logo for your publication</p>
        </div>

        <div class="form-group">
            <label>Blog Cover</label>
            {{#if model.cover}}
                <img class="blog-cover" src="{{model.cover}}" alt="cover photo" role="button" {{action "openModal" "upload" this "cover"}}>
            {{else}}
                <button type="button" class="btn btn-green js-modal-cover" {{action "openModal" "upload" this "cover"}}>Upload Image</button>
            {{/if}}
            <p>Display a cover image on your site</p>
        </div>

        <fieldset>
            <div class="form-group">
                <label for="email-address">Email Address</label>
                {{input id="email-address" name="general[email-address]" type="email" value=model.email autocapitalize="off" autocorrect="off"}}
                <p>Address to use for admin notifications</p>
            </div>

            <div class="form-group">
                <label for="postsPerPage">Posts per page</label>
                {{! `pattern` brings up numeric keypad allowing any number of digits}}
                {{input id="postsPerPage" name="general[postsPerPage]" focus-out="checkPostsPerPage" value=model.postsPerPage min="1" max="1000" type="number" pattern="[0-9]*"}}
                <p>How many posts should be displayed on each page</p>
            </div>

            <div class="form-group for-checkbox">
                <label for="permalinks">Dated Permalinks</label>
                <label class="checkbox" for="permalinks">
                    {{input id="permalinks" name="general[permalinks]" type="checkbox" checked=isDatedPermalinks}}
                    <span class="input-toggle-component"></span>
                    <p>Include the date in your post URLs</p>
                </label>
            </div>

            <div class="form-group for-select">
                <label for="activeTheme">Theme</label>
                <span class="gh-select" data-select-text="{{selectedTheme.label}}" tabindex="0">
                   {{view "select"
                       id="activeTheme"
                       name="general[activeTheme]"
                       content=themes
                       optionValuePath="content.name"
                       optionLabelPath="content.label"
                       value=model.activeTheme
                       selection=selectedTheme}}
               </span>
                <p>Select a theme for your blog</p>
            </div>

            <div class="form-group for-checkbox">
                <label for="isPrivate">Make this blog private</label>
                <label class="checkbox" for="isPrivate">
                    {{input id="isPrivate" name="general[isPrivate]" type="checkbox"
                    checked=model.isPrivate}}
                    <span class="input-toggle-component"></span>
                    <p>Enable password protection</p>
                </label>
            </div>

            {{#if model.isPrivate}}
            <div class="form-group">
                {{input name="general[password]" type="text" value=model.password}}
                <p>This password will be needed to access your blog. All search engine optimization and social features are now disabled. This password is stored in plaintext.</p>
            </div>
            {{/if}}
        </fieldset>
    </form>
</section>