Compare commits
2 Commits
41c5f6444d
...
76f7ced8e9
| Author | SHA1 | Date | |
|---|---|---|---|
| 76f7ced8e9 | |||
| fc0a696157 |
379
package-lock.json
generated
379
package-lock.json
generated
@@ -8,8 +8,11 @@
|
||||
"name": "dsa5e-character-sheet-symbiote",
|
||||
"version": "0.0.0",
|
||||
"dependencies": {
|
||||
"i18next": "^25.2.1",
|
||||
"i18next-browser-languagedetector": "^8.2.0",
|
||||
"react": "^19.1.0",
|
||||
"react-dom": "^19.1.0",
|
||||
"react-i18next": "^15.5.3",
|
||||
"react-icons": "^5.5.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
@@ -264,6 +267,15 @@
|
||||
"@babel/core": "^7.0.0-0"
|
||||
}
|
||||
},
|
||||
"node_modules/@babel/runtime": {
|
||||
"version": "7.27.6",
|
||||
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.27.6.tgz",
|
||||
"integrity": "sha512-vbavdySgbTTrmFE+EsiqUTzlOr5bzlnJtUv9PynGCAKvfQqjIXbvFdumPM/GxMDfyuGMJaJAU6TO4zc1Jf1i8Q==",
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=6.9.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@babel/template": {
|
||||
"version": "7.27.2",
|
||||
"resolved": "https://registry.npmjs.org/@babel/template/-/template-7.27.2.tgz",
|
||||
@@ -1984,6 +1996,18 @@
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/detect-libc": {
|
||||
"version": "2.0.4",
|
||||
"resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-2.0.4.tgz",
|
||||
"integrity": "sha512-3UDv+G9CsCKO1WKMGw9fwq/SWJYbI0c5Y7LU1AXYoDdbhE2AHQ6N6Nb34sG8Fj7T5APy8qXDCKuuIHd1BR0tVA==",
|
||||
"dev": true,
|
||||
"license": "Apache-2.0",
|
||||
"optional": true,
|
||||
"peer": true,
|
||||
"engines": {
|
||||
"node": ">=8"
|
||||
}
|
||||
},
|
||||
"node_modules/electron-to-chromium": {
|
||||
"version": "1.5.167",
|
||||
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.167.tgz",
|
||||
@@ -2426,6 +2450,55 @@
|
||||
"node": ">=8"
|
||||
}
|
||||
},
|
||||
"node_modules/html-parse-stringify": {
|
||||
"version": "3.0.1",
|
||||
"resolved": "https://registry.npmjs.org/html-parse-stringify/-/html-parse-stringify-3.0.1.tgz",
|
||||
"integrity": "sha512-KknJ50kTInJ7qIScF3jeaFRpMpE8/lfiTdzf/twXyPBLAGrLRTmkz3AdTnKeh40X8k9L2fdYwEp/42WGXIRGcg==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"void-elements": "3.1.0"
|
||||
}
|
||||
},
|
||||
"node_modules/i18next": {
|
||||
"version": "25.2.1",
|
||||
"resolved": "https://registry.npmjs.org/i18next/-/i18next-25.2.1.tgz",
|
||||
"integrity": "sha512-+UoXK5wh+VlE1Zy5p6MjcvctHXAhRwQKCxiJD8noKZzIXmnAX8gdHX5fLPA3MEVxEN4vbZkQFy8N0LyD9tUqPw==",
|
||||
"funding": [
|
||||
{
|
||||
"type": "individual",
|
||||
"url": "https://locize.com"
|
||||
},
|
||||
{
|
||||
"type": "individual",
|
||||
"url": "https://locize.com/i18next.html"
|
||||
},
|
||||
{
|
||||
"type": "individual",
|
||||
"url": "https://www.i18next.com/how-to/faq#i18next-is-awesome.-how-can-i-support-the-project"
|
||||
}
|
||||
],
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.27.1"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"typescript": "^5"
|
||||
},
|
||||
"peerDependenciesMeta": {
|
||||
"typescript": {
|
||||
"optional": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/i18next-browser-languagedetector": {
|
||||
"version": "8.2.0",
|
||||
"resolved": "https://registry.npmjs.org/i18next-browser-languagedetector/-/i18next-browser-languagedetector-8.2.0.tgz",
|
||||
"integrity": "sha512-P+3zEKLnOF0qmiesW383vsLdtQVyKtCNA9cjSoKCppTKPQVfKd2W8hbVo5ZhNJKDqeM7BOcvNoKJOjpHh4Js9g==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.23.2"
|
||||
}
|
||||
},
|
||||
"node_modules/ignore": {
|
||||
"version": "5.3.2",
|
||||
"resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.2.tgz",
|
||||
@@ -2503,6 +2576,18 @@
|
||||
"dev": true,
|
||||
"license": "ISC"
|
||||
},
|
||||
"node_modules/jiti": {
|
||||
"version": "2.4.2",
|
||||
"resolved": "https://registry.npmjs.org/jiti/-/jiti-2.4.2.tgz",
|
||||
"integrity": "sha512-rg9zJN+G4n2nfJl5MW3BMygZX56zKPNVEYYqq7adpmMh4Jn2QNEwhvQlFy6jPVdcod7txZtKHWnyZiA3a0zP7A==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"peer": true,
|
||||
"bin": {
|
||||
"jiti": "lib/jiti-cli.mjs"
|
||||
}
|
||||
},
|
||||
"node_modules/js-tokens": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
|
||||
@@ -2594,6 +2679,257 @@
|
||||
"node": ">= 0.8.0"
|
||||
}
|
||||
},
|
||||
"node_modules/lightningcss": {
|
||||
"version": "1.30.1",
|
||||
"resolved": "https://registry.npmjs.org/lightningcss/-/lightningcss-1.30.1.tgz",
|
||||
"integrity": "sha512-xi6IyHML+c9+Q3W0S4fCQJOym42pyurFiJUHEcEyHS0CeKzia4yZDEsLlqOFykxOdHpNy0NmvVO31vcSqAxJCg==",
|
||||
"dev": true,
|
||||
"license": "MPL-2.0",
|
||||
"optional": true,
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"detect-libc": "^2.0.3"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">= 12.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/parcel"
|
||||
},
|
||||
"optionalDependencies": {
|
||||
"lightningcss-darwin-arm64": "1.30.1",
|
||||
"lightningcss-darwin-x64": "1.30.1",
|
||||
"lightningcss-freebsd-x64": "1.30.1",
|
||||
"lightningcss-linux-arm-gnueabihf": "1.30.1",
|
||||
"lightningcss-linux-arm64-gnu": "1.30.1",
|
||||
"lightningcss-linux-arm64-musl": "1.30.1",
|
||||
"lightningcss-linux-x64-gnu": "1.30.1",
|
||||
"lightningcss-linux-x64-musl": "1.30.1",
|
||||
"lightningcss-win32-arm64-msvc": "1.30.1",
|
||||
"lightningcss-win32-x64-msvc": "1.30.1"
|
||||
}
|
||||
},
|
||||
"node_modules/lightningcss-darwin-arm64": {
|
||||
"version": "1.30.1",
|
||||
"resolved": "https://registry.npmjs.org/lightningcss-darwin-arm64/-/lightningcss-darwin-arm64-1.30.1.tgz",
|
||||
"integrity": "sha512-c8JK7hyE65X1MHMN+Viq9n11RRC7hgin3HhYKhrMyaXflk5GVplZ60IxyoVtzILeKr+xAJwg6zK6sjTBJ0FKYQ==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MPL-2.0",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"darwin"
|
||||
],
|
||||
"peer": true,
|
||||
"engines": {
|
||||
"node": ">= 12.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/parcel"
|
||||
}
|
||||
},
|
||||
"node_modules/lightningcss-darwin-x64": {
|
||||
"version": "1.30.1",
|
||||
"resolved": "https://registry.npmjs.org/lightningcss-darwin-x64/-/lightningcss-darwin-x64-1.30.1.tgz",
|
||||
"integrity": "sha512-k1EvjakfumAQoTfcXUcHQZhSpLlkAuEkdMBsI/ivWw9hL+7FtilQc0Cy3hrx0AAQrVtQAbMI7YjCgYgvn37PzA==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MPL-2.0",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"darwin"
|
||||
],
|
||||
"peer": true,
|
||||
"engines": {
|
||||
"node": ">= 12.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/parcel"
|
||||
}
|
||||
},
|
||||
"node_modules/lightningcss-freebsd-x64": {
|
||||
"version": "1.30.1",
|
||||
"resolved": "https://registry.npmjs.org/lightningcss-freebsd-x64/-/lightningcss-freebsd-x64-1.30.1.tgz",
|
||||
"integrity": "sha512-kmW6UGCGg2PcyUE59K5r0kWfKPAVy4SltVeut+umLCFoJ53RdCUWxcRDzO1eTaxf/7Q2H7LTquFHPL5R+Gjyig==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MPL-2.0",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"freebsd"
|
||||
],
|
||||
"peer": true,
|
||||
"engines": {
|
||||
"node": ">= 12.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/parcel"
|
||||
}
|
||||
},
|
||||
"node_modules/lightningcss-linux-arm-gnueabihf": {
|
||||
"version": "1.30.1",
|
||||
"resolved": "https://registry.npmjs.org/lightningcss-linux-arm-gnueabihf/-/lightningcss-linux-arm-gnueabihf-1.30.1.tgz",
|
||||
"integrity": "sha512-MjxUShl1v8pit+6D/zSPq9S9dQ2NPFSQwGvxBCYaBYLPlCWuPh9/t1MRS8iUaR8i+a6w7aps+B4N0S1TYP/R+Q==",
|
||||
"cpu": [
|
||||
"arm"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MPL-2.0",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"linux"
|
||||
],
|
||||
"peer": true,
|
||||
"engines": {
|
||||
"node": ">= 12.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/parcel"
|
||||
}
|
||||
},
|
||||
"node_modules/lightningcss-linux-arm64-gnu": {
|
||||
"version": "1.30.1",
|
||||
"resolved": "https://registry.npmjs.org/lightningcss-linux-arm64-gnu/-/lightningcss-linux-arm64-gnu-1.30.1.tgz",
|
||||
"integrity": "sha512-gB72maP8rmrKsnKYy8XUuXi/4OctJiuQjcuqWNlJQ6jZiWqtPvqFziskH3hnajfvKB27ynbVCucKSm2rkQp4Bw==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MPL-2.0",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"linux"
|
||||
],
|
||||
"peer": true,
|
||||
"engines": {
|
||||
"node": ">= 12.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/parcel"
|
||||
}
|
||||
},
|
||||
"node_modules/lightningcss-linux-arm64-musl": {
|
||||
"version": "1.30.1",
|
||||
"resolved": "https://registry.npmjs.org/lightningcss-linux-arm64-musl/-/lightningcss-linux-arm64-musl-1.30.1.tgz",
|
||||
"integrity": "sha512-jmUQVx4331m6LIX+0wUhBbmMX7TCfjF5FoOH6SD1CttzuYlGNVpA7QnrmLxrsub43ClTINfGSYyHe2HWeLl5CQ==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MPL-2.0",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"linux"
|
||||
],
|
||||
"peer": true,
|
||||
"engines": {
|
||||
"node": ">= 12.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/parcel"
|
||||
}
|
||||
},
|
||||
"node_modules/lightningcss-linux-x64-gnu": {
|
||||
"version": "1.30.1",
|
||||
"resolved": "https://registry.npmjs.org/lightningcss-linux-x64-gnu/-/lightningcss-linux-x64-gnu-1.30.1.tgz",
|
||||
"integrity": "sha512-piWx3z4wN8J8z3+O5kO74+yr6ze/dKmPnI7vLqfSqI8bccaTGY5xiSGVIJBDd5K5BHlvVLpUB3S2YCfelyJ1bw==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MPL-2.0",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"linux"
|
||||
],
|
||||
"peer": true,
|
||||
"engines": {
|
||||
"node": ">= 12.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/parcel"
|
||||
}
|
||||
},
|
||||
"node_modules/lightningcss-linux-x64-musl": {
|
||||
"version": "1.30.1",
|
||||
"resolved": "https://registry.npmjs.org/lightningcss-linux-x64-musl/-/lightningcss-linux-x64-musl-1.30.1.tgz",
|
||||
"integrity": "sha512-rRomAK7eIkL+tHY0YPxbc5Dra2gXlI63HL+v1Pdi1a3sC+tJTcFrHX+E86sulgAXeI7rSzDYhPSeHHjqFhqfeQ==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MPL-2.0",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"linux"
|
||||
],
|
||||
"peer": true,
|
||||
"engines": {
|
||||
"node": ">= 12.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/parcel"
|
||||
}
|
||||
},
|
||||
"node_modules/lightningcss-win32-arm64-msvc": {
|
||||
"version": "1.30.1",
|
||||
"resolved": "https://registry.npmjs.org/lightningcss-win32-arm64-msvc/-/lightningcss-win32-arm64-msvc-1.30.1.tgz",
|
||||
"integrity": "sha512-mSL4rqPi4iXq5YVqzSsJgMVFENoa4nGTT/GjO2c0Yl9OuQfPsIfncvLrEW6RbbB24WtZ3xP/2CCmI3tNkNV4oA==",
|
||||
"cpu": [
|
||||
"arm64"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MPL-2.0",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"win32"
|
||||
],
|
||||
"peer": true,
|
||||
"engines": {
|
||||
"node": ">= 12.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/parcel"
|
||||
}
|
||||
},
|
||||
"node_modules/lightningcss-win32-x64-msvc": {
|
||||
"version": "1.30.1",
|
||||
"resolved": "https://registry.npmjs.org/lightningcss-win32-x64-msvc/-/lightningcss-win32-x64-msvc-1.30.1.tgz",
|
||||
"integrity": "sha512-PVqXh48wh4T53F/1CCu8PIPCxLzWyCnn/9T5W1Jpmdy5h9Cwd+0YQS6/LwhHXSafuc61/xg9Lv5OrCby6a++jg==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MPL-2.0",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"win32"
|
||||
],
|
||||
"peer": true,
|
||||
"engines": {
|
||||
"node": ">= 12.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/parcel"
|
||||
}
|
||||
},
|
||||
"node_modules/locate-path": {
|
||||
"version": "6.0.0",
|
||||
"resolved": "https://registry.npmjs.org/locate-path/-/locate-path-6.0.0.tgz",
|
||||
@@ -2808,9 +3144,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/postcss": {
|
||||
"version": "8.5.5",
|
||||
"resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.5.tgz",
|
||||
"integrity": "sha512-d/jtm+rdNT8tpXuHY5MMtcbJFBkhXE6593XVR9UoGCH8jSFGci7jGvMGH5RYd5PBJW+00NZQt6gf7CbagJCrhg==",
|
||||
"version": "8.5.6",
|
||||
"resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.6.tgz",
|
||||
"integrity": "sha512-3Ybi1tAuwAP9s0r1UQ2J4n5Y0G05bJkpUIO0/bI9MhwmD70S5aTWbXGBwxHrelT+XM1k6dM0pk+SwNkpTRN7Pg==",
|
||||
"dev": true,
|
||||
"funding": [
|
||||
{
|
||||
@@ -2898,6 +3234,32 @@
|
||||
"react": "^19.1.0"
|
||||
}
|
||||
},
|
||||
"node_modules/react-i18next": {
|
||||
"version": "15.5.3",
|
||||
"resolved": "https://registry.npmjs.org/react-i18next/-/react-i18next-15.5.3.tgz",
|
||||
"integrity": "sha512-ypYmOKOnjqPEJZO4m1BI0kS8kWqkBNsKYyhVUfij0gvjy9xJNoG/VcGkxq5dRlVwzmrmY1BQMAmpbbUBLwC4Kw==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.27.6",
|
||||
"html-parse-stringify": "^3.0.1"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"i18next": ">= 23.2.3",
|
||||
"react": ">= 16.8.0",
|
||||
"typescript": "^5"
|
||||
},
|
||||
"peerDependenciesMeta": {
|
||||
"react-dom": {
|
||||
"optional": true
|
||||
},
|
||||
"react-native": {
|
||||
"optional": true
|
||||
},
|
||||
"typescript": {
|
||||
"optional": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/react-icons": {
|
||||
"version": "5.5.0",
|
||||
"resolved": "https://registry.npmjs.org/react-icons/-/react-icons-5.5.0.tgz",
|
||||
@@ -3172,7 +3534,7 @@
|
||||
"version": "5.8.3",
|
||||
"resolved": "https://registry.npmjs.org/typescript/-/typescript-5.8.3.tgz",
|
||||
"integrity": "sha512-p1diW6TqL9L07nNxvRMM7hMMw4c5XOo/1ibL4aAIGmSAt9slTE1Xgw5KWuof2uTOvCg9BY7ZRi+GaF+7sfgPeQ==",
|
||||
"dev": true,
|
||||
"devOptional": true,
|
||||
"license": "Apache-2.0",
|
||||
"bin": {
|
||||
"tsc": "bin/tsc",
|
||||
@@ -3349,6 +3711,15 @@
|
||||
"url": "https://github.com/sponsors/jonschlinkert"
|
||||
}
|
||||
},
|
||||
"node_modules/void-elements": {
|
||||
"version": "3.1.0",
|
||||
"resolved": "https://registry.npmjs.org/void-elements/-/void-elements-3.1.0.tgz",
|
||||
"integrity": "sha512-Dhxzh5HZuiHQhbvTW9AMetFfBHDMYpo23Uo9btPXgdYP+3T5S+p+jgNy7spra+veYhBP2dCSgxR/i2Y02h5/6w==",
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=0.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/which": {
|
||||
"version": "2.0.2",
|
||||
"resolved": "https://registry.npmjs.org/which/-/which-2.0.2.tgz",
|
||||
|
||||
@@ -10,8 +10,11 @@
|
||||
"preview": "vite preview"
|
||||
},
|
||||
"dependencies": {
|
||||
"i18next": "^25.2.1",
|
||||
"i18next-browser-languagedetector": "^8.2.0",
|
||||
"react": "^19.1.0",
|
||||
"react-dom": "^19.1.0",
|
||||
"react-i18next": "^15.5.3",
|
||||
"react-icons": "^5.5.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
import React from 'react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import type {DSACharacter, DSAAttributes} from '../types/character';
|
||||
|
||||
interface AttributesProps {
|
||||
@@ -7,6 +8,7 @@ interface AttributesProps {
|
||||
}
|
||||
|
||||
const Attributes: React.FC<AttributesProps> = ({ character, setCharacter }) => {
|
||||
const { t } = useTranslation();
|
||||
const updateAttribute = (attr: keyof DSAAttributes, value: number) => {
|
||||
// Input validation - clamp between 1 and 20
|
||||
const clampedValue = Math.min(20, Math.max(1, value));
|
||||
@@ -20,25 +22,18 @@ const Attributes: React.FC<AttributesProps> = ({ character, setCharacter }) => {
|
||||
}));
|
||||
};
|
||||
|
||||
const attributeDisplayNames: Record<keyof DSAAttributes, string> = {
|
||||
courage: "CO - Courage",
|
||||
cleverness: "CL - Cleverness",
|
||||
intuition: "IN - Intuition",
|
||||
charisma: "CH - Charisma",
|
||||
dexterity: "DE - Dexterity",
|
||||
agility: "AG - Agility",
|
||||
constitution: "CN - Constitution",
|
||||
strength: "ST - Strength"
|
||||
const getAttributeDisplayName = (attr: keyof DSAAttributes): string => {
|
||||
return t(`attributes.${attr}`);
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="attributes section">
|
||||
<h2>Attributes</h2>
|
||||
<h2>{t('attributes.title')}</h2>
|
||||
<div className="attributes-grid">
|
||||
{Object.entries(character.attributes).map(([key, value]) => (
|
||||
<div key={key} className="attribute">
|
||||
<label htmlFor={key}>
|
||||
{attributeDisplayNames[key as keyof DSAAttributes]}
|
||||
{getAttributeDisplayName(key as keyof DSAAttributes)}
|
||||
</label>
|
||||
<input
|
||||
id={key}
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
import React from 'react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import type {DSACharacter} from '../types/character';
|
||||
|
||||
interface BasicInfoProps {
|
||||
@@ -7,6 +8,7 @@ interface BasicInfoProps {
|
||||
}
|
||||
|
||||
const BasicInfo: React.FC<BasicInfoProps> = ({ character, setCharacter }) => {
|
||||
const { t } = useTranslation();
|
||||
const updateField = (field: keyof DSACharacter, value: string) => {
|
||||
setCharacter(prev => ({
|
||||
...prev,
|
||||
@@ -16,50 +18,50 @@ const BasicInfo: React.FC<BasicInfoProps> = ({ character, setCharacter }) => {
|
||||
|
||||
return (
|
||||
<div className="basic-info section">
|
||||
<h2>Basic Information</h2>
|
||||
<h2>{t('basicInfo.title')}</h2>
|
||||
<div className="form-grid">
|
||||
<div className="form-group">
|
||||
<label htmlFor="name">Name</label>
|
||||
<label htmlFor="name">{t('basicInfo.name')}</label>
|
||||
<input
|
||||
id="name"
|
||||
type="text"
|
||||
value={character.name}
|
||||
onChange={(e) => updateField('name', e.target.value)}
|
||||
placeholder="Enter character name"
|
||||
placeholder={t('basicInfo.namePlaceholder')}
|
||||
/>
|
||||
</div>
|
||||
<div className="form-group">
|
||||
<label htmlFor="species">Species</label>
|
||||
<label htmlFor="species">{t('basicInfo.species')}</label>
|
||||
<input
|
||||
id="species"
|
||||
type="text"
|
||||
value={character.species}
|
||||
onChange={(e) => updateField('species', e.target.value)}
|
||||
placeholder="e.g., Human, Elf, Dwarf"
|
||||
placeholder={t('basicInfo.speciesPlaceholder')}
|
||||
/>
|
||||
</div>
|
||||
<div className="form-group">
|
||||
<label htmlFor="culture">Culture</label>
|
||||
<label htmlFor="culture">{t('basicInfo.culture')}</label>
|
||||
<input
|
||||
id="culture"
|
||||
type="text"
|
||||
value={character.culture}
|
||||
onChange={(e) => updateField('culture', e.target.value)}
|
||||
placeholder="e.g., Middenrealmish, Thorwalian"
|
||||
placeholder={t('basicInfo.culturePlaceholder')}
|
||||
/>
|
||||
</div>
|
||||
<div className="form-group">
|
||||
<label htmlFor="profession">Profession</label>
|
||||
<label htmlFor="profession">{t('basicInfo.profession')}</label>
|
||||
<input
|
||||
id="profession"
|
||||
type="text"
|
||||
value={character.profession}
|
||||
onChange={(e) => updateField('profession', e.target.value)}
|
||||
placeholder="e.g., Warrior, Mage, Scout"
|
||||
placeholder={t('basicInfo.professionPlaceholder')}
|
||||
/>
|
||||
</div>
|
||||
<div className="form-group">
|
||||
<label htmlFor="experience-level">Experience Level</label>
|
||||
<label htmlFor="experience-level">{t('basicInfo.experienceLevel')}</label>
|
||||
<select
|
||||
id="experience-level"
|
||||
value={character.experienceLevel}
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
// src/components/CharacterSheet.tsx
|
||||
import React, { useState } from 'react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import type { DSACharacter } from '../types/character';
|
||||
import BasicInfo from './BasicInfo';
|
||||
import Attributes from './Attributes';
|
||||
@@ -7,9 +8,10 @@ import Skills from './Skills';
|
||||
import Spells from './Spells';
|
||||
import CombatValues from './CombatValues';
|
||||
import ThemeToggle from './ThemeToggle';
|
||||
import LanguageSelector from './LanguageSelector';
|
||||
import DSADiceRoller from "./DSADiceRoller.tsx";
|
||||
import iconUrl from '/icon.png';
|
||||
import './CharacterSheet.css';
|
||||
import '../styles/CharacterSheet.css';
|
||||
|
||||
// Erweiterte Initial-Daten mit Astralenergie und Zaubern
|
||||
const initialCharacter: DSACharacter = {
|
||||
@@ -48,6 +50,7 @@ const initialCharacter: DSACharacter = {
|
||||
};
|
||||
|
||||
const CharacterSheet: React.FC = () => {
|
||||
const { t } = useTranslation();
|
||||
const [character, setCharacter] = useState<DSACharacter>(initialCharacter);
|
||||
|
||||
// Hilfsfunktion um zu prüfen ob Charakter Zauberer ist
|
||||
@@ -56,14 +59,15 @@ const CharacterSheet: React.FC = () => {
|
||||
return (
|
||||
<div className="character-sheet">
|
||||
<ThemeToggle />
|
||||
<LanguageSelector />
|
||||
|
||||
<header className="character-sheet-header">
|
||||
<img
|
||||
src={iconUrl}
|
||||
alt="DSA 5e Character Sheet"
|
||||
alt={t('app.iconAlt')}
|
||||
className="character-sheet-icon"
|
||||
/>
|
||||
<h1>DSA 5 Character Sheet</h1>
|
||||
<h1>{t('app.title')}</h1>
|
||||
</header>
|
||||
|
||||
{/* Grundinformationen */}
|
||||
@@ -96,7 +100,7 @@ const CharacterSheet: React.FC = () => {
|
||||
astralEnergy: { max: 20, current: 20 }
|
||||
}))}
|
||||
>
|
||||
🪄 Zauberfähigkeiten hinzufügen
|
||||
{t('spells.addMagic')}
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
|
||||
30
src/components/LanguageSelector.tsx
Normal file
30
src/components/LanguageSelector.tsx
Normal file
@@ -0,0 +1,30 @@
|
||||
import React from 'react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import '../styles/LanguageSelector.css';
|
||||
|
||||
const LanguageSelector: React.FC = () => {
|
||||
const { i18n } = useTranslation();
|
||||
|
||||
const changeLanguage = (lng: string) => {
|
||||
i18n.changeLanguage(lng);
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="language-selector">
|
||||
<button
|
||||
className={`language-btn ${i18n.language === 'en' ? 'active' : ''}`}
|
||||
onClick={() => changeLanguage('en')}
|
||||
>
|
||||
🇬🇧 EN
|
||||
</button>
|
||||
<button
|
||||
className={`language-btn ${i18n.language === 'de' ? 'active' : ''}`}
|
||||
onClick={() => changeLanguage('de')}
|
||||
>
|
||||
🇩🇪 DE
|
||||
</button>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default LanguageSelector;
|
||||
@@ -1,6 +1,7 @@
|
||||
import React from 'react';
|
||||
import {FaMoon, FaSun} from "react-icons/fa";
|
||||
import {useTheme} from '../contexts/ThemeContext';
|
||||
import '../styles/ThemeToggle.css';
|
||||
|
||||
const ThemeToggle: React.FC = () => {
|
||||
const {theme, toggleTheme} = useTheme();
|
||||
|
||||
14
src/global.d.ts
vendored
Normal file
14
src/global.d.ts
vendored
Normal file
@@ -0,0 +1,14 @@
|
||||
declare global {
|
||||
interface Window {
|
||||
TS: {
|
||||
dice: {
|
||||
putDiceInTray: (rollData: any[], showInTray: boolean) => Promise<string>;
|
||||
onRollResults: (callback: (rollEvent: any) => void) => void;
|
||||
sendDiceResult: (resultGroups: any[], rollId: string) => Promise<void>;
|
||||
evaluateDiceResultsGroup: (group: any) => Promise<number>;
|
||||
};
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
export {};
|
||||
@@ -1,44 +1,136 @@
|
||||
import { useEffect, useState } from 'react';
|
||||
import { useEffect, useState, useCallback } from 'react';
|
||||
|
||||
interface DiceRollResult {
|
||||
interface DSAResult {
|
||||
dice: number[];
|
||||
total: number;
|
||||
timestamp: number;
|
||||
success: boolean;
|
||||
qualityLevel: number;
|
||||
remainingPoints: number;
|
||||
rollId?: string;
|
||||
}
|
||||
|
||||
interface TaleSpireAPI {
|
||||
rollDice: (diceString: string, label?: string) => Promise<DiceRollResult>;
|
||||
postToChat: (message: string) => void;
|
||||
}
|
||||
|
||||
// TaleSpire API global verfügbar machen
|
||||
declare global {
|
||||
interface Window {
|
||||
TS: TaleSpireAPI;
|
||||
}
|
||||
interface TrackedRoll {
|
||||
type: 'dsa' | 'simple';
|
||||
attributes?: [number, number, number];
|
||||
skillValue?: number;
|
||||
modifier?: number;
|
||||
label: string;
|
||||
bonus?: number;
|
||||
}
|
||||
|
||||
export const useTaleSpireDice = () => {
|
||||
const [isAvailable, setIsAvailable] = useState(false);
|
||||
const [trackedRolls, setTrackedRolls] = useState<Record<string, TrackedRoll>>({});
|
||||
const [rollResults, setRollResults] = useState<Record<string, any>>({});
|
||||
|
||||
useEffect(() => {
|
||||
// Prüfen ob TaleSpire API verfügbar ist
|
||||
setIsAvailable(!!window.TS);
|
||||
// Check if TaleSpire API is available
|
||||
const available = typeof window !== 'undefined' &&
|
||||
window.TS &&
|
||||
window.TS.dice;
|
||||
setIsAvailable(available);
|
||||
|
||||
if (available) {
|
||||
// Set up event listener for roll results
|
||||
window.TS.dice.onRollResults((rollEvent: any) => {
|
||||
handleRollResult(rollEvent);
|
||||
});
|
||||
}
|
||||
}, []);
|
||||
|
||||
const handleRollResult = useCallback(async (rollEvent: any) => {
|
||||
const rollId = rollEvent.payload.rollId;
|
||||
|
||||
if (!trackedRolls[rollId]) {
|
||||
return; // Not our roll
|
||||
}
|
||||
|
||||
if (rollEvent.kind === "rollResults") {
|
||||
const roll = rollEvent.payload;
|
||||
const rollData = trackedRolls[rollId];
|
||||
|
||||
let result;
|
||||
|
||||
if (rollData.type === 'dsa') {
|
||||
result = await evaluateDSACheck(roll, rollData);
|
||||
} else if (rollData.type === 'simple') {
|
||||
result = await evaluateSimpleRoll(roll, rollData);
|
||||
}
|
||||
|
||||
if (result) {
|
||||
// Send result back to TaleSpire
|
||||
await window.TS.dice.sendDiceResult([result.resultGroup], rollId);
|
||||
|
||||
// Store result locally
|
||||
setRollResults(prev => ({
|
||||
...prev,
|
||||
[rollId]: result
|
||||
}));
|
||||
}
|
||||
} else if (rollEvent.kind === "rollRemoved") {
|
||||
// Clean up when roll is removed
|
||||
setTrackedRolls(prev => {
|
||||
const updated = { ...prev };
|
||||
delete updated[rollId];
|
||||
return updated;
|
||||
});
|
||||
}
|
||||
}, [trackedRolls]);
|
||||
|
||||
const evaluateDSACheck = async (roll: any, rollData: TrackedRoll) => {
|
||||
if (!roll.resultsGroups || roll.resultsGroups.length < 1) {
|
||||
return null;
|
||||
}
|
||||
|
||||
const group = roll.resultsGroups[0];
|
||||
const dice: number[] = [];
|
||||
|
||||
// Extract dice results
|
||||
for (const result of group.results) {
|
||||
for (const die of result.dice) {
|
||||
dice.push(die.result);
|
||||
}
|
||||
}
|
||||
|
||||
// Calculate DSA result
|
||||
const dsaResult = calculateDSAResult(
|
||||
dice,
|
||||
rollData.attributes!,
|
||||
rollData.skillValue!,
|
||||
rollData.modifier!
|
||||
);
|
||||
|
||||
return {
|
||||
...dsaResult,
|
||||
resultGroup: group,
|
||||
type: 'dsa',
|
||||
label: rollData.label
|
||||
};
|
||||
};
|
||||
|
||||
const evaluateSimpleRoll = async (roll: any, rollData: TrackedRoll) => {
|
||||
if (!roll.resultsGroups || roll.resultsGroups.length < 1) {
|
||||
return null;
|
||||
}
|
||||
|
||||
const group = roll.resultsGroups[0];
|
||||
const total = await window.TS.dice.evaluateDiceResultsGroup(group);
|
||||
|
||||
return {
|
||||
resultGroup: group,
|
||||
total: total + (rollData.bonus || 0),
|
||||
type: 'simple',
|
||||
label: rollData.label
|
||||
};
|
||||
};
|
||||
|
||||
const rollDSACheck = async (
|
||||
attributes: [number, number, number],
|
||||
skillValue: number,
|
||||
modifier: number = 0,
|
||||
label: string = "DSA 5e Probe"
|
||||
): Promise<{
|
||||
dice: number[];
|
||||
success: boolean;
|
||||
qualityLevel: number;
|
||||
remainingPoints: number;
|
||||
}> => {
|
||||
if (!window.TS) {
|
||||
// Fallback für Development ohne TaleSpire
|
||||
): Promise<DSAResult> => {
|
||||
if (!isAvailable) {
|
||||
// Development fallback
|
||||
const dice = [
|
||||
Math.floor(Math.random() * 20) + 1,
|
||||
Math.floor(Math.random() * 20) + 1,
|
||||
@@ -48,40 +140,94 @@ export const useTaleSpireDice = () => {
|
||||
}
|
||||
|
||||
try {
|
||||
const result = await window.TS.rollDice("3d20", label);
|
||||
const dsaResult = calculateDSAResult(result.dice, attributes, skillValue, modifier);
|
||||
const rollData = [{
|
||||
name: label,
|
||||
roll: "3d20"
|
||||
}];
|
||||
|
||||
// Ergebnis in TaleSpire Chat posten
|
||||
const chatMessage = formatDSAChatMessage(dsaResult, attributes, skillValue, modifier, label);
|
||||
window.TS.postToChat(chatMessage);
|
||||
const rollId = await window.TS.dice.putDiceInTray(rollData, true);
|
||||
|
||||
// Track this roll
|
||||
setTrackedRolls(prev => ({
|
||||
...prev,
|
||||
[rollId]: {
|
||||
type: 'dsa',
|
||||
attributes,
|
||||
skillValue,
|
||||
modifier,
|
||||
label
|
||||
}
|
||||
}));
|
||||
|
||||
// Return a promise that resolves when we get the result
|
||||
return new Promise((resolve) => {
|
||||
const checkResult = () => {
|
||||
if (rollResults[rollId]) {
|
||||
resolve({ ...rollResults[rollId], rollId });
|
||||
} else {
|
||||
setTimeout(checkResult, 100);
|
||||
}
|
||||
};
|
||||
checkResult();
|
||||
});
|
||||
|
||||
return dsaResult;
|
||||
} catch (error) {
|
||||
console.error('TaleSpire Dice Roll failed:', error);
|
||||
console.error('TaleSpire DSA roll failed:', error);
|
||||
throw error;
|
||||
}
|
||||
};
|
||||
|
||||
const rollSimpleDice = async (diceString: string, label?: string) => {
|
||||
if (!window.TS) {
|
||||
// Fallback für Development
|
||||
if (!isAvailable) {
|
||||
// Development fallback
|
||||
const sides = parseInt(diceString.split('d')[1]) || 20;
|
||||
const count = parseInt(diceString.split('d')[0]) || 1;
|
||||
const dice = Array.from({ length: count }, () => Math.floor(Math.random() * sides) + 1);
|
||||
return { dice, total: dice.reduce((a, b) => a + b, 0), timestamp: Date.now() };
|
||||
}
|
||||
|
||||
return await window.TS.rollDice(diceString, label);
|
||||
try {
|
||||
const rollData = [{
|
||||
name: label || 'Simple Roll',
|
||||
roll: diceString
|
||||
}];
|
||||
|
||||
const rollId = await window.TS.dice.putDiceInTray(rollData, true);
|
||||
|
||||
setTrackedRolls(prev => ({
|
||||
...prev,
|
||||
[rollId]: {
|
||||
type: 'simple',
|
||||
label: label || 'Simple Roll'
|
||||
}
|
||||
}));
|
||||
|
||||
return new Promise((resolve) => {
|
||||
const checkResult = () => {
|
||||
if (rollResults[rollId]) {
|
||||
resolve(rollResults[rollId]);
|
||||
} else {
|
||||
setTimeout(checkResult, 100);
|
||||
}
|
||||
};
|
||||
checkResult();
|
||||
});
|
||||
|
||||
} catch (error) {
|
||||
console.error('TaleSpire simple roll failed:', error);
|
||||
throw error;
|
||||
}
|
||||
};
|
||||
|
||||
return {
|
||||
isAvailable,
|
||||
rollDSACheck,
|
||||
rollSimpleDice
|
||||
rollSimpleDice,
|
||||
rollResults
|
||||
};
|
||||
};
|
||||
|
||||
// DSA 5e Würfellogik
|
||||
// Keep your existing DSA calculation logic
|
||||
const calculateDSAResult = (
|
||||
dice: number[],
|
||||
attributes: [number, number, number],
|
||||
@@ -91,7 +237,6 @@ const calculateDSAResult = (
|
||||
let remainingPoints = skillValue;
|
||||
const effectiveAttributes = attributes.map(attr => attr + modifier);
|
||||
|
||||
// Für jeden Würfel prüfen ob er das Attribut überschreitet
|
||||
dice.forEach((roll, index) => {
|
||||
if (roll > effectiveAttributes[index]) {
|
||||
remainingPoints -= (roll - effectiveAttributes[index]);
|
||||
@@ -108,20 +253,3 @@ const calculateDSAResult = (
|
||||
remainingPoints: Math.max(0, remainingPoints)
|
||||
};
|
||||
};
|
||||
|
||||
// Chat-Nachricht formatieren
|
||||
const formatDSAChatMessage = (
|
||||
result: any,
|
||||
attributes: [number, number, number],
|
||||
skillValue: number,
|
||||
modifier: number,
|
||||
label: string
|
||||
) => {
|
||||
const { dice, success, qualityLevel, remainingPoints } = result;
|
||||
const modifierText = modifier !== 0 ? ` (${modifier > 0 ? '+' : ''}${modifier})` : '';
|
||||
|
||||
return `🎲 **${label}**
|
||||
📊 Würfel: ${dice.join(', ')} vs ${attributes.join('/')}${modifierText}
|
||||
⚔️ FW: ${skillValue} | Übrig: ${remainingPoints}
|
||||
${success ? `✅ **Erfolg** (QL ${qualityLevel})` : '❌ **Fehlschlag**'}`;
|
||||
};
|
||||
38
src/i18n/i18n.ts
Normal file
38
src/i18n/i18n.ts
Normal file
@@ -0,0 +1,38 @@
|
||||
import i18n from 'i18next';
|
||||
import { initReactI18next } from 'react-i18next';
|
||||
import LanguageDetector from 'i18next-browser-languagedetector';
|
||||
|
||||
// Import translations
|
||||
import enTranslation from './locales/en.json';
|
||||
import deTranslation from './locales/de.json';
|
||||
|
||||
// Initialize i18next
|
||||
i18n
|
||||
// Detect user language
|
||||
.use(LanguageDetector)
|
||||
// Pass the i18n instance to react-i18next
|
||||
.use(initReactI18next)
|
||||
// Initialize i18next
|
||||
.init({
|
||||
resources: {
|
||||
en: enTranslation,
|
||||
de: deTranslation
|
||||
},
|
||||
fallbackLng: 'en',
|
||||
debug: import.meta.env.MODE === 'development',
|
||||
|
||||
interpolation: {
|
||||
escapeValue: false, // React already escapes values
|
||||
},
|
||||
|
||||
// Default namespace
|
||||
defaultNS: 'translation',
|
||||
|
||||
// Detection options
|
||||
detection: {
|
||||
order: ['localStorage', 'navigator'],
|
||||
caches: ['localStorage'],
|
||||
}
|
||||
});
|
||||
|
||||
export default i18n;
|
||||
54
src/i18n/locales/de.json
Normal file
54
src/i18n/locales/de.json
Normal file
@@ -0,0 +1,54 @@
|
||||
{
|
||||
"translation": {
|
||||
"app": {
|
||||
"title": "DSA 5 Charakterbogen",
|
||||
"iconAlt": "DSA 5 Charakterbogen"
|
||||
},
|
||||
"basicInfo": {
|
||||
"title": "Grundinformationen",
|
||||
"name": "Name",
|
||||
"namePlaceholder": "Charaktername eingeben",
|
||||
"species": "Spezies",
|
||||
"speciesPlaceholder": "z.B. Mensch, Elf, Zwerg",
|
||||
"culture": "Kultur",
|
||||
"culturePlaceholder": "z.B. Mittelländisch, Thorwalsch",
|
||||
"profession": "Profession",
|
||||
"professionPlaceholder": "z.B. Krieger, Magier, Kundschafter",
|
||||
"experienceLevel": "Erfahrungsstufe",
|
||||
"experienceLevels": {
|
||||
"inexperienced": "Unerfahren",
|
||||
"average": "Durchschnittlich",
|
||||
"experienced": "Erfahren",
|
||||
"competent": "Kompetent",
|
||||
"masterful": "Meisterhaft",
|
||||
"brilliant": "Brillant",
|
||||
"legendary": "Legendär"
|
||||
}
|
||||
},
|
||||
"attributes": {
|
||||
"title": "Eigenschaften",
|
||||
"courage": "MU - Mut",
|
||||
"cleverness": "KL - Klugheit",
|
||||
"intuition": "IN - Intuition",
|
||||
"charisma": "CH - Charisma",
|
||||
"dexterity": "FF - Fingerfertigkeit",
|
||||
"agility": "GE - Gewandtheit",
|
||||
"constitution": "KO - Konstitution",
|
||||
"strength": "KK - Körperkraft"
|
||||
},
|
||||
"combat": {
|
||||
"title": "Kampfwerte",
|
||||
"lifePoints": "Lebenspunkte",
|
||||
"stamina": "Ausdauer",
|
||||
"initiative": "Initiative",
|
||||
"speed": "Geschwindigkeit"
|
||||
},
|
||||
"skills": {
|
||||
"title": "Fertigkeiten"
|
||||
},
|
||||
"spells": {
|
||||
"title": "Zauber",
|
||||
"addMagic": "🪄 Zauberfähigkeiten hinzufügen"
|
||||
}
|
||||
}
|
||||
}
|
||||
54
src/i18n/locales/en.json
Normal file
54
src/i18n/locales/en.json
Normal file
@@ -0,0 +1,54 @@
|
||||
{
|
||||
"translation": {
|
||||
"app": {
|
||||
"title": "DSA 5 Character Sheet",
|
||||
"iconAlt": "DSA 5e Character Sheet"
|
||||
},
|
||||
"basicInfo": {
|
||||
"title": "Basic Information",
|
||||
"name": "Name",
|
||||
"namePlaceholder": "Enter character name",
|
||||
"species": "Species",
|
||||
"speciesPlaceholder": "e.g., Human, Elf, Dwarf",
|
||||
"culture": "Culture",
|
||||
"culturePlaceholder": "e.g., Middenrealmish, Thorwalian",
|
||||
"profession": "Profession",
|
||||
"professionPlaceholder": "e.g., Warrior, Mage, Scout",
|
||||
"experienceLevel": "Experience Level",
|
||||
"experienceLevels": {
|
||||
"inexperienced": "Inexperienced",
|
||||
"average": "Average",
|
||||
"experienced": "Experienced",
|
||||
"competent": "Competent",
|
||||
"masterful": "Masterful",
|
||||
"brilliant": "Brilliant",
|
||||
"legendary": "Legendary"
|
||||
}
|
||||
},
|
||||
"attributes": {
|
||||
"title": "Attributes",
|
||||
"courage": "CO - Courage",
|
||||
"cleverness": "CL - Cleverness",
|
||||
"intuition": "IN - Intuition",
|
||||
"charisma": "CH - Charisma",
|
||||
"dexterity": "DE - Dexterity",
|
||||
"agility": "AG - Agility",
|
||||
"constitution": "CN - Constitution",
|
||||
"strength": "ST - Strength"
|
||||
},
|
||||
"combat": {
|
||||
"title": "Combat Values",
|
||||
"lifePoints": "Life Points",
|
||||
"stamina": "Stamina",
|
||||
"initiative": "Initiative",
|
||||
"speed": "Speed"
|
||||
},
|
||||
"skills": {
|
||||
"title": "Skills"
|
||||
},
|
||||
"spells": {
|
||||
"title": "Spells",
|
||||
"addMagic": "🪄 Add Magic Abilities"
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -3,6 +3,8 @@ import React from 'react';
|
||||
import ReactDOM from 'react-dom/client';
|
||||
import App from './App';
|
||||
import './index.css';
|
||||
// Import i18n configuration
|
||||
import './i18n/i18n';
|
||||
|
||||
ReactDOM.createRoot(document.getElementById('root')!).render(
|
||||
<React.StrictMode>
|
||||
|
||||
@@ -20,10 +20,10 @@
|
||||
}
|
||||
|
||||
.character-sheet {
|
||||
max-width: 900px;
|
||||
max-width: 599px;
|
||||
margin: 0 auto;
|
||||
padding: 20px;
|
||||
font-family: 'Segoe UI', 'Roboto', -apple-system, BlinkMacSystemFont, sans-serif;
|
||||
font-family: OptimusPrinceps;
|
||||
color: var(--ts-color-on-surface, var(--text-color));
|
||||
background-color: var(--ts-color-surface, var(--surface-color));
|
||||
line-height: 1.6;
|
||||
@@ -519,39 +519,6 @@ button:active {
|
||||
--surface-variant-color: #f9f9f9;
|
||||
}
|
||||
|
||||
/* Theme Toggle Button */
|
||||
.theme-toggle {
|
||||
position: fixed;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
border-radius: 25px;
|
||||
background: var(--ts-color-primary);
|
||||
color: white;
|
||||
border: none;
|
||||
font-size: 1.5rem;
|
||||
cursor: pointer;
|
||||
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
|
||||
transition: all 0.3s ease;
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
.theme-toggle:hover {
|
||||
transform: scale(1.1);
|
||||
box-shadow: 0 6px 16px rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
.theme-icon {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: white;
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
body {
|
||||
background: var(--ts-background-primary, var(--background-color));
|
||||
transition: background-color 0.3s ease;
|
||||
29
src/styles/LanguageSelector.css
Normal file
29
src/styles/LanguageSelector.css
Normal file
@@ -0,0 +1,29 @@
|
||||
.language-selector {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
margin: 10px;
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
right: 10px;
|
||||
}
|
||||
|
||||
.language-btn {
|
||||
background-color: var(--ts-color-primary, var(--primary-color));
|
||||
color: var(--ts-color-on-primary, var(--on-primary-color));
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: 4px;
|
||||
padding: 5px 10px;
|
||||
cursor: pointer;
|
||||
font-size: 14px;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.language-btn:hover {
|
||||
background-color: var(--bg-hover);
|
||||
}
|
||||
|
||||
.language-btn.active {
|
||||
background-color: var(--primary-color);
|
||||
color: white;
|
||||
border-color: var(--primary-color);
|
||||
}
|
||||
17
src/styles/ThemeToggle.css
Normal file
17
src/styles/ThemeToggle.css
Normal file
@@ -0,0 +1,17 @@
|
||||
.theme-toggle {
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
position: fixed;
|
||||
color: var(--ts-color-secondary);
|
||||
background: var(--ts-background-tertiary);
|
||||
bottom: 10px;
|
||||
right: 10px;
|
||||
padding: 10px;
|
||||
border-radius: 50%;
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
.theme-toggle:hover {
|
||||
color: var(--ts-accent-hover);
|
||||
background: var(--ts-accent-background);
|
||||
}
|
||||
@@ -1,16 +0,0 @@
|
||||
/* src/styles/talespire-variables.css */
|
||||
:root {
|
||||
/* TaleSpire Color Variables */
|
||||
--ts-color-surface: #ffffff;
|
||||
--ts-color-on-surface: #000000;
|
||||
--ts-color-surface-variant: #f9f9f9;
|
||||
--ts-color-primary: #7b2cbf;
|
||||
--ts-color-secondary: #3a0ca3;
|
||||
--ts-color-outline: #cccccc;
|
||||
--ts-color-error: #ff4444;
|
||||
|
||||
/* Add other TaleSpire variables as you discover them */
|
||||
--ts-color-background: #f5f5f5;
|
||||
--ts-color-on-background: #222222;
|
||||
--ts-background-primary: #1a1a1a,
|
||||
}
|
||||
@@ -2,7 +2,9 @@ import { defineConfig } from 'vite';
|
||||
import react from '@vitejs/plugin-react';
|
||||
|
||||
export default defineConfig({
|
||||
plugins: [react()],
|
||||
plugins: [
|
||||
react(),
|
||||
],
|
||||
base: './',
|
||||
build: {
|
||||
minify: 'esbuild', // ← Statt terser
|
||||
|
||||
Reference in New Issue
Block a user