Skip to content

Instantly share code, notes, and snippets.

@jamigibbs
Created April 15, 2021 18:31
Show Gist options
  • Save jamigibbs/b5999b214e70f40529e2e70cfa9b6ac7 to your computer and use it in GitHub Desktop.
Save jamigibbs/b5999b214e70f40529e2e70cfa9b6ac7 to your computer and use it in GitHub Desktop.
PageLayout_Template.cmp
<!--
- Use this component as a template for custom page layouts
- siteforceContentArea, slds-col_padded & com-layout-column are Customer Service (Napili) classes that match
- page layout classes in that OTB theme
-->
<aura:component description="Peak_PageLayout_Template" implements="forceCommunity:layout" access="global">
<aura:attribute name="ContentHeader" type="Aura.Component[]" />
<aura:attribute name="ContentSubHeader" type="Aura.Component[]" />
<aura:attribute name="Content" type="Aura.Component[]" />
<aura:attribute name="Content2" type="Aura.Component[]" />
<aura:attribute name="Sidebar" type="Aura.Component[]" />
<aura:attribute name="Sidebar2" type="Aura.Component[]" />
<aura:attribute name="ContentSubFooter" type="Aura.Component[]" />
<aura:attribute name="ContentFooter" type="Aura.Component[]" />
<section>
{!v.ContentHeader}
<div class="slds-container_center slds-container_x-large siteforceContentArea slds-p-vertical_medium">
<lightning:layout multipleRows="true">
<lightning:layoutItem size="12" class="slds-col_padded comm-layout-column">
{!v.ContentSubHeader}
</lightning:layoutItem>
<lightning:layoutItem size="12" mediumDeviceSize="8" class="slds-col_padded comm-layout-column">
{!v.Content}
</lightning:layoutItem>
<lightning:layoutItem size="12" mediumDeviceSize="4" class="slds-col_padded comm-layout-column">
{!v.Sidebar}
</lightning:layoutItem>
<lightning:layoutItem size="12" mediumDeviceSize="4" class="slds-col_padded comm-layout-column">
{!v.Sidebar2}
</lightning:layoutItem>
<lightning:layoutItem size="12" mediumDeviceSize="8" class="slds-col_padded comm-layout-column">
{!v.Content2}
</lightning:layoutItem>
<lightning:layoutItem size="12" class="slds-col_padded comm-layout-column">
{!v.ContentSubFooter}
</lightning:layoutItem>
</lightning:layout>
</div>
{!v.ContentFooter}
</section>
</aura:component>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment