XDavidT/gist:ae275df9d91adc045ddf720cbef57298

## gistfile1.txt
<!DOCTYPE html>
<html lang="en">

<head>

  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  <meta name="description" content="">
  <meta name="author" content="">

  <title>SB Admin 2 - Users</title>

  <!-- Custom fonts for this template -->
  <link href="vendor/fontawesome-free/css/all.min.css" rel="stylesheet" type="text/css">
  <link href="https://fonts.googleapis.com/css?family=Nunito:200,200i,300,300i,400,400i,600,600i,700,700i,800,800i,900,900i" rel="stylesheet">

  <!-- Custom styles for this template -->
  <link href="css/sb-admin-2.css" rel="stylesheet">


  <!-- Custom styles for this page -->
  <link href="vendor/datatables/dataTables.bootstrap4.min.css" rel="stylesheet">

</head>

<body id="page-top">

  <!-- Page Wrapper -->
  <div id="wrapper">

    <!-- Sidebar -->
    {{>sidebar}}

    <!-- Content Wrapper -->
    <div id="content-wrapper" class="d-flex flex-column">

      <!-- Main Content -->
      <div id="content">

        <!-- Topbar -->
        {{>topbar}}

        <!-- Begin Page Content -->
        <div class="container-fluid">

          <!-- Page Heading -->
          <h1 class="h3 mb-2 text-gray-800">Users</h1>

         <div class="card-body" data-toggle="modal" data-target="#addUserModal">
            <button>ADD USER</button>
          </div>
              <div class="table-responsive">
                <table class="table table-bordered" id="dataTableUsers" width="100%" cellspacing="0">
                  <thead>
                    <tr>
                      <th>Id</th>
                      <th>name</th>
                      <th>email</th>
                    </tr>
                  </thead>
                  <tbody>
                    <tr>
                      <td>Error</td>
                      <td>Error</td>
                      <td>Error</td>
                    </tr>
                  </tbody>
                </table>
              </div>


        </div>
        <!-- /.container-fluid -->

      </div>
      <!-- End of Main Content -->

      <!-- Footer -->
      {{>footer}}

    </div>
    <!-- End of Content Wrapper -->

  </div>
  <!-- End of Page Wrapper -->

  <!-- Scroll to Top Button-->
  <a class="scroll-to-top rounded" href="#page-top">
    <i class="fas fa-angle-up"></i>
  </a>

  <!-- Logout Modal-->
  <div class="modal fade" id="logoutModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <h5 class="modal-title" id="exampleModalLabel">Ready to Leave?</h5>
          <button class="close" type="button" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">×</span>
          </button>
        </div>
        <div class="modal-body">Select "Logout" below if you are ready to end your current session.</div>
        <div class="modal-footer">
          <button class="btn btn-secondary" type="button" data-dismiss="modal">Cancel</button>
          <a class="btn btn-primary" href="login.html">Logout</a>
        </div>
      </div>
    </div>
  </div>


<!-- Add User Modal -->
<div class="modal fade modal-center-screen" id="addUserModal" tabindex="-1" role="dialog" data-backdrop="static" style="padding-top: 280px">
    <div class="modal-dialog modal-lg">
    <div class="modal-content">
        <div class="modal-header">
              <h3 class='col-12 modal-title text-center'>
              Centered Modal Title
              <button type='button' class='close' data-dismiss='modal' aria-label='Close'>
              <span aria-hidden='true'>&times;</span>
              </button></h3>
        </div>
        <div class="modal-body">
            <form class="input-group" method="post" action="/users" >

                  <div class="input-group-prepend"  >
                    <div class="input-group-text" >NAME</div>
                  </div>
                  <input type="text" id="NameRule" name="NameRule" size="38" autocomplete="off" required>

                  <div class="input-group-prepend"  >
                    <div class="input-group-text" >FIELD</div>
                  </div>
                  <input type="text" id="ruleField" name="ruleField" size="4" autocomplete="off" required>

                  <div class="input-group-prepend"  >
                    <div class="input-group-text" >VALUE</div>
                  </div>
                  <input type="text" id="ruleValue" name="ruleValue" size="4" autocomplete="off" required>

                  <button type="submit" id="send" class="btn btn-success btn-circle" >
                        <i class="fas fa-check"></i>
                  </button>

              </form>
        </div>
        <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        </div>
    </div>
    </div>
</div>


  <!-- Bootstrap core JavaScript-->
  <script src="vendor/jquery/jquery.min.js"></script>
  <script src="vendor/bootstrap/js/bootstrap.bundle.min.js"></script>

  <!-- Core plugin JavaScript-->
  <script src="vendor/jquery-easing/jquery.easing.min.js"></script>

  <!-- Custom scripts for all pages-->
  <script src="js/sb-admin-2.min.js"></script>

  <!-- Page level plugins | Data table script -->
  <script src="vendor/datatables/jquery.dataTables.min.js"></script>
  {{!-- Style for DataTable --}}
  <script src="vendor/datatables/dataTables.bootstrap4.min.js"></script>

  <!-- Page level custom scripts | DataTable script -->

  {{!-- Script to fill the table manual --}}
  <script src="js/Users.js"></script>

</body>

</html>
	<!DOCTYPE html>
	<html lang="en">

	<head>

	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
	<meta name="description" content="">
	<meta name="author" content="">

	<title>SB Admin 2 - Users</title>

	<!-- Custom fonts for this template -->
	<link href="vendor/fontawesome-free/css/all.min.css" rel="stylesheet" type="text/css">
	<link href="https://fonts.googleapis.com/css?family=Nunito:200,200i,300,300i,400,400i,600,600i,700,700i,800,800i,900,900i" rel="stylesheet">

	<!-- Custom styles for this template -->
	<link href="css/sb-admin-2.css" rel="stylesheet">



	<!-- Custom styles for this page -->
	<link href="vendor/datatables/dataTables.bootstrap4.min.css" rel="stylesheet">

	</head>

	<body id="page-top">

	<!-- Page Wrapper -->
	<div id="wrapper">

	<!-- Sidebar -->
	{{>sidebar}}

	<!-- Content Wrapper -->
	<div id="content-wrapper" class="d-flex flex-column">

	<!-- Main Content -->
	<div id="content">

	<!-- Topbar -->
	{{>topbar}}

	<!-- Begin Page Content -->
	<div class="container-fluid">

	<!-- Page Heading -->
	<h1 class="h3 mb-2 text-gray-800">Users</h1>

	<div class="card-body" data-toggle="modal" data-target="#addUserModal">
	<button>ADD USER</button>
	</div>
	<div class="table-responsive">
	<table class="table table-bordered" id="dataTableUsers" width="100%" cellspacing="0">
	<thead>
	<tr>
	<th>Id</th>
	<th>name</th>
	<th>email</th>
	</tr>
	</thead>
	<tbody>
	<tr>
	<td>Error</td>
	<td>Error</td>
	<td>Error</td>
	</tr>
	</tbody>
	</table>
	</div>



	</div>
	<!-- /.container-fluid -->

	</div>
	<!-- End of Main Content -->

	<!-- Footer -->
	{{>footer}}

	</div>
	<!-- End of Content Wrapper -->

	</div>
	<!-- End of Page Wrapper -->

	<!-- Scroll to Top Button-->
	<a class="scroll-to-top rounded" href="#page-top">
	<i class="fas fa-angle-up"></i>
	</a>

	<!-- Logout Modal-->
	<div class="modal fade" id="logoutModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
	<div class="modal-dialog" role="document">
	<div class="modal-content">
	<div class="modal-header">
	<h5 class="modal-title" id="exampleModalLabel">Ready to Leave?</h5>
	<button class="close" type="button" data-dismiss="modal" aria-label="Close">
	<span aria-hidden="true">×</span>
	</button>
	</div>
	<div class="modal-body">Select "Logout" below if you are ready to end your current session.</div>
	<div class="modal-footer">
	<button class="btn btn-secondary" type="button" data-dismiss="modal">Cancel</button>
	<a class="btn btn-primary" href="login.html">Logout</a>
	</div>
	</div>
	</div>
	</div>


	<!-- Add User Modal -->
	<div class="modal fade modal-center-screen" id="addUserModal" tabindex="-1" role="dialog" data-backdrop="static" style="padding-top: 280px">
	<div class="modal-dialog modal-lg">
	<div class="modal-content">
	<div class="modal-header">
	<h3 class='col-12 modal-title text-center'>
	Centered Modal Title
	<button type='button' class='close' data-dismiss='modal' aria-label='Close'>
	<span aria-hidden='true'>×</span>
	</button></h3>
	</div>
	<div class="modal-body">
	<form class="input-group" method="post" action="/users" >

	<div class="input-group-prepend" >
	<div class="input-group-text" >NAME</div>
	</div>
	<input type="text" id="NameRule" name="NameRule" size="38" autocomplete="off" required>

	<div class="input-group-prepend" >
	<div class="input-group-text" >FIELD</div>
	</div>
	<input type="text" id="ruleField" name="ruleField" size="4" autocomplete="off" required>

	<div class="input-group-prepend" >
	<div class="input-group-text" >VALUE</div>
	</div>
	<input type="text" id="ruleValue" name="ruleValue" size="4" autocomplete="off" required>

	<button type="submit" id="send" class="btn btn-success btn-circle" >
	<i class="fas fa-check"></i>
	</button>

	</form>
	</div>
	<div class="modal-footer">
	<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
	</div>
	</div>
	</div>
	</div>





	<!-- Bootstrap core JavaScript-->
	<script src="vendor/jquery/jquery.min.js"></script>
	<script src="vendor/bootstrap/js/bootstrap.bundle.min.js"></script>

	<!-- Core plugin JavaScript-->
	<script src="vendor/jquery-easing/jquery.easing.min.js"></script>

	<!-- Custom scripts for all pages-->
	<script src="js/sb-admin-2.min.js"></script>

	<!-- Page level plugins \| Data table script -->
	<script src="vendor/datatables/jquery.dataTables.min.js"></script>
	{{!-- Style for DataTable --}}
	<script src="vendor/datatables/dataTables.bootstrap4.min.js"></script>

	<!-- Page level custom scripts \| DataTable script -->

	{{!-- Script to fill the table manual --}}
	<script src="js/Users.js"></script>

	</body>

	</html>