From 671886781edc4f48c4e9ca25494677c3a928538b Mon Sep 17 00:00:00 2001 From: shahdlala66 Date: Sun, 26 Apr 2026 13:34:55 +0200 Subject: [PATCH] feat: new boared design --- angular.json | 18 +- assets/ChessAssets/b_Bishop.png | Bin 0 -> 2606 bytes assets/ChessAssets/b_King.png | Bin 0 -> 2084 bytes assets/ChessAssets/b_Knight.png | Bin 0 -> 2260 bytes assets/ChessAssets/b_Pawn.png | Bin 0 -> 2268 bytes assets/ChessAssets/b_Queen.png | Bin 0 -> 2538 bytes assets/ChessAssets/b_Rook.png | Bin 0 -> 1611 bytes assets/ChessAssets/w_Bishop.png | Bin 0 -> 2747 bytes assets/ChessAssets/w_King.png | Bin 0 -> 2088 bytes assets/ChessAssets/w_Knight.png | Bin 0 -> 2289 bytes assets/ChessAssets/w_Pawn.png | Bin 0 -> 2390 bytes assets/ChessAssets/w_Queen.png | Bin 0 -> 2575 bytes assets/ChessAssets/w_Rook.png | Bin 0 -> 1689 bytes .../arabian-chess}/license.txt | 0 .../arabian-chess}/plane.png | Bin .../arabian-chess}/player-one.gif | Bin .../arabian-chess}/player-two.gif | Bin .../arabian-chess}/raf.gif | Bin .../arabian-chess}/ref/cover.png | Bin .../arabian-chess}/ref/full_art.png | Bin .../arabian-chess}/ref/logo.png | Bin .../arabian-chess}/sheets/board.png | Bin .../arabian-chess}/sheets/board_centered.png | Bin .../sheets/board_without_bottom.png | Bin .../arabian-chess}/sheets/nums & letters.png | Bin .../arabian-chess}/sheets/pieces.png | Bin .../sprites/board/board_bottom.png | Bin .../sprites/board/board_square_black.png | Bin .../sprites/board/board_square_white.png | Bin .../sprites/nums & letters/letter_a.png | Bin .../sprites/nums & letters/letter_b.png | Bin .../sprites/nums & letters/letter_c.png | Bin .../sprites/nums & letters/letter_d.png | Bin .../sprites/nums & letters/letter_e.png | Bin .../sprites/nums & letters/letter_f.png | Bin .../sprites/nums & letters/letter_g.png | Bin .../sprites/nums & letters/letter_h.png | Bin .../sprites/nums & letters/num_0.png | Bin .../sprites/nums & letters/num_1.png | Bin .../sprites/nums & letters/num_2.png | Bin .../sprites/nums & letters/num_3.png | Bin .../sprites/nums & letters/num_4.png | Bin .../sprites/nums & letters/num_5.png | Bin .../sprites/nums & letters/num_6.png | Bin .../sprites/nums & letters/num_7.png | Bin .../sprites/pieces/black_bishop.png | Bin .../sprites/pieces/black_king.png | Bin .../sprites/pieces/black_knight.png | Bin .../sprites/pieces/black_pawn.png | Bin .../sprites/pieces/black_queen.png | Bin .../sprites/pieces/black_rook.png | Bin .../sprites/pieces/white_bishop.png | Bin .../sprites/pieces/white_king.png | Bin .../sprites/pieces/white_knight.png | Bin .../sprites/pieces/white_pawn.png | Bin .../sprites/pieces/white_queen.png | Bin .../sprites/pieces/white_rook.png | Bin .../arabian-chess}/xav.png | Bin .../arabian-chess}/zayne.png | Bin .../chess-board/chess-board.component.css | 34 +- .../chess-board/chess-board.component.html | 7 +- .../chess-board/chess-board.component.ts | 3 + .../chess-piece/chess-piece.component.ts | 39 +- src/app/pages/game/game.component.css | 33 + src/app/pages/game/game.component.html | 26 + src/app/pages/game/game.component.ts | 14 + src/app/pages/welcome/welcome.component.css | 640 +++++++++--------- src/app/pages/welcome/welcome.component.html | 82 ++- src/app/pages/welcome/welcome.component.ts | 2 +- 69 files changed, 546 insertions(+), 352 deletions(-) create mode 100644 assets/ChessAssets/b_Bishop.png create mode 100644 assets/ChessAssets/b_King.png create mode 100644 assets/ChessAssets/b_Knight.png create mode 100644 assets/ChessAssets/b_Pawn.png create mode 100644 assets/ChessAssets/b_Queen.png create mode 100644 assets/ChessAssets/b_Rook.png create mode 100644 assets/ChessAssets/w_Bishop.png create mode 100644 assets/ChessAssets/w_King.png create mode 100644 assets/ChessAssets/w_Knight.png create mode 100644 assets/ChessAssets/w_Pawn.png create mode 100644 assets/ChessAssets/w_Queen.png create mode 100644 assets/ChessAssets/w_Rook.png rename {arabian-chess => assets/arabian-chess}/license.txt (100%) rename {arabian-chess => assets/arabian-chess}/plane.png (100%) rename {arabian-chess => assets/arabian-chess}/player-one.gif (100%) rename {arabian-chess => assets/arabian-chess}/player-two.gif (100%) rename {arabian-chess => assets/arabian-chess}/raf.gif (100%) rename {arabian-chess => assets/arabian-chess}/ref/cover.png (100%) rename {arabian-chess => assets/arabian-chess}/ref/full_art.png (100%) rename {arabian-chess => assets/arabian-chess}/ref/logo.png (100%) rename {arabian-chess => assets/arabian-chess}/sheets/board.png (100%) rename {arabian-chess => assets/arabian-chess}/sheets/board_centered.png (100%) rename {arabian-chess => assets/arabian-chess}/sheets/board_without_bottom.png (100%) rename {arabian-chess => assets/arabian-chess}/sheets/nums & letters.png (100%) rename {arabian-chess => assets/arabian-chess}/sheets/pieces.png (100%) rename {arabian-chess => assets/arabian-chess}/sprites/board/board_bottom.png (100%) rename {arabian-chess => assets/arabian-chess}/sprites/board/board_square_black.png (100%) rename {arabian-chess => assets/arabian-chess}/sprites/board/board_square_white.png (100%) rename {arabian-chess => assets/arabian-chess}/sprites/nums & letters/letter_a.png (100%) rename {arabian-chess => assets/arabian-chess}/sprites/nums & letters/letter_b.png (100%) rename {arabian-chess => assets/arabian-chess}/sprites/nums & letters/letter_c.png (100%) rename {arabian-chess => assets/arabian-chess}/sprites/nums & letters/letter_d.png (100%) rename {arabian-chess => assets/arabian-chess}/sprites/nums & letters/letter_e.png (100%) rename {arabian-chess => assets/arabian-chess}/sprites/nums & letters/letter_f.png (100%) rename {arabian-chess => assets/arabian-chess}/sprites/nums & letters/letter_g.png (100%) rename {arabian-chess => assets/arabian-chess}/sprites/nums & letters/letter_h.png (100%) rename {arabian-chess => assets/arabian-chess}/sprites/nums & letters/num_0.png (100%) rename {arabian-chess => assets/arabian-chess}/sprites/nums & letters/num_1.png (100%) rename {arabian-chess => assets/arabian-chess}/sprites/nums & letters/num_2.png (100%) rename {arabian-chess => assets/arabian-chess}/sprites/nums & letters/num_3.png (100%) rename {arabian-chess => assets/arabian-chess}/sprites/nums & letters/num_4.png (100%) rename {arabian-chess => assets/arabian-chess}/sprites/nums & letters/num_5.png (100%) rename {arabian-chess => assets/arabian-chess}/sprites/nums & letters/num_6.png (100%) rename {arabian-chess => assets/arabian-chess}/sprites/nums & letters/num_7.png (100%) rename {arabian-chess => assets/arabian-chess}/sprites/pieces/black_bishop.png (100%) rename {arabian-chess => assets/arabian-chess}/sprites/pieces/black_king.png (100%) rename {arabian-chess => assets/arabian-chess}/sprites/pieces/black_knight.png (100%) rename {arabian-chess => assets/arabian-chess}/sprites/pieces/black_pawn.png (100%) rename {arabian-chess => assets/arabian-chess}/sprites/pieces/black_queen.png (100%) rename {arabian-chess => assets/arabian-chess}/sprites/pieces/black_rook.png (100%) rename {arabian-chess => assets/arabian-chess}/sprites/pieces/white_bishop.png (100%) rename {arabian-chess => assets/arabian-chess}/sprites/pieces/white_king.png (100%) rename {arabian-chess => assets/arabian-chess}/sprites/pieces/white_knight.png (100%) rename {arabian-chess => assets/arabian-chess}/sprites/pieces/white_pawn.png (100%) rename {arabian-chess => assets/arabian-chess}/sprites/pieces/white_queen.png (100%) rename {arabian-chess => assets/arabian-chess}/sprites/pieces/white_rook.png (100%) rename {arabian-chess => assets/arabian-chess}/xav.png (100%) rename {arabian-chess => assets/arabian-chess}/zayne.png (100%) diff --git a/angular.json b/angular.json index fd1f73a..fd5ca34 100644 --- a/angular.json +++ b/angular.json @@ -28,8 +28,13 @@ }, { "glob": "**/*", - "input": "arabian-chess", - "output": "/arabian-chess" + "input": "assets/arabian-chess", + "output": "/assets/arabian-chess" + }, + { + "glob": "**/*", + "input": "assets/ChessAssets", + "output": "/assets/ChessAssets" } ], "styles": [ @@ -99,8 +104,13 @@ }, { "glob": "**/*", - "input": "arabian-chess", - "output": "/arabian-chess" + "input": "assets/arabian-chess", + "output": "/assets/arabian-chess" + }, + { + "glob": "**/*", + "input": "assets/ChessAssets", + "output": "/assets/ChessAssets" } ], "styles": [ diff --git a/assets/ChessAssets/b_Bishop.png b/assets/ChessAssets/b_Bishop.png new file mode 100644 index 0000000000000000000000000000000000000000..26458d8fc12add45658730453f02aa03ada96546 GIT binary patch literal 2606 zcmV+}3eok6P)Jb9M)(U7Zrm#Vf}}TYloQ-YPlyxk3H20n z0*M1D;(!Dq1`2IOL(;T$693rceP`Dtt(rD=HlEp;_Yor}MuP0VH}Ac9Z{`h=AP9mW z2!bF8f*=TjAXrM3$HzR@c|^(hfyd`O0&P}MGh!|Pj2wh z^q4mvu<*U7s677NMA4&Whh`eBsK{SkBg=8Y0t9U8*I%8^A2{p@k28ek*J-@Z-B=IW8zbWu(x%p_>{}uV$VsM-<=yk`+Qgmg9l~2v5NU z1*r4do_gg$GsMRlS&j<|aAl*>y8`UA)Q2d51zf##zk?;+p=pPaN(fP$5wsc?5<&GS zqEaiQx$^Mg^!>)&khb?!O885%9H&yjTmz__nK(EVjG6x@3;)goNd?=+E{`uCG^651 zBb>`4=ga>T5=}sm$oYTzZKK1%pPKpalOx3-7Zd=qe~!o7JOYjdN?W^8>7NIos{Ua> z`1kfA)P*5*jDTY6h@W@KVr+E*5c&d-d7kan;R4afi5wvzG{OlUqEn-)e4VK z$fD(;EecTOu>`?mvj++}e#%eAC1PF~gxyUeSNN+B$pVXzbp?31%Lf%d2!9aVX*^Vf z6^e5Ob;>AN4g#w@zUA3oJvWu7v7y1~GGd7&r%>Tl11g3H7OztV$*KZe;vnwRbCdbv z=~3^gyL^rd1d`Z2R4#fYP8!W~@QA;nMj0b(E&wL~E1rGTm!9)e_w)UN_~7@=HiAV2 zhwo8_Ttb!3=MynqRBeX%s03v7)1 z4+2(TY$yleYwti}f&#pI*fV=JkyyM%(v0pmk6AG9q5_nQYU?@zL9K2;_nWU`H?Jvs z`vwWz09QL9e66bi-3sugi?hEAtN>|_1GHO!ei}I0!te?8Q6-J&Q~+iE26>>vG_Y$( zcO0No0h|_o7v1gXbSl7koZNLC99?J5lO}X3KrrND`2QHAh4_piX+p08=HQgf=GiH~+e0VwVCJuHcCg$nlVOvSGgfo&mnU zRLmLIDjt~R0`P)9n;P{Na8Xn)hoC8>(;06e`}03-ni}ybDEkNiD_r~vC@ui)k^z|F z0wDZV7JlWW^8Y%?W>fVLoGoSZ969_xE{!@n`RFsTOEBg>K@+Bz68`kqqrwNX6TT{$ z{=J>Or6J5d=li=CMm+@2_` z@ykZrs3jr}c>Z#yt>Tqer+d5dF0p7;(uB^b6ut3cf%*Y64at>rQ+d+eYZzO*k+UeX zGSBvT$@TX)TKLfNAUbbmM$W&lK0&xu6g>ui-B1Y@nm*~#pnDEt)?;-7lYf@;7Flh3 ztMzDDquIY1hx>p_K;Z}h;vn}GqGI{u&9<7euRVV>;U|YfYNQFBL11pL6U`sxvZ!uw z_#9{2u$SNl2Z?CAhVPU1YpH=5f0G6O>z#PdLQu}DEag%EH?U%@P!)-^91qiNw^rGl zSJPVB!J^z|O8{#yIg(R;dF({4Z)JecadHX&J+9=b#?H9$D=l+x!ZJ{|0w5Fi6-Uk0 zS7G9V?KCRK{loSQr%8L5oTWSC&WPbD1CDdV3|@nVwUF0{TeoSuz8xpABs$1L2iXg z1y$H;#5<4Lp*mfhS}OQBSR^S19ak~vO%en_5ClOG1VIo4K@bE%5QN_N58aSD9PZ?V QkN^Mx07*qoM6N<$g0z0fbN~PV literal 0 HcmV?d00001 diff --git a/assets/ChessAssets/b_King.png b/assets/ChessAssets/b_King.png new file mode 100644 index 0000000000000000000000000000000000000000..9a7d13f8d8a833738d30e30bf016fd02e4e20284 GIT binary patch literal 2084 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 AxBvhE literal 0 HcmV?d00001 diff --git a/assets/ChessAssets/w_Bishop.png b/assets/ChessAssets/w_Bishop.png new file mode 100644 index 0000000000000000000000000000000000000000..473f5f4548e79db71069378bc39084f3b5993428 GIT binary patch literal 2747 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 LpI~M?Bc|{lqMX1v literal 0 HcmV?d00001 diff --git a/arabian-chess/license.txt b/assets/arabian-chess/license.txt similarity index 100% rename from arabian-chess/license.txt rename to assets/arabian-chess/license.txt diff --git a/arabian-chess/plane.png b/assets/arabian-chess/plane.png similarity index 100% rename from arabian-chess/plane.png rename to assets/arabian-chess/plane.png diff --git a/arabian-chess/player-one.gif b/assets/arabian-chess/player-one.gif similarity index 100% rename from arabian-chess/player-one.gif rename to assets/arabian-chess/player-one.gif diff --git a/arabian-chess/player-two.gif b/assets/arabian-chess/player-two.gif similarity index 100% rename from arabian-chess/player-two.gif rename to assets/arabian-chess/player-two.gif diff --git a/arabian-chess/raf.gif b/assets/arabian-chess/raf.gif similarity index 100% rename from arabian-chess/raf.gif rename to assets/arabian-chess/raf.gif diff --git a/arabian-chess/ref/cover.png b/assets/arabian-chess/ref/cover.png similarity index 100% rename from arabian-chess/ref/cover.png rename to assets/arabian-chess/ref/cover.png diff --git a/arabian-chess/ref/full_art.png b/assets/arabian-chess/ref/full_art.png similarity index 100% rename from arabian-chess/ref/full_art.png rename to assets/arabian-chess/ref/full_art.png diff --git a/arabian-chess/ref/logo.png b/assets/arabian-chess/ref/logo.png similarity index 100% rename from arabian-chess/ref/logo.png rename to assets/arabian-chess/ref/logo.png diff --git a/arabian-chess/sheets/board.png b/assets/arabian-chess/sheets/board.png similarity index 100% rename from arabian-chess/sheets/board.png rename to assets/arabian-chess/sheets/board.png diff --git a/arabian-chess/sheets/board_centered.png b/assets/arabian-chess/sheets/board_centered.png similarity index 100% rename from arabian-chess/sheets/board_centered.png rename to assets/arabian-chess/sheets/board_centered.png diff --git a/arabian-chess/sheets/board_without_bottom.png b/assets/arabian-chess/sheets/board_without_bottom.png similarity index 100% rename from arabian-chess/sheets/board_without_bottom.png rename to assets/arabian-chess/sheets/board_without_bottom.png diff --git a/arabian-chess/sheets/nums & letters.png b/assets/arabian-chess/sheets/nums & letters.png similarity index 100% rename from arabian-chess/sheets/nums & letters.png rename to assets/arabian-chess/sheets/nums & letters.png diff --git a/arabian-chess/sheets/pieces.png b/assets/arabian-chess/sheets/pieces.png similarity index 100% rename from arabian-chess/sheets/pieces.png rename to assets/arabian-chess/sheets/pieces.png diff --git a/arabian-chess/sprites/board/board_bottom.png b/assets/arabian-chess/sprites/board/board_bottom.png similarity index 100% rename from arabian-chess/sprites/board/board_bottom.png rename to assets/arabian-chess/sprites/board/board_bottom.png diff --git a/arabian-chess/sprites/board/board_square_black.png b/assets/arabian-chess/sprites/board/board_square_black.png similarity index 100% rename from arabian-chess/sprites/board/board_square_black.png rename to assets/arabian-chess/sprites/board/board_square_black.png diff --git a/arabian-chess/sprites/board/board_square_white.png b/assets/arabian-chess/sprites/board/board_square_white.png similarity index 100% rename from arabian-chess/sprites/board/board_square_white.png rename to assets/arabian-chess/sprites/board/board_square_white.png diff --git a/arabian-chess/sprites/nums & letters/letter_a.png b/assets/arabian-chess/sprites/nums & letters/letter_a.png similarity index 100% rename from arabian-chess/sprites/nums & letters/letter_a.png rename to assets/arabian-chess/sprites/nums & letters/letter_a.png diff --git a/arabian-chess/sprites/nums & letters/letter_b.png b/assets/arabian-chess/sprites/nums & letters/letter_b.png similarity index 100% rename from arabian-chess/sprites/nums & letters/letter_b.png rename to assets/arabian-chess/sprites/nums & letters/letter_b.png diff --git a/arabian-chess/sprites/nums & letters/letter_c.png b/assets/arabian-chess/sprites/nums & letters/letter_c.png similarity index 100% rename from arabian-chess/sprites/nums & letters/letter_c.png rename to assets/arabian-chess/sprites/nums & letters/letter_c.png diff --git a/arabian-chess/sprites/nums & letters/letter_d.png b/assets/arabian-chess/sprites/nums & letters/letter_d.png similarity index 100% rename from arabian-chess/sprites/nums & letters/letter_d.png rename to assets/arabian-chess/sprites/nums & letters/letter_d.png diff --git a/arabian-chess/sprites/nums & letters/letter_e.png b/assets/arabian-chess/sprites/nums & letters/letter_e.png similarity index 100% rename from arabian-chess/sprites/nums & letters/letter_e.png rename to assets/arabian-chess/sprites/nums & letters/letter_e.png diff --git a/arabian-chess/sprites/nums & letters/letter_f.png b/assets/arabian-chess/sprites/nums & letters/letter_f.png similarity index 100% rename from arabian-chess/sprites/nums & letters/letter_f.png rename to assets/arabian-chess/sprites/nums & letters/letter_f.png diff --git a/arabian-chess/sprites/nums & letters/letter_g.png b/assets/arabian-chess/sprites/nums & letters/letter_g.png similarity index 100% rename from arabian-chess/sprites/nums & letters/letter_g.png rename to assets/arabian-chess/sprites/nums & letters/letter_g.png diff --git a/arabian-chess/sprites/nums & letters/letter_h.png b/assets/arabian-chess/sprites/nums & letters/letter_h.png similarity index 100% rename from arabian-chess/sprites/nums & letters/letter_h.png rename to assets/arabian-chess/sprites/nums & letters/letter_h.png diff --git a/arabian-chess/sprites/nums & letters/num_0.png b/assets/arabian-chess/sprites/nums & letters/num_0.png similarity index 100% rename from arabian-chess/sprites/nums & letters/num_0.png rename to assets/arabian-chess/sprites/nums & letters/num_0.png diff --git a/arabian-chess/sprites/nums & letters/num_1.png b/assets/arabian-chess/sprites/nums & letters/num_1.png similarity index 100% rename from arabian-chess/sprites/nums & letters/num_1.png rename to assets/arabian-chess/sprites/nums & letters/num_1.png diff --git a/arabian-chess/sprites/nums & letters/num_2.png b/assets/arabian-chess/sprites/nums & letters/num_2.png similarity index 100% rename from arabian-chess/sprites/nums & letters/num_2.png rename to assets/arabian-chess/sprites/nums & letters/num_2.png diff --git a/arabian-chess/sprites/nums & letters/num_3.png b/assets/arabian-chess/sprites/nums & letters/num_3.png similarity index 100% rename from arabian-chess/sprites/nums & letters/num_3.png rename to assets/arabian-chess/sprites/nums & letters/num_3.png diff --git a/arabian-chess/sprites/nums & letters/num_4.png b/assets/arabian-chess/sprites/nums & letters/num_4.png similarity index 100% rename from arabian-chess/sprites/nums & letters/num_4.png rename to assets/arabian-chess/sprites/nums & letters/num_4.png diff --git a/arabian-chess/sprites/nums & letters/num_5.png b/assets/arabian-chess/sprites/nums & letters/num_5.png similarity index 100% rename from arabian-chess/sprites/nums & letters/num_5.png rename to assets/arabian-chess/sprites/nums & letters/num_5.png diff --git a/arabian-chess/sprites/nums & letters/num_6.png b/assets/arabian-chess/sprites/nums & letters/num_6.png similarity index 100% rename from arabian-chess/sprites/nums & letters/num_6.png rename to assets/arabian-chess/sprites/nums & letters/num_6.png diff --git a/arabian-chess/sprites/nums & letters/num_7.png b/assets/arabian-chess/sprites/nums & letters/num_7.png similarity index 100% rename from arabian-chess/sprites/nums & letters/num_7.png rename to assets/arabian-chess/sprites/nums & letters/num_7.png diff --git a/arabian-chess/sprites/pieces/black_bishop.png b/assets/arabian-chess/sprites/pieces/black_bishop.png similarity index 100% rename from arabian-chess/sprites/pieces/black_bishop.png rename to assets/arabian-chess/sprites/pieces/black_bishop.png diff --git a/arabian-chess/sprites/pieces/black_king.png b/assets/arabian-chess/sprites/pieces/black_king.png similarity index 100% rename from arabian-chess/sprites/pieces/black_king.png rename to assets/arabian-chess/sprites/pieces/black_king.png diff --git a/arabian-chess/sprites/pieces/black_knight.png b/assets/arabian-chess/sprites/pieces/black_knight.png similarity index 100% rename from arabian-chess/sprites/pieces/black_knight.png rename to assets/arabian-chess/sprites/pieces/black_knight.png diff --git a/arabian-chess/sprites/pieces/black_pawn.png b/assets/arabian-chess/sprites/pieces/black_pawn.png similarity index 100% rename from arabian-chess/sprites/pieces/black_pawn.png rename to assets/arabian-chess/sprites/pieces/black_pawn.png diff --git a/arabian-chess/sprites/pieces/black_queen.png b/assets/arabian-chess/sprites/pieces/black_queen.png similarity index 100% rename from arabian-chess/sprites/pieces/black_queen.png rename to assets/arabian-chess/sprites/pieces/black_queen.png diff --git a/arabian-chess/sprites/pieces/black_rook.png b/assets/arabian-chess/sprites/pieces/black_rook.png similarity index 100% rename from arabian-chess/sprites/pieces/black_rook.png rename to assets/arabian-chess/sprites/pieces/black_rook.png diff --git a/arabian-chess/sprites/pieces/white_bishop.png b/assets/arabian-chess/sprites/pieces/white_bishop.png similarity index 100% rename from arabian-chess/sprites/pieces/white_bishop.png rename to assets/arabian-chess/sprites/pieces/white_bishop.png diff --git a/arabian-chess/sprites/pieces/white_king.png b/assets/arabian-chess/sprites/pieces/white_king.png similarity index 100% rename from arabian-chess/sprites/pieces/white_king.png rename to assets/arabian-chess/sprites/pieces/white_king.png diff --git a/arabian-chess/sprites/pieces/white_knight.png b/assets/arabian-chess/sprites/pieces/white_knight.png similarity index 100% rename from arabian-chess/sprites/pieces/white_knight.png rename to assets/arabian-chess/sprites/pieces/white_knight.png diff --git a/arabian-chess/sprites/pieces/white_pawn.png b/assets/arabian-chess/sprites/pieces/white_pawn.png similarity index 100% rename from arabian-chess/sprites/pieces/white_pawn.png rename to assets/arabian-chess/sprites/pieces/white_pawn.png diff --git a/arabian-chess/sprites/pieces/white_queen.png b/assets/arabian-chess/sprites/pieces/white_queen.png similarity index 100% rename from arabian-chess/sprites/pieces/white_queen.png rename to assets/arabian-chess/sprites/pieces/white_queen.png diff --git a/arabian-chess/sprites/pieces/white_rook.png b/assets/arabian-chess/sprites/pieces/white_rook.png similarity index 100% rename from arabian-chess/sprites/pieces/white_rook.png rename to assets/arabian-chess/sprites/pieces/white_rook.png diff --git a/arabian-chess/xav.png b/assets/arabian-chess/xav.png similarity index 100% rename from arabian-chess/xav.png rename to assets/arabian-chess/xav.png diff --git a/arabian-chess/zayne.png b/assets/arabian-chess/zayne.png similarity index 100% rename from arabian-chess/zayne.png rename to assets/arabian-chess/zayne.png diff --git a/src/app/components/chess-board/chess-board.component.css b/src/app/components/chess-board/chess-board.component.css index 4eec498..47b3421 100644 --- a/src/app/components/chess-board/chess-board.component.css +++ b/src/app/components/chess-board/chess-board.component.css @@ -42,11 +42,41 @@ } .square.light { - background-image: url('/arabian-chess/sprites/board/board_square_white.png'); + background-image: url('/assets/arabian-chess/sprites/board/board_square_white.png'); } .square.dark { - background-image: url('/arabian-chess/sprites/board/board_square_black.png'); + background-image: url('/assets/arabian-chess/sprites/board/board_square_black.png'); +} + +.board-grid--classic { + border-radius: var(--border-radius-md); +} + +.board-grid--classic .square { + background-image: none; + transition: filter 160ms ease; +} + +.board-grid--classic .square.light { + background-color: #f3c8a0; +} + +.board-grid--classic .square.dark { + background-color: #ba6d4b; +} + +.board-grid--classic .square.drag-over { + outline-color: #5a2c28; +} + +.board-grid--classic .square.selected { + outline-color: #5a2c28; +} + +.board-grid--classic .square.highlighted::after { + background: #b9dad1; + border-color: #5a2c28; } .square.highlighted::after { diff --git a/src/app/components/chess-board/chess-board.component.html b/src/app/components/chess-board/chess-board.component.html index 3644300..0704d39 100644 --- a/src/app/components/chess-board/chess-board.component.html +++ b/src/app/components/chess-board/chess-board.component.html @@ -1,5 +1,5 @@
-
+
@for (square of squares; track trackByCoordinate($index, square)) {
diff --git a/src/app/components/chess-board/chess-board.component.ts b/src/app/components/chess-board/chess-board.component.ts index dc38701..0a1a1a8 100644 --- a/src/app/components/chess-board/chess-board.component.ts +++ b/src/app/components/chess-board/chess-board.component.ts @@ -7,6 +7,8 @@ interface BoardSquare { pieceCode: string | null; } +type BoardTheme = 'arabian' | 'classic'; + @Component({ selector: 'app-chess-board', standalone: true, @@ -18,6 +20,7 @@ export class ChessBoardComponent implements OnChanges { @Input({ required: true }) fen = ''; @Input() selectedSquare: string | null = null; @Input() highlightedSquares: string[] = []; + @Input() boardTheme: BoardTheme = 'arabian'; @Output() squareSelected = new EventEmitter(); squares: BoardSquare[] = []; diff --git a/src/app/components/chess-piece/chess-piece.component.ts b/src/app/components/chess-piece/chess-piece.component.ts index bdfb755..6b3e125 100644 --- a/src/app/components/chess-piece/chess-piece.component.ts +++ b/src/app/components/chess-piece/chess-piece.component.ts @@ -1,5 +1,7 @@ import { Component, EventEmitter, Input, Output } from '@angular/core'; +type BoardTheme = 'arabian' | 'classic'; + @Component({ selector: 'app-chess-piece', standalone: true, @@ -8,6 +10,7 @@ import { Component, EventEmitter, Input, Output } from '@angular/core'; }) export class ChessPieceComponent { @Input({ required: true }) pieceCode: string | null = null; + @Input() boardTheme: BoardTheme = 'arabian'; @Input() draggable = false; @Output() pieceDragStart = new EventEmitter(); @Output() pieceDragEnd = new EventEmitter(); @@ -30,12 +33,21 @@ export class ChessPieceComponent { return ''; } - const color = this.pieceCode === this.pieceCode.toUpperCase() ? 'white' : 'black'; - const pieceName = this.getPieceName(this.pieceCode.toLowerCase()); - return `/arabian-chess/sprites/pieces/${color}_${pieceName}.png`; + const isWhite = this.pieceCode === this.pieceCode.toUpperCase(); + const pieceCode = this.pieceCode.toLowerCase(); + + if (this.boardTheme === 'classic') { + const colorPrefix = isWhite ? 'w' : 'b'; + const classicPieceName = this.getClassicPieceName(pieceCode); + return `/assets/ChessAssets/${colorPrefix}_${classicPieceName}.png`; + } + + const arabianColor = isWhite ? 'white' : 'black'; + const arabianPieceName = this.getArabianPieceName(pieceCode); + return `/assets/arabian-chess/sprites/pieces/${arabianColor}_${arabianPieceName}.png`; } - private getPieceName(piece: string): string { + private getArabianPieceName(piece: string): string { switch (piece) { case 'k': return 'king'; @@ -53,4 +65,23 @@ export class ChessPieceComponent { return 'pawn'; } } + + private getClassicPieceName(piece: string): string { + switch (piece) { + case 'k': + return 'King'; + case 'q': + return 'Queen'; + case 'r': + return 'Rook'; + case 'b': + return 'Bishop'; + case 'n': + return 'Knight'; + case 'p': + return 'Pawn'; + default: + return 'Pawn'; + } + } } diff --git a/src/app/pages/game/game.component.css b/src/app/pages/game/game.component.css index b9ca9ea..611d0b5 100644 --- a/src/app/pages/game/game.component.css +++ b/src/app/pages/game/game.component.css @@ -48,6 +48,39 @@ h2 { flex: 0 0 auto; } +.board-theme-card { + background: var(--color-bg-card); + border: var(--border-width) solid var(--color-border); + border-radius: var(--border-radius-md); + padding: var(--size-md-padding); + display: grid; + gap: var(--size-sm); +} + +.board-theme-card h3 { + margin: 0; + color: var(--color-text-primary); + font-size: 1rem; +} + +.board-theme-group { + display: flex; + gap: var(--size-md); + flex-wrap: wrap; +} + +.board-theme-option { + display: inline-flex; + align-items: center; + gap: var(--size-xs); + color: var(--color-text-primary); + font-weight: 600; +} + +.board-theme-option input { + accent-color: var(--color-primary); +} + .move-card { padding: var(--size-lg-padding); } diff --git a/src/app/pages/game/game.component.html b/src/app/pages/game/game.component.html index e0df059..9d54af4 100644 --- a/src/app/pages/game/game.component.html +++ b/src/app/pages/game/game.component.html @@ -48,11 +48,37 @@ [fen]="facade.state.fen" [selectedSquare]="facade.selectedSquare" [highlightedSquares]="facade.highlightedSquares" + [boardTheme]="boardTheme" (squareSelected)="facade.onBoardSquareSelected($event)" />
+
+

Board Design

+
+ + + +
+
+ { @@ -70,6 +74,11 @@ export class GameComponent implements OnInit, OnDestroy { this.syncExportValue(); } + setBoardTheme(theme: BoardTheme): void { + this.boardTheme = theme; + localStorage.setItem(GameComponent.BOARD_THEME_STORAGE_KEY, theme); + } + completeExport(): void { this.syncExportValue(); if (!this.exportValue.trim()) { @@ -220,4 +229,9 @@ export class GameComponent implements OnInit, OnDestroy { private getTimerStorageKey(gameId: string): string { return `nowchess.timer.${gameId}`; } + + private resolveStoredBoardTheme(): BoardTheme { + const stored = localStorage.getItem(GameComponent.BOARD_THEME_STORAGE_KEY); + return stored === 'classic' ? 'classic' : 'arabian'; + } } diff --git a/src/app/pages/welcome/welcome.component.css b/src/app/pages/welcome/welcome.component.css index e919f9b..74d99f7 100644 --- a/src/app/pages/welcome/welcome.component.css +++ b/src/app/pages/welcome/welcome.component.css @@ -1,22 +1,67 @@ .welcome-shell { - min-height: 100vh; + --city-sky-top: #dbefff; + --city-sky-mid: #bfd7eb; + --city-sky-bottom: #95b3ca; + --city-fog: rgba(168, 203, 226, 0.35); + --city-building-a: #8ba8be; + --city-building-b: #7696af; + --city-building-c: #6787a3; + --city-building-edge: rgba(230, 247, 255, 0.2); + --city-window: #bdeeff; + --city-window-soft: rgba(189, 238, 255, 0.25); + --city-billboard-bg: rgba(223, 246, 255, 0.92); + --city-billboard-border: rgba(111, 161, 195, 0.6); + --city-billboard-text: #21435a; + --city-panel-bg: rgba(235, 248, 255, 0.9); + --city-panel-border: rgba(122, 170, 201, 0.55); + --city-panel-input: rgba(255, 255, 255, 0.92); + + min-height: 100svh; display: flex; flex-direction: column; + justify-content: space-between; align-items: center; - justify-content: center; - padding: var(--size-xl); + padding: clamp(1rem, 2.3vw, 1.75rem); position: relative; + overflow: hidden; + background: linear-gradient(180deg, var(--city-sky-top) 0%, var(--city-sky-mid) 58%, var(--city-sky-bottom) 100%); +} + +:host-context([data-theme='dark']) .welcome-shell { + --city-sky-top: #010f1f; + --city-sky-mid: #051424; + --city-sky-bottom: #00626e; + --city-fog: rgba(0, 218, 243, 0.14); + --city-building-a: #122131; + --city-building-b: #1c2b3c; + --city-building-c: #273647; + --city-building-edge: rgba(255, 255, 255, 0.08); + --city-window: #00e5ff; + --city-window-soft: rgba(0, 229, 255, 0.22); + --city-billboard-bg: rgba(0, 218, 243, 0.16); + --city-billboard-border: rgba(0, 229, 255, 0.45); + --city-billboard-text: #d4e4fa; + --city-panel-bg: rgba(18, 33, 49, 0.88); + --city-panel-border: rgba(0, 218, 243, 0.35); + --city-panel-input: rgba(5, 20, 36, 0.88); +} + +.sky-vignette { + position: absolute; + inset: 0; + pointer-events: none; + background: linear-gradient(180deg, transparent 45%, var(--city-fog) 100%); + opacity: 0.9; } .clouds-container { display: flex; justify-content: center; align-items: flex-start; - gap: 60px; + gap: clamp(1.25rem, 4vw, 3.5rem); width: 100%; - max-width: 900px; - margin-bottom: var(--size-xl); - position: relative; + max-width: 980px; + margin-top: clamp(2.8rem, 6vh, 5.2rem); z-index: 1; } @@ -27,7 +72,7 @@ display: flex; align-items: center; justify-content: center; - filter: drop-shadow(0 4px 10px rgba(0, 0, 0, 0.12)); + filter: drop-shadow(0 8px 18px rgba(0, 0, 0, 0.18)); } .plane-body { @@ -54,7 +99,7 @@ display: flex; align-items: center; justify-content: center; - filter: drop-shadow(0 4px 10px rgba(0, 0, 0, 0.12)); + filter: drop-shadow(0 6px 12px rgba(0, 0, 0, 0.15)); } .cloud::before { @@ -85,91 +130,288 @@ height: 100px; object-fit: contain; z-index: 10; - filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.15)); position: relative; } -.gif-with-halo { +.welcome-intro { position: relative; - display: inline-block; -} - -.gif-with-halo::before { - content: ''; - position: absolute; - top: -10px; - left: 50%; - transform: translateX(-50%); - width: 75px; - height: 15px; - border: 2px solid rgba(255, 215, 0, 0.7); - border-radius: 50%; - box-shadow: 0 0 8px rgba(255, 215, 0, 0.5); - z-index: 5; -} - -.welcome-card { - width: min(900px, 100%); - border-radius: var(--border-radius-lg); - border: var(--border-width) solid var(--color-border); - background: var(--color-bg-main); - padding: var(--size-xl-padding); - box-shadow: var(--shadow-md); + z-index: 2; + margin-top: clamp(0.4rem, 1.1vh, 1rem); + text-align: center; } h1 { - margin: 0 0 var(--size-xs); - color: var(--color-text-primary); - font-size: var(--heading-h1); + margin: 0; + color: var(--city-billboard-text); + font-size: clamp(1.65rem, 3.6vw, 2.65rem); + letter-spacing: 0.04em; + text-transform: uppercase; } p { - margin: 0 0 var(--size-lg); + margin: 0; + color: var(--city-billboard-text); } -.mode-grid { +.welcome-intro p { + margin-top: 0.25rem; + opacity: 0.9; + font-size: clamp(0.88rem, 1.6vw, 1.02rem); +} + +.skyline-controls { + position: relative; + width: min(1200px, 100%); + min-height: clamp(280px, 43vh, 500px); display: grid; - grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); - gap: var(--size-xl-gap); + grid-template-columns: repeat(4, minmax(110px, 1fr)); + gap: clamp(0.6rem, 1.2vw, 1.2rem); + align-items: end; + z-index: 2; + padding-inline: clamp(0.2rem, 1.2vw, 0.9rem); + margin-top: auto; +} + +.tower { + --tower-height: clamp(210px, 38vh, 430px); + position: relative; + height: var(--tower-height); + border-radius: 14px 14px 0 0; + overflow: visible; + background: linear-gradient(180deg, var(--city-building-b) 0%, var(--city-building-a) 65%, var(--city-building-c) 100%); + border: 1px solid var(--city-building-edge); + box-shadow: inset 0 0 30px rgba(0, 0, 0, 0.2); +} + +.tower::before { + content: ''; + position: absolute; + inset: 0; + background: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.08) 48%, transparent 52%); + opacity: 0.55; + pointer-events: none; +} + +.tower-windows { + position: absolute; + left: 18%; + right: 18%; + bottom: 22px; + display: grid; + gap: 14px; +} + +.tower-windows span { + height: 2px; + border-radius: 999px; + background: var(--city-window); + box-shadow: 0 0 5px var(--city-window); + opacity: 0.28; +} + +.tower-bot { + --tower-height: clamp(245px, 48vh, 520px); +} + +.tower-1v1 { + --tower-height: clamp(200px, 39vh, 430px); +} + +.tower-join { + --tower-height: clamp(225px, 44vh, 480px); +} + +.tower-import { + --tower-height: clamp(265px, 51vh, 560px); } .mode { - border: var(--border-width) solid var(--color-border); - border-radius: var(--border-radius-md); - padding: var(--size-lg-padding); + border-radius: 0.8rem; + border: 1px solid var(--city-billboard-border); + background: var(--city-billboard-bg); + color: var(--city-billboard-text); + backdrop-filter: blur(4px); text-align: left; display: grid; - gap: var(--size-xs); + gap: 0.2rem; + transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease; +} + +.mode-billboard { + position: absolute; + left: 12%; + right: 12%; + top: 0; + transform: translateY(-56%); + padding: 0.8rem 0.9rem; } .mode span { - font-size: 1.15rem; - color: var(--color-text-primary); + font-size: clamp(0.95rem, 1.4vw, 1.12rem); + font-weight: 700; + letter-spacing: 0.02em; } .mode small { - color: var(--color-text-primary); - opacity: 0.9; + color: var(--city-billboard-text); + opacity: 0.85; + font-size: 0.75rem; } .mode-active { - background: var(--color-secondary-mint); cursor: pointer; } .mode-active:hover:enabled { - background: var(--color-secondary-blue); + transform: translateY(-60%) scale(1.01); + box-shadow: 0 0 22px var(--city-window-soft); } -.mode-disabled { - background: var(--color-bg-card); - opacity: 0.75; +.mode-active:disabled { + opacity: 0.6; + cursor: not-allowed; +} + +.interaction-deck { + width: min(880px, 100%); + display: grid; + gap: 0.7rem; + margin-top: 0.45rem; + margin-bottom: clamp(0.5rem, 1.4vh, 0.95rem); + z-index: 3; +} + +.difficulty-selector, +.join-game-form, +.import-game-form { + background: var(--city-panel-bg); + border: 1px solid var(--city-panel-border); + border-radius: 12px; + padding: 0.8rem; + backdrop-filter: blur(6px); +} + +.difficulty-selector p, +.join-game-form p, +.import-game-form p { + margin: 0 0 0.65rem; + font-weight: 600; +} + +.difficulty-buttons { + display: flex; + gap: 0.55rem; + flex-wrap: wrap; +} + +.difficulty-btn { + flex: 1; + min-width: 78px; + padding: 0.45rem 0.65rem; + border: 1px solid var(--city-panel-border); + border-radius: 9px; + cursor: pointer; + font-weight: 600; + background: rgba(170, 226, 255, 0.68); + color: var(--city-billboard-text); +} + +.difficulty-btn:hover:enabled { + filter: brightness(0.96); +} + +.join-game-input-group { + display: flex; + gap: 0.5rem; + flex-wrap: wrap; +} + +.join-game-input, +.import-game-text { + width: 100%; + border: 1px solid var(--city-panel-border); + border-radius: 9px; + background: var(--city-panel-input); + color: var(--city-billboard-text); + font-family: inherit; +} + +.join-game-input { + flex: 1; + min-width: 155px; + padding: 0.58rem 0.72rem; + font-size: 0.95rem; +} + +.import-game-text { + margin-top: 0.55rem; + margin-bottom: 0.55rem; + min-height: 110px; + resize: vertical; + padding: 0.58rem 0.72rem; + font-size: 0.95rem; +} + +.join-game-input:focus, +.import-game-text:focus { + outline: none; + border-color: var(--city-window); + box-shadow: 0 0 0 2px var(--city-window-soft); +} + +.import-mode-group { + display: flex; + gap: 0.8rem; + margin-bottom: 0.5rem; +} + +.import-mode-option { + display: inline-flex; + align-items: center; + gap: 0.35rem; + font-size: 0.92rem; +} + +.join-game-btn { + padding: 0.52rem 0.72rem; + border-radius: 9px; + border: 1px solid var(--city-panel-border); + cursor: pointer; + font-weight: 600; + color: var(--city-billboard-text); +} + +.join-game-btn.join { + background: rgba(170, 226, 255, 0.68); +} + +.join-game-btn.join:hover:enabled { + filter: brightness(0.95); +} + +.join-game-btn.cancel { + background: rgba(238, 243, 252, 0.82); +} + +.join-game-btn.cancel:hover:enabled { + filter: brightness(0.96); +} + +.join-game-btn:disabled, +.difficulty-btn:disabled { + opacity: 0.56; + cursor: not-allowed; } .error { - color: var(--color-text-primary); - font-weight: 700; - margin-top: var(--size-xl); + margin-top: 0.05rem; + margin-bottom: 0; + color: #ffd0d0; + background: rgba(146, 0, 16, 0.45); + border: 1px solid rgba(255, 170, 170, 0.6); + border-radius: 9px; + padding: 0.5rem 0.65rem; + font-weight: 600; } .plane-left { @@ -187,281 +429,57 @@ p { } @keyframes float { - 0%, 100% { - transform: translateY(0px); + 0%, + 100% { + transform: translateY(0); } + 50% { - transform: translateY(-15px); + transform: translateY(-12px); } } -@media (max-width: 768px) { - .welcome-shell { - padding: var(--size-lg); - } - +@media (max-width: 900px) { .clouds-container { - gap: 30px; - margin-bottom: var(--size-lg); + gap: 1rem; } - .plane { - width: 240px; - height: 110px; + .skyline-controls { + grid-template-columns: repeat(2, minmax(130px, 1fr)); + min-height: clamp(350px, 53vh, 620px); } - .plane-gif { - width: 55px; - height: 55px; - transform: translateX(-20px) translateY(12px); + .tower { + --tower-height: clamp(170px, 25vh, 280px); + } +} + +@media (max-width: 560px) { + .welcome-shell { + padding: 0.75rem; } - .cloud { - width: 170px; - height: 75px; + .skyline-controls { + gap: 0.45rem; + min-height: clamp(360px, 57vh, 650px); } - .cloud::before { - width: 65px; - height: 65px; - box-shadow: 40px 0 0 7px #ffffff, 80px 0 0 3px #ffffff, 20px -13px 0 10px #ffffff, 60px -10px 0 8px #ffffff; - } - - .cloud::after { - width: 170px; - height: 38px; - } - - .cloud-gif { - width: 140px; - height: 140px; - } - - .gif-with-halo::before { - top: -8px; - width: 80px; - height: 12px; - border: 1.5px solid rgba(255, 215, 0, 0.7); - } - - .welcome-card { - padding: var(--size-xl); - } - - h1 { - font-size: var(--heading-h1-mobile); - } - - p { - font-size: 0.875rem; - margin: 0 0 var(--size-lg); - } - - .mode-grid { - grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); - gap: var(--size-md-gap); - } - - .mode { - padding: var(--size-md-padding); - gap: var(--size-xs-gap); + .mode-billboard { + left: 10%; + right: 10%; + padding: 0.72rem 0.72rem; } .mode span { - font-size: 1rem; + font-size: 0.9rem; } .mode small { font-size: 0.7rem; } - .error { - font-size: 0.75rem; + .interaction-deck { + margin-top: 0.3rem; + margin-bottom: 0.45rem; } } - -@media (max-width: 480px) { - .welcome-shell { - padding: var(--size-sm); - } - - .welcome-card { - padding: var(--size-lg-padding); - border-radius: var(--border-radius-md); - } - - h1 { - font-size: var(--heading-h1-small); - margin: 0 0 var(--size-xs); - } - - p { - font-size: 0.8rem; - margin: 0 0 var(--size-md); - } - - .mode-grid { - grid-template-columns: 1fr; - } - - .mode { - padding: var(--size-md-padding); - } - - .mode span { - font-size: 0.95rem; - } -} - -.difficulty-selector { - grid-column: 1 / -1; - background: var(--color-bg-card); - border: var(--border-width) solid var(--color-border); - border-radius: var(--border-radius-md); - padding: var(--size-lg-padding); - margin: var(--size-md) 0; -} - -.difficulty-selector p { - margin: 0 0 var(--size-md); - font-weight: 600; -} - -.difficulty-buttons { - display: flex; - gap: var(--size-md-gap); - flex-wrap: wrap; -} - -.difficulty-btn { - flex: 1; - min-width: 80px; - padding: var(--size-md-padding); - border: var(--border-width) solid var(--color-border); - border-radius: var(--border-radius-md); - cursor: pointer; - font-weight: 600; - transition: all 0.3s ease; -} - -.difficulty-btn.easy { - background: var(--color-success-light, #d4edda); - color: var(--color-text-primary); -} - -.difficulty-btn.easy:hover:enabled { - background: var(--color-success, #28a745); - color: white; -} - -.difficulty-btn.medium { - background: var(--color-warning-light, #fff3cd); - color: var(--color-text-primary); -} - -.difficulty-btn.medium:hover:enabled { - background: var(--color-warning, #ffc107); - color: var(--color-text-primary); -} - -.difficulty-btn.hard { - background: var(--color-danger-light, #f8d7da); - color: var(--color-text-primary); -} - -.difficulty-btn.hard:hover:enabled { - background: var(--color-danger, #dc3545); - color: white; -} - -.join-game-form { - grid-column: 1 / -1; - background: var(--color-bg-card); - border: var(--border-width) solid var(--color-border); - border-radius: var(--border-radius-md); - padding: var(--size-lg-padding); - margin: var(--size-md) 0; -} - -.join-game-form p { - margin: 0 0 var(--size-md); - font-weight: 600; -} - -.join-game-input-group { - display: flex; - gap: var(--size-md-gap); - flex-wrap: wrap; -} - -.join-game-input { - flex: 1; - min-width: 150px; - padding: var(--size-md-padding); - border: var(--border-width) solid var(--color-border); - border-radius: var(--border-radius-md); - background: var(--color-bg-input); - color: var(--color-text-primary); - font-family: inherit; - font-size: 1rem; - transition: border-color 0.3s ease; -} - -.join-game-input:focus { - outline: none; - border-color: var(--color-secondary-mint); - box-shadow: 0 0 0 3px rgba(185, 218, 209, 0.2); -} - -.join-game-input:disabled { - background: var(--color-bg-card); - opacity: 0.6; -} - -.join-game-btn { - padding: var(--size-md-padding) var(--size-lg); - border: var(--border-width) solid var(--color-border); - border-radius: var(--border-radius-md); - cursor: pointer; - font-weight: 600; - font-size: 0.95rem; - transition: all 0.3s ease; -} - -.join-game-btn.join { - background: var(--color-secondary-mint); - color: var(--color-text-primary); -} - -.join-game-btn.join:hover:enabled { - background: var(--color-secondary-blue); -} - -.join-game-btn.join:disabled { - opacity: 0.6; - cursor: not-allowed; -} - -.join-game-btn.cancel { - background: var(--color-bg-card); - color: var(--color-text-primary); -} - -.join-game-btn.cancel:hover:enabled { - background: var(--color-border); -} - -.join-game-btn.cancel:disabled { - opacity: 0.6; - cursor: not-allowed; -} - -.difficulty-btn.hard:hover:enabled { - background: var(--color-danger, #dc3545); - color: white; -} - -.difficulty-btn:disabled { - opacity: 0.6; - cursor: not-allowed; -} diff --git a/src/app/pages/welcome/welcome.component.html b/src/app/pages/welcome/welcome.component.html index 254d5c7..4d1d7ca 100644 --- a/src/app/pages/welcome/welcome.component.html +++ b/src/app/pages/welcome/welcome.component.html @@ -8,62 +8,88 @@
+ + +
- Player One + Player One
- Plane - Raf + Plane + Raf
- Player Two + Player Two
-
+ +

Welcome to NowChess

Pick a mode to begin.

+
-
- + + - @if (showDifficultySelector) { -
-

Select difficulty:

-
- - - -
-
- } - - + + - + + - -
+ + +
+ +
+ @if (showDifficultySelector) { +
+

Select difficulty:

+
+ + + +
+
+ } @if (showJoinGameForm) {
diff --git a/src/app/pages/welcome/welcome.component.ts b/src/app/pages/welcome/welcome.component.ts index a948317..0bb52c0 100644 --- a/src/app/pages/welcome/welcome.component.ts +++ b/src/app/pages/welcome/welcome.component.ts @@ -11,7 +11,7 @@ import { GameApiService } from '../../services/game-api.service'; standalone: true, imports: [CommonModule, FormsModule], templateUrl: './welcome.component.html', - styleUrl: './welcome.component.css' + styleUrls: ['./welcome.component.css'] }) export class WelcomeComponent { creating = false;