templates/mobile_webpages/test/modal.html

   1 [% USE P %]
   2
   3 <h1>Material Modal Tests</h1>
   4
   5
   6 <div>
   7
   8 Button triggered modal, no close/agree button:<br>
   9
  10 [% P.M.button_tag("", "Modal", class="modal-trigger", href="#modal1") %]
  11 <!-- Modal Structure -->
  12 <div id="modal1" class="modal">
  13   <div class="modal-content">
  14     <h4>Modal Header</h4>
  15     <p>A bunch of text</p>
  16   </div>
  17 </div>
  18
  19 </div>
  20
  21
  22 <div>
  23 Button triggered modal, close/agree button:<br>
  24
  25 [% P.M.button_tag("", "Modal", class="modal-trigger", href="#modal2") %]
  26 <!-- Modal Structure -->
  27 <div id="modal2" class="modal">
  28   <div class="modal-content">
  29     <h4>Modal Header</h4>
  30     <p>A bunch of text</p>
  31   </div>
  32   <div class="modal-footer">
  33     [% P.M.button_tag('', 'Cancel', class="modal-close", flat=1) %]
  34     [% P.M.button_tag('', 'Agree', class="modal-close", flat=1) %]
  35   </div>
  36 </div>
  37
  38 </div>
  39
  40 <div>
  41 Javascript triggered modal:<br>
  42 [% P.M.button_tag("\$('#modal1').modal('open')", "Open!") %]
  43 </div>
  44
  45
  46 <div>
  47 popup_dialog modal with given html:<br>
  48 [% P.M.button_tag("kivi.popup_dialog({ html: 'Testtext'})", "Testtext") %]
  49 </div>