First release of how I changed the challenge.

This commit is contained in:
2019-10-01 13:54:35 -05:00
parent ed0d1b7d57
commit 82c0e30af4
6 changed files with 465 additions and 51 deletions

View File

@@ -1,55 +1,58 @@
<!DOCTYPE html>
<html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
<title>RX_API_Two</title>
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="assets/css/styles.css">
<script src="assets/js/system.js"></script>
</head>
<body>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
<title>RX_API_Two</title>
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="assets/css/styles.css">
</head>
<body>
<!-- Start: 2 Rows 1+3 Columns -->
<div></div>
<!-- End: 2 Rows 1+3 Columns -->
<!-- Start: 2 Rows 1+1 Columns -->
<div>
<div class="container">
<div class="row">
<div class="col-md-12" style="background-color: #bca59e;">
<h1 class="text-center">RX API Two</h1>
</div>
</div>
<div class="row">
<div class="col-md-12 text-center align-self-center"><strong>Please enter your address to find the closest pharmacy near you.</strong></div>
</div>
</div>
</div>
<!-- End: 2 Rows 1+1 Columns -->
<!-- Start: 2 Rows 1+1 Columns -->
<div>
<div class="container">
<div class="row">
<div class="col-md-12 text-center align-self-center m-auto"><input class="form-control-lg" type="text" maxlength="255" required="" placeholder="Type Address Here" autofocus="" style="width: 300px;"></div>
</div>
<div class="row">
<div class="col-md-12 text-center align-self-center"><button class="btn btn-primary" type="button">Find Closest</button></div>
</div>
</div>
</div>
<!-- End: 2 Rows 1+1 Columns -->
<!-- Start: 1 Row 1 Column -->
<div>
<div class="container">
<div class="row">
<div class="col-md-12"></div>
</div>
</div>
</div>
<!-- End: 1 Row 1 Column -->
<script src="assets/js/jquery.min.js"></script>
<script src="assets/bootstrap/js/bootstrap.min.js"></script>
</body>
<div class="container">
<div><p>&nbsp;</p></div>
<div class="row">
<div class="col-md-12" style="background-color: #bca59e;">
<h1 class="text-center">RX API Two</h1>
</div>
</div>
<div><p>&nbsp;</p></div>
<div class="row">
<div class="col-md-12 text-center align-self-center"><strong>Enter your address to find the closest pharmacy near you.</strong></div>
</div>
</div>
<div class="container">
<div><p>&nbsp;</p></div>
<div id="alertBox" class="row collapse hide">
<div class="col-md-12 text-center align-self-center">
<div class="alert alert-warning" role="alert">
<span><strong>Alert</strong> text.</span>
</div>
</div>
<div><p>&nbsp;</p></div>
</div>
<div class="row">
<div class="col-md-12 text-center align-self-center m-auto"><input id="txtAddress" class="form-control-lg" type="text" maxlength="255" required="" placeholder="Type Address Here" autofocus="" style="width: 300px;"></div>
</div>
<div><p>&nbsp;</p></div>
<div class="row">
<div class="col-md-12 text-center align-self-center"><button id="btnFind" class="btn btn-primary" type="button" onClick="btnFind()">Find Closest</button></div>
</div>
</div>
<div class="container">
<div><p>&nbsp;</p></div>
<div id="spinnerBox" class="row collapse hide">
<div class="col-md-12 text-center align-self-center">
<span class="spinner-border spinner-border-lg" role="status"></span>
</div>
</div>
<div id="txtOutput" class="row collapse hide" style="background-color: beige;">
<div class="col-md-12"></div>
</div>
</div>
<script src="assets/js/jquery.min.js"></script>
<script src="assets/bootstrap/js/bootstrap.min.js"></script>
</body>
</html>