NowChess/NowChess-Frontend
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: size pieces and fen and pgn importer

Browse Source
This commit is contained in:
shahdlala66
2026-04-17 23:53:42 +02:00
parent c60d00f9d2
commit d89c7e8c3f
4 changed files with 158 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/pages/game/game.component.html
+43 -15
View File
@@ -9,22 +9,50 @@
@if (loading) {
<p>Loading game state...</p>
} @else if (state) {
<section class="top-section">
<form class="move-form" (ngSubmit)="submitMove()">
<label for="uciMove">Play move (UCI)</label>
<input id="uciMove" name="uciMove" [(ngModel)]="moveInput" placeholder="e2e4" />
<button type="submit">Send Move</button>
</form>
<p class="board-hint">Click your piece to highlight legal targets.</p>
</section>
<section class="content-layout">
<aside class="import-card fen-card">
<label for="fenImport">Import FEN</label>
<textarea
id="fenImport"
name="fenImport"
[(ngModel)]="fenInput"
rows="4"
placeholder="rnbqkbnr/pppppppp/8/8/8/8/PPPPPPPP/RNBQKBNR w KQkq - 0 1"
></textarea>
<button type="button" (click)="importFen()">Load FEN</button>
</aside>
<section class="board-section">
<app-chess-board
[fen]="state.fen"
[selectedSquare]="selectedSquare"
[highlightedSquares]="highlightedSquares"
(squareSelected)="onBoardSquareSelected($event)"
/>
<section class="center-column">
<section class="top-section">
<form class="move-form" (ngSubmit)="submitMove()">
<label for="uciMove">Play move (UCI)</label>
<input id="uciMove" name="uciMove" [(ngModel)]="moveInput" placeholder="e2e4" />
<button type="submit">Send Move</button>
</form>
<p class="board-hint">Click your piece to highlight legal targets.</p>
</section>
<section class="board-section">
<app-chess-board
[fen]="state.fen"
[selectedSquare]="selectedSquare"
[highlightedSquares]="highlightedSquares"
(squareSelected)="onBoardSquareSelected($event)"
/>
</section>
</section>
<aside class="import-card pgn-card">
<label for="pgnImport">Import PGN</label>
<textarea
id="pgnImport"
name="pgnImport"
[(ngModel)]="pgnInput"
rows="4"
placeholder="1. e4 e5 2. Nf3 Nc6 *"
></textarea>
<button type="button" (click)="importPgn()">Load PGN</button>
</aside>
</section>
}