haunter/sharechess
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added paper-style boards

Browse Source
This commit is contained in:
Maciej Caderek
2022-04-26 23:49:01 +02:00
parent 2da3b60118
commit 5f0e3b1e6f
11 changed files with 220 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
public/textures/cardboard.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 327 KiB

BIN
public/textures/cardboard_ico.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 12 KiB

BIN
public/textures/paper.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 365 KiB

BIN
public/textures/paper_ico.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 18 KiB

25
public/textures/squares/dark-lines.svg Normal file
View File

@@ -0,0 +1,25 @@
<svg width="180" height="180" viewBox="0 0 180 180" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_116_987)">
<path d="M14.5607 2.56068C15.1465 1.97489 15.1465 1.02512 14.5607 0.439339C13.9749 -0.146446 13.0252 -0.146446 12.4394 0.439339L1.43936 11.4393C0.853546 12.0251 0.853546 12.9749 1.43936 13.5607C2.02518 14.1465 2.97488 14.1465 3.5607 13.5607L14.5607 2.56068Z" fill="black" fill-opacity="0.4"/>
<path d="M36.5607 2.56068C37.1465 1.97489 37.1465 1.02512 36.5607 0.439339C35.9749 -0.146446 35.0252 -0.146446 34.4394 0.439339L1.43936 33.4393C0.853546 34.0251 0.853546 34.9749 1.43936 35.5607C2.02518 36.1465 2.97488 36.1465 3.5607 35.5607L36.5607 2.56068Z" fill="black" fill-opacity="0.4"/>
<path d="M58.5607 2.56068C59.1465 1.97489 59.1465 1.02512 58.5607 0.439339C57.9749 -0.146446 57.0252 -0.146446 56.4394 0.439339L1.43936 55.4393C0.853546 56.0251 0.853546 56.9749 1.43936 57.5607C2.02518 58.1465 2.97488 58.1465 3.5607 57.5607L58.5607 2.56068Z" fill="black" fill-opacity="0.4"/>
<path d="M80.5607 2.56068C81.1465 1.97489 81.1465 1.02512 80.5607 0.439339C79.9749 -0.146446 79.0252 -0.146446 78.4394 0.439339L1.43936 77.4393C0.853546 78.0251 0.853546 78.9749 1.43936 79.5607C2.02518 80.1465 2.97488 80.1465 3.5607 79.5607L80.5607 2.56068Z" fill="black" fill-opacity="0.4"/>
<path d="M102.561 2.56068C103.147 1.97489 103.147 1.02512 102.561 0.439339C101.975 -0.146446 101.025 -0.146446 100.439 0.439339L1.43936 99.4393C0.853546 100.025 0.853546 100.975 1.43936 101.561C2.02518 102.146 2.97488 102.146 3.5607 101.561L102.561 2.56068Z" fill="black" fill-opacity="0.4"/>
<path d="M124.561 2.56068C125.147 1.97489 125.147 1.02512 124.561 0.439339C123.975 -0.146446 123.025 -0.146446 122.439 0.439339L1.43936 121.439C0.853546 122.025 0.853546 122.975 1.43936 123.561C2.02518 124.146 2.97488 124.146 3.5607 123.561L124.561 2.56068Z" fill="black" fill-opacity="0.4"/>
<path d="M146.561 2.56068C147.147 1.97489 147.147 1.02512 146.561 0.439339C145.975 -0.146446 145.025 -0.146446 144.439 0.439339L1.43936 143.439C0.853546 144.025 0.853546 144.975 1.43936 145.561C2.02518 146.146 2.97488 146.146 3.5607 145.561L146.561 2.56068Z" fill="black" fill-opacity="0.4"/>
<path d="M168.561 2.56068C169.147 1.97489 169.147 1.02512 168.561 0.439339C167.975 -0.146446 167.025 -0.146446 166.439 0.439339L1.43936 165.439C0.853546 166.025 0.853546 166.975 1.43936 167.561C2.02518 168.146 2.97488 168.146 3.5607 167.561L168.561 2.56068Z" fill="black" fill-opacity="0.4"/>
<path d="M179.561 13.5607C180.147 12.9749 180.147 12.0251 179.561 11.4393C178.975 10.8536 178.025 10.8536 177.439 11.4393L12.4394 176.439C11.8535 177.025 11.8535 177.975 12.4394 178.561C13.0252 179.146 13.9749 179.146 14.5607 178.561L179.561 13.5607Z" fill="black" fill-opacity="0.4"/>
<path d="M179.561 35.5607C180.147 34.9749 180.147 34.0251 179.561 33.4393C178.975 32.8536 178.025 32.8536 177.439 33.4393L34.4394 176.439C33.8535 177.025 33.8535 177.975 34.4394 178.561C35.0252 179.146 35.9749 179.146 36.5607 178.561L179.561 35.5607Z" fill="black" fill-opacity="0.4"/>
<path d="M179.561 57.5607C180.147 56.9749 180.147 56.0251 179.561 55.4393C178.975 54.8536 178.025 54.8536 177.439 55.4393L56.4394 176.439C55.8535 177.025 55.8535 177.975 56.4394 178.561C57.0252 179.146 57.9749 179.146 58.5607 178.561L179.561 57.5607Z" fill="black" fill-opacity="0.4"/>
<path d="M179.561 79.5607C180.147 78.9749 180.147 78.0251 179.561 77.4393C178.975 76.8536 178.025 76.8536 177.439 77.4393L78.4394 176.439C77.8535 177.025 77.8535 177.975 78.4394 178.561C79.0252 179.146 79.9749 179.146 80.5607 178.561L179.561 79.5607Z" fill="black" fill-opacity="0.4"/>
<path d="M179.561 101.561C180.147 100.975 180.147 100.025 179.561 99.4393C178.975 98.8536 178.025 98.8536 177.439 99.4393L100.439 176.439C99.8535 177.025 99.8535 177.975 100.439 178.561C101.025 179.146 101.975 179.146 102.561 178.561L179.561 101.561Z" fill="black" fill-opacity="0.4"/>
<path d="M179.561 123.561C180.147 122.975 180.147 122.025 179.561 121.439C178.975 120.854 178.025 120.854 177.439 121.439L122.439 176.439C121.854 177.025 121.854 177.975 122.439 178.561C123.025 179.146 123.975 179.146 124.561 178.561L179.561 123.561Z" fill="black" fill-opacity="0.4"/>
<path d="M179.561 145.561C180.147 144.975 180.147 144.025 179.561 143.439C178.975 142.854 178.025 142.854 177.439 143.439L144.439 176.439C143.854 177.025 143.854 177.975 144.439 178.561C145.025 179.146 145.975 179.146 146.561 178.561L179.561 145.561Z" fill="black" fill-opacity="0.4"/>
<path d="M179.561 167.561C180.147 166.975 180.147 166.025 179.561 165.439C178.975 164.854 178.025 164.854 177.439 165.439L166.439 176.439C165.854 177.025 165.854 177.975 166.439 178.561C167.025 179.146 167.975 179.146 168.561 178.561L179.561 167.561Z" fill="black" fill-opacity="0.4"/>
</g>
<defs>
<clipPath id="clip0_116_987">
<rect width="180" height="180" fill="white"/>
</clipPath>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 4.8 KiB

25
public/textures/squares/dark-lines2.svg Normal file
View File

@@ -0,0 +1,25 @@
<svg width="180" height="180" viewBox="0 0 180 180" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_119_992)">
<path d="M14.5607 2.56068C15.1465 1.97489 15.1465 1.02512 14.5607 0.439339C13.9749 -0.146446 13.0252 -0.146446 12.4394 0.439339L1.43936 11.4393C0.853546 12.0251 0.853546 12.9749 1.43936 13.5607C2.02518 14.1465 2.97488 14.1465 3.5607 13.5607L14.5607 2.56068Z" fill="black" fill-opacity="0.6"/>
<path d="M36.5607 2.56068C37.1465 1.97489 37.1465 1.02512 36.5607 0.439339C35.9749 -0.146446 35.0252 -0.146446 34.4394 0.439339L1.43936 33.4393C0.853546 34.0251 0.853546 34.9749 1.43936 35.5607C2.02518 36.1465 2.97488 36.1465 3.5607 35.5607L36.5607 2.56068Z" fill="black" fill-opacity="0.6"/>
<path d="M58.5607 2.56068C59.1465 1.97489 59.1465 1.02512 58.5607 0.439339C57.9749 -0.146446 57.0252 -0.146446 56.4394 0.439339L1.43936 55.4393C0.853546 56.0251 0.853546 56.9749 1.43936 57.5607C2.02518 58.1465 2.97488 58.1465 3.5607 57.5607L58.5607 2.56068Z" fill="black" fill-opacity="0.6"/>
<path d="M80.5607 2.56068C81.1465 1.97489 81.1465 1.02512 80.5607 0.439339C79.9749 -0.146446 79.0252 -0.146446 78.4394 0.439339L1.43936 77.4393C0.853546 78.0251 0.853546 78.9749 1.43936 79.5607C2.02518 80.1465 2.97488 80.1465 3.5607 79.5607L80.5607 2.56068Z" fill="black" fill-opacity="0.6"/>
<path d="M102.561 2.56068C103.147 1.97489 103.147 1.02512 102.561 0.439339C101.975 -0.146446 101.025 -0.146446 100.439 0.439339L1.43936 99.4393C0.853546 100.025 0.853546 100.975 1.43936 101.561C2.02518 102.146 2.97488 102.146 3.5607 101.561L102.561 2.56068Z" fill="black" fill-opacity="0.6"/>
<path d="M124.561 2.56068C125.147 1.97489 125.147 1.02512 124.561 0.439339C123.975 -0.146446 123.025 -0.146446 122.439 0.439339L1.43936 121.439C0.853546 122.025 0.853546 122.975 1.43936 123.561C2.02518 124.146 2.97488 124.146 3.5607 123.561L124.561 2.56068Z" fill="black" fill-opacity="0.6"/>
<path d="M146.561 2.56068C147.147 1.97489 147.147 1.02512 146.561 0.439339C145.975 -0.146446 145.025 -0.146446 144.439 0.439339L1.43936 143.439C0.853546 144.025 0.853546 144.975 1.43936 145.561C2.02518 146.146 2.97488 146.146 3.5607 145.561L146.561 2.56068Z" fill="black" fill-opacity="0.6"/>
<path d="M168.561 2.56068C169.147 1.97489 169.147 1.02512 168.561 0.439339C167.975 -0.146446 167.025 -0.146446 166.439 0.439339L1.43936 165.439C0.853546 166.025 0.853546 166.975 1.43936 167.561C2.02518 168.146 2.97488 168.146 3.5607 167.561L168.561 2.56068Z" fill="black" fill-opacity="0.6"/>
<path d="M179.561 13.5607C180.147 12.9749 180.147 12.0251 179.561 11.4393C178.975 10.8536 178.025 10.8536 177.439 11.4393L12.4394 176.439C11.8535 177.025 11.8535 177.975 12.4394 178.561C13.0252 179.146 13.9749 179.146 14.5607 178.561L179.561 13.5607Z" fill="black" fill-opacity="0.6"/>
<path d="M179.561 35.5607C180.147 34.9749 180.147 34.0251 179.561 33.4393C178.975 32.8536 178.025 32.8536 177.439 33.4393L34.4394 176.439C33.8535 177.025 33.8535 177.975 34.4394 178.561C35.0252 179.146 35.9749 179.146 36.5607 178.561L179.561 35.5607Z" fill="black" fill-opacity="0.6"/>
<path d="M179.561 57.5607C180.147 56.9749 180.147 56.0251 179.561 55.4393C178.975 54.8536 178.025 54.8536 177.439 55.4393L56.4394 176.439C55.8535 177.025 55.8535 177.975 56.4394 178.561C57.0252 179.146 57.9749 179.146 58.5607 178.561L179.561 57.5607Z" fill="black" fill-opacity="0.6"/>
<path d="M179.561 79.5607C180.147 78.9749 180.147 78.0251 179.561 77.4393C178.975 76.8536 178.025 76.8536 177.439 77.4393L78.4394 176.439C77.8535 177.025 77.8535 177.975 78.4394 178.561C79.0252 179.146 79.9749 179.146 80.5607 178.561L179.561 79.5607Z" fill="black" fill-opacity="0.6"/>
<path d="M179.561 101.561C180.147 100.975 180.147 100.025 179.561 99.4393C178.975 98.8536 178.025 98.8536 177.439 99.4393L100.439 176.439C99.8535 177.025 99.8535 177.975 100.439 178.561C101.025 179.146 101.975 179.146 102.561 178.561L179.561 101.561Z" fill="black" fill-opacity="0.6"/>
<path d="M179.561 123.561C180.147 122.975 180.147 122.025 179.561 121.439C178.975 120.854 178.025 120.854 177.439 121.439L122.439 176.439C121.854 177.025 121.854 177.975 122.439 178.561C123.025 179.146 123.975 179.146 124.561 178.561L179.561 123.561Z" fill="black" fill-opacity="0.6"/>
<path d="M179.561 145.561C180.147 144.975 180.147 144.025 179.561 143.439C178.975 142.854 178.025 142.854 177.439 143.439L144.439 176.439C143.854 177.025 143.854 177.975 144.439 178.561C145.025 179.146 145.975 179.146 146.561 178.561L179.561 145.561Z" fill="black" fill-opacity="0.6"/>
<path d="M179.561 167.561C180.147 166.975 180.147 166.025 179.561 165.439C178.975 164.854 178.025 164.854 177.439 165.439L166.439 176.439C165.854 177.025 165.854 177.975 166.439 178.561C167.025 179.146 167.975 179.146 168.561 178.561L179.561 167.561Z" fill="black" fill-opacity="0.6"/>
</g>
<defs>
<clipPath id="clip0_119_992">
<rect width="180" height="180" fill="white"/>
</clipPath>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 4.8 KiB

8
src/board/styles-board/boardStyles.ts
View File

@@ -65,6 +65,10 @@ import wood5 from "./pic/wood5";
import wood6 from "./pic/wood6"; import wood6 from "./pic/wood6";
import wood7 from "./pic/wood7"; import wood7 from "./pic/wood7";
import wood8 from "./pic/wood8"; import wood8 from "./pic/wood8";
import lines_parchment from "./pic/lines_parchment";
import lines_alabaster from "./pic/lines_alabaster";
import lines_paper from "./pic/lines_paper";
import lines_cardboard from "./pic/lines_cardboard";
const boardStyles = { const boardStyles = {
standard, standard,
@@ -133,6 +137,10 @@ const boardStyles = {
wood6, wood6,
wood7, wood7,
wood8, wood8,
lines_parchment,
lines_alabaster,
lines_paper,
lines_cardboard,
}; };
const boardNames = Object.keys(boardStyles); const boardNames = Object.keys(boardStyles);

40
src/board/styles-board/pic/lines_alabaster.ts Normal file
View File

@@ -0,0 +1,40 @@
import { Style } from "../../../types";
const style: Style = {
category: "pic",
background: {
type: "solid",
data: {
color: "#EDEDED",
},
},
dark: {
type: "image",
data: {
src: "/textures/squares/dark-lines.svg",
},
},
light: {
type: "solid",
data: {
color: "transparent",
},
},
moveIndicator: {
type: "color",
data: "#55ff0022",
},
border: {
type: "solid",
data: {
color: "#BBBBBB",
},
},
coords: {
onLight: "#0000007f",
onDark: "#00000099",
onBorder: "#00000099",
},
};
export default style;

41
src/board/styles-board/pic/lines_cardboard.ts Normal file
View File

@@ -0,0 +1,41 @@
import { Style } from "../../../types";
const style: Style = {
category: "pic",
background: {
type: "solid",
data: {
color: "transparent",
},
},
dark: {
type: "image",
data: {
src: "/textures/squares/dark-lines2.svg",
},
},
light: {
type: "solid",
data: {
color: "transparent",
},
},
moveIndicator: {
type: "color",
data: "#55ff0022",
},
border: {
type: "image",
data: {
src: "/textures/cardboard.jpg",
},
},
coords: {
onLight: "#0000007f",
onDark: "#00000099",
onBorder: "#00000099",
},
ico: "/textures/cardboard_ico.png",
};
export default style;

41
src/board/styles-board/pic/lines_paper.ts Normal file
View File

@@ -0,0 +1,41 @@
import { Style } from "../../../types";
const style: Style = {
category: "pic",
background: {
type: "solid",
data: {
color: "transparent",
},
},
dark: {
type: "image",
data: {
src: "/textures/squares/dark-lines2.svg",
},
},
light: {
type: "solid",
data: {
color: "transparent",
},
},
moveIndicator: {
type: "color",
data: "#55ff0022",
},
border: {
type: "image",
data: {
src: "/textures/paper.jpg",
},
},
coords: {
onLight: "#0000007f",
onDark: "#00000099",
onBorder: "#00000099",
},
ico: "/textures/paper_ico.png",
};
export default style;

40
src/board/styles-board/pic/lines_parchment.ts Normal file
View File

@@ -0,0 +1,40 @@
import { Style } from "../../../types";
const style: Style = {
category: "pic",
background: {
type: "solid",
data: {
color: "#EFDEB1",
},
},
dark: {
type: "image",
data: {
src: "/textures/squares/dark-lines.svg",
},
},
light: {
type: "solid",
data: {
color: "transparent",
},
},
moveIndicator: {
type: "color",
data: "#55ff0022",
},
border: {
type: "solid",
data: {
color: "#C5B386",
},
},
coords: {
onLight: "#0000007f",
onDark: "#00000099",
onBorder: "#00000099",
},
};
export default style;