Updated message with close + hyperlink

index.html

@@ -50,8 +50,6 @@ <h1>Sorry!</h1>
     <h4>MicrobeTrace requires CSS to run, but it looks like the appropriate CSS files weren't loaded for some reason.
       Please try <a href="#" onclick="location.reload();">Refreshing the Page</a></h4>
   </div>
-  <span id="development-version" style="margin-left: 0px; position: absolute; z-index: 3000; bottom: 100px; color: #0037ff; font-weight: bolder; font-size: x-small;"> Non Production environment. Coming soon to this space- MicrobeTrace 1.0, the Angular version!
-    To access the complete production version, visit www.microbetrace.cdc.gov </span></li> 
 
   <nav class="navbar fixed-top navbar-expand-xl navbar-light bg-light">
     <ul class="nav mr-auto">
@@ -701,6 +699,10 @@ <h5 class="modal-title" id="urlModalLabel">Auspice JSON URL</h5>
   <script src="src/index.js" async charset="utf-8"></script>
   <script src="dist/bundle.secondary.js" defer charset="utf-8"></script>
   <link rel="stylesheet" type="text/css" href="dist/bundle.secondary.css">
+
+  <span id="development-version" class="dev-span"> Non Production environment. Coming soon to this space- MicrobeTrace 1.0, the Angular version!
+    To access the complete production version, visit <a class="mt-url" href="https://microbetrace.cdc.gov/MicrobeTrace/" target="_blank">www.microbetrace.cdc.gov</a>
+    <button class="close-btn">X</button></span>
 </body>
 
 </html>

src/index.js

@@ -11,6 +11,11 @@ $(function() {
     $("#ie-warning").remove();
   }
 
+
+  $(".close-btn").on("click", function() {
+    $("#development-version").hide();
+  });
+
   // Before anything else gets done, ask the user to accept the legal agreement
   localforage.getItem("licenseAccepted").then(accepted => {
     if (!accepted) {
@@ -133,6 +138,8 @@ $(function() {
     });
   });
 
+
+
   $("#save-data").on("click", () => {
     let zip = new JSZip();
     let name = $("#save-file-name").val();

src/main.css

@@ -21,6 +21,28 @@ body {
   user-select: none; /* Non-prefixed version, currently
                                 supported by Chrome and Opera */
 }
+
+.dev-span {
+  margin-left: 0px;
+  position: absolute;
+  z-index: 3000;
+  bottom: 100px;
+  font-weight: bolder;
+  font-size: x-small;
+}
+
+.close-btn {
+  background: transparent;
+  border: none;
+  cursor: pointer;
+  font-weight: bold;
+  font-size: 13px;
+}
+
+.mt-url {
+  color: #007bff !important;
+}
+
 .selectable,
 [type="text"] {
   -webkit-touch-callout: auto; /* iOS Safari */