@mideind/netskrafl-react 3.2.9 → 3.2.11

package/dist/esm/css/netskrafl.css

@@ -501,7 +501,7 @@ div.netskrafl-container {
     /* Selection and player identity colors */
     --option-selected: var(--color-gatadagsinsPalette-200);
     --human-color: var(--color-gatadagsinsPalette-300);
-    --autoplayer-color: var(--color-samheitiPalette-400);
+    --autoplayer-color: var(--color-samheitiPalette-200);
     --toggler-selected: var(--color-primary-400);
     --header-green: var(--color-primary-500);
 
@@ -669,7 +669,7 @@ div.netskrafl-container.legacy-colors {
     --total-margin: 2px;
     --total-human-background: #b5bdc4;
     --total-autoplayer-background: #b5bdc4;
-    --autoplayer-highlight-color: black;
+    --autoplayer-highlight-color: white;
     --racktile-background: var(--human-color);
 
     /* Button backgrounds for classic scheme - white text on colored background */
@@ -1811,9 +1811,19 @@ div.netskrafl-tile.dragging.no-drop {
     border-color: #c07359; /* Matches default --cancel-button */
 }
 
+[data-theme="dark"] div.netskrafl-tile.dragging {
+    color: oklch(86% 0.004 155.258); 
+    background-color: oklch(24% 0.004 155.258); 
+}
+
+[data-theme="dark"] div.netskrafl-tile.dragging.no-drop {
+    border-color: oklch(58% 0.13 25);
+}
+
 div.netskrafl-tile.dragging.legacy-colors {
     /* Legacy color scheme: hardcode values since CSS variables are out of
     scope when the tile is a child of the document body during dragging */
+    color: black;
     background-color: #fcce43; /* Matches legacy --rack-tile-background */
     border-color: #47ba96; /* Matches legacy --ok-button */
 }
@@ -3798,11 +3808,6 @@ div.netskrafl-tile.dragging div.letterscore {
     vertical-align: top;
 }
 
-.letterscore,
-.netskrafl-container .tileletter {
-    color: var(--text-color);
-}
-
 /* Paragraphs of help text that should be centered on screens that are wide enough */
 
 .netskrafl-container p.help-center {
@@ -3816,27 +3821,27 @@ div.netskrafl-racktile {
 
 @keyframes selBlink {
     0% {
-        color: white;
+        /* color: var(--container-bg-color); */
         background-color: var(--cancel-button);
         border-color: var(--cancel-button);
     }
     45% {
-        color: white;
+        /* color: var(--container-bg-color); */
         background-color: var(--cancel-button);
         border-color: var(--cancel-button);
     }
     50% {
-        color: black;
-        background-color: white;
-        border-color: white;
+        /* color: var(--text-color); */
+        background-color: var(--container-bg-color);
+        border-color: var(--container-bg-color);
     }
     95% {
-        color: black;
-        background-color: white;
-        border-color: white;
+        /* color: var(--text-color); */
+        background-color: var(--container-bg-color);
+        border-color: var(--container-bg-color);
     }
     100% {
-        color: white;
+        /* color: var(--container-bg-color); */
         background-color: var(--cancel-button);
         border-color: var(--cancel-button);
     }
@@ -6940,6 +6945,7 @@ div.netskrafl-container input[type="checkbox"] {
         height: 34px;
     }
     div.netskrafl-tile {
+        color: var(--text-color);
         font-size: 24px;
         line-height: 25px;
         height: 28px;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mideind/netskrafl-react",
-  "version": "3.2.9",
+  "version": "3.2.11",
   "description": "React UI for Netskrafl",
   "repository": {
     "type": "git",