<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="format-detection" content="telephone=no">
<meta name="msapplication-tap-highlight" content="no">
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">
<link rel="stylesheet" type="text/css" href="css/index.css">
<link rel="stylesheet" type="text/css" href="css/ptd_estilo.css">
<link rel="stylesheet" href="css/bootstrap-theme.min.css">
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="css/ptd_estilo.css">
<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">
<title>Pedido</title>
</head>
<body>
<div id="telaUsuarios" class="page">
<div class="navbar1">
<button class="btnVoltar"></button>
<span>Pedido</span>
<button class="btnComentario"></button>
<p>
<div class="container-fluid">
<div class="row top">
<div class="col-sm-12">
<div class="jumbotron">
<div class="row">
<div class="col-sm-12 col-md-12">
<div class="row">
<div class="col-md-6">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Bebidas</h3>
</div>
<div class="panel-body">
<div class="row">
<div class="col-md-12">
<a href="#" class="list-group-item">Coca Cola<input type="checkbox" class="pull-right"></a>
</div>
</div>
<div class="row">
<div class="col-md-12">
<a href="#" class="list-group-item">Água<input type="checkbox" class="pull-right"></a>
</div>
</div>
<div class="row">
<div class="col-md-12">
<a href="#" class="list-group-item">Cerveja<input type="checkbox" class="pull-right"></a>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Pizza</h3>
</div>
<div class="panel-body">
<div class="row">
<div class="col-md-12">
<a href="#" class="list-group-item">Frango<input type="checkbox" class="pull-right"></a>
</div>
</div>
<div class="row">
<div class="col-md-12">
<a href="#" class="list-group-item">Mussarela<input type="checkbox" class="pull-right"></a>
</div>
</div>
<div class="row">
<div class="col-md-12">
<a href="#" class="list-group-item">Calabreza<input type="checkbox" class="pull-right"></a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Salgados</h3>
</div>
<div class="panel-body">
<div class="row">
<div class="col-md-12">
<a href="#" class="list-group-item">Coxinha<input type="checkbox" class="pull-right"></a>
</div>
</div>
<div class="row">
<div class="col-md-12">
<a href="#" class="list-group-item">Crossaint<input type="checkbox" class="pull-right"></a>
</div>
</div>
<div class="row">
<div class="col-md-12">
<a href="#" class="list-group-item">Hanburgão<input type="checkbox" class="pull-right"></a>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Doces</h3>
</div>
<div class="panel-body">
<div class="row">
<div class="col-md-12">
<a href="#" class="list-group-item">Cocada<input type="checkbox" class="pull-right"></a>
</div>
</div>
<div class="row">
<div class="col-md-12">
<a href="#" class="list-group-item">Sonho<input type="checkbox" class="pull-right"></a>
</div>
</div>
<div class="row">
<div class="col-md-12">
<a href="#" class="list-group-item">Brigadeiro<input type="checkbox" class="pull-right"></a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6">
</div>
<div class="col-md-6"></div>
</div>
</div>
</div>
<a href="javascript:selecionar_todo()">Marcar todos</a> |
<a href="javascript:deselecionar_todo()">Marcar nenhum</a>
<div class="bc-bot">
<button type="submit" class="btn btn-info">Fechar Pedido</button>
<button type="reset" class="btn btn-danger">Juntar Mesas</button>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
<script type="text/javascript" src=""></script>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="js/index.js"></script>
<script type="text/javascript" src="js/functions.js"></script>
<script type="text/javascript" src="js/botao.js"></script>
</html>Você vai precisar de uma linguagem backend com acesso a uma API, ou então essas API SaaS, como por exemplo o Firebase do Google ou algo assim. Só com javascript é possível, usando Node.JS, mas vai precisar esccrever o backend.