mirror of
https://github.com/alexkurowski/solo-toolkit.git
synced 2026-07-22 10:10:32 +00:00
Update
This commit is contained in:
Alex
parent
f2ce3ecd53
commit
d348d15cfe
17 changed files with 419 additions and 328 deletions
|
|
@ -15,7 +15,7 @@ const context = await esbuild.context({
|
|||
banner: {
|
||||
js: banner,
|
||||
},
|
||||
entryPoints: ["src/main.ts"],
|
||||
entryPoints: ["src/main.ts", "src/styles.css"],
|
||||
bundle: true,
|
||||
external: [
|
||||
"obsidian",
|
||||
|
|
@ -46,11 +46,11 @@ const context = await esbuild.context({
|
|||
],
|
||||
format: "cjs",
|
||||
target: "es2022",
|
||||
logLevel: "info",
|
||||
logLevel: watch ? "info" : "error",
|
||||
sourcemap: watch ? "inline" : false,
|
||||
minify: true,
|
||||
treeShaking: true,
|
||||
outfile: "main.js",
|
||||
outdir: "dist",
|
||||
logOverride: { "empty-import-meta": "silent" },
|
||||
});
|
||||
|
||||
|
|
|
|||
103
package-lock.json
generated
103
package-lock.json
generated
|
|
@ -1,13 +1,16 @@
|
|||
{
|
||||
"name": "alexkurowski/solo-toolkit",
|
||||
"version": "0.1.1",
|
||||
"version": "0.1.6",
|
||||
"lockfileVersion": 2,
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"": {
|
||||
"name": "alexkurowski/solo-toolkit",
|
||||
"version": "0.1.1",
|
||||
"version": "0.1.6",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@codemirror/language": "^6.10.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@eslint/js": "^9.2.0",
|
||||
"@types/node": "^16.11.6",
|
||||
|
|
@ -25,19 +28,28 @@
|
|||
"typescript-eslint": "^7.8.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/language": {
|
||||
"version": "6.10.1",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/language/-/language-6.10.1.tgz",
|
||||
"integrity": "sha512-5GrXzrhq6k+gL5fjkAwt90nYDmjlzTIJV8THnxNFtNKWotMIlzzN+CpqxqwXOECnUdOndmSeWntVrVcv5axWRQ==",
|
||||
"dependencies": {
|
||||
"@codemirror/state": "^6.0.0",
|
||||
"@codemirror/view": "^6.23.0",
|
||||
"@lezer/common": "^1.1.0",
|
||||
"@lezer/highlight": "^1.0.0",
|
||||
"@lezer/lr": "^1.0.0",
|
||||
"style-mod": "^4.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@codemirror/state": {
|
||||
"version": "6.4.1",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/state/-/state-6.4.1.tgz",
|
||||
"integrity": "sha512-QkEyUiLhsJoZkbumGZlswmAhA7CBU02Wrz7zvH4SrcifbsqwlXShVXg65f3v/ts57W3dqyamEriMhij1Z3Zz4A==",
|
||||
"dev": true,
|
||||
"peer": true
|
||||
"integrity": "sha512-QkEyUiLhsJoZkbumGZlswmAhA7CBU02Wrz7zvH4SrcifbsqwlXShVXg65f3v/ts57W3dqyamEriMhij1Z3Zz4A=="
|
||||
},
|
||||
"node_modules/@codemirror/view": {
|
||||
"version": "6.26.3",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/view/-/view-6.26.3.tgz",
|
||||
"integrity": "sha512-gmqxkPALZjkgSxIeeweY/wGQXBfwTUaLs8h7OKtSwfbj9Ct3L11lD+u1sS7XHppxFQoMDiMDp07P9f3I2jWOHw==",
|
||||
"dev": true,
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"@codemirror/state": "^6.4.0",
|
||||
"style-mod": "^4.1.0",
|
||||
|
|
@ -500,6 +512,27 @@
|
|||
"integrity": "sha512-93zYdMES/c1D69yZiKDBj0V24vqNzB/koF26KPaagAfd3P/4gUlh3Dys5ogAK+Exi9QyzlD8x/08Zt7wIKcDcA==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/@lezer/common": {
|
||||
"version": "1.2.1",
|
||||
"resolved": "https://registry.npmjs.org/@lezer/common/-/common-1.2.1.tgz",
|
||||
"integrity": "sha512-yemX0ZD2xS/73llMZIK6KplkjIjf2EvAHcinDi/TfJ9hS25G0388+ClHt6/3but0oOxinTcQHJLDXh6w1crzFQ=="
|
||||
},
|
||||
"node_modules/@lezer/highlight": {
|
||||
"version": "1.2.0",
|
||||
"resolved": "https://registry.npmjs.org/@lezer/highlight/-/highlight-1.2.0.tgz",
|
||||
"integrity": "sha512-WrS5Mw51sGrpqjlh3d4/fOwpEV2Hd3YOkp9DBt4k8XZQcoTHZFB7sx030A6OcahF4J1nDQAa3jXlTVVYH50IFA==",
|
||||
"dependencies": {
|
||||
"@lezer/common": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@lezer/lr": {
|
||||
"version": "1.4.0",
|
||||
"resolved": "https://registry.npmjs.org/@lezer/lr/-/lr-1.4.0.tgz",
|
||||
"integrity": "sha512-Wst46p51km8gH0ZUmeNrtpRYmdlRHUpN1DQd3GFAyKANi8WVz8c2jHYTf1CVScFaCjQw1iO3ZZdqGDxQPRErTg==",
|
||||
"dependencies": {
|
||||
"@lezer/common": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@nodelib/fs.scandir": {
|
||||
"version": "2.1.5",
|
||||
"resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz",
|
||||
|
|
@ -2547,9 +2580,7 @@
|
|||
"node_modules/style-mod": {
|
||||
"version": "4.1.2",
|
||||
"resolved": "https://registry.npmjs.org/style-mod/-/style-mod-4.1.2.tgz",
|
||||
"integrity": "sha512-wnD1HyVqpJUI2+eKZ+eo1UwghftP6yuFheBqqe+bWCotBjC2K1YnteJILRMs3SM4V/0dLEW1SC27MWP5y+mwmw==",
|
||||
"dev": true,
|
||||
"peer": true
|
||||
"integrity": "sha512-wnD1HyVqpJUI2+eKZ+eo1UwghftP6yuFheBqqe+bWCotBjC2K1YnteJILRMs3SM4V/0dLEW1SC27MWP5y+mwmw=="
|
||||
},
|
||||
"node_modules/supports-color": {
|
||||
"version": "7.2.0",
|
||||
|
|
@ -2909,9 +2940,7 @@
|
|||
"node_modules/w3c-keyname": {
|
||||
"version": "2.2.8",
|
||||
"resolved": "https://registry.npmjs.org/w3c-keyname/-/w3c-keyname-2.2.8.tgz",
|
||||
"integrity": "sha512-dpojBhNsCNN7T82Tm7k26A6G9ML3NkhDsnw9n/eoxSRlVBB4CEtIQ/KTCLI2Fwf3ataSXRhYFkQi3SlnFwPvPQ==",
|
||||
"dev": true,
|
||||
"peer": true
|
||||
"integrity": "sha512-dpojBhNsCNN7T82Tm7k26A6G9ML3NkhDsnw9n/eoxSRlVBB4CEtIQ/KTCLI2Fwf3ataSXRhYFkQi3SlnFwPvPQ=="
|
||||
},
|
||||
"node_modules/which": {
|
||||
"version": "2.0.2",
|
||||
|
|
@ -2963,19 +2992,28 @@
|
|||
}
|
||||
},
|
||||
"dependencies": {
|
||||
"@codemirror/language": {
|
||||
"version": "6.10.1",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/language/-/language-6.10.1.tgz",
|
||||
"integrity": "sha512-5GrXzrhq6k+gL5fjkAwt90nYDmjlzTIJV8THnxNFtNKWotMIlzzN+CpqxqwXOECnUdOndmSeWntVrVcv5axWRQ==",
|
||||
"requires": {
|
||||
"@codemirror/state": "^6.0.0",
|
||||
"@codemirror/view": "^6.23.0",
|
||||
"@lezer/common": "^1.1.0",
|
||||
"@lezer/highlight": "^1.0.0",
|
||||
"@lezer/lr": "^1.0.0",
|
||||
"style-mod": "^4.0.0"
|
||||
}
|
||||
},
|
||||
"@codemirror/state": {
|
||||
"version": "6.4.1",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/state/-/state-6.4.1.tgz",
|
||||
"integrity": "sha512-QkEyUiLhsJoZkbumGZlswmAhA7CBU02Wrz7zvH4SrcifbsqwlXShVXg65f3v/ts57W3dqyamEriMhij1Z3Zz4A==",
|
||||
"dev": true,
|
||||
"peer": true
|
||||
"integrity": "sha512-QkEyUiLhsJoZkbumGZlswmAhA7CBU02Wrz7zvH4SrcifbsqwlXShVXg65f3v/ts57W3dqyamEriMhij1Z3Zz4A=="
|
||||
},
|
||||
"@codemirror/view": {
|
||||
"version": "6.26.3",
|
||||
"resolved": "https://registry.npmjs.org/@codemirror/view/-/view-6.26.3.tgz",
|
||||
"integrity": "sha512-gmqxkPALZjkgSxIeeweY/wGQXBfwTUaLs8h7OKtSwfbj9Ct3L11lD+u1sS7XHppxFQoMDiMDp07P9f3I2jWOHw==",
|
||||
"dev": true,
|
||||
"peer": true,
|
||||
"requires": {
|
||||
"@codemirror/state": "^6.4.0",
|
||||
"style-mod": "^4.1.0",
|
||||
|
|
@ -3208,6 +3246,27 @@
|
|||
"integrity": "sha512-93zYdMES/c1D69yZiKDBj0V24vqNzB/koF26KPaagAfd3P/4gUlh3Dys5ogAK+Exi9QyzlD8x/08Zt7wIKcDcA==",
|
||||
"dev": true
|
||||
},
|
||||
"@lezer/common": {
|
||||
"version": "1.2.1",
|
||||
"resolved": "https://registry.npmjs.org/@lezer/common/-/common-1.2.1.tgz",
|
||||
"integrity": "sha512-yemX0ZD2xS/73llMZIK6KplkjIjf2EvAHcinDi/TfJ9hS25G0388+ClHt6/3but0oOxinTcQHJLDXh6w1crzFQ=="
|
||||
},
|
||||
"@lezer/highlight": {
|
||||
"version": "1.2.0",
|
||||
"resolved": "https://registry.npmjs.org/@lezer/highlight/-/highlight-1.2.0.tgz",
|
||||
"integrity": "sha512-WrS5Mw51sGrpqjlh3d4/fOwpEV2Hd3YOkp9DBt4k8XZQcoTHZFB7sx030A6OcahF4J1nDQAa3jXlTVVYH50IFA==",
|
||||
"requires": {
|
||||
"@lezer/common": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"@lezer/lr": {
|
||||
"version": "1.4.0",
|
||||
"resolved": "https://registry.npmjs.org/@lezer/lr/-/lr-1.4.0.tgz",
|
||||
"integrity": "sha512-Wst46p51km8gH0ZUmeNrtpRYmdlRHUpN1DQd3GFAyKANi8WVz8c2jHYTf1CVScFaCjQw1iO3ZZdqGDxQPRErTg==",
|
||||
"requires": {
|
||||
"@lezer/common": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"@nodelib/fs.scandir": {
|
||||
"version": "2.1.5",
|
||||
"resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz",
|
||||
|
|
@ -4570,9 +4629,7 @@
|
|||
"style-mod": {
|
||||
"version": "4.1.2",
|
||||
"resolved": "https://registry.npmjs.org/style-mod/-/style-mod-4.1.2.tgz",
|
||||
"integrity": "sha512-wnD1HyVqpJUI2+eKZ+eo1UwghftP6yuFheBqqe+bWCotBjC2K1YnteJILRMs3SM4V/0dLEW1SC27MWP5y+mwmw==",
|
||||
"dev": true,
|
||||
"peer": true
|
||||
"integrity": "sha512-wnD1HyVqpJUI2+eKZ+eo1UwghftP6yuFheBqqe+bWCotBjC2K1YnteJILRMs3SM4V/0dLEW1SC27MWP5y+mwmw=="
|
||||
},
|
||||
"supports-color": {
|
||||
"version": "7.2.0",
|
||||
|
|
@ -4793,9 +4850,7 @@
|
|||
"w3c-keyname": {
|
||||
"version": "2.2.8",
|
||||
"resolved": "https://registry.npmjs.org/w3c-keyname/-/w3c-keyname-2.2.8.tgz",
|
||||
"integrity": "sha512-dpojBhNsCNN7T82Tm7k26A6G9ML3NkhDsnw9n/eoxSRlVBB4CEtIQ/KTCLI2Fwf3ataSXRhYFkQi3SlnFwPvPQ==",
|
||||
"dev": true,
|
||||
"peer": true
|
||||
"integrity": "sha512-dpojBhNsCNN7T82Tm7k26A6G9ML3NkhDsnw9n/eoxSRlVBB4CEtIQ/KTCLI2Fwf3ataSXRhYFkQi3SlnFwPvPQ=="
|
||||
},
|
||||
"which": {
|
||||
"version": "2.0.2",
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@
|
|||
"scripts": {
|
||||
"dev": "node esbuild.config.mjs watch",
|
||||
"build": "tsc --noEmit -skipLibCheck && node esbuild.config.mjs",
|
||||
"deploy": "rm -rf ./dist && mkdir -p dist/solo-rpg-toolkit && cp main.js dist/solo-rpg-toolkit && cp styles.css dist/solo-rpg-toolkit && cp manifest.json dist/solo-rpg-toolkit",
|
||||
"deploy": "rm -rf ./dist/solo-rpg-toolkit && mkdir -p dist/solo-rpg-toolkit && cp dist/main.js dist/solo-rpg-toolkit && cp dist/styles.css dist/solo-rpg-toolkit && cp manifest.json dist/solo-rpg-toolkit",
|
||||
"lint": "tsc --noEmit && eslint ./src",
|
||||
"version": "ruby tasks/version.rb",
|
||||
"release": "ruby tasks/release.rb"
|
||||
|
|
@ -15,6 +15,7 @@
|
|||
"author": "Alex Kurowski",
|
||||
"license": "MIT",
|
||||
"devDependencies": {
|
||||
"@codemirror/language": "^6.10.1",
|
||||
"@eslint/js": "^9.2.0",
|
||||
"@types/node": "^16.11.6",
|
||||
"@typescript-eslint/eslint-plugin": "5.29.0",
|
||||
|
|
|
|||
|
|
@ -15,6 +15,8 @@ const icons = {
|
|||
'<path d="M50 8.33334L6.25 40.1667L22.9167 91.6667H77.0833L93.75 40.1667L50 8.33334ZM43.75 70.8333H37.0417V45.375L29.1667 47.7917V42.4583L42.9583 37.5H43.75V70.8333ZM70.8333 70.8333H48.5833V66.2917C48.5833 66.2917 63.4583 51.875 63.4583 47.5C63.4583 42.1667 59.0833 42.7083 59.0833 42.7083C56.25 42.9167 54.1667 45.2917 54.1667 48.125H47.6667C47.9167 42.0417 53 37.25 59.4583 37.5C69.75 37.5 69.875 45.2083 69.875 47.0833C69.875 54.4583 56.5833 65.7083 56.5833 65.7083L70.8333 65.625V70.8333Z" fill="currentColor"/>',
|
||||
"srt-d20":
|
||||
'<path d="M85.2917 27.5833L52.375 9.08334C51.7083 8.58334 50.875 8.33334 50 8.33334C49.125 8.33334 48.2917 8.58334 47.625 9.08334L14.7083 27.5833C13.375 28.2917 12.5 29.6667 12.5 31.25V68.75C12.5 70.3333 13.375 71.7083 14.7083 72.4167L47.625 90.9167C48.2917 91.4167 49.125 91.6667 50 91.6667C50.875 91.6667 51.7083 91.4167 52.375 90.9167L85.2917 72.4167C86.625 71.7083 87.5 70.3333 87.5 68.75V31.25C87.5 29.6667 86.625 28.2917 85.2917 27.5833ZM47.7083 66.5L26.2917 66.375V62.125C26.2917 62.125 40.5833 48.25 40.625 44.0417C40.625 38.875 36.375 39.4167 36.375 39.4167C36.375 39.4167 32.2917 39.5833 31.8333 44.625L25.5833 44.8333C25.5833 44.8333 25.75 34.4167 36.7917 34.4167C46.6667 34.4167 46.7917 41.8333 46.7917 43.75C46.7917 50.75 33.9583 61.5417 33.9583 61.5417L47.7083 61.5V66.5ZM72.9167 56.25C72.9167 62.0833 68.125 66.875 62.2083 66.875C56.25 66.875 51.5 62.0833 51.5 56.25V45.1667C51.5 39.25 56.25 34.4583 62.2083 34.4583C68.1667 34.4583 72.9167 39.25 72.9167 45.1667V56.25ZM66.6667 44.875V56.375C66.6667 58.8333 64.5833 60.8333 62.1667 60.8333C59.75 60.8333 57.75 58.8333 57.75 56.375V44.875C57.75 42.4167 59.75 40.4583 62.1667 40.4583C64.5833 40.4583 66.6667 42.4167 66.6667 44.875Z" fill="currentColor"/>',
|
||||
"srt-d100":
|
||||
'<path fill-rule="evenodd" clip-rule="evenodd" d="M43.8021 10.4583C45.5104 8.79167 47.5938 8 49.6771 8C51.7604 8 53.8438 8.79167 55.5521 10.4583L88.8854 43.7917C92.1771 47.0417 92.1771 52.2917 88.8854 55.5417L55.5521 88.875C52.3021 92.1667 47.0521 92.1667 43.8021 88.875L10.4688 55.5417C7.17708 52.2917 7.17708 47.0417 10.4688 43.7917L43.8021 10.4583ZM34.0938 61.5833L61.5938 34.0833L65.2604 37.75L37.7604 65.25L34.0938 61.5833ZM36.6213 36.6109C37.6528 35.5795 39.0517 35 40.5104 35C41.9691 35 43.3681 35.5795 44.3995 36.6109C45.431 37.6424 46.0104 39.0413 46.0104 40.5C46.0104 41.9587 45.431 43.3576 44.3995 44.3891C43.3681 45.4205 41.9691 46 40.5104 46C39.0517 46 37.6528 45.4205 36.6213 44.3891C35.5899 43.3576 35.0104 41.9587 35.0104 40.5C35.0104 39.0413 35.5899 37.6424 36.6213 36.6109ZM54.9547 54.9442C55.9861 53.9128 57.3851 53.3333 58.8438 53.3333C60.3024 53.3333 61.7014 53.9128 62.7328 54.9442C63.7643 55.9757 64.3438 57.3746 64.3438 58.8333C64.3438 60.292 63.7643 61.691 62.7328 62.7224C61.7014 63.7539 60.3024 64.3333 58.8438 64.3333C57.3851 64.3333 55.9861 63.7539 54.9547 62.7224C53.9232 61.691 53.3438 60.292 53.3438 58.8333C53.3438 57.3746 53.9232 55.9757 54.9547 54.9442Z" fill="currentColor"/>',
|
||||
};
|
||||
|
||||
export const registerIcons = () => {
|
||||
|
|
|
|||
5
src/styles.css
Normal file
5
src/styles.css
Normal file
|
|
@ -0,0 +1,5 @@
|
|||
@import "./styles/shared";
|
||||
@import "./styles/layout";
|
||||
@import "./styles/deck";
|
||||
@import "./styles/dice";
|
||||
@import "./styles/word";
|
||||
86
src/styles/deck.css
Normal file
86
src/styles/deck.css
Normal file
|
|
@ -0,0 +1,86 @@
|
|||
.srt-container {
|
||||
.deck-buttons {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: var(--size-4-4);
|
||||
white-space: nowrap;
|
||||
|
||||
.deck-size {
|
||||
min-width: 50px;
|
||||
line-height: var(--input-height);
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
|
||||
.deck-results {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
gap: var(--size-4-4);
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
|
||||
.deck-result {
|
||||
flex-grow: 0;
|
||||
flex-shrink: 0;
|
||||
width: 76px;
|
||||
height: 104px;
|
||||
padding: var(--size-4-1) var(--size-4-2);
|
||||
background: #fcfcfc;
|
||||
border-radius: var(--radius-m);
|
||||
border: var(--size-2-1) solid #fcfcfc;
|
||||
cursor: pointer;
|
||||
transition: border-color 0.3s ease-in-out;
|
||||
animation: 0.5s ease-in-out srt-fadein;
|
||||
|
||||
&:hover {
|
||||
border-color: var(--interactive-accent);
|
||||
}
|
||||
|
||||
.deck-result-content {
|
||||
display: inline-flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
font-weight: 500;
|
||||
|
||||
&.deck-result-red {
|
||||
color: var(--color-red);
|
||||
}
|
||||
|
||||
&.deck-result-black {
|
||||
color: #212121;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.deck-result-value {
|
||||
display: inline-block;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.deck-result-type {
|
||||
position: relative;
|
||||
top: 1px;
|
||||
}
|
||||
}
|
||||
|
||||
&.srt-desktop-layout {
|
||||
.deck-results {
|
||||
flex-direction: column-reverse;
|
||||
margin-bottom: var(--size-4-6);
|
||||
}
|
||||
}
|
||||
|
||||
&.srt-mobile-layout {
|
||||
.deck-buttons {
|
||||
.deck-size {
|
||||
padding-left: var(--size-4-5);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
56
src/styles/dice.css
Normal file
56
src/styles/dice.css
Normal file
|
|
@ -0,0 +1,56 @@
|
|||
.srt-container {
|
||||
.dice-buttons {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: var(--size-4-2);
|
||||
width: 100%;
|
||||
|
||||
.dice-variant {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
gap: var(--size-4-2);
|
||||
|
||||
.clickable-icon {
|
||||
padding: var(--size-4-1);
|
||||
|
||||
svg {
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.dice-results {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.dice-result-value {
|
||||
min-width: 32px;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
&.srt-mobile-layout {
|
||||
.dice-buttons {
|
||||
gap: var(--size-4-1);
|
||||
|
||||
.dice-variant {
|
||||
.clickable-icon {
|
||||
padding: var(--size-4-3);
|
||||
|
||||
svg {
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
90
src/styles/layout.css
Normal file
90
src/styles/layout.css
Normal file
|
|
@ -0,0 +1,90 @@
|
|||
.srt-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
justify-content: flex-end;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
max-height: 100%;
|
||||
overflow: hidden;
|
||||
|
||||
.srt-tab-picker {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
flex-wrap: wrap-reverse;
|
||||
gap: var(--size-4-4);
|
||||
width: 100%;
|
||||
padding-top: var(--size-4-4);
|
||||
margin-top: var(--size-4-4);
|
||||
border-top: 1px solid var(--color-base-40);
|
||||
|
||||
.srt-tab-picker-tabs {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
gap: var(--size-4-2);
|
||||
|
||||
.clickable-icon {
|
||||
transition:
|
||||
color 0.3s,
|
||||
background 0.3s;
|
||||
|
||||
&.highlight {
|
||||
color: var(--text-on-accent);
|
||||
background: var(--interactive-accent);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.srt-tab {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: stretch;
|
||||
justify-content: flex-end;
|
||||
gap: var(--size-4-4);
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
&.srt-desktop-layout {
|
||||
flex-direction: column-reverse;
|
||||
justify-content: flex-start;
|
||||
|
||||
.srt-tab-picker {
|
||||
margin-top: 0;
|
||||
padding-top: 0;
|
||||
padding-bottom: var(--size-4-4);
|
||||
margin-bottom: var(--size-4-4);
|
||||
border-top: none;
|
||||
border-bottom: 1px solid var(--color-base-40);
|
||||
}
|
||||
|
||||
.srt-tab {
|
||||
justify-content: flex-start;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
&.srt-mobile-layout {
|
||||
.srt-tab-picker {
|
||||
.clickable-icon {
|
||||
padding: var(--size-4-2);
|
||||
|
||||
svg {
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
}
|
||||
}
|
||||
|
||||
.srt-tab-picker-tabs {
|
||||
gap: var(--size-4-4);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
14
src/styles/shared.css
Normal file
14
src/styles/shared.css
Normal file
|
|
@ -0,0 +1,14 @@
|
|||
.srt-container {
|
||||
.nofade {
|
||||
animation: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes srt-fadein {
|
||||
from {
|
||||
opacity: 0;
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
49
src/styles/word.css
Normal file
49
src/styles/word.css
Normal file
|
|
@ -0,0 +1,49 @@
|
|||
.srt-container {
|
||||
.word-buttons {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: var(--size-4-4);
|
||||
}
|
||||
|
||||
.word-results {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
justify-content: flex-end;
|
||||
gap: var(--size-4-4);
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
|
||||
.word-result {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
animation: 0.5s ease-in-out srt-fadein;
|
||||
|
||||
&:not(:hover) {
|
||||
color: var(--text-normal);
|
||||
}
|
||||
}
|
||||
|
||||
.word-result-type {
|
||||
display: inline-block;
|
||||
min-width: 60px;
|
||||
font-size: 0.75em;
|
||||
line-height: 2em;
|
||||
color: var(--color-base-60);
|
||||
text-align: right;
|
||||
margin-right: var(--size-4-4);
|
||||
}
|
||||
}
|
||||
|
||||
&.srt-desktop-layout {
|
||||
.word-results {
|
||||
flex-direction: column-reverse;
|
||||
margin-bottom: var(--size-4-6);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,3 +1,4 @@
|
|||
import oracle from './oracle';
|
||||
import adjectives from "./adjectives";
|
||||
import adverbs from "./adverbs";
|
||||
import nouns from "./nouns";
|
||||
|
|
@ -12,6 +13,7 @@ import hairs from "./hairs";
|
|||
import settlement from "./settlement";
|
||||
|
||||
export const dictionary = {
|
||||
oracle,
|
||||
adjectives,
|
||||
adverbs,
|
||||
nouns,
|
||||
|
|
|
|||
4
src/utils/dictionary/oracle.ts
Normal file
4
src/utils/dictionary/oracle.ts
Normal file
|
|
@ -0,0 +1,4 @@
|
|||
export default [
|
||||
["extreme yes", "yes", "yes", "no", "no", "extreme no"],
|
||||
["but", "", "", "", "", "and"],
|
||||
];
|
||||
|
|
@ -2,6 +2,16 @@ import { dictionary } from "./dictionary";
|
|||
import { randomFrom } from "./dice";
|
||||
import { capitalize } from "./helpers";
|
||||
|
||||
const getOracle = () => {
|
||||
const answer1 = randomFrom(dictionary.oracle[0]);
|
||||
const answer2 = randomFrom(dictionary.oracle[1]);
|
||||
if (answer2) {
|
||||
return capitalize(`${answer1}, ${answer2}`);
|
||||
} else {
|
||||
return capitalize(answer1);
|
||||
}
|
||||
};
|
||||
|
||||
const getNoun = () => randomFrom(dictionary.nouns);
|
||||
const getVerb = () => randomFrom(dictionary.verbs);
|
||||
const getAdjective = () => randomFrom(dictionary.adjectives);
|
||||
|
|
@ -121,6 +131,8 @@ const getTown = () =>
|
|||
|
||||
export const generateWord = (type: string): string => {
|
||||
switch (type) {
|
||||
case "Oracle":
|
||||
return getOracle();
|
||||
case "Subject":
|
||||
return getSubject();
|
||||
case "Action":
|
||||
|
|
|
|||
|
|
@ -25,6 +25,7 @@ export class DiceView {
|
|||
this.createDiceBtn(10);
|
||||
this.createDiceBtn(12);
|
||||
this.createDiceBtn(20);
|
||||
this.createDiceBtn(100);
|
||||
|
||||
this.repopulateResults();
|
||||
}
|
||||
|
|
|
|||
|
|
@ -16,8 +16,6 @@ interface DevApp extends App {
|
|||
|
||||
export const VIEW_TYPE = "MAIN_VIEW";
|
||||
|
||||
const resetTimeout = 800;
|
||||
|
||||
const tabLabels = {
|
||||
dice: "Dice",
|
||||
deck: "Deck",
|
||||
|
|
@ -122,24 +120,9 @@ export class SoloToolkitView extends ItemView {
|
|||
|
||||
setCta(this.tab);
|
||||
|
||||
let lastBtnClickAt = 0;
|
||||
const maybeReset = (tab: keyof typeof btns) => {
|
||||
if (this.tab === tab) {
|
||||
const now = Date.now();
|
||||
if (lastBtnClickAt && now - lastBtnClickAt <= resetTimeout) {
|
||||
this[tab].reset();
|
||||
lastBtnClickAt = 0;
|
||||
} else {
|
||||
lastBtnClickAt = now;
|
||||
}
|
||||
} else {
|
||||
lastBtnClickAt = 0;
|
||||
}
|
||||
};
|
||||
|
||||
const btnOnClick = (tab: keyof typeof btns) => () => {
|
||||
maybeReset(tab);
|
||||
this.tab = tab;
|
||||
if (tab === "dice") this.dice.reset();
|
||||
setCta(tab);
|
||||
this.createTab();
|
||||
updateResetBtnTooltip();
|
||||
|
|
|
|||
|
|
@ -4,6 +4,17 @@ import { generateWord, randomFrom, clickToCopy } from "../utils";
|
|||
|
||||
const MAX_REMEMBER_SIZE = 1000;
|
||||
|
||||
const wordLabels: { [word: string]: string } = {
|
||||
Oracle: "yes/no answer",
|
||||
Subject: "a subject",
|
||||
Action: "an action",
|
||||
Name: "a name",
|
||||
Aspects: "character aspects",
|
||||
Skills: "character skills",
|
||||
Job: "occupation",
|
||||
Town: "a town name",
|
||||
};
|
||||
|
||||
export class WordView {
|
||||
view: View;
|
||||
words: [string, string][];
|
||||
|
|
@ -22,6 +33,7 @@ export class WordView {
|
|||
|
||||
this.wordBtnsEl = this.view.tabViewEl.createDiv("word-buttons");
|
||||
this.wordBtnsEl.empty();
|
||||
this.createWordBtn("Oracle");
|
||||
this.createWordBtn("Subject");
|
||||
this.createWordBtn("Action");
|
||||
this.createWordBtn("Name");
|
||||
|
|
@ -67,7 +79,7 @@ export class WordView {
|
|||
createWordBtn(type: string) {
|
||||
new ButtonComponent(this.wordBtnsEl)
|
||||
.setButtonText(type)
|
||||
.setTooltip(`Generate ${type.toLowerCase()}`)
|
||||
.setTooltip(`Generate ${wordLabels[type] || type.toLowerCase()}`)
|
||||
.onClick(() => {
|
||||
const value = generateWord(type);
|
||||
this.words.push([type, value]);
|
||||
|
|
|
|||
281
styles.css
281
styles.css
|
|
@ -1,281 +0,0 @@
|
|||
.srt-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
justify-content: flex-end;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
max-height: 100%;
|
||||
overflow: hidden;
|
||||
|
||||
.srt-tab-picker {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
flex-wrap: wrap-reverse;
|
||||
gap: var(--size-4-4);
|
||||
width: 100%;
|
||||
padding-top: var(--size-4-4);
|
||||
margin-top: var(--size-4-4);
|
||||
border-top: 1px solid var(--color-base-40);
|
||||
|
||||
.srt-tab-picker-tabs {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
gap: var(--size-4-2);
|
||||
|
||||
.clickable-icon {
|
||||
transition:
|
||||
color 0.3s,
|
||||
background 0.3s;
|
||||
|
||||
&.highlight {
|
||||
color: var(--text-on-accent);
|
||||
background: var(--interactive-accent);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.srt-tab {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: stretch;
|
||||
justify-content: flex-end;
|
||||
gap: var(--size-4-4);
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.dice-buttons {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: var(--size-4-2);
|
||||
width: 100%;
|
||||
|
||||
.dice-variant {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
gap: var(--size-4-2);
|
||||
|
||||
.clickable-icon {
|
||||
padding: var(--size-4-1);
|
||||
|
||||
svg {
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.dice-results {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.dice-result-value {
|
||||
min-width: 32px;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
.deck-buttons {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: var(--size-4-4);
|
||||
white-space: nowrap;
|
||||
|
||||
.deck-size {
|
||||
min-width: 50px;
|
||||
line-height: var(--input-height);
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
|
||||
.deck-results {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
gap: var(--size-4-4);
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
|
||||
.deck-result {
|
||||
flex-grow: 0;
|
||||
flex-shrink: 0;
|
||||
width: 80px;
|
||||
height: 104px;
|
||||
padding: var(--size-4-1) var(--size-4-2);
|
||||
background: #fcfcfc;
|
||||
border-radius: var(--radius-m);
|
||||
border: var(--size-2-1) solid #fcfcfc;
|
||||
cursor: pointer;
|
||||
transition: border-color 0.3s ease-in-out;
|
||||
animation: 0.5s ease-in-out srt-fadein;
|
||||
|
||||
&:hover {
|
||||
border-color: var(--interactive-accent);
|
||||
}
|
||||
|
||||
.deck-result-content {
|
||||
display: inline-flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: flex-start;
|
||||
font-weight: 500;
|
||||
|
||||
&.deck-result-red {
|
||||
color: var(--color-red);
|
||||
}
|
||||
|
||||
&.deck-result-black {
|
||||
color: #212121;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.deck-result-value {
|
||||
display: inline-block;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.deck-result-type {
|
||||
position: relative;
|
||||
top: 1px;
|
||||
}
|
||||
}
|
||||
|
||||
.word-buttons {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: var(--size-4-4);
|
||||
}
|
||||
|
||||
.word-results {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
justify-content: flex-end;
|
||||
gap: var(--size-4-4);
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
|
||||
.word-result {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
animation: 0.5s ease-in-out srt-fadein;
|
||||
|
||||
&:not(:hover) {
|
||||
color: var(--text-normal);
|
||||
}
|
||||
}
|
||||
|
||||
.word-result-type {
|
||||
display: inline-block;
|
||||
min-width: 60px;
|
||||
font-size: 0.75em;
|
||||
line-height: 2em;
|
||||
color: var(--color-base-60);
|
||||
text-align: right;
|
||||
margin-right: var(--size-4-4);
|
||||
}
|
||||
}
|
||||
|
||||
&.srt-desktop-layout {
|
||||
flex-direction: column-reverse;
|
||||
justify-content: flex-start;
|
||||
|
||||
.srt-tab-picker {
|
||||
margin-top: 0;
|
||||
padding-top: 0;
|
||||
padding-bottom: var(--size-4-4);
|
||||
margin-bottom: var(--size-4-4);
|
||||
border-top: none;
|
||||
border-bottom: 1px solid var(--color-base-40);
|
||||
}
|
||||
|
||||
.srt-tab {
|
||||
justify-content: flex-start;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.deck-results {
|
||||
flex-direction: column-reverse;
|
||||
margin-bottom: var(--size-4-6);
|
||||
}
|
||||
|
||||
.word-results {
|
||||
flex-direction: column-reverse;
|
||||
margin-bottom: var(--size-4-6);
|
||||
}
|
||||
}
|
||||
|
||||
&.srt-mobile-layout {
|
||||
.srt-tab-picker {
|
||||
.clickable-icon {
|
||||
padding: var(--size-4-2);
|
||||
|
||||
svg {
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
}
|
||||
}
|
||||
|
||||
.srt-tab-picker-tabs {
|
||||
gap: var(--size-4-4);
|
||||
}
|
||||
}
|
||||
|
||||
.dice-buttons {
|
||||
.dice-variant {
|
||||
.clickable-icon {
|
||||
padding: var(--size-4-3);
|
||||
|
||||
svg {
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.deck-buttons {
|
||||
.deck-size {
|
||||
padding-left: var(--size-4-5);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.nofade {
|
||||
animation: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes srt-fadein {
|
||||
from {
|
||||
opacity: 0;
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
Loading…
Reference in a new issue