diff --git a/.styles/root.css b/.styles/root.css index 101cec0..fe3b0c1 100644 --- a/.styles/root.css +++ b/.styles/root.css @@ -14,7 +14,8 @@ margin: 0; } .dotdungeon > .window-content label { - display: block; + display: inline-block; + cursor: pointer; } .dotdungeon > .window-content button, .dotdungeon > .window-content button:hover { all: initial; @@ -35,6 +36,7 @@ border-style: solid; border-color: rgba(0, 0, 0, 0.4); background-color: rgba(0, 0, 0, 0.1); + font-family: sans-serif; } .dotdungeon > .window-content input[type=text]:focus, .dotdungeon > .window-content input[type=text]:active, .dotdungeon > .window-content input[type=number]:focus, @@ -66,6 +68,7 @@ justify-content: center; align-items: center; width: 100%; + gap: 8px; } .dotdungeon .skill-group { display: flex; @@ -81,6 +84,43 @@ text-align: center; } +.dotdungeon .panel { + display: grid; + grid-template-rows: min-content 1fr; + border: 2px solid black; + background: greenyellow; +} +.dotdungeon .panel__header { + background: black; + color: white; + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + gap: 4px; + padding: 0 4px; +} +.dotdungeon .panel__header h2 { + all: initial; + display: block; + box-sizing: border-box; + color: inherit; + flex-grow: 1; + font-family: "Pixelify Sans", sans-serif; + font-size: 20px; +} +.dotdungeon .panel__header .icon { + height: 20px; + width: 20px; + aspect-ratio: 1/1; +} + +@container (max-width: 400px) { + .dotdungeon .panel__header .icon { + display: none; + visibility: hidden; + } +} .dotdungeon .actor--pc { display: grid; grid-template-areas: "avatar stats stats" "avatar skills skills" "backpack skills skills" "backpack sync aspect" "backpack weapons aspect" "backpack weapons spells" "backpack roles spells" "summons roles mounts" "summons roles storage"; @@ -119,6 +159,13 @@ .dotdungeon .actor--pc .panel--aspect { grid-area: aspect; } +.dotdungeon .actor--pc .panel--aspect .panel__content { + display: grid; + grid-template-rows: min-content min-content min-content 1fr; + height: 100%; + gap: 4px; + padding: 8px; +} .dotdungeon .actor--pc .panel--weapons { grid-area: weapons; } @@ -137,45 +184,23 @@ .dotdungeon .actor--pc .panel--storage { grid-area: storage; } -.dotdungeon .panel { - border: 2px solid black; - background: greenyellow; -} -.dotdungeon .panel__header { - background: black; - color: white; - display: flex; - flex-direction: row; - justify-content: center; - align-items: center; - gap: 4px; -} -.dotdungeon .panel__header h2 { - all: initial; - color: inherit; - flex-grow: 1; - padding-left: 8px; - font-family: "Pixelify Sans", sans-serif; - font-size: 20px; -} -.dotdungeon .panel__header .icon { - height: 32px; - width: 32px; - aspect-ratio: 1/1; -} @container (max-width: 620px) { .dotdungeon .actor--pc { grid-template-columns: repeat(2, minmax(0, 1fr)); - grid-template-rows: repeat(15, minmax(0, 1fr)); - grid-template-areas: "avatar sync" "avatar skills" "stats skills" "stats skills" "weapons aspect" "weapons aspect" "backpack aspect" "backpack roles" "backpack roles" "backpack roles" "backpack spells" "summons spells" "summons storage" "mounts storage" "mounts storage"; + grid-template-rows: repeat(15, min-content); + grid-template-areas: "avatar stats" "avatar skills" "sync skills" "weapons skills" "weapons skills" "backpack aspect" "backpack aspect" "backpack roles" "backpack roles" "backpack roles" "backpack spells" "summons spells" "summons storage" "mounts storage" "mounts storage"; } - .dotdungeon .panel { + .dotdungeon .actor--pc .panel { background: yellowgreen; } - .dotdungeon .panel--stats .panel__content { + .dotdungeon .actor--pc .panel--stats .panel__content { flex-wrap: wrap; } + .dotdungeon .actor--pc .panel--skills .panel__content { + display: flex; + flex-direction: column; + } } @container (max-width: 400px) { .dotdungeon .actor--pc { @@ -183,27 +208,21 @@ grid-template-rows: repeat(12, min-content); grid-template-areas: "avatar" "stats" "sync" "skills" "aspect" "roles" "backpack" "weapons" "spells" "mounts" "summons" "storage"; } - .dotdungeon .panel { - background: blueviolet; - } - .dotdungeon .panel__header .icon { - display: none; - visibility: hidden; + .dotdungeon .actor--pc .panel--skills .skill { + flex-direction: column; } } .dotdungeon .item--aspect { padding: 4px; } .dotdungeon .item--aspect input[type=text] { - font-family: sans-serif; font-size: 1.5em; height: 1.5em; width: 100%; } .dotdungeon .item--aspect textarea { - font-family: sans-serif; width: 100%; resize: vertical; } -/*# sourceMappingURL=data:application/json;charset=utf-8,%7B%22version%22:3,%22sourceRoot%22:%22%22,%22sources%22:%5B%22../styles/root.scss%22,%22../styles/mixins/_foundry.scss%22,%22../styles/_vars.scss%22,%22../styles/mixins/_partials.scss%22,%22../styles/sheets/partials/stat.scss%22,%22../styles/sheets/partials/skill.scss%22,%22../styles/sheets/actor/mvp.scss%22,%22../styles/mixins/_breakpoints.scss%22,%22../styles/sheets/items/aspect.scss%22%5D,%22names%22:%5B%5D,%22mappings%22:%22AAIQ;AAKP;EACC;;AAED;EACC;;AAGD;ECfA;EACA;EACA;EDeC;EACA,aEnBW;EFoBX;;AAGD;EACC;;AAGD;EC1BA;EACA;EACA;ED0BC;EACA;;AAGD;AAAA;AAAA;EChCA;EACA;EACA;EDkCC;EGpCD;EACA;EACA;EACA;EACA;;AAEA;AAAA;AAAA;AAAA;AAAA;EAEC;;AHgCD;EACC;;;AAKF;EACC;;AAEA;EACC;EACA,YElDW;;;AEFb;EACC;EACA;EACA;;ACHD;EACC;EACA;EACA;EACA;EACA;;AAEA;EACC;EACA;EACA;EACA;EACA;;AAEA;EACC;EACA;EACA;EACA;;;ACdF;EACC;EACA,qBACC;EASD;EACA;EACA;EACA;;AAGC;EACC;;AAED;EACC;;AACA;EACC;EACA;EACA;EACA;EACA;;AAGF;EACC;;AAEA;EACC;EACA;EACA;;AAGF;EACC;;AAED;EACC;;AAED;EACC;;AAED;EACC;;AAED;EACC;;AAED;EACC;;AAED;EACC;;AAED;EACC;;AAED;EACC;;AAKH;EACC;EACA;;AAEA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACC;EACA;EACA;EACA;EACA,aJ5FS;EI6FT;;AAGD;EAEC,QADO;EAEP,OAFO;EAGP;;;ACnGH;ED4GC;IACC;IACA;IACA,qBACC;;EAiBF;IACC;;EAGC;IACC;;;AChIJ;EDyIC;IACC;IACA;IACA,qBACC;;EAaF;IACC;;EAGC;IACC;IACA;;;AErKL;EACC;;AAEA;EACC,aNLU;EMMV;EACA;EACA;;AAGD;EACC,aNZU;EMaV;EACA%22,%22file%22:%22root.css%22%7D */ +/*# sourceMappingURL=data:application/json;charset=utf-8,%7B%22version%22:3,%22sourceRoot%22:%22%22,%22sources%22:%5B%22../styles/root.scss%22,%22../styles/mixins/_foundry.scss%22,%22../styles/_vars.scss%22,%22../styles/mixins/_partials.scss%22,%22../styles/sheets/partials/stat.scss%22,%22../styles/sheets/partials/skill.scss%22,%22../styles/sheets/partials/panel.scss%22,%22../styles/mixins/_breakpoints.scss%22,%22../styles/sheets/actor/mvp.scss%22,%22../styles/sheets/items/aspect.scss%22%5D,%22names%22:%5B%5D,%22mappings%22:%22AAIQ;AAKP;EACC;;AAED;EACC;;AAGD;ECfA;EACA;EACA;EDeC;EACA,aEnBW;EFoBX;;AAGD;EACC;EACA;;AAGD;EC3BA;EACA;EACA;ED2BC;EACA;;AAGD;AAAA;AAAA;ECjCA;EACA;EACA;EDmCC;EGnCD;EACA;EACA;EACA;EACA;EACA,aDPW;;ACSX;AAAA;AAAA;AAAA;AAAA;EAEC;;AH8BD;EACC;;;AAKF;EACC;;AAEA;EACC;EACA,YElDW;;;AEHb;EACC;EACA;EACA;;ACHD;EACC;EACA;EACA;EACA;EACA;EACA;;AAEA;EACC;EACA;EACA;EACA;EACA;;AAEA;EACC;EACA;EACA;EACA;;;ACfH;EACC;EACA;EAEA;EACA;;AAEA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;ELpBD;EACA;EACA;EKoBE;EACA;EACA,aJzBU;EI0BV;;AAGD;EAEC,QADO;EAEP,OAFO;EAGP;;;AC1BF;EDgCA;IACC;IACA;;;AEtCF;EACC;EACA,qBACC;EASD;EACA;EACA;EACA;;AAGC;EACC;;AAED;EACC;;AACA;EACC;EACA;EACA;EACA;EACA;;AAGF;EACC;;AAEA;EACC;EACA;EACA;;AAGF;EACC;;AAED;EACC;;AAED;EACC;;AACA;EACC;EACA;EACA;EACA;EACA;;AAGF;EACC;;AAED;EACC;;AAED;EACC;;AAED;EACC;;AAED;EACC;;AAED;EACC;;;AD1EF;ECkFC;IACC;IACA;IACA,qBACC;;EAgBD;IACC;;EAGC;IACC;;EAKD;IACC;IACA;;;AD5GL;ECsHC;IACC;IACA;IACA,qBACC;;EAeC;IACC;;;AC/IN;EACC;;AAEA;EACC;EACA;EACA;;AAGD;EACC;EACA%22,%22file%22:%22root.css%22%7D */ diff --git a/.styles/sheets/actor/mvp.css b/.styles/sheets/actor/mvp.css index 2b06434..7b6746b 100644 --- a/.styles/sheets/actor/mvp.css +++ b/.styles/sheets/actor/mvp.css @@ -36,6 +36,13 @@ .dotdungeon .actor--pc .panel--aspect { grid-area: aspect; } +.dotdungeon .actor--pc .panel--aspect .panel__content { + display: grid; + grid-template-rows: min-content min-content min-content 1fr; + height: 100%; + gap: 4px; + padding: 8px; +} .dotdungeon .actor--pc .panel--weapons { grid-area: weapons; } @@ -54,45 +61,23 @@ .dotdungeon .actor--pc .panel--storage { grid-area: storage; } -.dotdungeon .panel { - border: 2px solid black; - background: greenyellow; -} -.dotdungeon .panel__header { - background: black; - color: white; - display: flex; - flex-direction: row; - justify-content: center; - align-items: center; - gap: 4px; -} -.dotdungeon .panel__header h2 { - all: initial; - color: inherit; - flex-grow: 1; - padding-left: 8px; - font-family: "Pixelify Sans", sans-serif; - font-size: 20px; -} -.dotdungeon .panel__header .icon { - height: 32px; - width: 32px; - aspect-ratio: 1/1; -} @container (max-width: 620px) { .dotdungeon .actor--pc { grid-template-columns: repeat(2, minmax(0, 1fr)); - grid-template-rows: repeat(15, minmax(0, 1fr)); - grid-template-areas: "avatar sync" "avatar skills" "stats skills" "stats skills" "weapons aspect" "weapons aspect" "backpack aspect" "backpack roles" "backpack roles" "backpack roles" "backpack spells" "summons spells" "summons storage" "mounts storage" "mounts storage"; + grid-template-rows: repeat(15, min-content); + grid-template-areas: "avatar stats" "avatar skills" "sync skills" "weapons skills" "weapons skills" "backpack aspect" "backpack aspect" "backpack roles" "backpack roles" "backpack roles" "backpack spells" "summons spells" "summons storage" "mounts storage" "mounts storage"; } - .dotdungeon .panel { + .dotdungeon .actor--pc .panel { background: yellowgreen; } - .dotdungeon .panel--stats .panel__content { + .dotdungeon .actor--pc .panel--stats .panel__content { flex-wrap: wrap; } + .dotdungeon .actor--pc .panel--skills .panel__content { + display: flex; + flex-direction: column; + } } @container (max-width: 400px) { .dotdungeon .actor--pc { @@ -100,13 +85,9 @@ grid-template-rows: repeat(12, min-content); grid-template-areas: "avatar" "stats" "sync" "skills" "aspect" "roles" "backpack" "weapons" "spells" "mounts" "summons" "storage"; } - .dotdungeon .panel { - background: blueviolet; - } - .dotdungeon .panel__header .icon { - display: none; - visibility: hidden; + .dotdungeon .actor--pc .panel--skills .skill { + flex-direction: column; } } -/*# sourceMappingURL=data:application/json;charset=utf-8,%7B%22version%22:3,%22sourceRoot%22:%22%22,%22sources%22:%5B%22../../../styles/sheets/actor/mvp.scss%22,%22../../../styles/_vars.scss%22,%22../../../styles/mixins/_breakpoints.scss%22%5D,%22names%22:%5B%5D,%22mappings%22:%22AAIC;EACC;EACA,qBACC;EASD;EACA;EACA;EACA;;AAGC;EACC;;AAED;EACC;;AACA;EACC;EACA;EACA;EACA;EACA;;AAGF;EACC;;AAEA;EACC;EACA;EACA;;AAGF;EACC;;AAED;EACC;;AAED;EACC;;AAED;EACC;;AAED;EACC;;AAED;EACC;;AAED;EACC;;AAED;EACC;;AAED;EACC;;AAKH;EACC;EACA;;AAEA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACC;EACA;EACA;EACA;EACA,aC5FS;ED6FT;;AAGD;EAEC,QADO;EAEP,OAFO;EAGP;;;AEnGH;EF4GC;IACC;IACA;IACA,qBACC;;EAiBF;IACC;;EAGC;IACC;;;AEhIJ;EFyIC;IACC;IACA;IACA,qBACC;;EAaF;IACC;;EAGC;IACC;IACA%22,%22file%22:%22mvp.css%22%7D */ +/*# sourceMappingURL=data:application/json;charset=utf-8,%7B%22version%22:3,%22sourceRoot%22:%22%22,%22sources%22:%5B%22../../../styles/sheets/actor/mvp.scss%22,%22../../../styles/mixins/_breakpoints.scss%22%5D,%22names%22:%5B%5D,%22mappings%22:%22AAGA;EACC;EACA,qBACC;EASD;EACA;EACA;EACA;;AAGC;EACC;;AAED;EACC;;AACA;EACC;EACA;EACA;EACA;EACA;;AAGF;EACC;;AAEA;EACC;EACA;EACA;;AAGF;EACC;;AAED;EACC;;AAED;EACC;;AACA;EACC;EACA;EACA;EACA;EACA;;AAGF;EACC;;AAED;EACC;;AAED;EACC;;AAED;EACC;;AAED;EACC;;AAED;EACC;;;AC1EF;EDkFC;IACC;IACA;IACA,qBACC;;EAgBD;IACC;;EAGC;IACC;;EAKD;IACC;IACA;;;AC5GL;EDsHC;IACC;IACA;IACA,qBACC;;EAeC;IACC%22,%22file%22:%22mvp.css%22%7D */ diff --git a/.styles/sheets/items/aspect.css b/.styles/sheets/items/aspect.css index 2b39c6f..8572a97 100644 --- a/.styles/sheets/items/aspect.css +++ b/.styles/sheets/items/aspect.css @@ -2,15 +2,13 @@ padding: 4px; } .dotdungeon .item--aspect input[type=text] { - font-family: sans-serif; font-size: 1.5em; height: 1.5em; width: 100%; } .dotdungeon .item--aspect textarea { - font-family: sans-serif; width: 100%; resize: vertical; } -/*# sourceMappingURL=data:application/json;charset=utf-8,%7B%22version%22:3,%22sourceRoot%22:%22%22,%22sources%22:%5B%22../../../styles/sheets/items/aspect.scss%22,%22../../../styles/_vars.scss%22%5D,%22names%22:%5B%5D,%22mappings%22:%22AAEA;EACC;;AAEA;EACC,aCLU;EDMV;EACA;EACA;;AAGD;EACC,aCZU;EDaV;EACA%22,%22file%22:%22aspect.css%22%7D */ +/*# sourceMappingURL=data:application/json;charset=utf-8,%7B%22version%22:3,%22sourceRoot%22:%22%22,%22sources%22:%5B%22../../../styles/sheets/items/aspect.scss%22%5D,%22names%22:%5B%5D,%22mappings%22:%22AAEA;EACC;;AAEA;EACC;EACA;EACA;;AAGD;EACC;EACA%22,%22file%22:%22aspect.css%22%7D */ diff --git a/.styles/sheets/partials/panel.css b/.styles/sheets/partials/panel.css new file mode 100644 index 0000000..0c2782d --- /dev/null +++ b/.styles/sheets/partials/panel.css @@ -0,0 +1,39 @@ +.dotdungeon .panel { + display: grid; + grid-template-rows: min-content 1fr; + border: 2px solid black; + background: greenyellow; +} +.dotdungeon .panel__header { + background: black; + color: white; + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + gap: 4px; + padding: 0 4px; +} +.dotdungeon .panel__header h2 { + all: initial; + display: block; + box-sizing: border-box; + color: inherit; + flex-grow: 1; + font-family: "Pixelify Sans", sans-serif; + font-size: 20px; +} +.dotdungeon .panel__header .icon { + height: 20px; + width: 20px; + aspect-ratio: 1/1; +} + +@container (max-width: 400px) { + .dotdungeon .panel__header .icon { + display: none; + visibility: hidden; + } +} + +/*# sourceMappingURL=data:application/json;charset=utf-8,%7B%22version%22:3,%22sourceRoot%22:%22%22,%22sources%22:%5B%22../../../styles/sheets/partials/panel.scss%22,%22../../../styles/mixins/_foundry.scss%22,%22../../../styles/_vars.scss%22,%22../../../styles/mixins/_breakpoints.scss%22%5D,%22names%22:%5B%5D,%22mappings%22:%22AAIA;EACC;EACA;EAEA;EACA;;AAEA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;ECpBD;EACA;EACA;EDoBE;EACA;EACA,aEzBU;EF0BV;;AAGD;EAEC,QADO;EAEP,OAFO;EAGP;;;AG1BF;EHgCA;IACC;IACA%22,%22file%22:%22panel.css%22%7D */ diff --git a/.styles/sheets/partials/skill.css b/.styles/sheets/partials/skill.css index 9d3ed13..900ccd4 100644 --- a/.styles/sheets/partials/skill.css +++ b/.styles/sheets/partials/skill.css @@ -4,6 +4,7 @@ justify-content: center; align-items: center; width: 100%; + gap: 8px; } .dotdungeon .skill-group { display: flex; @@ -19,4 +20,4 @@ text-align: center; } -/*# sourceMappingURL=data:application/json;charset=utf-8,%7B%22version%22:3,%22sourceRoot%22:%22%22,%22sources%22:%5B%22../../../styles/sheets/partials/skill.scss%22%5D,%22names%22:%5B%5D,%22mappings%22:%22AAAA;EACC;EACA;EACA;EACA;EACA;;AAEA;EACC;EACA;EACA;EACA;EACA;;AAEA;EACC;EACA;EACA;EACA%22,%22file%22:%22skill.css%22%7D */ +/*# sourceMappingURL=data:application/json;charset=utf-8,%7B%22version%22:3,%22sourceRoot%22:%22%22,%22sources%22:%5B%22../../../styles/sheets/partials/skill.scss%22%5D,%22names%22:%5B%5D,%22mappings%22:%22AAAA;EACC;EACA;EACA;EACA;EACA;EACA;;AAEA;EACC;EACA;EACA;EACA;EACA;;AAEA;EACC;EACA;EACA;EACA%22,%22file%22:%22skill.css%22%7D */ diff --git a/langs/en-ca.json b/langs/en-ca.json index 4fab558..fc123e7 100644 --- a/langs/en-ca.json +++ b/langs/en-ca.json @@ -69,6 +69,8 @@ "dotdungeon.item.aspect.description": "Description", "dotdungeon.item.aspect.send-to-chat": "Send Aspect to Chat", - "dotdungeon.aria.skill-dropdown": "Your expertise level in the {skill} skill", + + "dotdungeon.aria.skill.dropdown": "Your expertise level in the {skill} skill", + "dotdungeon.aria.skill.button.roll": "Roll a {skill} check", "dotdungeon.aria.aspect-description": "The information on how the aspect works" } \ No newline at end of file diff --git a/module/handlebars.mjs b/module/handlebars.mjs index ec139b0..6d07528 100644 --- a/module/handlebars.mjs +++ b/module/handlebars.mjs @@ -2,7 +2,7 @@ export const partials = [ `actors/char-sheet-mvp/partials/dice_choice.hbs`, `actors/char-sheet-mvp/partials/stat.hbs`, `actors/char-sheet-mvp/partials/skill.hbs`, - `actors/char-sheet-mvp/partials/panel.hbs`, + `partials/panel.hbs`, `items/aspect.hbs`, ]; @@ -24,7 +24,7 @@ export async function preloadHandlebarsTemplates() { console.debug(`Loading partial: ${partial}`); const path = `${pathPrefix}${partial}`; paths[`dotdungeon.${partial.split(`/`).pop().replace(`.hbs`, ``)}`] = path; - } + }; console.debug(`Loaded ${partials.length} partials`); console.groupEnd(); @@ -37,8 +37,6 @@ function createArray(...args) { }; function objectValue(obj, keypath) { - // console.log(obj, keypath.string) - return keypath function helper(o, k) { let v = o[k[0]]; if (typeof v === "object") { @@ -46,7 +44,8 @@ function objectValue(obj, keypath) { }; return v; }; - return helper(obj, keypath.string.split(`.`)) + let resp = helper(obj, keypath.string.split(`.`)); + return resp; }; @@ -73,4 +72,4 @@ function toFriendlyDuration(duration) { friendly += `${duration}s`; }; return friendly; -} \ No newline at end of file +}; \ No newline at end of file diff --git a/module/models/PlayerData.mjs b/module/models/PlayerData.mjs index cd3b085..1a79d51 100644 --- a/module/models/PlayerData.mjs +++ b/module/models/PlayerData.mjs @@ -62,9 +62,11 @@ export class PlayerData extends foundry.abstract.DataModel { piloting: trainingLevelField(), }) }), - aspect: new fields.StringField({ - blank: true, - trim: true, + aspect: new fields.SchemaField({ + name: new fields.StringField({ blank: true, trim: true }), + description: new fields.StringField({ blank: true, trim: true }), + deactivateAfter: new fields.NumberField({ min: 0, integer: true}), + used: new fields.BooleanField(), }), roles: new fields.ArrayField(new fields.HTMLField()), weapon: new fields.SchemaField({ diff --git a/styles/_vars.scss b/styles/_vars.scss index 18930d7..0689d94 100644 --- a/styles/_vars.scss +++ b/styles/_vars.scss @@ -1,3 +1,4 @@ $title-font: 'Pixelify Sans', sans-serif; $body-font: sans-serif; +$input-font: $body-font; $background: #f2f2f2; \ No newline at end of file diff --git a/styles/mixins/_partials.scss b/styles/mixins/_partials.scss index b9763a3..e5d897b 100644 --- a/styles/mixins/_partials.scss +++ b/styles/mixins/_partials.scss @@ -1,9 +1,12 @@ +@use "../vars" as *; + @mixin input-generic { border-width: 2px; border-radius: 4px; border-style: solid; border-color: rgba(0,0,0, 0.4); background-color: rgba(0,0,0, 0.1); + font-family: $input-font; &:focus, &:active { diff --git a/styles/root.scss b/styles/root.scss index 756948a..7c29012 100644 --- a/styles/root.scss +++ b/styles/root.scss @@ -22,7 +22,8 @@ } label { - display: block; + display: inline-block; + cursor: pointer; } button, button:hover { @@ -56,6 +57,7 @@ @import "./sheets/partials/stat.scss"; @import "./sheets/partials/skill.scss"; +@import "./sheets/partials/panel.scss"; @import "./sheets/actor/mvp.scss"; @import "./sheets/items/aspect.scss"; \ No newline at end of file diff --git a/styles/sheets/actor/mvp.scss b/styles/sheets/actor/mvp.scss index e65ec24..0bdefaf 100644 --- a/styles/sheets/actor/mvp.scss +++ b/styles/sheets/actor/mvp.scss @@ -1,106 +1,80 @@ @use "../../vars.scss" as *; @use "../../mixins/breakpoints" as *; -.dotdungeon { - .actor--pc { - display: grid; - grid-template-areas: - "avatar stats stats" - "avatar skills skills" - "backpack skills skills" - "backpack sync aspect" - "backpack weapons aspect" - "backpack weapons spells" - "backpack roles spells" - "summons roles mounts" - "summons roles storage"; - grid-template-columns: repeat(3, minmax(0, 1fr)); - grid-template-rows: min-content repeat(8, minmax(0, 1fr)); - padding: 4px; - gap: 4px; - - .panel { - &--avatar { - grid-area: avatar; - } - &--stats { - grid-area: stats; - .panel__content { - display: flex; - flex-direction: row; - gap: 8px; - justify-content: space-evenly; - padding: 8px; - } - } - &--skills { - grid-area: skills; - - .panel__content { - display: grid; - grid-template-columns: repeat(2, minmax(0, 1fr)); - grid-template-rows: repeat(2, minmax(0, min-content)); - } - } - &--backpack { - grid-area: backpack; - } - &--sync { - grid-area: sync; - } - &--aspect { - grid-area: aspect; - } - &--weapons { - grid-area: weapons; - } - &--roles { - grid-area: roles; - } - &--spells { - grid-area: spells; - } - &--mounts { - grid-area: mounts; - } - &--summons { - grid-area: summons; - } - &--storage { - grid-area: storage; - } - } - } +.dotdungeon .actor--pc { + display: grid; + grid-template-areas: + "avatar stats stats" + "avatar skills skills" + "backpack skills skills" + "backpack sync aspect" + "backpack weapons aspect" + "backpack weapons spells" + "backpack roles spells" + "summons roles mounts" + "summons roles storage"; + grid-template-columns: repeat(3, minmax(0, 1fr)); + grid-template-rows: min-content repeat(8, minmax(0, 1fr)); + padding: 4px; + gap: 4px; .panel { - border: 2px solid black; - background: greenyellow; - - &__header { - background: black; - color: white; - display: flex; - flex-direction: row; - justify-content: center; - align-items: center; - gap: 4px; - - h2 { - all: initial; - color: inherit; - flex-grow: 1; - padding-left: 8px; - font-family: $title-font; - font-size: 20px; + &--avatar { + grid-area: avatar; + } + &--stats { + grid-area: stats; + .panel__content { + display: flex; + flex-direction: row; + gap: 8px; + justify-content: space-evenly; + padding: 8px; } + } + &--skills { + grid-area: skills; - .icon { - $size: 32px; - height: $size; - width: $size; - aspect-ratio: 1/1; + .panel__content { + display: grid; + grid-template-columns: repeat(2, minmax(0, 1fr)); + grid-template-rows: repeat(2, minmax(0, min-content)); } } + &--backpack { + grid-area: backpack; + } + &--sync { + grid-area: sync; + } + &--aspect { + grid-area: aspect; + .panel__content { + display: grid; + grid-template-rows: min-content min-content min-content 1fr; + height: 100%; + gap: 4px; + padding: 8px; + } + } + &--weapons { + grid-area: weapons; + } + &--roles { + grid-area: roles; + } + &--spells { + grid-area: spells; + } + &--mounts { + grid-area: mounts; + } + &--summons { + grid-area: summons; + } + &--storage { + grid-area: storage; + } } } @@ -109,14 +83,14 @@ .dotdungeon { .actor--pc { grid-template-columns: repeat(2, minmax(0, 1fr)); - grid-template-rows: repeat(15, minmax(0, 1fr)); + grid-template-rows: repeat(15, min-content); grid-template-areas: - "avatar sync" + "avatar stats" "avatar skills" - "stats skills" - "stats skills" - "weapons aspect" - "weapons aspect" + "sync skills" + "weapons skills" + "weapons skills" + "backpack aspect" "backpack aspect" "backpack roles" "backpack roles" @@ -126,14 +100,21 @@ "summons storage" "mounts storage" "mounts storage"; - } - .panel { - background: yellowgreen; + .panel { + background: yellowgreen; - &--stats { - .panel__content { - flex-wrap: wrap; + &--stats { + .panel__content { + flex-wrap: wrap; + } + } + + &--skills { + .panel__content { + display: flex; + flex-direction: column; + } } } } @@ -158,14 +139,12 @@ "mounts" "summons" "storage"; - } - .panel { - background: blueviolet; - &__header { - .icon { - display: none; - visibility: hidden; + .panel { + &--skills { + .skill { + flex-direction: column; + } } } } diff --git a/styles/sheets/items/aspect.scss b/styles/sheets/items/aspect.scss index 72f8421..2461b9b 100644 --- a/styles/sheets/items/aspect.scss +++ b/styles/sheets/items/aspect.scss @@ -4,14 +4,12 @@ padding: 4px; input[type=text] { - font-family: $body-font; font-size: 1.5em; height: 1.5em; width: 100%; } textarea { - font-family: $body-font; width: 100%; resize: vertical; } diff --git a/styles/sheets/partials/panel.scss b/styles/sheets/partials/panel.scss new file mode 100644 index 0000000..677a4c4 --- /dev/null +++ b/styles/sheets/partials/panel.scss @@ -0,0 +1,44 @@ +@use "../../mixins/breakpoints" as *; +@use "../../mixins/foundry" as *; +@use "../../vars" as *; + +.dotdungeon .panel { + display: grid; + grid-template-rows: min-content 1fr; + + border: 2px solid black; + background: greenyellow; + + &__header { + background: black; + color: white; + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + gap: 4px; + padding: 0 4px; + + h2 { + @include fvtt_reset; + color: inherit; + flex-grow: 1; + font-family: $title-font; + font-size: 20px; + } + + .icon { + $size: 20px; + height: $size; + width: $size; + aspect-ratio: 1/1; + } + } +} + +@include bp-s { + .dotdungeon .panel__header .icon { + display: none; + visibility: hidden; + } +} \ No newline at end of file diff --git a/styles/sheets/partials/skill.scss b/styles/sheets/partials/skill.scss index b380ffd..e664c30 100644 --- a/styles/sheets/partials/skill.scss +++ b/styles/sheets/partials/skill.scss @@ -4,6 +4,7 @@ justify-content: center; align-items: center; width: 100%; + gap: 8px; &-group { display: flex; diff --git a/templates/actors/char-sheet-mvp/partials/skill.hbs b/templates/actors/char-sheet-mvp/partials/skill.hbs index 801ab05..6028cc7 100644 --- a/templates/actors/char-sheet-mvp/partials/skill.hbs +++ b/templates/actors/char-sheet-mvp/partials/skill.hbs @@ -1,24 +1,37 @@