prueba.html

<!DOCTYPE html<html>
	<head>
		<title>Prueba</title>
		<meta charset="utf-8">

		 <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

		 <link rel="shortcut icon" href="https://i.pinimg.com/originals/90/2e/b1/902eb16546985bbc3b42628ee6bffdfe.png">


		<link rel="stylesheet" href="http://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
		<!-- <link rel="stylesheet" href="/resources/demos/style.css"> -->
		<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
		<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
		<script type="text/javascript" src="script.js"></script>


		<style type="text/css">
			.form{
				padding: 0px;
				border: dotted;
			}

			tr:hover{
				background-color: gray;
			}

			label{
				margin-right: 10px;
			}

			.fixed-dialog{
				  position: fixed;
				  /*top: 10px;*/
				  left: 50px;
				  bottom: 50px;
			}

			body{
				background-color: blue; /*#4286f4;*/
			}

			table{
				border:dotted;
			}

		</style>

	</head>
	<body>
		<button id="papa" width="500px">prueba</button>
		<div class="container">

      	<div class="row">

        <div class="col-lg-4">
        	<table id="listaTareas" class="table">
        		<tr>
        			<th>Id</th>
        			<th>Fecha</th>
			        <th>Descripcion</th>
			        <th>Prioridad</th>
			        <th>Estado</th>
			        <th></th>
        		</tr>

              </table>
          </div>

      </div>
      <!-- /.row -->

    </div>

    <br><br>


	<!-- formulario agregar -->
    <div class="form" style="background-color:#f47741;">
		<h3>Form Agregar</h3>
		<div class="form-group">
    		<label>Proyecto</label>
    		<input type="text" name="" id="proyecto">
    	</div>
		<div class="form-group">
    		<label>Descripción</label>
    		<input type="text" name="" id="descripcion">
    	</div>
    	<button id="botonAgregar">Agregar!</button>
    </div>


	<div id="dialogDetail"></div>

	<div id="formularioEditar">


		<div class="form-group">
			<label for="idEditar">ID</label>
			<input type="text" name="idEditar" id="idEditar" placeholder="id tarea" disabled>
		</div>

		<div class="form-group">
			<label for="fechaEditar">Fecha</label>
			<input type="text" name="fechaEditar" placeholder="Fecha" id="fechaEditar">
		</div>

		<div class="form-group">
			<label for="descripcionEditar">Descripción</label>
			<input type="text" name="descripcionEditar" placeholder="Descripción" id="descripcionEditar">
		</div>

		<div class="form-group">
			<label for="prioridadEditar">Prioridad</label>
			<input type="text" name="prioridadEditar" placeholder="Prioridad" id="prioridadEditar">
		</div>

		<div class="form-group">
			<label for="estadoEditar">Estado</label>
			<input type="text" name="estadoEditar" placeholder="Estado" id="estadoEditar">
		</div>

		<div class="form-group">
			<label for="">Proyecto</label>
			<input type="text" name="proyectoEditar" placeholder="Proyecto" id="proyectoEditar">
		</div>


		<button id="botonGuardarCambios" style="margin-top:5px; padding: 10px;">Guardar Cambios</button>

	</div>

	<div></div>


	</body>
</html>