"Navigation"
Bootstrap 4.1.1 Snippet by rgarrow

<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"><link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"> <section> <div class="container"> <div class="row mbr-justify-content-center"> <div class="col-lg-6 mbr-col-md-10"> <div class="wrap"> <div class="ico-wrap"> <span class="mbr-iconfont fa-volume-up fa"></span> </div> <div class="text-wrap vcenter"> <h2 class="mbr-fonts-style mbr-bold mbr-section-title3 display-5">Stay <span>Successful</span></h2> <p class="mbr-fonts-style text1 mbr-text display-6">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum</p> </div> </div> </div> <div class="col-lg-6 mbr-col-md-10"> <div class="wrap"> <div class="ico-wrap"> <span class="mbr-iconfont fa-calendar fa"></span> </div> <div class="text-wrap vcenter"> <h2 class="mbr-fonts-style mbr-bold mbr-section-title3 display-5">Create <span>An Effective Team</span> </h2> <p class="mbr-fonts-style text1 mbr-text display-6">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum</p> </div> </div> </div> <div class="col-lg-6 mbr-col-md-10"> <div class="wrap"> <div class="ico-wrap"> <span class="mbr-iconfont fa-globe fa"></span> </div> <div class="text-wrap vcenter"> <h2 class="mbr-fonts-style mbr-bold mbr-section-title3 display-5">Launch <span>A Unique Project</span> </h2> <p class="mbr-fonts-style text1 mbr-text display-6">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum</p> </div> </div> </div> <div class="col-lg-6 mbr-col-md-10"> <div class="wrap"> <div class="ico-wrap"> <span class="mbr-iconfont fa-trophy fa"></span> </div> <div class="text-wrap vcenter"> <h2 class="mbr-fonts-style mbr-bold mbr-section-title3 display-5">Achieve <span>Your Targets</span></h2> <p class="mbr-fonts-style text1 mbr-text display-6">Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum</p> </div> </div> </div> </div> </div> </section>
<style> .affix { top:0; width: 100%; z-index: 9999 !important; } .navbar { margin-bottom: 0px; } .affix ~ .container-fluid { position: relative; top: 50px; } </style> <div class="row"> <div class="col-sm-12"> <div class="container-fluid" style="background-color:#5bc0de;color:#444;height:175px;"> <h2>[Feature:SelectedFeature.FeatureName]</h2> <h3>[Feature:SelectedFeaturePPMScore.FeatureTypeName] [Feature:SelectedFeaturePPMScore.StartDateFormatted] - [Feature:SelectedFeaturePPMScore.EndDateFormatted]</h3> <p>[Feature:SelectedFeaturePPMScore.FeatureDescription]</p> </div> <!-- <div class="row"> <div class="col-sm-10"> <h2>Scoring</h2> <p>Use the following sliders to score your work. Each tab defines the scoring groups. <span style="font-size: 18px; color: blue;">Select all values before submitting</span></p> </div> </div> --> <div class="row"> <div class="col-sm-9"> [Fields:UserIDsPresentCSV] </div> <div class="col-sm-3"> <p>[Fields:SubmitAll]</p> </div> </div> <div class="col-sm-12" data-spy="affix" data-offset-top="205"> <ul class="nav nav-tabs"> <li class="active"><a data-toggle="tab" href="#home">Impact</a></li> <li><a data-toggle="tab" href="#menu1">Effort</a></li> <li><a data-toggle="tab" href="#menu2">Risk</a></li> <li><a data-toggle="tab" href="#menu3"></a></li> </ul> <div class="tab-content"> <div id="home" class="tab-pane fade in active"> <h3>Impact Measures</h3> <div class="row"> <div class="col-sm-12"> [Fields:iContributionToRevenueID] </div> </div> <div class="row"> <div class="col-sm-12"> [Fields:iCostSavingsScore] </div> </div> <div class="row"> <div class="col-sm-12"> [Fields:iContributionToCXID] </div> </div> <div class="row"> <div class="col-sm-12"> [Fields:iContributionToStabilityID] </div> </div> <div class="row"> <div class="col-sm-12"> [Fields:iContributionToSecurityID] </div> </div> <div class="row"> <div class="col-sm-12"> [Fields:iContributionToTransformationRebuildID] </div> </div> <div class="row"> <div class="col-sm-12"> [Fields:iContributionToTransformationRationalizeID] </div> </div> </div> <div id="menu1" class="tab-pane fade"> <h3>Effort Measures</h3> <div class="row"> <div class="col-sm-12"> [Fields:eAmountOfWorkID] </div> </div> <div class="row"> <div class="col-sm-12"> [Fields:eSolutionComplexityID] </div> </div> <div class="row"> <div class="col-sm-12"> [Fields:eSolutionUncertaintyID] </div> </div> </div> <div id="menu2" class="tab-pane fade"> <h3>Risk Measures</h3> <div class="row"> <div class="col-sm-12"> [Fields:rAbilityToStaffID] </div> </div> <div class="row"> <div class="col-sm-12"> [Fields:rDependenciesID] </div> </div> <div class="row"> <div class="col-sm-12"> [Fields:rScheduleInflexibilityID] </div> </div> </div> <div id="menu3" class="tab-pane fade"> <h3></h3> <p>[Fields:Value]</p> <p>[Fields:TimeCriticality]</p> <p>[Fields:RiskReduction]</p> <p>[Fields:Transformation]</p> <p>[Fields:JobSize]</p> <p>[Fields:TotalScore]</p> </div> </div> </div> </div> </div>
<link href="/Portals/0/Libraries/dhtmlx/dhtmlxgantt.css" rel="stylesheet" type="text/css" /> <style> .gantt_grid_head_add { display: none; } .quarterSubscale { border-right: 3px solid #bbb !important; } .child_preview { z-index: 1; overflow: hidden; opacity: 70%; } .hideText .gantt_task_content { visibility: hidden; } .ews_gantt_task .gantt_task_content { padding-left: 45px; } .gantt_task_progress { text-align: left; padding-left: 10px; box-sizing: border-box; color: white; font-weight: bold; overflow: visible; } .gantt_task_line.gantt_task_inline_color .gantt_task_progress { background-color: rgba(100, 100, 100, 0.45); opacity: 1; } </style> <script src="[Portal:HomeDirectory]Libraries/dhtmlx/dhtmlxgantt.js"></script> <script src="[Portal:HomeDirectory]Libraries/dhtmlx/ext/dhtmlxgantt_undo.js"></script> <script src="[Portal:HomeDirectory]Libraries/dhtmlx/ext/dhtmlxgantt_marker.js"></script> <script src="[Portal:HomeDirectory]Libraries/dhtmlx/ext/dhtmlxgantt_fullscreen.js"></script> <script src="[Portal:HomeDirectory]Libraries/dhtmlx/ext/dhtmlxgantt_tooltip.js"></script> <script src="[Portal:HomeDirectory]Libraries/dhtmlx/ext/dhtmlxgantt_smart_rendering.js"></script> <!-- <script src="http://export.dhtmlx.com/gantt/api.js"></script> -->

Related: See More


Questions / Comments: