Changes

Jump to navigation Jump to search

Main Page (view source)

Revision as of 16:13, 16 February 2017

5,174 bytes added ,  8 years ago
no edit summary
Line 47: Line 47:  
<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">
Line 62: Line 146:  
                             <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 class="panel-expand">
  −
                                <div class="pointer"><i class="fa fa-times"></i></div>
   
                             </div>
 
                             </div>
 
                       </div>
 
                       </div>
Retrieved from "https://wiki.sustainabletechnologies.ca/wiki/Special:MobileDiff/401"

Navigation menu