lib/templates/block.mustache

   1 {{!
   2     @template core/block
   3
   4     Example context (json):
   5     {
   6         "id": "block0",
   7         "class": "block block_html",
   8         "showskiplink": true,
   9         "type": "html",
  10         "ariarole": "complementary",
  11         "title": "Test block",
  12         "blockinstanceid": 1,
  13         "content": "<p>Hello block world!</p>"
  14     }
  15
  16 }}
  17 {{! Block Skip Link }}
  18 {{#showskiplink}}
  19   <a href="#sb-{{skipid}}" class="sr-only sr-only-focusable">{{#str}}skipa, access, {{{title}}}{{/str}}</a>
  20 {{/showskiplink}}
  21
  22 {{! Start Block Container }}
  23 <section id="{{id}}"
  24      class="{{#hidden}}hidden{{/hidden}} {{class}} {{#hascontrols}}block_with_controls{{/hascontrols}} card mb-3"
  25      role="{{ariarole}}"
  26      data-block="{{type}}"
  27      data-instance-id="{{blockinstanceid}}"
  28      {{#arialabel}}
  29         aria-label="{{arialabel}}"
  30      {{/arialabel}}
  31      {{^arialabel}}
  32         {{#title}}
  33           aria-labelledby="instance-{{blockinstanceid}}-header"
  34         {{/title}}
  35      {{/arialabel}}>
  36
  37     {{! Block contents }}
  38     <div class="card-body p-3">
  39
  40         {{! Block header }}
  41         {{#title}}
  42             <h3 id="instance-{{blockinstanceid}}-header" class="h5 card-title d-inline">{{{title}}}</h3>
  43         {{/title}}
  44
  45         {{#hascontrols}}
  46             <div class="block-controls float-right header">
  47                 {{{controls}}}
  48             </div>
  49         {{/hascontrols}}
  50
  51         <div class="card-text content mt-3">
  52             {{{content}}}
  53             <div class="footer">{{{footer}}}</div>
  54             {{{annotation}}}
  55         </div>
  56
  57     </div>
  58
  59 {{! End Block Container }}
  60 </section>
  61
  62 {{! Block Skip Link Target }}
  63 {{#showskiplink}}
  64   <span id="sb-{{skipid}}"></span>
  65 {{/showskiplink}}