Michael/chesspreview
1
0 Fork 0
mirror of https://github.com/R0m1k3/chesspreview.git synced 2026-10-14 18:56:32 +02:00
Code Issues Packages Projects Releases Wiki Activity

Improve white piece contrast

Browse Source
This commit is contained in:
Michael committed 2026-07-20 16:42:39 +02:00
1 parent 638d19fe6f
commit c944e8fda5
2 files changed
+2 -2
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

src/main.jsx
+1 -1
View File
@@ -4,7 +4,7 @@ import { Chess } from 'chess.js';
import { Brain, ChevronRight, CircleHelp, FlipVertical2, Lightbulb, LoaderCircle, RotateCcw, Settings, Sparkles, X } from 'lucide-react';
import './styles.css';
const PIECES = { p: '♟', n: '♞', b: '♝', r: '♜', q: '♛', k: '♚', P: '♙', N: '♘', B: '♗', R: '♖', Q: '♕', K: '♔' };
const PIECES = { p: '♟', n: '♞', b: '♝', r: '♜', q: '♛', k: '♚', P: '♟', N: '♞', B: '♝', R: '♜', Q: '♛', K: '♚' };
const FILES = ['a','b','c','d','e','f','g','h'];
const RANKS = ['8','7','6','5','4','3','2','1'];
const START_FEN = new Chess().fen();
src/styles.css
+1 -1
View File
@@ -26,7 +26,7 @@ h1,h2 { font-family:'Playfair Display',serif;margin:4px 0 0;font-weight:600; } h
.board { display:grid;grid-template-columns:repeat(8,minmax(0,1fr));grid-template-rows:repeat(8,minmax(0,1fr));position:relative;width:100%;height:100%;border:1px solid #10110f; }
.square { border:0; padding:0; min-width:0;min-height:0;position:relative; display:grid;place-items:center;cursor:pointer; overflow:hidden; }.square.light{background:#d8d0bc}.square.dark{background:#67725e}.square:hover:after{content:'';position:absolute;inset:0;background:rgba(255,255,255,.11)}
.square.last:before { content:'';position:absolute;inset:0;background:rgba(214,169,67,.34); }.square.selected { box-shadow:inset 0 0 0 4px rgba(244,190,70,.78); }.square.best { box-shadow:inset 0 0 0 3px rgba(199,109,69,.65); }
.piece { font-family:'Times New Roman',serif;font-size:clamp(32px,5.8vw,74px);line-height:1;position:relative;z-index:2;cursor:grab;user-select:none;filter:drop-shadow(0 3px 1px rgba(0,0,0,.22));transition:transform .12s; }.piece:hover{transform:translateY(-2px)}.white-piece{color:#f6f0e2;text-shadow:-1px -1px 0 #191b17,1px -1px 0 #191b17,-1px 1px 0 #191b17,1px 1px 0 #191b17}.black-piece{color:#171914;text-shadow:0 1px 0 rgba(255,255,255,.17)}
.piece { font-family:'Times New Roman',serif;font-size:clamp(32px,5.8vw,74px);line-height:1;position:relative;z-index:2;cursor:grab;user-select:none;filter:drop-shadow(0 3px 1px rgba(0,0,0,.22));transition:transform .12s; }.piece:hover{transform:translateY(-2px)}.white-piece{color:#f8f0dd;-webkit-text-stroke:1.4px #242720;text-shadow:0 2px 0 #242720,0 4px 5px rgba(10,12,9,.32);filter:drop-shadow(0 2px 1px rgba(0,0,0,.34))}.black-piece{color:#171914;text-shadow:0 1px 0 rgba(255,255,255,.17)}
.target { width:18%;height:18%;border-radius:50%;background:rgba(18,23,17,.35);position:absolute;z-index:3;pointer-events:none; }.target.capture { width:76%;height:76%;background:transparent;border:5px solid rgba(18,23,17,.35); }
.rank-label,.file-label { position:absolute;font:600 8px 'DM Mono',monospace;z-index:4;opacity:.72; }.rank-label{top:3px;left:4px}.file-label{bottom:2px;right:4px}.dark .rank-label,.dark .file-label{color:var(--cream)}
.arrow { position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:5;overflow:visible; }.arrow line { stroke:#d66f43;stroke-width:1.7;stroke-linecap:round;opacity:.85; }.arrow marker path{fill:#d66f43}