+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/tasks/tasks.css b/tasks/tasks.css
new file mode 100644
index 0000000..a416fe1
--- /dev/null
+++ b/tasks/tasks.css
@@ -0,0 +1,209 @@
+
+/* hide the "edit" imported from mw*/
+span.mw-editsection {
+display: none;
+}
+
+/* hide the marker for image gallery imported from mw*/
+li.gallerybox::marker {
+ display: none;
+}
+
+body {
+ font-family: sans-serif;
+ color: black;
+ height: 100%
+ width: 100%;
+ display: block;
+}
+
+/* id for button that SHOULD open "Tasks of the Contingent Librarian" text in modal popup*/
+#tasksBtn {
+ display: inline-block;
+ color: black;
+ font-family: serif;
+ font-size: 1.6em;
+ padding-left: 0px;
+ padding-right: 0px;
+ margin-left: 18px;
+ margin-top: 6px;
+ background-color: white;
+ border: none;
+}
+
+/* id for button that opens "*A note to the reader" text in modal popup*/
+#noteBtn {
+ display: inline;
+ color: blue;
+ font-family: serif;
+ font-size: 1.6em;
+ padding-left: 0px;
+ padding-right: 0px;
+ margin-top: 6px;
+ background-color: white;
+ border: none;
+}
+
+/* hover state for buttons */
+#tasksBtn:hover, #noteBtn:hover {
+ background-color: yellow;
+ color: black;
+}
+
+ /* The Modal (background) */
+.modal {
+ display: none; /* Hidden by default */
+ position: fixed; /* Stay in place */
+ z-index: 1; /* Sit on top */
+ left: 0;
+ top: 0;
+ width: 80%; /* Full width */
+ height: 80%; /* Full height */
+ overflow: auto; /* Enable scroll if needed */
+ background-color: rgb(0,0,0); /* Fallback color */
+ background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
+}
+
+/* Modal Content/Box */
+.modal-content {
+ font-family: sans-serif;
+ font-size: 1.6em;
+ background-color: white;
+ margin: 10% auto; /* 10% from the top and centered */
+ padding: 18px;
+ border: 1px solid #888;
+ width: 50%; /* Could be more or less, depending on screen size */
+}
+
+/* The Close Button */
+.close {
+ color: #aaa;
+ float: right;
+ font-size: 28px;
+ font-weight: bold;
+}
+
+.close:hover,
+.close:focus {
+ color: black;
+ text-decoration: none;
+ cursor: pointer;
+}
+
+p.imgcaption {
+ position: relative;
+}
+
+a:hover {
+ background-color: yellow;
+}
+
+.snippets {
+ font-family: monospace;
+ position: absolute;
+ margin-top: 400px;
+}
+
+.reverse {
+ width: 210px;
+ height: 148px;
+ margin-left: 6px;
+ margin-top: 400px;
+ border: solid 1px blue;
+}
+
+div.container-fluid {
+ max-width: 100%;
+}
+
+.cardback {
+ width: 100%;
+ height: 100%;
+ font-family: monospace;
+}
+
+.col {
+ width: 50%;
+}
+
+/* main card image div class */
+.thumbinner {
+ border: 1px dotted blue;
+ width: 100%;
+ padding: 6px;
+ font-family: sans-serif;
+ font-size: 0.9em;
+}
+
+.thumbimage {
+ width: 100%;
+}
+
+.row {
+ display: inline-block;
+}
+
+h2 {
+ text-align: top;
+}
+
+.heading {
+ font-family: serif;
+ font-size: 1.6em;
+ margin-left: 18px;
+}
+
+iframe {
+ border: 1px solid blue;
+ width: 100%;
+ height: 563px;
+ margin: 0;
+}
+
+iframe[name="verso"] {
+ background-repeat: repeat;
+ background-image: url("./IMG/2px_grey.jpg");
+}
+
+iframe[name="recto"] {
+ border: 1px dotted blue;
+}
+
+.alert {
+ font-family: serif;
+ font-size: 1em;
+ display: inline-block;
+ margin-top: 18px;
+ margin-right: 6px;
+ padding-left: 36px;
+ padding-top: 6px;
+ background-color: white;
+ width: 40%;
+ z-index: 2;
+}
+
+.cards {
+ box-shadow: 5px 8px #888888;
+}
+
+.note {
+ display: none;
+ position: absolute;
+ background-color: white;
+ z-index: 10;
+}
+/*
+img {
+ position: absolute;
+ left: 0px;
+ top: 0px;
+ z-index: -1;
+ max-width: 100%
+}
+*/
+
+.cardbackimg {
+ width: auto;
+ height: auto;
+ z-index: -2;
+}
diff --git a/tasks/tasks.js b/tasks/tasks.js
new file mode 100644
index 0000000..e445e80
--- /dev/null
+++ b/tasks/tasks.js
@@ -0,0 +1,16 @@
+document.addEventListener("DOMContentLoaded", function () {
+
+ console.log("greetings from javascript", window.location);
+ var name = window.location.href,
+ p = name.lastIndexOf("/");
+ name = name.substring(p+1);
+ var base = name.substring(0, name.length-5);
+ if (!base.endsWith("_rvrs")) {
+ var rvrs = base + "_rvrs.html";
+ var a = document.createElement("a");
+ a.href = rvrs;
+ a.target= "recto";
+ a.innerHTML = "flipside";
+ document.body.appendChild(a);
+ }
+});