blob: 08a9d8688385bc6012faa3f6552894243895d1ec [file] [log] [blame]
<div class="container-fluid " style="height: 90% ;">
<div class="row" style="height: 100%">
<div class="col-sm-2" >
<div class="card" style="height: 110%">
<div class="card-header">
STEM Projects
</div>
<div class="card-body">
<div class="pre-scrollable">
<tree [tree]="stemprojects"></tree>
</div>
</div>
</div>
</div>
<div class="col-sm-10" style="height: 105%">
<div class="card" style="height: 67%">
<div class="card-header">
Content
</div>
<div class="card-body">
<div class="bd-example">
<dl class="row">
<dt class="col-sm-3">Description lists</dt>
<dd class="col-sm-9">A description list is perfect for defining terms.</dd>
<dt class="col-sm-3">Euismod</dt>
<dd class="col-sm-9">
<p>Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.</p>
<p>Donec id elit non mi porta gravida at eget metus.</p>
</dd>
<dt class="col-sm-3">Malesuada porta</dt>
<dd class="col-sm-9">Etiam porta sem malesuada magna mollis euismod.</dd>
<dt class="col-sm-3 text-truncate">Truncated term is truncated</dt>
<dd class="col-sm-9">Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</dd>
<dt class="col-sm-3">Nesting</dt>
<dd class="col-sm-9">
<dl class="row">
<dt class="col-sm-4">Nested definition list</dt>
<dd class="col-sm-8">Aenean posuere, tortor sed cursus feugiat, nunc augue blandit nunc.</dd>
</dl>
</dd>
</dl>
</div>
</div>
</div>
<div class="card" style="height: 40%">
<div class="col-md-12 mb-12" style="height: 100%">
<!-- Nav tabs -->
<tabset>
<tab>
<ng-template tabHeading><i class="icon-list"></i> Scenarios &nbsp;</ng-template>
<div class="pre-scrollable">
<tree [tree]="Scenarios"></tree>
</div>
</tab>
<tab>
<ng-template tabHeading><i class="icon-calculator"></i> Models &nbsp;</ng-template>
<div class="pre-scrollable">
<tree [tree]="models"></tree>
</div>
</tab>
<tab>
<ng-template tabHeading><i class="icon-pie-chart"></i> Graphs</ng-template>
<div class="pre-scrollable">
<tree [tree]="graph"></tree>
</div>
</tab>
<tab>
<ng-template tabHeading><i class="icon-list"></i> Predicate &nbsp;</ng-template>
<div class="pre-scrollable">
<tree [tree]="predicate"></tree>
</div>
</tab>
<tab>
<ng-template tabHeading><i class="icon-calculator"></i> Sequencer &nbsp;</ng-template>
<div class="pre-scrollable">
<tree [tree]="sequencer"></tree>
</div>
</tab>
<tab>
<ng-template tabHeading><i class="icon-pie-chart"></i> Triggers</ng-template>
<div class="pre-scrollable">
<tree [tree]="triggers"></tree>
</div>
</tab>
<tab>
<ng-template tabHeading><i class="icon-pie-chart"></i> Experiments</ng-template>
<div class="pre-scrollable">
<tree [tree]="experiments"></tree>
</div>
</tab>
</tabset>
</div><!--/.col-->
</div>
</div>
</div>
</div>