cleanup

3 files changed, 18 insertions, 7 deletions

diff --git a/index.html b/index.html
index 973f4c1..1805be4 100644
--- a/index.html
+++ b/index.html
@@ -29,6 +29,7 @@
 				Write a line of poetry. Syllables in dark boxes should be stressed.
 			</p>
 			<div id="entry"></div>
+            <input id="kb" type="text" style="display:none;"></input>
 			<div id="btns">
 				<button id="check" type="submit">Check</button>
 				<button id="clear">Clear</button>
@@ -50,7 +51,7 @@
 					adding punctuation as desired.
 				</p>
 				<div>
-					<textarea cols="80" rows="6" id="share"></textarea>
+					<textarea rows="4" id="share"></textarea>
 				</div>
 				<button id="copy">Copy</button>
 				<hr>
diff --git a/static/script.js b/static/script.js
index 778fdd0..37c5725 100644
--- a/static/script.js
+++ b/static/script.js
@@ -150,7 +150,7 @@ function winGame(challenge) {
     winEl.style = 'display: block;'
     document.getElementById('btns').style = 'display: none;'
     document.getElementById('meter').innerText = challenge.meter
-    document.getElementById('ctx').innerHTML = challenge.ctx.replaceAll(/^(.*)/gm, '\t$1') + `\n\t<span class="byline">&mdash;<a href="${challenge.link}">${challenge.title}</a>, ${challenge.collection}, ${challenge.author}</span>`
+    document.getElementById('ctx').innerHTML = challenge.ctx.replaceAll(/^(.*)/gm, '  $1') + `\n\t<span class="byline">&mdash;<a href="${challenge.link}">${challenge.title}</a>, ${challenge.collection}, ${challenge.author}</span>`
     var date = new Date().toISOString().slice(0, 10)
     var firstguess = Object.values(guesses[0]).join(' ')
     document.getElementById('share').value = `I solved the ${date} Prosodyle at cyfraeviolae.org/prosodyle. My first guess was: "${firstguess}".`
@@ -166,6 +166,9 @@ document.addEventListener('keydown', function(e) {
     if (e.ctrlKey || e.altKey || (!"ABCDEFGHIJKLMNOPQRSTUVWXYZ".includes(e.key.toUpperCase()) && e.key != 'Backspace' && e.key != 'Enter')) {
         return;
     }
+    if (e.target.id == 'share') {
+        return;
+    }
     e.preventDefault();
 
     if (e.key == 'Enter') {
@@ -216,6 +219,7 @@ document.getElementById('copy').addEventListener('click', function(e) {
 function focus(el) {
     focused = parseInt(el.getAttribute('data-offset'))
     el.classList.add('focus')
+    document.getElementById('kb').focus()
 }
 
 function unfocus(el) {
diff --git a/static/styles.css b/static/styles.css
index 06cb18a..5bd99f1 100644
--- a/static/styles.css
+++ b/static/styles.css
@@ -38,7 +38,8 @@ a:hover {
 form {
 	border: 1px DarkSlateGrey solid;
     padding: 10px;
-    padding-left: 25px;
+    padding-left: 20px;
+    padding-right: 20px;
 }
 
 .sep {
@@ -52,18 +53,18 @@ button {
 
 .box {
 	display: inline-block;
-    width: 40px;
-    height: 40px;
+    width: 25px;
+    height: 25px;
     text-align: center;
     font-weight: bold;
-    font-size: 22px;
+    font-size: 14px;
     border: 2px lightgrey solid;
     margin-right: 0px;
     margin-left: 0px;
 	color: black;
 	background-color: white;
 	vertical-align: top;
-	line-height: 39px;
+	line-height: 25px;
 	font-family: Cantarell;
 }
 .focus {
@@ -135,6 +136,7 @@ hr {
 }
 
 .poetry {
+	font-size: 85%;
 	font-family: EBGaramond;
 }
 
@@ -142,3 +144,7 @@ hr {
 	font-style: italic;
 	font-size: 75%;
 }
+
+#share {
+	width: 90%;
+}