strolch/li.strolch.planningwebapp/src/main/webapp/parts/model.html

<div id="part-model" class="container-fluid hidden">
    <div class="row">
        <div class="col-sm-offset-2 col-sm-8">

            <!-- Nav tabs -->
            <ul class="nav nav-tabs" role="tablist">
                <li class="nav-item"><a class="nav-link" data-toggle="tab" href="#model-resourcesTab" role="tab">Resources</a>
                </li>
                <li class="nav-item"><a class="nav-link" data-toggle="tab" href="#model-ordersTab" role="tab">Orders</a>
                </li>
            </ul>

            <!-- Tab panes -->
            <div class="tab-content">
                <div class="tab-pane" id="model-resourcesTab" role="tabpanel">
                    <div class="row">
                        <div class="col-sm-12">
                            <form>
                                <div class="form-group row">
                                    <div class="col-sm-offset-2 col-sm-8">
                                        <input type="text" class="form-control" id="modelResourceTableSearch"
                                               placeholder="[id:<value>] [name:<value>] [type:<value>] [param:<bagId>:<paramId>] [value]">
                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-sm-12">
                            <table id="modelResourceTable" class="table table-striped table-bordered hover"
                                   cellspacing="0"
                                   width="100%">

                                <caption>The resources for the current user's realm</caption>

                            </table>
                        </div>
                    </div>
                </div>
                <div class="tab-pane" id="model-ordersTab" role="tabpanel">
                    <div class="row">
                        <table id="modelOrderTable" class="table table-striped">

                            <caption>The orders for the current user's realm</caption>

                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>