From: Benjamin Auder <benjamin.auder@somewhere>
Date: Tue, 21 Apr 2020 13:16:24 +0000 (+0200)
Subject: Lighter color for diagonal lines on board
X-Git-Url: https://git.auder.net/img/css/current/pieces/doc/%7B%7B?a=commitdiff_plain;h=8efb985ef0f123dadc47934734e70795a960ec29;p=vchess.git

Lighter color for diagonal lines on board
---

diff --git a/client/src/components/Board.vue b/client/src/components/Board.vue
index 7f2e43e4..88a34198 100644
--- a/client/src/components/Board.vue
+++ b/client/src/components/Board.vue
@@ -568,7 +568,11 @@ export default {
             this.coordsToXY(line[1], bPos.top, bPos.left, squareWidth);
           let path =
             document.createElementNS("http://www.w3.org/2000/svg", "path");
-          path.classList.add("svg-line");
+          if (line[0][0] == line[1][0] || line[0][1] == line[1][1])
+            path.classList.add("svg-line");
+          else
+            // "Diagonals" are drawn with a lighter color (TODO: generalize)
+            path.classList.add("svg-diag");
           path.setAttribute(
             "d",
             "M" + lStart.x + "," + lStart.y + " " +
@@ -844,6 +848,9 @@ export default {
 .svg-line
   stroke: black
 
+.svg-diag
+  stroke: grey
+
 .arrow-head
   fill: #5f0e78
 </style>