diff --git a/css/kidsonbrooms.css b/css/kidsonbrooms.css index 8e242f1..0316024 100644 --- a/css/kidsonbrooms.css +++ b/css/kidsonbrooms.css @@ -162,72 +162,140 @@ } .flex-group-center { + display: -webkit-box; + display: -ms-flexbox; display: flex; + -webkit-box-orient: vertical; + -webkit-box-direction: normal; + -ms-flex-direction: center; flex-direction: center; + -ms-flex-wrap: center; flex-wrap: center; + -webkit-box-pack: start; + -ms-flex-pack: start; justify-content: flex-start; + -webkit-box-align: stretch; + -ms-flex-align: stretch; align-items: stretch; text-align: center; } .flex-group-left { + display: -webkit-box; + display: -ms-flexbox; display: flex; + -webkit-box-orient: vertical; + -webkit-box-direction: normal; + -ms-flex-direction: flex-start; flex-direction: flex-start; + -ms-flex-wrap: center; flex-wrap: center; + -webkit-box-pack: start; + -ms-flex-pack: start; justify-content: flex-start; + -webkit-box-align: stretch; + -ms-flex-align: stretch; align-items: stretch; text-align: left; } .flex-group-right { + display: -webkit-box; + display: -ms-flexbox; display: flex; + -webkit-box-orient: vertical; + -webkit-box-direction: normal; + -ms-flex-direction: flex-end; flex-direction: flex-end; + -ms-flex-wrap: center; flex-wrap: center; + -webkit-box-pack: start; + -ms-flex-pack: start; justify-content: flex-start; + -webkit-box-align: stretch; + -ms-flex-align: stretch; align-items: stretch; text-align: right; } .flexshrink { + -webkit-box-flex: 0; + -ms-flex: 0; flex: 0; } .flex-between { + -webkit-box-pack: justify; + -ms-flex-pack: justify; justify-content: space-between; } .flexlarge { + -webkit-box-flex: 2; + -ms-flex: 2; flex: 2; } .align-left { + display: -webkit-box; + display: -ms-flexbox; display: flex; + -webkit-box-orient: vertical; + -webkit-box-direction: normal; + -ms-flex-direction: flex-start; flex-direction: flex-start; + -ms-flex-wrap: center; flex-wrap: center; + -webkit-box-pack: start; + -ms-flex-pack: start; justify-content: flex-start; + -webkit-box-align: stretch; + -ms-flex-align: stretch; align-items: stretch; text-align: left; } .align-right { + display: -webkit-box; + display: -ms-flexbox; display: flex; + -webkit-box-orient: vertical; + -webkit-box-direction: normal; + -ms-flex-direction: flex-end; flex-direction: flex-end; + -ms-flex-wrap: center; flex-wrap: center; + -webkit-box-pack: start; + -ms-flex-pack: start; justify-content: flex-start; + -webkit-box-align: stretch; + -ms-flex-align: stretch; align-items: stretch; text-align: right; } .align-center { + display: -webkit-box; + display: -ms-flexbox; display: flex; + -webkit-box-orient: vertical; + -webkit-box-direction: normal; + -ms-flex-direction: center; flex-direction: center; + -ms-flex-wrap: center; flex-wrap: center; + -webkit-box-pack: start; + -ms-flex-pack: start; justify-content: flex-start; + -webkit-box-align: stretch; + -ms-flex-align: stretch; align-items: stretch; text-align: center; } .right-align-input { + -webkit-box-flex: 1; + -ms-flex: 1; flex: 1; margin-left: auto; max-width: 260px; @@ -243,26 +311,47 @@ cursor: pointer; } +.editor-container { + min-height: 200px; /* Adjust this value as needed */ +} + /* Styles limited to kidsonbrooms sheets */ .kids-on-brooms .item-form { font-family: "Roboto", sans-serif; } .kids-on-brooms .sheet-header { + display: -webkit-box; + display: -ms-flexbox; display: flex; + -webkit-box-orient: horizontal; + -webkit-box-direction: normal; + -ms-flex-direction: row; flex-direction: row; + -ms-flex-wrap: wrap; flex-wrap: wrap; + -webkit-box-align: start; + -ms-flex-align: start; + align-items: flex-start; + -webkit-box-pack: start; + -ms-flex-pack: start; justify-content: flex-start; - align-items: stretch; - flex: 0 auto; + -webkit-box-flex: 0; + -ms-flex: 0 1 auto; + flex: 0 1 auto; overflow: hidden; margin-bottom: 10px; + height: 110px; } .kids-on-brooms .sheet-header .profile-img { + -webkit-box-flex: 0; + -ms-flex: 0 0 100px; flex: 0 0 100px; height: 100px; margin-right: 10px; } .kids-on-brooms .sheet-header .header-fields { + -webkit-box-flex: 1; + -ms-flex: 1; flex: 1; } .kids-on-brooms .sheet-header h1.charname { @@ -281,7 +370,9 @@ border-radius: 10px; } .kids-on-brooms .sheet-tabs { - flex: 0; + -webkit-box-flex: 1; + -ms-flex: 1; + flex: 1; } .kids-on-brooms .sheet-body, .kids-on-brooms .sheet-body .tab, @@ -295,8 +386,14 @@ padding: 0 8px; } .kids-on-brooms .selection-row { + display: -webkit-box; + display: -ms-flexbox; display: flex; + -webkit-box-pack: justify; + -ms-flex-pack: justify; justify-content: space-between; + -webkit-box-align: center; + -ms-flex-align: center; align-items: center; margin-bottom: 10px; } @@ -307,6 +404,8 @@ height: 28px; margin: 2px 0; padding: 0; + -webkit-box-align: center; + -ms-flex-align: center; align-items: center; background: rgba(0, 0, 0, 0.05); border: 2px groove #eeede0; @@ -320,6 +419,8 @@ font-weight: bold; padding-left: 5px; text-align: left; + display: -webkit-box; + display: -ms-flexbox; display: flex; } .kids-on-brooms .items-list { @@ -336,7 +437,11 @@ padding: 0; } .kids-on-brooms .items-list .item { + display: -webkit-box; + display: -ms-flexbox; display: flex; + -webkit-box-align: center; + -ms-flex-align: center; align-items: center; padding: 0 2px; border-bottom: 1px solid #c9c7b8; @@ -345,11 +450,15 @@ border-bottom: none; } .kids-on-brooms .items-list .item .item-name { + -webkit-box-flex: 2; + -ms-flex: 2; flex: 2; margin: 0; overflow: hidden; font-size: 13px; text-align: left; + display: -webkit-box; + display: -ms-flexbox; display: flex; color: #191813; } @@ -359,6 +468,8 @@ overflow-x: hidden; } .kids-on-brooms .items-list .item .item-name .item-image { + -webkit-box-flex: 0; + -ms-flex: 0 0 30px; flex: 0 0 30px; height: 30px; background-size: 30px; @@ -366,8 +477,14 @@ margin-right: 5px; } .kids-on-brooms .items-list .item-controls { + display: -webkit-box; + display: -ms-flexbox; display: flex; + -webkit-box-flex: 0; + -ms-flex: 0 0 100px; flex: 0 0 100px; + -webkit-box-pack: end; + -ms-flex-pack: end; justify-content: flex-end; } .kids-on-brooms .items-list .item-controls a { @@ -385,6 +502,8 @@ height: 28px; margin: 2px 0; padding: 0; + -webkit-box-align: center; + -ms-flex-align: center; align-items: center; background: rgba(0, 0, 0, 0.05); border: 2px groove #eeede0; @@ -399,6 +518,8 @@ text-align: left; } .kids-on-brooms .item-formula { + -webkit-box-flex: 0; + -ms-flex: 0 0 200px; flex: 0 0 200px; padding: 0 8px; } @@ -418,6 +539,4 @@ .kids-on-brooms .kids-on-brooms select:focus { outline: none; border-color: #8102dd; -} - -/*# sourceMappingURL=kidsonbrooms.css.map */ +} \ No newline at end of file diff --git a/gulpfile.js b/gulpfile.js index ec4a710..f7734a0 100644 --- a/gulpfile.js +++ b/gulpfile.js @@ -71,7 +71,7 @@ function compileScss() { /* ----------------------------------------- */ function watchUpdates() { - gulp.watch(SYSTEM_SCSS, css); + gulp.watch(SYSTEM_SCSS, compileScss); } diff --git a/module/kidsonbrooms.mjs b/module/kidsonbrooms.mjs index 31165ad..194b3ae 100644 --- a/module/kidsonbrooms.mjs +++ b/module/kidsonbrooms.mjs @@ -42,6 +42,7 @@ Hooks.once('init', async function() { decimals: 2 }; + // Define custom Document classes CONFIG.Actor.documentClass = KidsOnBroomsActor; @@ -104,12 +105,10 @@ Hooks.once('init', async function() { } }); - - - - // Preload Handlebars templates. return preloadHandlebarsTemplates(); + + }); /*** diff --git a/module/sheets/actor-sheet.mjs b/module/sheets/actor-sheet.mjs index 7de4c75..b4a3819 100644 --- a/module/sheets/actor-sheet.mjs +++ b/module/sheets/actor-sheet.mjs @@ -20,6 +20,8 @@ export class KidsOnBroomsActorSheet extends ActorSheet { { console.log("template", this.actor) return `systems/kidsonbrooms/templates/actor/actor-${this.actor.type}-sheet.html`; + + } /* -------------------------------------------- */ diff --git a/scss/components/_forms.scss b/scss/components/_forms.scss index b84222b..9652480 100644 --- a/scss/components/_forms.scss +++ b/scss/components/_forms.scss @@ -3,10 +3,15 @@ } .sheet-header { - @include flexbox(row, wrap, flex-start); // Use a mixin for flexbox - flex: 0 auto; + display: flex; + flex-direction: row; + flex-wrap: wrap; + align-items: flex-start; + justify-content: flex-start; // Use a mixin for flexbox + flex: 0 1 auto; overflow: hidden; margin-bottom: 10px; + height: 110px; .profile-img { flex: 0 0 100px; @@ -38,7 +43,7 @@ div.editor-border { } .sheet-tabs { - flex: 0; + flex: 1; } .sheet-body, diff --git a/scss/kidsonbrooms.scss b/scss/kidsonbrooms.scss index 403c967..5445f18 100644 --- a/scss/kidsonbrooms.scss +++ b/scss/kidsonbrooms.scss @@ -14,6 +14,10 @@ @import 'global/flex'; @import 'global/base'; +.editor-container { + min-height: 200px; /* Adjust this value as needed */ +} + /* Styles limited to kidsonbrooms sheets */ .kids-on-brooms { @import 'components/forms'; diff --git a/system.json b/system.json index 43c14fd..2fd1a35 100644 --- a/system.json +++ b/system.json @@ -2,7 +2,7 @@ "id": "kidsonbrooms", "title": "Kids on Brooms System", "description": "The Kids on Brooms system for FoundryVTT!", - "version": "1.1.5", + "version": "1.1.6", "compatibility": { "minimum": 12, "verified": 12.331 diff --git a/templates/actor/actor-character-sheet.html b/templates/actor/actor-character-sheet.html index 120ff36..96bb181 100644 --- a/templates/actor/actor-character-sheet.html +++ b/templates/actor/actor-character-sheet.html @@ -43,10 +43,16 @@ - {{!-- Schoolbag Tab --}} -