diff --git a/daggerheart.mjs b/daggerheart.mjs index 387c1a74..1fa044ed 100644 --- a/daggerheart.mjs +++ b/daggerheart.mjs @@ -174,8 +174,10 @@ Hooks.on('ready', () => { Hooks.once('dicesoniceready', () => {}); -Hooks.on('renderChatMessageHTML', (_, element) => { +Hooks.on('renderChatMessageHTML', (_, element, message) => { enricherRenderSetup(element); + const cssClass = message.message.flags?.daggerheart?.cssClass; + if (cssClass) cssClass.split(' ').forEach(cls => element.classList.add(cls)); }); Hooks.on('renderJournalEntryPageProseMirrorSheet', (_, element) => { diff --git a/lang/en.json b/lang/en.json index 14292e5b..bc3404b0 100755 --- a/lang/en.json +++ b/lang/en.json @@ -1060,6 +1060,7 @@ }, "Bonuses": { "rest": { + "downtimeAction": "Downtime Action", "shortRest": { "shortRestMoves": { "label": "Short Rest: Bonus Short Rest Moves", diff --git a/module/applications/dialogs/downtime.mjs b/module/applications/dialogs/downtime.mjs index d0da7d72..7911ecb9 100644 --- a/module/applications/dialogs/downtime.mjs +++ b/module/applications/dialogs/downtime.mjs @@ -142,10 +142,18 @@ export default class DhpDowntime extends HandlebarsApplicationMixin(ApplicationV content: await foundry.applications.handlebars.renderTemplate( 'systems/daggerheart/templates/ui/chat/downtime.hbs', { - title: `${this.actor.name} - ${game.i18n.localize(`DAGGERHEART.APPLICATIONS.Downtime.${this.shortrest ? 'shortRest' : 'longRest'}.title`)}`, + title: game.i18n.localize( + `DAGGERHEART.APPLICATIONS.Downtime.${this.shortrest ? 'shortRest' : 'longRest'}.title` + ), + actor: { name: this.actor.name, img: this.actor.img }, moves: moves } - ) + ), + flags: { + daggerheart: { + cssClass: 'dh-chat-message dh-style' + } + } }); cls.create(msg.toObject()); diff --git a/module/data/fields/actionField.mjs b/module/data/fields/actionField.mjs index dd2b4dea..2a515a9e 100644 --- a/module/data/fields/actionField.mjs +++ b/module/data/fields/actionField.mjs @@ -249,19 +249,23 @@ export function ActionMixin(Base) { const systemData = { title: game.i18n.localize('DAGGERHEART.CONFIG.ActionType.action'), origin: origin, - img: this.img, - name: this.name, + action: { name: this.name, img: this.img, tags: this.tags ? this.tags : ['Spell', 'Arcana', 'Lv 10'] }, + itemOrigin: this.item, description: this.description, - actions: [] }; const msg = { type: 'abilityUse', user: game.user.id, system: systemData, content: await foundry.applications.handlebars.renderTemplate( - 'systems/daggerheart/templates/ui/chat/ability-use.hbs', + 'systems/daggerheart/templates/ui/chat/action.hbs', systemData - ) + ), + flags: { + daggerheart: { + cssClass: 'dh-chat-message dh-style' + } + } }; cls.create(msg); diff --git a/module/documents/item.mjs b/module/documents/item.mjs index a05a7ff0..f69bcbc2 100644 --- a/module/documents/item.mjs +++ b/module/documents/item.mjs @@ -121,9 +121,9 @@ export default class DHItem extends foundry.documents.Item { : game.i18n.localize('DAGGERHEART.UI.Chat.foundationCard.subclassFeatureTitle'), origin: origin, img: this.img, - name: this.name, + item: { name: this.name, img: this.img, tags: this.tags ? this.tags : ['Spell', 'Arcana', 'Lv 10'] }, description: this.system.description, - actions: [] + actions: this.system.actions }; const msg = new cls({ type: 'abilityUse', @@ -132,7 +132,12 @@ export default class DHItem extends foundry.documents.Item { content: await foundry.applications.handlebars.renderTemplate( 'systems/daggerheart/templates/ui/chat/ability-use.hbs', systemData - ) + ), + flags: { + daggerheart: { + cssClass: 'dh-chat-message dh-style' + } + } }); cls.create(msg.toObject()); diff --git a/styles/less/global/chat.less b/styles/less/global/chat.less new file mode 100644 index 00000000..60e6b69b --- /dev/null +++ b/styles/less/global/chat.less @@ -0,0 +1,18 @@ +@import '../utils/colors.less'; +@import '../utils/fonts.less'; +@import '../utils/mixin.less'; + +.dh-chat-message { + background-image: url('../assets/parchments/dh-parchment-dark.png'); + border: none !important; + padding: 8px 0; + + .message-header { + padding: 0 8px 8px; + color: @beige; + .message-sender, + .message-metadata { + font-family: @font-body; + } + } +} diff --git a/styles/less/global/elements.less b/styles/less/global/elements.less index dda82362..69c2c6d0 100755 --- a/styles/less/global/elements.less +++ b/styles/less/global/elements.less @@ -1,7 +1,7 @@ @import '../utils/colors.less'; @import '../utils/fonts.less'; -.application.dh-style { +.dh-style { border: 1px solid light-dark(@dark-blue, @golden); input[type='text'], diff --git a/styles/less/global/index.less b/styles/less/global/index.less index c37de0c7..881ae6bb 100644 --- a/styles/less/global/index.less +++ b/styles/less/global/index.less @@ -1,5 +1,6 @@ @import './sheet.less'; @import './dialog.less'; +@import './chat.less'; @import './elements.less'; @import './tab-navigation.less'; @import './tab-form-footer.less'; diff --git a/styles/less/global/inventory-item.less b/styles/less/global/inventory-item.less index 452d997b..fddb0dfa 100644 --- a/styles/less/global/inventory-item.less +++ b/styles/less/global/inventory-item.less @@ -1,5 +1,6 @@ @import '../utils/colors.less'; @import '../utils/fonts.less'; +@import '../utils/mixin.less'; .theme-light .application.daggerheart.dh-style { .inventory-item, @@ -50,6 +51,10 @@ .roll-img { position: absolute; transition: opacity 300ms ease-in; + height: 40px; + width: 40px; + object-fit: cover; + border-radius: 3px; } .roll-img { diff --git a/styles/less/ui/chat/ability-use.less b/styles/less/ui/chat/ability-use.less new file mode 100644 index 00000000..3cad6377 --- /dev/null +++ b/styles/less/ui/chat/ability-use.less @@ -0,0 +1,84 @@ +@import '../../utils/colors.less'; +@import '../../utils/fonts.less'; +@import '../../utils/spacing.less'; + +.daggerheart.chat { + &.domain-card { + display: flex; + flex-direction: column; + align-items: center; + + .card-img { + width: 100%; + height: 200px; + mask-image: linear-gradient(0deg, transparent 0%, black 10%, black 90%, transparent 100%); + object-fit: cover; + } + + .domain-card-header { + display: flex; + flex-direction: column; + width: 100%; + padding: 8px; + gap: 5px; + border-bottom: 1px solid @golden; + + .title { + font-size: 20px; + color: @golden; + font-family: @font-subtitle; + margin: 0; + } + + .tags { + display: flex; + gap: 10px; + + .tag { + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 3px 5px; + font-size: 12px; + font-family: @font-body; + + background: light-dark(@dark-15, @beige-15); + border: 1px solid light-dark(@dark, @beige); + color: light-dark(@dark, @beige); + border-radius: 3px; + } + } + } + + .description { + color: @beige; + padding: 8px; + font-family: @font-body; + } + + .ability-card-footer { + display: flex; + flex-wrap: wrap; + gap: 5px; + width: 100%; + padding: 0 8px; + + button { + font-family: @font-body; + font-weight: 600; + height: 40px; + flex: 1 1 calc(50% - 5px); + + &:nth-last-child(1):nth-child(odd) { + flex-basis: 100%; + } + } + + .ability-card-action-cost { + margin: auto; + font-size: 1.5em; + } + } + } +} diff --git a/styles/less/ui/chat/action.less b/styles/less/ui/chat/action.less new file mode 100644 index 00000000..5228259c --- /dev/null +++ b/styles/less/ui/chat/action.less @@ -0,0 +1,77 @@ +@import '../../utils/colors.less'; +@import '../../utils/fonts.less'; +@import '../../utils/spacing.less'; + +.daggerheart.chat { + &.action { + display: flex; + flex-direction: column; + align-items: center; + + .action-section { + display: flex; + flex-direction: row; + width: 100%; + padding: 8px; + gap: 5px; + border-bottom: 1px solid @golden; + + .action-img { + width: 40px; + height: 40px; + border-radius: 3px; + object-fit: cover; + } + + .action-header { + display: flex; + flex-direction: column; + gap: 5px; + + .title { + font-size: 20px; + color: @golden; + font-family: @font-subtitle; + margin: 0; + } + + .label { + font-size: 12px; + color: @beige; + font-family: @font-body; + margin: 0; + } + } + } + + .description { + color: @beige; + padding: 8px; + font-family: @font-body; + } + + .ability-card-footer { + display: flex; + flex-wrap: wrap; + gap: 5px; + width: 100%; + padding: 0 8px; + + button { + font-family: @font-body; + font-weight: 600; + height: 40px; + flex: 1 1 calc(50% - 5px); + + &:nth-last-child(1):nth-child(odd) { + flex-basis: 100%; + } + } + + .ability-card-action-cost { + margin: auto; + font-size: 1.5em; + } + } + } +} diff --git a/styles/less/ui/chat/chat.less b/styles/less/ui/chat/chat.less index 4558cf8e..c27f8b3c 100644 --- a/styles/less/ui/chat/chat.less +++ b/styles/less/ui/chat/chat.less @@ -1,31 +1,8 @@ @import '../../utils/colors.less'; +@import '../../utils/fonts.less'; @import '../../utils/spacing.less'; .daggerheart.chat { - &.downtime { - display: flex; - flex-direction: column; - align-items: center; - - .downtime-title-container { - display: flex; - flex-direction: column; - align-items: center; - - .downtime-subtitle { - font-size: 17px; - } - } - - .downtime-image { - width: 80px; - } - - .action-use-button { - width: 100%; - } - } - &.resource-roll { .reroll-message { text-align: center; @@ -358,58 +335,6 @@ } } - &.domain-card { - display: flex; - flex-direction: column; - align-items: center; - - .domain-card-title { - width: 100%; - display: flex; - flex-direction: column; - align-items: center; - - div { - font-size: 20px; - font-variant: small-caps; - font-weight: bold; - } - - h2 { - width: 100%; - text-align: center; - margin: 0; - } - } - - .ability-card-footer { - display: flex; - width: 100%; - margin-top: @fullMargin; - flex-wrap: wrap; - - button { - border-radius: 6px; - background: @positive; - border-color: black; - flex-basis: calc(50% - 2px); - - &:nth-of-type(n + 3) { - margin-top: @tinyMargin; - } - } - - .ability-card-action-cost { - margin: auto; - font-size: 1.5em; - } - } - - img { - width: 80px; - } - } - button { &.inner-button { --button-size: 1.25rem; diff --git a/styles/less/ui/chat/downtime.less b/styles/less/ui/chat/downtime.less new file mode 100644 index 00000000..ab4e1ec2 --- /dev/null +++ b/styles/less/ui/chat/downtime.less @@ -0,0 +1,98 @@ +@import '../../utils/colors.less'; +@import '../../utils/fonts.less'; +@import '../../utils/spacing.less'; + +.daggerheart.chat { + &.downtime { + display: flex; + flex-direction: column; + align-items: center; + + .downtime-header { + display: flex; + gap: 13px; + flex-direction: row; + align-items: center; + width: 100%; + padding-left: 8px; + margin-bottom: 12px; + + .profile { + width: 40px; + height: 40px; + border-radius: 50%; + object-fit: cover; + } + + .header-label { + .title { + font-size: 20px; + color: @golden; + font-family: @font-subtitle; + margin: 0; + } + .label { + font-size: 12px; + color: @beige; + font-family: @font-body; + margin: 0; + } + } + } + + .downtime-moves-list { + display: flex; + flex-direction: column; + gap: 5px; + + .downtime-move { + width: 100%; + + .downtime-label { + display: flex; + align-items: center; + gap: 5px; + border-bottom: 1px solid @golden; + margin: 0 8px; + + .downtime-image { + width: 40px; + height: 40px; + border-radius: 3px; + } + + .header-label { + padding: 8px; + .title { + font-size: 16px; + color: @golden; + font-family: @font-subtitle; + margin: 0; + } + .label { + font-size: 12px; + color: @beige; + font-family: @font-body; + margin: 0; + } + } + } + + .description { + padding: 8px; + color: beige; + font-family: @font-body; + font-size: 14px; + } + } + + .action-use-button { + width: -webkit-fill-available; + margin: 0 8px; + font-family: @font-body; + font-weight: 600; + height: 40px; + } + } + } +} diff --git a/styles/less/ui/index.less b/styles/less/ui/index.less index 13e578b0..94bdb247 100644 --- a/styles/less/ui/index.less +++ b/styles/less/ui/index.less @@ -1,4 +1,7 @@ +@import './chat/ability-use.less'; +@import './chat/action.less'; @import './chat/chat.less'; +@import './chat/downtime.less'; @import './chat/sheet.less'; @import './chat/theme-colorful.less'; diff --git a/templates/ui/chat/ability-use.hbs b/templates/ui/chat/ability-use.hbs index 4ebaa293..338fcd59 100644 --- a/templates/ui/chat/ability-use.hbs +++ b/templates/ui/chat/ability-use.hbs @@ -1,9 +1,14 @@
-
-

{{name}}

+ +
+

{{item.name}}

+
    + {{#each item.tags as |tag|}} +
  • {{tag}}
    • + {{/each}} +
- -
{{{description}}}
+
{{{description}}}
\ No newline at end of file