<!DOCTYPE html>
<html lang="pt-br">
<head>
<!-- Importando o css do bootstrap -->
<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="stylesheet" href="css/style2.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.9/css/all.css" integrity="sha384-5SOiIsAziJl6AWe0HWRKTXlfcSHKmYV4RBF18PPJ173Kzn7jzMyFuTtk8JA7QQG1" crossorigin="anonymous">
<!-- Bootstrap CSS -->
<style>
table {
width: 84%;
position: absolute;
right: 10px;
}
.table-bordered {
width: 80%;
position: absolute;
right: 25px;
}
table,
th,
td {
border: 1px solid black;
border-radius: 10px;
}
th,
td {
padding: 20px;
text-align: left;
}
table#t01 tr:nth-child(even) {
background-color: #eee;
}
table#t01 tr:nth-child(odd) {
background-color: #fff;
}
table#t01 th {
background-color: black;
color: white;
}
</style>
</head>
<body>
<span id="center11"><h1 style="color:pink;">Ingredientes</h1></span>
<div class="menu">
<ul>
<li style="color:aliceblue"><i class="fas fa-home" aria-ridden="true" id="opa"></i>
<a href="home.html">
<h3 style="color:aliceblue">Home</h3>
</a>
<br>
</li>
<li style="color:aliceblue"><i class="fas fa-user" aria-ridden="true" id="opa"></i>
<a href="c_funcionario.html">
<h3 style="color:aliceblue">Funcionarios</h3>
</a>
<br>
</li>
<li style="color:aliceblue"><i class="fas fa-address-book" aria-ridden="true" id="opa"></i>
<a href="c_cliente.html">
<h3 style="color:aliceblue">Clientes</h3>
</a>
<br>
</li>
<li style="color:aliceblue"><i class="fas fa-birthday-cake" aria-ridden="true" id="opa"></i>
<a href="c_produtos.html">
<h3 style="color:aliceblue">Produtos</h3>
</a>
<ul>
<li><a href="c_ingredientes.html">Ingredientes</a></li>
<li><a href="estoque.html">Consulta</a></li>
</ul>
<li style="color:aliceblue"><i class="fas fa-dolly" aria-ridden="true" id="opa"></i>
<a href="c_encomenda.html">
<h3 style="color:aliceblue">Encomenda</h3>
</a>
</li>
</li>
</ul>
</div>
<div id="table">
<div class="row ">
<div class="col-md-12">
<div class="container ">
<div class="table-responsive">
<table class="table table-striped table-bordered table-hover">
<thead>
<tr>
<th>ID</th>
<th>Ingredientes</th>
<th>Código Ingredientes</th>
<th class="actions">Ações</th>
</tr>
</thead>
<tbody>
<tr>
<th>1</th>
<td>Conteúdo</td>
<td>Conteúdo</td>
<td class="actions">
<a class="btn btn-success btn-xs" href="view.html">Visualizar</a>
<a class="btn btn-warning btn-xs" href="edit.html">Editar</a>
<a class="btn btn-danger btn-xs" href="#" data-toggle="modal" data-target="#delete-modal">Excluir</a>
</td>
</tr>
<tr>
<th>2</th>
<td>Conteúdo</td>
<td>Conteúdo</td>
<td class="actions">
<a class="btn btn-success btn-xs" href="view.html">Visualizar</a>
<a class="btn btn-warning btn-xs" href="edit.html">Editar</a>
<a class="btn btn-danger btn-xs" href="#" data-toggle="modal" data-target="#delete-modal">Excluir</a>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
<div class="container">
</div>
<center><button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#MyModal">Cadastrar</button></center>
<div id="MyModal" class="modal fade" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<div class="container">
<div class="row centered-form">
<div class="col-xs-16 col-sm-6 col-md-6 col-sm-offset-4 col-md-offset-1">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Registro de Ingredientes</h3>
</div>
<div class="panel-body">
<form role="form">
<div class="row">
<div class="col-xs-6 col-sm-6 col-md-6">
<div class="form-group">
<input type="text" name="cod_ingrediente" id="cod_ingrediente" class="form-control input-sm" placeholder="Codigo do Ingrediente">
</div>
</div>
<div class="col-xs-6 col-sm-6 col-md-6">
<div class="form-group">
<input type="text" name="nome_ingrediente" id="nome_ingrediente" class="form-control input-sm" placeholder="Nome do Ingrediente">
</div>
</div>
</div>
<div class="form-group">
<input type="email" name="email" id="email" class="form-control input-sm" placeholder="Email Address">
</div>
<input type="submit" value="Register" class="btn btn-info btn-block">
</form>
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
</body>
<!-- Importando o jQuery -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><!--Importandoojsdobootstrap--><scriptsrc="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<script src="js/java.js" type="text/javascript"></script>
</html>