@paperbits/core/workshops/blog/ko/blogPostDetails.html

Paperbits core components.

<div class="flex flex-column fit">
    <div class="flex-item flex-item-grow form" data-bind="scrollable: true">
        <div class="form-group">
            <label for="title" class="form-label">Title</label>
            <div class="input-group">
                <input type="text" id="title" class="form-control" data-bind="textInput: blogPostItem.title, validationElement: blogPostItem.title, focus: true"
                    placeholder="e.g. Getting started" maxlength="256" />
                <button class="btn btn-danger input-group-btn" type="button" data-bind="validationMessageToggle: blogPostItem.title">!</button>
            </div>
        </div>

        <div class="form-group">
            <label for="permalink" class="form-label">Permalink</label>
            <div class="input-group">
                <input type="text" id="permalink" class="form-control" data-bind="textInput: blogPostItem.permalink, validationElement: blogPostItem.permalink"
                    placeholder="e.g. /blog/post" maxlength="2000" spellcheck="false" />
                <button class="btn btn-danger input-group-btn" data-bind="validationMessageToggle: blogPostItem.permalink" type="button">!</button>
            </div>
        </div>

        <div class="form-group">
            <label for="description" class="form-label">Description</label>
            <textarea id="description" class="form-control" data-bind="textInput: blogPostItem.description" maxlength="256"></textarea>
        </div>

        <div class="form-group">
            <label for="keywords" class="form-label">Keywords</label>
            <input type="text" id="keywords" class="form-control" data-bind="textInput: blogPostItem.keywords" placeholder="e.g. blog" maxlength="256"
            />
        </div>
    </div>

    <div class="flex-item btn-group">
        <button class="btn btn-default" data-bind="click: deleteBlogPost">
            <i aria-hidden="true" class="paperbits-icon paperbits-simple-remove"></i>
            Delete blog post
        </button>
    </div>
</div>