483
edits
Changes
Jump to navigation
Jump to search
Line 47:
Line 47:
Line 62:
Line 146: </div><div class="panel-expand"> <div class="pointer"><i class="fa fa-times"></i></div>
no edit summary
<div class="thumbnail">http://mediawiki.trca.info/images/b/be/IMG_2457_750X500.jpg</div>
<div class="thumbnail">http://mediawiki.trca.info/images/b/be/IMG_2457_750X500.jpg</div>
</div>
</div>
<div class="col-md-12 column sortable ui-sortable pull-right">
<div class="portlet">
<div class="panel panel-primary-light-border">
<div class="panel-heading clearfix">
<div class="panel-caption">
<h3 class="panel-title">Portlet Overview</h3>
</div>
<div class="panel-options dark">
<div class="panel-collapse">
<div class="pointer"><i class="fa fa-chevron-up"></i></div>
</div>
<div class="panel-remove">
<div class="pointer"><i class="fa fa-times"></i></div>
</div>
</div>
</div>
<div style="display: block;" class="panel-body">
<p class="justify">Note the functionality, while not the same as tabs, it allows for large blocks of content in a
small space in the same way as tabs, but with additional functionality that would be difficult to accomplish with tabs.
Personally I prefer porlets to tabs.</p>
<p style="text-align:justify">As to portlet functionality note how they can be dragged and dropped to different locations, if
you select the <i class="fa fa-chevron-up"></i> it will close the portlet, selecting the <i class="fa fa-times"></i> will remove a portlet, whereas the <i class="fa fa-chevron-down"></i> will close the porlet. Panels can also be set to the
desired potion, either open or closed on page load.</p>
</div>
</div>
</div>
<div class="portlet">
<div class="panel panel-primary-light-border">
<div class="panel-heading clearfix">
<div class="panel-caption">
<h3 class="panel-title">Bootstrap Portlet 2</h3>
</div>
<div class="panel-options dark">
<div class="panel-expand">
<div class="pointer"><i class="fa fa-chevron-down"></i></div>
</div>
<div class="panel-remove">
<div class="pointer"><i class="fa fa-times"></i></div>
</div>
</div>
</div>
<div style="display: none;" class="panel-body">
<p class="justify">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris ullamcorper
dolor ut urna consectetur, id interdum purus pellentesque. Suspendisse fringilla
nunc erat, nec consectetur nisi tristique nec. Etiam dignissim hendrerit vehicula.
Cras eu dui vel nulla cursus feugiat. Suspendisse sem purus, molestie quis diam ac,
facilisis hendrerit elit. Morbi molestie ligula ut volutpat commodo. Donec ultrices,
metus a adipiscing ultrices, risus nibh rutrum nibh, vel interdum quam justo nec
nibh. Maecenas non orci a metus sollicitudin sollicitudin.
</p>
</div>
</div>
</div>
<div class="portlet">
<div class="panel panel-primary-light-border">
<div class="panel-heading clearfix">
<div class="panel-caption">
<h3 class="panel-title">Bootstrap Portlet 3</h3>
</div>
<div class="panel-options dark">
<div class="panel-expand">
<div class="pointer"><i class="fa fa-chevron-down"></i></div>
</div>
<div class="panel-remove">
<div class="pointer"><i class="fa fa-times"></i></div>
</div>
</div>
</div>
<div style="display: none;" class="panel-body">
<p class="justify">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris ullamcorper
dolor ut urna consectetur, id interdum purus pellentesque. Suspendisse fringilla
nunc erat, nec consectetur nisi tristique nec. Etiam dignissim hendrerit vehicula.
Cras eu dui vel nulla cursus feugiat. Suspendisse sem purus, molestie quis diam ac,
facilisis hendrerit elit. Morbi molestie ligula ut volutpat commodo. Donec ultrices,
metus a adipiscing ultrices, risus nibh rutrum nibh, vel interdum quam justo nec
nibh. Maecenas non orci a metus sollicitudin sollicitudin.
</p>
</div>
</div>
</div>
</div>
<div class="col-md-12">
<div class="col-md-12">
<div class="panel-expand">
<div class="panel-expand">
<div class="pointer"><i class="fa fa-chevron-down"></i></div>
<div class="pointer"><i class="fa fa-chevron-down"></i></div>
</div>
</div>
</div>
</div>