From a55f0890cee2f1c3d8a84e53db1f644459cff69e Mon Sep 17 00:00:00 2001
From: sepia <soerxpso@gmail.com>
Date: Wed, 23 Jul 2025 21:07:07 -0500
Subject: [PATCH] Add last move highlight

---
 public/style.css           | 11 +++++++----
 src/view/board-renderer.ts |  6 +++++-
 2 files changed, 12 insertions(+), 5 deletions(-)

diff --git a/public/style.css b/public/style.css
index b4d8862..69d964b 100644
--- a/public/style.css
+++ b/public/style.css
@@ -168,6 +168,13 @@ body {
   left: 12px;
 }
 
+.last-move.stone-white-heart::after,
+.last-move.stone-black-heart::after,
+.last-move.stone-white-heart::before,
+.last-move.stone-black-heart::before {
+  border: 2px solid var(--color-info) !important;
+}
+
 .stone-black-heart::after,
 .stone-white-heart::after {
   left: 0;
@@ -208,10 +215,6 @@ body {
   padding: 2px;
 }
 
-.last-move {
-  box-shadow: 0 0 5px 3px var(--color-warning-light);
-}
-
 #game-link-container {
   position: relative;
   display: flex;
diff --git a/src/view/board-renderer.ts b/src/view/board-renderer.ts
index c473dd4..22ca59d 100644
--- a/src/view/board-renderer.ts
+++ b/src/view/board-renderer.ts
@@ -4,6 +4,9 @@ export function renderGameBoardHtml(
   game: GomokuGame,
   isPlayerToPlay: boolean,
 ): string {
+  // Check the last move, so that the stone can be highlighted
+  const lastMove = game.history[game.history.length - 1];
+      
   let boardHtml = '<div id="game-board" class="game-board-grid">';
   for (let row = 0; row < game.board.length; row++) {
     for (let col = 0; col < game.board[row].length; col++) {
@@ -13,7 +16,8 @@ export function renderGameBoardHtml(
       if (stone) {
         const colorClass =
           stone === 'black' ? 'stone-black-heart' : 'stone-white-heart';
-        stoneHtml = `<div class="${colorClass}"></div>`;
+        const lastMoveClass = col == lastMove.col && row == lastMove.row ? 'last-move' : '';
+        stoneHtml = `<div class="${colorClass} ${lastMoveClass}"></div>`;
       }
 
       // Calculate top and left for absolute positioning, offset by half the intersection div size