add class to board instead of cells

diff --git a/public/trivabble.css b/public/trivabble.css
index ce40519be8074f77e97735400fcd8de121f7962c..b36d1304d7a9d206e7c1c163f8ddf9d754fc2fe3 100644 (file)
--- a/public/trivabble.css
+++ b/public/trivabble.css
@@ -125,19 +125,19 @@ html, #board, [draggable], .tile {
     overflow:hidden;
 }
 
-.special-cell-label-clip {
+.special-cell-label-clip .special-cell-label {
     text-overflow:clip;
 }
 
-.special-cell-label-dots {
+.special-cell-label-dots .special-cell-label {
     text-overflow:ellipsis;
 }
 
-.special-cell-label-none {
+.special-cell-label-none .special-cell-label {
     visibility:hidden;
 }
 
-.special-cell-label-short {
+.special-cell-label-short .special-cell-label {
     display:inline;
 }
 

diff --git a/public/trivabble.js b/public/trivabble.js
index 7ce7c1c2c6d74516f697cb474e2ca6a47f3d4aae..6c843b7e168c4dd499e1b533c1c118b27651c930 100644 (file)
--- a/public/trivabble.js
+++ b/public/trivabble.js
@@ -2317,14 +2317,14 @@
         setSetting("CellCaptions", mode);
         document.getElementById("cell-captions").value = mode;
 
-        for (const cells of [].slice.call(document.getElementsByClassName("special-cell-label"))) {
-            cells.classList.remove("special-cell-label-clip");
-            cells.classList.remove("special-cell-label-dots");
-            cells.classList.remove("special-cell-label-none");
-            cells.classList.remove("special-cell-label-short");
+        board.classList.remove("special-cell-label-clip");
+        board.classList.remove("special-cell-label-dots");
+        board.classList.remove("special-cell-label-none");
+        board.classList.remove("special-cell-label-short");
 
-            cells.classList.add("special-cell-label-" + mode);
+        board.classList.add("special-cell-label-" + mode);
 
+        for (const cells of [].slice.call(document.getElementsByClassName("special-cell-label"))) {
             cells.textContent = (mode === "short") ? cells.shortText : cells.longText;
         }
     }