<div content="jquery-wrapper" class="abs holder-all browse-mode">
    <mct-include key="'topbar-browse'"></mct-include>
    <div class="holder browse-area outline abs" ng-controller="BrowseController">
        <div class='split-layout vertical contents abs'
             ng-controller="SplitPaneController as splitter">
            <div class='split-pane-component treeview pane'
                 ng-style="{ width: splitter.state() + 'px'}">
                <mct-representation key="'create-button'" mct-object="navigatedObject">
                </mct-representation>
                <div class='holder tree-holder abs'>
                    <mct-representation key="'tree'"
                                        mct-object="domainObject"
                                        ng-model="treeModel">
                    </mct-representation>
                </div>
            </div>
            <div class="splitter"
                 ng-style="{ left: splitter.state() + 'px'}"
                 mct-drag-down="splitter.startMove()"
                 mct-drag="splitter.move(delta[0])"></div>
            <div class='split-pane-component items pane'
                 ng-style="{ left: splitter.state() + 'px', right: '0px' }">
                <div class='holder abs' id='content-area'>
                    <mct-representation mct-object="navigatedObject" key="'browse-object'">
                    </mct-representation>
                </div>
            </div>
        </div>
    </div>
    <mct-include key="'bottombar'"></mct-include>
</div>