Framework7 - Action Sheet Template


Advertisements

Description

The modalActionsTemplate is a parameter, which can be passed on app initialization if you want to customize the Action Sheet template. You can customize Action Sheet template by passing modalActionsTemplate parameter on App initialization. The parameter will accept Template7 formatted HTML string, which will be compiled by Template7 with the groups context passed. The template will look as shown below −

<!-- This template will equalt to default layout -->
<div class = "actions-modal">
   <!-- this is a single group -->
   {{#each this}}
      <div class = "actions-modal-group">
         <!-- this represents a single button -->
         
         {{#each this}}
            {{#if label}}
               <span class = "actions-modal-label">{{text}}</span>
            {{else}}
               <div class = "actions-modal-button {{#if color}}color-{{color}}{{/if}} 
                  {{#if bold}}actions-modal-button-bold{{/if}}">{{text}}
               </div>
            {{/if}}
         {{/each}}
         
      </div>
   {{/each}}
</div>
framework7_overlays.htm
Advertisements