Skip to content

Commit

Permalink
added the body closing tag for some of the html tags, and also worked…
Browse files Browse the repository at this point in the history 
… on the general accessibility of all html files in the repo.
  • Loading branch information
@Natacha-Danbadan
Natacha-Danbadan committed Oct 24, 2022
1 parent 40ad7c0 commit a1785ee
Show file tree
Hide file tree
Showing 5 changed files with 82 additions and 61 deletions.
82 changes: 42 additions & 40 deletions examples/archive.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,51 +19,50 @@
</head>

<body style="margin:0;">

<div class="modal fade" id="welcomeModal" aria-labelledby="exampleModalLabel" tabindex="-1" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-dialog-scrollable">
<div class="modal-content bg-light">
<div class="modal-header d-block">
<div class="d-flex justify-content-between align-items-center">
<h2 class="modal-title">Welcome to MapKnitter Lite</h2>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>

<main>
<div class="modal fade" id="welcomeModal" aria-labelledby="exampleModalLabel" tabindex="-1" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-dialog-scrollable">
<div class="modal-content bg-light">
<div class="modal-header d-block">
<div class="d-flex justify-content-between align-items-center">
<h2 class="modal-title">Welcome to MapKnitter Lite</h2>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<p> <small>(while MapKnitter is offline)</small> </p>
</div>
<div class="modal-body">
<p>First, you’ll need to go to <a href="https://archive.org/" target="_blank">archive.org</a>, create an account, and then upload your images.
<a href="https://archive.org/embed/help-upload-overview" target="_blank">Watch this helpful video guide.</a>
</p>
<p>You’ll get an address that looks like this:
<a href="https://archive.org/details/texas-barnraising/" target="_blank">
https://archive.org/details/texas-barnraising/
</a>
</p>
<p>Paste it here to begin:</p>
<form id="form">
<input id="input" type="text" class="form-control" placeholder="https://archive.org/details/..." required>
<button type="submit" class="btn btn-primary mt-4 mb-5">Begin</button>
</form>
</div>
<p> <small>(while MapKnitter is offline)</small> </p>
</div>
<div class="modal-body">
<p>First, you’ll need to go to <a href="https://archive.org/" target="_blank">archive.org</a>, create an account, and then upload your images.
<a href="https://archive.org/embed/help-upload-overview" target="_blank">Watch this helpful video guide.</a>
</p>
<p>You’ll get an address that looks like this:
<a href="https://archive.org/details/texas-barnraising/" target="_blank">
https://archive.org/details/texas-barnraising/
</a>
</p>
<p>Paste it here to begin:</p>
<form id="form">
<input id="input" type="text" class="form-control" placeholder="https://archive.org/details/..." required>
<button type="submit" class="btn btn-primary mt-4 mb-5">Begin</button>
</form>
</div>
</div>
</div>
</div>

<div id="map" style="width:100%; height:100%; position:absolute; top:0;"></div>

<div class="offcanvas offcanvas-end" data-bs-backdrop="false" data-bs-keyboard="false" tabindex="1" id="offcanvasRight" aria-labelledby="offcanvasRightLabel">
<div class="offcanvas-header">
<h3 id="offcanvasRightLabel">Images</h3>
<button type="button" class="btn btn-primary d-sm-none" data-bs-dismiss="offcanvas" aria-label="Close">View Map</button>
</div>
<hr>
<div class="offcanvas-body">
<p id="response" class="mb-5">No link = No images...</p>
<div id="imgContainer"></div>
<div id="map" style="width:100%; height:100%; position:absolute; top:0;"></div>
<div class="offcanvas offcanvas-end" data-bs-backdrop="false" data-bs-keyboard="false" tabindex="1" id="offcanvasRight" aria-labelledby="offcanvasRightLabel">
<div class="offcanvas-header">
<h3 id="offcanvasRightLabel">Images</h3>
<button type="button" class="btn btn-primary d-sm-none" data-bs-dismiss="offcanvas" aria-label="Close">View Map</button>
</div>
<hr>
<div class="offcanvas-body">
<p id="response" class="mb-5">No link = No images...</p>
<div id="imgContainer"></div>
</div>
</div>
</div>
</body>

</main>

<script>
let map;
let welcomeModal = document.getElementById('welcomeModal');
Expand Down Expand Up @@ -142,4 +141,7 @@ <h3 id="offcanvasRightLabel">Images</h3>
}
});
</script>

</body>
</html>

15 changes: 10 additions & 5 deletions examples/export.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,13 +14,16 @@
<script src="../dist/vendor.js"></script>
<script src="../dist/leaflet.distortableimage.js"></script>
</head>
<body style="margin:0;">

<form id="test_form" >
<input type="file" class="ldi" id="inputimage" accept="image/*">
</form>
<body style="margin:0;">

<div id="map" style="width:100%; height:100%; position:absolute; top:0;"></div>
<main>
<form id="test_form" >
<input type="file" class="ldi" id="inputimage" accept="image/*">
</form>

<div id="map" style="width:100%; height:100%; position:absolute; top:0;"></div>
</main>

<script>
let map;
Expand Down Expand Up @@ -144,4 +147,6 @@
});
})();
</script>

</body>
</html>
17 changes: 11 additions & 6 deletions examples/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,13 +14,16 @@
<script src="../dist/vendor.js"></script>
<script src="../dist/leaflet.distortableimage.js"></script>
</head>
<body style="margin:0;">
<form id="test_form">
<input type="file" class="ldi" id="inputimage" accept="image/*" />
</form>

<div id="map" style="width:100%; height:100%; position:absolute; top:0;"></div>
</body>
<body style="margin:0;">
<main>
<form id="test_form">
<input type="file" class="ldi" id="inputimage" accept="image/*" />
</form>

<div id="map" style="width:100%; height:100%; position:absolute; top:0;"></div>
</main>

<script>
let map;

Expand All @@ -36,4 +39,6 @@
});
})();
</script>

</body>
</html>
14 changes: 9 additions & 5 deletions examples/listeners.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,11 +16,13 @@
</head>
<body style="margin:0;">

<form id="test_form" >
<input type="file" class="ldi" id="inputimage" accept="image/*">
</form>

<div id="map" style="width:100%; height:100%; position:absolute; top:0;"></div>
<main>
<form id="test_form" >
<input type="file" class="ldi" id="inputimage" accept="image/*">
</form>

<div id="map" style="width:100%; height:100%; position:absolute; top:0;"></div>
</main>

<script>
var map;
Expand All @@ -42,4 +44,6 @@
});
})();
</script>

</body>
</html>
15 changes: 10 additions & 5 deletions examples/select.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,13 +14,16 @@
<script src="../dist/vendor.js"></script>
<script src="../dist/leaflet.distortableimage.js"></script>
</head>
<body style="margin:0;">

<form id="test_form" >
<input type="file" class="ldi" id="inputimage" accept="image/*">
</form>
<body style="margin:0;">

<div id="map" style="width:100%; height:100%; position:absolute; top:0;"></div>
<main>
<form id="test_form" >
<input type="file" class="ldi" id="inputimage" accept="image/*">
</form>

<div id="map" style="width:100%; height:100%; position:absolute; top:0;"></div>
</main>

<script>
let map;
Expand Down Expand Up @@ -82,4 +85,6 @@
});
})();
</script>

</body>
</html>

0 comments on commit a1785ee

Please sign in to comment.