style remaing chat messages

This commit is contained in:
moliloo 2025-07-28 23:44:48 -03:00
parent e4820dd6bd
commit 76cfcb29ea
9 changed files with 103 additions and 59 deletions

View file

@ -54,6 +54,8 @@ export default class DhpDeathMove extends HandlebarsApplicationMixin(Application
{ {
player: this.actor.name, player: this.actor.name,
actor: { name: this.actor.name, img: this.actor.img }, actor: { name: this.actor.name, img: this.actor.img },
author: this.author,
speaker: cls.getSpeaker(),
title: game.i18n.localize(this.selectedMove.name), title: game.i18n.localize(this.selectedMove.name),
img: this.selectedMove.img, img: this.selectedMove.img,
description: game.i18n.localize(this.selectedMove.description) description: game.i18n.localize(this.selectedMove.description)

View file

@ -7,9 +7,13 @@ export default class DhpChatMessage extends foundry.documents.ChatMessage {
}); });
const actor = game.actors.get(this.speaker.actor); const actor = game.actors.get(this.speaker.actor);
const actorData = actor ?? { img: 'icons/svg/mystery-man.svg', name: '' }; const actorData = actor ?? {
img: this.author.avatar ? this.author.avatar : 'icons/svg/mystery-man.svg',
name: ''
};
/* We can change to fully implementing the renderHTML function if needed, instead of augmenting it. */ /* We can change to fully implementing the renderHTML function if needed, instead of augmenting it. */
const html = await super.renderHTML({ actor: actorData }); const html = await super.renderHTML({ actor: actorData, author: this.author });
console.log(this.author);
this.applyPermission(html); this.applyPermission(html);
if (this.type === 'dualityRoll') { if (this.type === 'dualityRoll') {

View file

@ -128,7 +128,11 @@ export default class DHItem extends foundry.documents.Item {
const msg = new cls({ const msg = new cls({
type: 'abilityUse', type: 'abilityUse',
user: game.user.id, user: game.user.id,
actor: this.actor,
author: this.author,
speaker: cls.getSpeaker(),
system: systemData, system: systemData,
title: game.i18n.localize('DAGGERHEART.ACTIONS.Config.displayInChat'),
content: await foundry.applications.handlebars.renderTemplate( content: await foundry.applications.handlebars.renderTemplate(
'systems/daggerheart/templates/ui/chat/ability-use.hbs', 'systems/daggerheart/templates/ui/chat/ability-use.hbs',
systemData systemData

View file

@ -3,14 +3,21 @@
@import '../utils/mixin.less'; @import '../utils/mixin.less';
.theme-light { .theme-light {
.daggerheart.chat-sidebar .chat-log { .daggerheart.chat-sidebar .chat-log,
#chat-notifications .chat-log {
.chat-message { .chat-message {
background-image: url('../assets/parchments/dh-parchment-light.png'); background-image: url('../assets/parchments/dh-parchment-light.png');
} }
} }
} }
.daggerheart.chat-sidebar { #chat-message {
font-family: @font-body;
padding: 8px;
}
.daggerheart.chat-sidebar,
#chat-notifications {
.chat-log { .chat-log {
.chat-message { .chat-message {
border: none !important; border: none !important;
@ -28,18 +35,21 @@
.message-metadata { .message-metadata {
font-family: @font-body; font-family: @font-body;
color: light-dark(@dark, @beige);
} }
} }
.message-header-main { .message-header-main {
flex: 1;
display: flex; display: flex;
align-items: center;
gap: 8px; gap: 8px;
flex: 1;
.actor-img { .actor-img {
border-radius: 50%; border-radius: 50%;
width: 60px; width: 40px;
height: 60px; height: 40px;
object-fit: cover;
} }
.message-sub-header-container { .message-sub-header-container {
@ -47,15 +57,14 @@
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: space-between; justify-content: space-between;
padding: 4px 0; color: light-dark(@dark, @beige);
color: @beige;
h4 { h4 {
font-size: 20px; font-size: 16px;
font-weight: bold; font-weight: bold;
margin-bottom: 0; margin-bottom: 0;
font-family: @font-body; font-family: @font-subtitle;
color: @golden; color: light-dark(@dark-blue, @golden);
} }
} }
} }

View file

@ -8,38 +8,6 @@
flex-direction: column; flex-direction: column;
align-items: center; 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 { .downtime-moves-list {
display: flex; display: flex;
flex-direction: column; flex-direction: column;

View file

@ -1,3 +1,12 @@
@import '../../utils/colors.less';
@import '../../utils/fonts.less';
.chat-message.dh-chat-message {
.message-content {
padding: 0;
}
}
.chat-message { .chat-message {
.duality-modifiers, .duality-modifiers,
.duality-result, .duality-result,
@ -6,6 +15,66 @@
} }
.message-content { .message-content {
padding: 0 8px;
font-family: @font-body;
color: light-dark(@dark, @beige);
blockquote {
border-left: 5px solid light-dark(@dark-blue-40, @golden-40);
}
a[href] {
color: light-dark(@dark-blue, @golden);
}
a[href]:hover,
a[href].active {
font-weight: bold;
text-shadow: 0 0 8px light-dark(@dark-blue, @golden);
}
button {
background: light-dark(transparent, @golden);
border: 1px solid light-dark(@dark-blue, @dark-blue);
color: light-dark(@dark-blue, @dark-blue);
outline: none;
box-shadow: none;
&:hover {
background: light-dark(@light-black, @dark-blue);
color: light-dark(@dark-blue, @golden);
}
&.glow {
animation: glow 0.75s infinite alternate;
}
&:disabled {
background: light-dark(transparent, @golden);
color: light-dark(@dark-blue, @dark-blue);
opacity: 0.6;
cursor: not-allowed;
&:hover {
background: light-dark(transparent, @golden);
color: light-dark(@dark-blue, @dark-blue);
}
}
&.reverted {
background: light-dark(@dark-blue-10, @golden-10);
color: light-dark(@dark-blue, @golden);
border: 1px solid light-dark(@dark, transparent);
&:hover {
background: light-dark(transparent, @golden);
color: light-dark(@dark-blue, @dark-blue);
}
img {
border-radius: 3px;
}
}
}
.enriched-effect { .enriched-effect {
display: flex; display: flex;
align-items: center; align-items: center;

View file

@ -5,7 +5,9 @@
<img class="actor-img" src="{{actor.img}}" /> <img class="actor-img" src="{{actor.img}}" />
<div class="message-sub-header-container"> <div class="message-sub-header-container">
<h4>{{ifThen message.title message.title alias}}</h4> <h4>{{ifThen message.title message.title alias}}</h4>
<div>{{actor.name}}</div> {{#if actor.name}}
<div>{{actor.name}} {{#if author.isGM}}(GM){{/if}}</div>
{{/if}}
</div> </div>
</div> </div>
<div class="message-header-metadata"> <div class="message-header-metadata">

View file

@ -1,11 +1,4 @@
<div class="daggerheart chat downtime"> <div class="daggerheart chat downtime">
<div class="downtime-header">
<img class="profile" src="{{actor.img}}">
<div class="header-label">
<h2 class="title">{{localize 'DAGGERHEART.UI.Chat.deathMove.title'}}</h2>
<span class="label">{{actor.name}}</span>
</div>
</div>
<ul class="downtime-moves-list"> <ul class="downtime-moves-list">
<li class="downtime-move"> <li class="downtime-move">
<div class="downtime-label"> <div class="downtime-label">

View file

@ -1,11 +1,4 @@
<div class="daggerheart chat downtime"> <div class="daggerheart chat downtime">
<div class="downtime-header">
<img class="profile" src="{{actor.img}}">
<div class="header-label">
<h2 class="title">{{title}}</h2>
<span class="label">{{actor.name}}</span>
</div>
</div>
<ul class="downtime-moves-list"> <ul class="downtime-moves-list">
{{#each moves as | move index |}} {{#each moves as | move index |}}
<li class="downtime-move"> <li class="downtime-move">