16 lines
777 B
CSS
16 lines
777 B
CSS
:root{
|
|
--cell-size: 60px;
|
|
}
|
|
body{font-family: Arial, Helvetica, sans-serif; margin:0; padding:0;}
|
|
.hidden{display:none}
|
|
header{background:#222;color:#fff;padding:10px}
|
|
main{padding:16px}
|
|
.card{border:1px solid #ddd;padding:12px;margin:8px;border-radius:6px}
|
|
.board{display:flex;flex-direction:column;gap:0;border:4px solid #444;width:calc(var(--cell-size)*8);}
|
|
.row{display:flex}
|
|
.cell{width:var(--cell-size);height:var(--cell-size);display:flex;align-items:center;justify-content:center;background:#f0d9b5;border:1px solid #b58863}
|
|
.cell:nth-child(even){background:#b58863}
|
|
.board.flipped{transform:rotate(180deg)}
|
|
.piece{width:48px;height:48px}
|
|
.game-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
|
|
.controls button{margin-left:8px}
|