diff --git a/themes/tegakituesday.com/layouts/challenges/single.html b/themes/tegakituesday.com/layouts/challenges/single.html
index 7c41bca..21752e0 100644
--- a/themes/tegakituesday.com/layouts/challenges/single.html
+++ b/themes/tegakituesday.com/layouts/challenges/single.html
@@ -14,19 +14,22 @@
+ {{ if .Params.english }}
+
+ {{ end }}
Tegaki Tuesday #{{- $current -}}
手書きの火曜日#{{- $current -}}・
{{ if .Params.english }}
-
+
{{- range.Params.english -}}
{{- $.RenderString . -}}
{{- end -}}
+
-
{{ end }}
diff --git a/themes/tegakituesday.com/static/js/toggle.js b/themes/tegakituesday.com/static/js/toggle.js
index 932d638..a988f02 100644
--- a/themes/tegakituesday.com/static/js/toggle.js
+++ b/themes/tegakituesday.com/static/js/toggle.js
@@ -4,6 +4,7 @@ const kyujitai = [["万","萬"],["与","與"],["両","兩"],["並","竝"],["乗"
const challenge = document.getElementById("challenge");
const defaultHeight = challenge.scrollHeight + "px";
+let verticalHeight;
challenge.style.height = defaultHeight;
const vocab = document.getElementById("challenge-vocab");
@@ -58,6 +59,7 @@ directionButton.addEventListener("click", function() {
texts.forEach(text => text.classList.add("vertical"));
this.innerHTML = "↔";
challenge.style.height = challenge.scrollHeight + "px";
+ verticalHeight = challenge.style.height;
} else {
texts.forEach(text => text.classList.remove("vertical"));
this.innerHTML = "↕";
@@ -66,6 +68,22 @@ directionButton.addEventListener("click", function() {
});
directionButton.click();
+const englishButton = document.getElementById("english");
+const challengeEnglish = document.getElementById("challenge-english");
+if (englishButton) {
+ englishButton.addEventListener("click", function() {
+ if (this.innerHTML == "Show translation") {
+ challengeEnglish.style.removeProperty("display");
+ this.innerHTML = "Hide translation";
+ challenge.style.height = challenge.scrollHeight + "px";
+ } else {
+ challengeEnglish.style.display = "none";
+ this.innerHTML = "Show translation";
+ challenge.style.height = directionButton.innerHTML == "↕" ? defaultHeight : verticalHeight;
+ }
+ });
+}
+
document.getElementById("highlight").addEventListener("click", function() {
if (this.innerHTML === "漢字") {
vocab.style.display = "none";