<div id="content" data-sparkline-container data-easy-pie-chart-container>
    <div class="row">
        <big-breadcrumbs items="['Other Pages', 'Forum Layout']" icon="file-o"
                         class="col-xs-12 col-sm-7 col-md-7 col-lg-4"></big-breadcrumbs>
        <div smart-include="app/layout/partials/sub-header.tpl.html"></div>
    </div>

    <!-- row -->
    <div class="row">
        <div class="col-sm-12">
            <div class="well">
                <table class="table table-striped table-forum">
                    <thead>
                    <tr>
                        <th colspan="2"><a ui-sref="app.appViews.forumDemo"> Projects </a> &gt; <a ui-sref="app.appViews.forumTopicDemo">Business
                            Requirement Docs </a> &gt; Nam quam nunc blandit vel
                        </th>
                    </tr>
                    </thead>
                    <tbody>
                    <!-- Post -->
                    <tr>
                        <td class="text-center"><a ui-sref="app.appViews.profileDemo"><img alt src="styles/img/flags/us.png"> &#xA0;
                            <strong>John Doe</strong></a></td>
                        <td>on <em>Jan 1, 2014 - 12:00am</em></td>
                    </tr>
                    <tr>
                        <td class="text-center" style="width: 12%;">
                            <div class="push-bit">
                                <a ui-sref="app.appViews.profileDemo"> <img src="styles/img/avatars/sunny.png" width="50" alt="avatar"
                                                             class="online"> </a>
                            </div>
                            <small>473 Posts</small>
                        </td>
                        <td>
                            <p>
                                Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo,
                                rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis
                                pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean
                                vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend
                                ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus
                                viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean imperdiet.
                            </p><h5>Forecast Pie</h5><span class="sparkline display-inline margin-bottom-10"
                                                           data-sparkline-type="pie" data-sparkline-offset="90"
                                                           data-sparkline-piesize="150px"> 33,20,10 </span>

                            <p>
                                Fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet
                                a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer
                                tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend
                                tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam
                                lorem ante, dapibus in, viv.
                            </p><em>- John Doe
                            <br>
                            CEO, SmartAdmin</em></td>
                    </tr>
                    <!-- end Post -->
                    <!-- Post -->
                    <tr>
                        <td class="text-center"><a ui-sref="app.appViews.profileDemo"><img alt src="styles/img/flags/es.png"> &#xA0;
                            <strong>Sadi Orlaf</strong></a></td>
                        <td>on <em>Jan 1, 2014 - 12:00am</em></td>
                    </tr>
                    <tr>
                        <td class="text-center" style="width: 12%;">
                            <div class="push-bit">
                                <a ui-sref="app.appViews.profileDemo"> <img src="styles/img/avatars/5.png" width="50" alt="avatar"
                                                             class="offline"> </a>
                            </div>
                            <small>473 Posts</small>
                        </td>
                        <td>
                            <p>
                                Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo,
                                rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis
                                pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean
                                vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend
                                ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus
                                viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean imperdiet.
                            </p><em>- Sadi Orlaf
                            <br>
                            Executive, SmartAdmin</em>

                            <div class="forum-attachment">
                                2 attachment(s) &#x2014; <a href-void> Download all attachments</a>
                                <ul class="list-inline margin-top-10">
                                    <li class="well well-sm padding-5">
                                        <strong>rocketlaunch.jpg</strong>
                                        <br>
                                        400 kb
                                        <br>
                                        <a href-void> Download</a> | <a href-void> View</a>
                                    </li>
                                    <li class="well well-sm padding-5">
                                        <strong>budget.xsl</strong>
                                        <br>
                                        400 kb
                                        <br>
                                        <a href-void> Download</a> | <a href-void> Share</a>
                                    </li>
                                </ul>
                            </div>
                        </td>
                    </tr>
                    <!-- end Post -->
                    <!-- Post -->
                    <tr>
                        <td class="text-center"><a ui-sref="app.appViews.profileDemo"><img alt src="styles/img/flags/us.png"> &#xA0;
                            <strong>Me</strong></a></td>
                        <td><em>Today</em></td>
                    </tr>
                    <tr>
                        <td class="text-center" style="width: 12%;">
                            <div class="push-bit">
                                <a ui-sref="app.appViews.profileDemo"> <img src="styles/img/avatars/sunny.png" width="50" alt="avatar"
                                                             class="online"> </a>
                            </div>
                            <small>473 Posts</small>
                        </td>
                        <td>
                            <div id="forumPost" data-smart-summernote-editor data-height="180"></div>
                            <button class="btn btn-primary margin-top-10">
                                Post
                            </button>
                            <button class="btn btn-success margin-top-10">
                                Save for later
                            </button>
                        </td>
                    </tr>
                    <!-- end Post -->
                    </tbody>
                </table>
                <div class="text-center">
                    <ul class="pagination pagination-sm">
                        <li class="disabled">
                            <a href-void>Prev</a>
                        </li>
                        <li class="active">
                            <a href-void>1</a>
                        </li>
                        <li>
                            <a href-void>2</a>
                        </li>
                        <li>
                            <a href-void>3</a>
                        </li>
                        <li>
                            <a href-void>...</a>
                        </li>
                        <li>
                            <a href-void>99</a>
                        </li>
                        <li>
                            <a href-void>Next</a>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
    <!-- end row -->
</div>