templates/extended-sweet-alert.html.twig line 1

Open in your IDE?
  1. {{ include('partials/main.html.twig') }}
  3.     <head>
  4.         
  5.         {{ include('partials/title-meta.html.twig', {title: 'SweetAlert 2'}) }}
  7.         <!-- Sweet Alert-->
  8.         <link href="/libs/sweetalert2/dist/sweetalert2.min.css" rel="stylesheet" type="text/css" />
  10.         {{ include('partials/head-css.html.twig') }}
  12.     </head>
  14.     {{ include('partials/body.html.twig') }}
  16.         <!-- Begin page -->
  17.         <div id="layout-wrapper">
  19.             {{ include('partials/menu.html.twig') }}
  21.             <!-- ============================================================== -->
  22.             <!-- Start right Content here -->
  23.             <!-- ============================================================== -->
  24.             <div class="main-content">
  26.                 <div class="page-content">
  27.                     <div class="container-fluid">
  29.                         {{ include('partials/page-title.html.twig', {pagetitle: 'Extended', title: 'SweetAlert 2'}) }}
  30.                         <div class="row">
  31.                             <div class="col-12">
  32.                                 <div class="card">
  33.                                     <div class="card-header">
  34.                                         <h4 class="card-title">Examples</h4>
  35.                                         <p class="card-title-desc">A beautiful, responsive, customizable
  36.                                             and accessible (WAI-ARIA) replacement for JavaScript's popup boxes. Zero
  37.                                             dependencies.</p>
  38.                                     </div>
  39.                                     <div class="card-body">
  40.                                         <div class="table-responsive">
  41.                                             <table class="table table-nowrap align-middle justify-content-center mb-0">
  42.                                                 <thead>
  43.                                                     <tr>
  44.                                                         <th scope="col" style="width: 50%;">
  45.                                                             Sweet Alert Type
  46.                                                         </th>
  47.                                                         <th scope="col" class="text-center">
  48.                                                             Sweet Alert Examples
  49.                                                         </th>
  50.                                                     </tr>
  51.                                                 </thead>
  52.                                                 <tbody>
  53.                                                     
  54.                                                     <tr>
  55.                                                         <th scope="row">
  56.                                                             A Basic Message
  57.                                                         </th>
  58.                                                         <td class="text-center">
  59.                                                             <button type="button" class="btn btn-primary btn-sm waves-effect waves-light" id="sa-basic">Click me</button>
  60.                                                         </td>
  61.                                                     </tr>
  63.                                                     <tr>
  64.                                                         <th scope="row">
  65.                                                             A Title with a Text Under
  66.                                                         </th>
  67.                                                         <td class="text-center">
  68.                                                             <button type="button" class="btn btn-primary btn-sm waves-effect waves-light" id="sa-title">Click me</button>
  69.                                                         </td>
  70.                                                     </tr>
  72.                                                     <tr>
  73.                                                         <th scope="row">
  74.                                                             A success message!
  75.                                                         </th>
  76.                                                         <td class="text-center">
  77.                                                             <button type="button" class="btn btn-primary btn-sm waves-effect waves-light" id="sa-success">Click me</button>
  78.                                                         </td>
  79.                                                     </tr>
  81.                                                     <tr>
  82.                                                         <th scope="row">
  83.                                                             A warning message, with a function attached to the "Confirm"-button...
  84.                                                         </th>
  85.                                                         <td class="text-center">
  86.                                                             <button type="button" class="btn btn-primary btn-sm waves-effect waves-light" id="sa-warning">Click me</button>
  87.                                                         </td>
  88.                                                     </tr>
  90.                                                     <tr>
  91.                                                         <th scope="row">
  92.                                                             By passing a parameter, you can execute something else for "Cancel".
  93.                                                         </th>
  94.                                                         <td class="text-center">
  95.                                                             <button type="button" class="btn btn-primary btn-sm waves-effect waves-light" id="sa-params">Click me</button>
  96.                                                         </td>
  97.                                                     </tr>
  99.                                                     <tr>
  100.                                                         <th scope="row">
  101.                                                             A message with custom Image Header
  102.                                                         </th>
  103.                                                         <td class="text-center">
  104.                                                             <button type="button" class="btn btn-primary btn-sm waves-effect waves-light" id="sa-image">Click me</button>
  105.                                                         </td>
  106.                                                     </tr>
  108.                                                     <tr>
  109.                                                         <th scope="row">
  110.                                                             A message with auto close timer
  111.                                                         </th>
  112.                                                         <td class="text-center">
  113.                                                             <button type="button" class="btn btn-primary btn-sm waves-effect waves-light" id="sa-close">Click me</button>
  114.                                                         </td>
  115.                                                     </tr>
  117.                                                     <tr>
  118.                                                         <th scope="row">
  119.                                                             Custom HTML description and buttons
  120.                                                         </th>
  121.                                                         <td class="text-center">
  122.                                                             <button type="button" class="btn btn-primary btn-sm waves-effect waves-light" id="custom-html-alert">Click me</button>
  123.                                                         </td>
  124.                                                     </tr>
  126.                                                     <tr>
  127.                                                         <th scope="row">
  128.                                                             A custom positioned dialog
  129.                                                         </th>
  130.                                                         <td class="text-center">
  131.                                                             <button type="button" class="btn btn-primary btn-sm waves-effect waves-light" id="sa-position">Click me</button>
  132.                                                         </td>
  133.                                                     </tr>
  135.                                                     <tr>
  136.                                                         <th scope="row">
  137.                                                             A message with custom width, padding and background
  138.                                                         </th>
  139.                                                         <td class="text-center">
  140.                                                             <button type="button" class="btn btn-primary btn-sm waves-effect waves-light" id="custom-padding-width-alert">Click me</button>
  141.                                                         </td>
  142.                                                     </tr>
  144.                                                     <tr>
  145.                                                         <th scope="row">
  146.                                                             Ajax request example
  147.                                                         </th>
  148.                                                         <td class="text-center">
  149.                                                             <button type="button" class="btn btn-primary btn-sm waves-effect waves-light" id="ajax-alert">Click me</button>
  150.                                                         </td>
  151.                                                     </tr>
  153.                                                 </tbody>
  154.                                             </table>
  155.                                             <!-- end table -->
  156.                                         </div>
  157.                                         <!-- end table responsive -->
  158.                                         
  159.                                     </div>
  160.                                 </div>
  161.                             </div> <!-- end col -->
  162.                         </div> <!-- end row -->
  163.                     </div> <!-- container-fluid -->
  164.                 </div>
  165.                 <!-- End Page-content -->
  167.                 
  168.                 {{ include('partials/footer.html.twig') }}
  169.             </div>
  170.             <!-- end main content-->
  172.         </div>
  173.         <!-- END layout-wrapper -->
  175.         {{ include('partials/right-sidebar.html.twig') }}
  177.         {{ include('partials/vendor-scripts.html.twig') }}
  179.         <!-- Sweet Alerts js -->
  180.         <script src="/libs/sweetalert2/dist/sweetalert2.min.js"></script>
  182.         <!-- Sweet alert init js-->
  183.         <script src="/js/pages/sweetalert.init.js"></script>
  185.         <script src="/js/app.js"></script>
  187.     </body>
  188. </html>