mirror of
https://github.com/Foundryborne/daggerheart.git
synced 2026-01-18 16:09:03 +01:00
Roll Chat message new design template
This commit is contained in:
Dapoolp
parent
f14cb3936a
commit
a3ef43aad6
21 changed files with 733 additions and 276 deletions
|
|
@ -1352,7 +1352,9 @@
|
|||
"check": "{check} Check",
|
||||
"continue": "Continue",
|
||||
"criticalSuccess": "Critical Success",
|
||||
"d20Roll": "D20 Roll",
|
||||
"damage": "Damage",
|
||||
"damageRoll": "Damage Roll",
|
||||
"damageType": "Damage Type",
|
||||
"description": "Description",
|
||||
"difficulty": "Difficulty",
|
||||
|
|
@ -1371,6 +1373,7 @@
|
|||
"features": "Features",
|
||||
"formula": "Formula",
|
||||
"healing": "Healing",
|
||||
"healingRoll": "Healing Roll",
|
||||
"HitPoints": {
|
||||
"single": "Hit Point",
|
||||
"plural": "Hit Points",
|
||||
|
|
|
|||
|
|
@ -47,7 +47,7 @@ export default class DhpDeathMove extends HandlebarsApplicationMixin(Application
|
|||
|
||||
static async takeMove() {
|
||||
const cls = getDocumentClass('ChatMessage');
|
||||
const msg = new cls({
|
||||
const msg = {
|
||||
user: game.user.id,
|
||||
content: await foundry.applications.handlebars.renderTemplate(
|
||||
'systems/daggerheart/templates/ui/chat/deathMove.hbs',
|
||||
|
|
@ -55,20 +55,23 @@ export default class DhpDeathMove extends HandlebarsApplicationMixin(Application
|
|||
player: this.actor.name,
|
||||
actor: { name: this.actor.name, img: this.actor.img },
|
||||
author: game.users.get(game.user.id),
|
||||
speaker: cls.getSpeaker(),
|
||||
title: game.i18n.localize(this.selectedMove.name),
|
||||
img: this.selectedMove.img,
|
||||
description: game.i18n.localize(this.selectedMove.description)
|
||||
}
|
||||
),
|
||||
title: game.i18n.localize(
|
||||
'DAGGERHEART.UI.Chat.deathMove.title'
|
||||
),
|
||||
speaker: cls.getSpeaker(),
|
||||
flags: {
|
||||
daggerheart: {
|
||||
cssClass: 'dh-chat-message dh-style'
|
||||
}
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
cls.create(msg.toObject());
|
||||
cls.create(msg);
|
||||
|
||||
this.close();
|
||||
}
|
||||
|
|
|
|||
|
|
@ -133,7 +133,7 @@ export default class DhpDowntime extends HandlebarsApplicationMixin(ApplicationV
|
|||
});
|
||||
|
||||
const cls = getDocumentClass('ChatMessage');
|
||||
const msg = new cls({
|
||||
const msg = {
|
||||
user: game.user.id,
|
||||
system: {
|
||||
moves: moves,
|
||||
|
|
@ -158,9 +158,9 @@ export default class DhpDowntime extends HandlebarsApplicationMixin(ApplicationV
|
|||
cssClass: 'dh-chat-message dh-style'
|
||||
}
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
cls.create(msg.toObject());
|
||||
cls.create(msg);
|
||||
|
||||
// Reset selection and update number of taken moves
|
||||
for (const [catName, category] of Object.entries(this.moveData)) {
|
||||
|
|
|
|||
|
|
@ -74,7 +74,7 @@ export default class ResourceDiceDialog extends HandlebarsApplicationMixin(Appli
|
|||
this.resetUsed = true;
|
||||
|
||||
const cls = getDocumentClass('ChatMessage');
|
||||
const msg = new cls({
|
||||
const msg = {
|
||||
user: game.user.id,
|
||||
content: await foundry.applications.handlebars.renderTemplate(
|
||||
'systems/daggerheart/templates/ui/chat/resource-roll.hbs',
|
||||
|
|
@ -83,9 +83,9 @@ export default class ResourceDiceDialog extends HandlebarsApplicationMixin(Appli
|
|||
name: this.item.name
|
||||
}
|
||||
)
|
||||
});
|
||||
};
|
||||
|
||||
cls.create(msg.toObject());
|
||||
cls.create(msg);
|
||||
this.close();
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -8,10 +8,6 @@ export default class DHAttackAction extends DHDamageAction {
|
|||
return parent.parent.type === 'weapon' ? 'attack' : 'spellcast';
|
||||
}
|
||||
|
||||
get chatTemplate() {
|
||||
return 'systems/daggerheart/templates/ui/chat/duality-roll.hbs';
|
||||
}
|
||||
|
||||
prepareData() {
|
||||
super.prepareData();
|
||||
if (!!this.item?.system?.attack) {
|
||||
|
|
|
|||
|
|
@ -69,10 +69,6 @@ export default class DHBaseAction extends ActionMixin(foundry.abstract.DataModel
|
|||
: this.item?.actor;
|
||||
}
|
||||
|
||||
get chatTemplate() {
|
||||
return 'systems/daggerheart/templates/ui/chat/duality-roll.hbs';
|
||||
}
|
||||
|
||||
static getRollType(parent) {
|
||||
return 'trait';
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,4 +1,3 @@
|
|||
import DHBaseAction from './baseAction.mjs';
|
||||
import DHDamageAction from './damageAction.mjs';
|
||||
|
||||
export default class DHHealingAction extends DHDamageAction {
|
||||
|
|
@ -7,49 +6,4 @@ export default class DHHealingAction extends DHDamageAction {
|
|||
static getRollType(parent) {
|
||||
return 'spellcast';
|
||||
}
|
||||
|
||||
/* static extraSchemas = [...super.extraSchemas, 'target', 'effects', 'healing', 'roll'];
|
||||
|
||||
static getRollType(parent) {
|
||||
return 'spellcast';
|
||||
}
|
||||
|
||||
getFormulaValue(data) {
|
||||
let formulaValue = this.healing.value;
|
||||
if (this.hasRoll && this.healing.resultBased && data.system.roll.result.duality === -1)
|
||||
return this.healing.valueAlt;
|
||||
return formulaValue;
|
||||
}
|
||||
|
||||
async rollHealing(event, data) {
|
||||
const systemData = data.system ?? data;
|
||||
let formulas = [
|
||||
{
|
||||
formula: this.getFormulaValue(data).getFormula(this.actor),
|
||||
applyTo: this.healing.applyTo
|
||||
}
|
||||
];
|
||||
|
||||
const config = {
|
||||
title: game.i18n.format('DAGGERHEART.UI.Chat.healingRoll.title', {
|
||||
healing: game.i18n.localize(CONFIG.DH.GENERAL.healingTypes[this.healing.applyTo].label)
|
||||
}),
|
||||
roll: formulas,
|
||||
targets: systemData.targets?.filter(t => t.hit),
|
||||
messageType: 'healing',
|
||||
source: systemData.source,
|
||||
data: this.getRollData(),
|
||||
event
|
||||
};
|
||||
|
||||
return CONFIG.Dice.daggerheart.DamageRoll.build(config);
|
||||
}
|
||||
|
||||
get chatTemplate() {
|
||||
return 'systems/daggerheart/templates/ui/chat/healing-roll.hbs';
|
||||
}
|
||||
|
||||
get modifiers() {
|
||||
return [];
|
||||
} */
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2,6 +2,6 @@ import DHAdversaryRoll from './adversaryRoll.mjs';
|
|||
|
||||
export default class DHDualityRoll extends DHAdversaryRoll {
|
||||
get messageTemplate() {
|
||||
return 'systems/daggerheart/templates/ui/chat/duality-roll.hbs';
|
||||
return 'systems/daggerheart/templates/ui/chat/duality-roll-temp.hbs';
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -19,6 +19,12 @@ export default class D20Roll extends DHRoll {
|
|||
|
||||
static DefaultDialog = D20RollDialog;
|
||||
|
||||
get title() {
|
||||
return game.i18n.localize(
|
||||
"DAGGERHEART.GENERAL.d20Roll"
|
||||
);
|
||||
}
|
||||
|
||||
get d20() {
|
||||
if (!(this.terms[0] instanceof foundry.dice.terms.Die)) this.createBaseDice();
|
||||
return this.terms[0];
|
||||
|
|
|
|||
|
|
@ -7,6 +7,12 @@ export default class DHRoll extends Roll {
|
|||
if (!this.data || !Object.keys(this.data).length) this.data = options.data;
|
||||
}
|
||||
|
||||
get title() {
|
||||
return game.i18n.localize(
|
||||
"DAGGERHEART.GENERAL.Roll"
|
||||
);
|
||||
}
|
||||
|
||||
static messageType = 'adversaryRoll';
|
||||
|
||||
static DefaultDialog = D20RollDialog;
|
||||
|
|
@ -85,6 +91,8 @@ export default class DHRoll extends Roll {
|
|||
msg = {
|
||||
type: this.messageType,
|
||||
user: game.user.id,
|
||||
title: roll.title,
|
||||
speaker: cls.getSpeaker(),
|
||||
sound: config.mute ? null : CONFIG.sounds.dice,
|
||||
system: config,
|
||||
rolls: [roll]
|
||||
|
|
|
|||
|
|
@ -17,6 +17,12 @@ export default class DualityRoll extends D20Roll {
|
|||
|
||||
static DefaultDialog = D20RollDialog;
|
||||
|
||||
get title() {
|
||||
return game.i18n.localize(
|
||||
"DAGGERHEART.GENERAL.dualityRoll"
|
||||
);
|
||||
}
|
||||
|
||||
get dHope() {
|
||||
// if ( !(this.terms[0] instanceof foundry.dice.terms.Die) ) return;
|
||||
if (!(this.dice[0] instanceof CONFIG.Dice.daggerheart.DualityDie)) this.createBaseDice();
|
||||
|
|
|
|||
|
|
@ -92,7 +92,7 @@ export default class DhActiveEffect extends ActiveEffect {
|
|||
description: this.description,
|
||||
actions: []
|
||||
};
|
||||
const msg = new cls({
|
||||
const msg = {
|
||||
type: 'abilityUse',
|
||||
user: game.user.id,
|
||||
system: systemData,
|
||||
|
|
@ -100,8 +100,8 @@ export default class DhActiveEffect extends ActiveEffect {
|
|||
'systems/daggerheart/templates/ui/chat/ability-use.hbs',
|
||||
systemData
|
||||
)
|
||||
});
|
||||
};
|
||||
|
||||
cls.create(msg.toObject());
|
||||
cls.create(msg);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -125,7 +125,7 @@ export default class DHItem extends foundry.documents.Item {
|
|||
description: this.system.description,
|
||||
actions: this.system.actions
|
||||
};
|
||||
const msg = new cls({
|
||||
const msg = {
|
||||
type: 'abilityUse',
|
||||
user: game.user.id,
|
||||
actor: this.actor,
|
||||
|
|
@ -142,8 +142,8 @@ export default class DHItem extends foundry.documents.Item {
|
|||
cssClass: 'dh-chat-message dh-style'
|
||||
}
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
cls.create(msg.toObject());
|
||||
cls.create(msg);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -21,13 +21,13 @@
|
|||
.chat-log {
|
||||
.chat-message {
|
||||
border: none !important;
|
||||
padding: 8px 0;
|
||||
padding: 0;
|
||||
background-image: url('../assets/parchments/dh-parchment-dark.png');
|
||||
|
||||
.message-header {
|
||||
display: flex;
|
||||
gap: 4px;
|
||||
padding: 0 8px 8px;
|
||||
padding: 8px;
|
||||
|
||||
.message-header-metadata {
|
||||
flex: none;
|
||||
|
|
@ -69,6 +69,10 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
.message-content {
|
||||
padding-bottom: 8px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
289
styles/less/ui/chat/chat-temp.less
Normal file
289
styles/less/ui/chat/chat-temp.less
Normal file
|
|
@ -0,0 +1,289 @@
|
|||
@import '../../utils/colors.less';
|
||||
|
||||
.chat-message {
|
||||
--text-color: light-dark(@dark-blue, @golden);
|
||||
--bg-color: light-dark(@dark-blue-40, @golden-40);
|
||||
|
||||
&.duality {
|
||||
&.hope {
|
||||
--text-color: @golden;
|
||||
--bg-color: @golden-40;
|
||||
.message-header, .message-content {
|
||||
background-color: @golden-bg;
|
||||
}
|
||||
}
|
||||
|
||||
&.fear {
|
||||
--text-color: @fear;
|
||||
--bg-color: @fear-40;
|
||||
.message-header, .message-content {
|
||||
background-color: @fear-bg;
|
||||
}
|
||||
}
|
||||
|
||||
&.critical {
|
||||
--text-color: @critical;
|
||||
--bg-color: @critical-40;
|
||||
.message-header, .message-content {
|
||||
background-color: @critical-bg;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.chat-roll {
|
||||
font-size: var(--font-size-12);
|
||||
padding: 0 20px;
|
||||
|
||||
.roll-part-header {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr auto 1fr;
|
||||
align-items: center;
|
||||
color: light-dark(@dark, @beige);
|
||||
|
||||
span {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 5px;
|
||||
text-transform: capitalize;
|
||||
padding: 0 10px;
|
||||
}
|
||||
|
||||
&:before, &:after {
|
||||
content: ' ';
|
||||
height: 1px;
|
||||
}
|
||||
|
||||
&:before {
|
||||
background: linear-gradient(90deg,rgba(0, 0, 0, 0) 0%, var(--text-color) 100%);
|
||||
}
|
||||
|
||||
&:after {
|
||||
background: linear-gradient(90deg,var(--text-color) 0%, rgba(0, 0, 0, 0) 100%);
|
||||
}
|
||||
}
|
||||
|
||||
.roll-part-extra {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
.roll-part-content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 5px;
|
||||
padding: 5px 0;
|
||||
|
||||
.dice-tooltip {
|
||||
width: 100%;
|
||||
|
||||
.wrapper {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
|
||||
> :first-child:not(.target-selector) {
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
> :last-child {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.roll-result-container {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
gap: 10px;
|
||||
color: var(--text-color);
|
||||
font-weight: 700;
|
||||
font-family: 'Cinzel', sans-serif;
|
||||
|
||||
.roll-result-value {
|
||||
font-size: var(--font-size-24);
|
||||
}
|
||||
|
||||
.roll-result-desc {
|
||||
font-size: var(--font-size-16);
|
||||
margin-top: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
.roll-difficulty {
|
||||
margin-top: -5px;
|
||||
}
|
||||
|
||||
.roll-dice {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 10px;
|
||||
font-weight: 700;
|
||||
font-family: 'Cinzel', sans-serif;
|
||||
|
||||
.roll-die {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 3px;
|
||||
|
||||
label {
|
||||
text-align: center;
|
||||
height: var(--font-size-12);
|
||||
}
|
||||
|
||||
> div {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 5px;
|
||||
font-size: var(--font-size-24);
|
||||
margin: auto;
|
||||
img {
|
||||
height: 30px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
fieldset {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
border-color: var(--text-color);
|
||||
border-radius: 5px;
|
||||
|
||||
legend {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
padding: 0 5px;
|
||||
color: var(--text-color);
|
||||
}
|
||||
}
|
||||
|
||||
.target-selector {
|
||||
+ .roll-part-extra {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.target-choice {
|
||||
display: flex;
|
||||
justify-content: space-evenly;
|
||||
font-size: var(--font-size-14);
|
||||
color: var(--text-color);
|
||||
padding: 5px 0;
|
||||
|
||||
.target-selected {
|
||||
font-weight: bold;
|
||||
text-shadow: 0px 0px 8px var(--text-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.roll-target {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
gap: 10px;
|
||||
align-items: center;
|
||||
|
||||
.target-img {
|
||||
border-radius: 50%;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.target-data {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.roll-formula {
|
||||
background-color: var(--bg-color);
|
||||
color: var(--text-color);
|
||||
border-radius: 4px;
|
||||
padding: 3px 5px;
|
||||
width: fit-content;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.roll-difficulty, .target-hit-status {
|
||||
color: @green;
|
||||
background-color: @green-10;
|
||||
border: 1px solid currentColor;
|
||||
border-radius: 4px;
|
||||
padding: 3px 5px;
|
||||
text-transform: uppercase;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.target-hit-status {
|
||||
width: fit-content;
|
||||
margin-top: 2px;
|
||||
|
||||
&.is-miss {
|
||||
color: @medium-red;
|
||||
background-color: @medium-red-10;
|
||||
}
|
||||
}
|
||||
|
||||
div[data-action="expandRoll"] {
|
||||
.roll-part-header > div > span {
|
||||
&:before, &:after {
|
||||
content: '\f078';
|
||||
font-family: var(--font-awesome);
|
||||
color: var(--text-color);
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
}
|
||||
|
||||
.on-reduced {
|
||||
display: grid;
|
||||
overflow: hidden;
|
||||
grid-template-rows: 1fr;
|
||||
transition: grid-template-rows 250ms ease;
|
||||
|
||||
.wrapper {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
&.expanded {
|
||||
.roll-part-header > div > span {
|
||||
&:before, &:after {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
}
|
||||
|
||||
.on-reduced {
|
||||
grid-template-rows: 0fr;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.roll-part + .roll-part {
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.target-section {
|
||||
.roll-part-content {
|
||||
gap: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.roll-buttons {
|
||||
display: flex;
|
||||
gap: 5px;
|
||||
margin-top: 8px;
|
||||
button {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,195 +1,195 @@
|
|||
@import '../../utils/colors.less';
|
||||
@import '../../utils/spacing.less';
|
||||
|
||||
.theme-colorful {
|
||||
.chat-message.duality {
|
||||
border-color: black;
|
||||
padding: 8px 0 0 0;
|
||||
fieldset.daggerheart.chat {
|
||||
border-top-width: 0;
|
||||
display: contents;
|
||||
legend {
|
||||
&:before,
|
||||
&:after {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
.message-header {
|
||||
color: var(--color-light-3);
|
||||
padding: 0 8px;
|
||||
}
|
||||
&.hope {
|
||||
background: linear-gradient(0, rgba(165, 42, 42, 0.6) 40px, rgba(0, 0, 0, 0.6));
|
||||
}
|
||||
&.fear {
|
||||
background: linear-gradient(0, @fearBackgroundEnd, @fearBackgroundStart);
|
||||
}
|
||||
&.critical {
|
||||
background: linear-gradient(0, @criticalBackgroundEnd, @criticalBackgroundStart);
|
||||
}
|
||||
.chat-message header {
|
||||
color: var(--color-light-3);
|
||||
}
|
||||
> * {
|
||||
padding: 0 8px;
|
||||
}
|
||||
.message-content {
|
||||
.duality-modifiers,
|
||||
.duality-result,
|
||||
.dice-title {
|
||||
display: flex;
|
||||
}
|
||||
.duality-modifiers {
|
||||
display: flex;
|
||||
gap: 2px;
|
||||
margin-bottom: 4px;
|
||||
flex-wrap: wrap;
|
||||
.duality-modifier {
|
||||
padding: 2px;
|
||||
border-radius: 6px;
|
||||
border: 1px solid;
|
||||
background: var(--color-dark-6);
|
||||
font-size: 12px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
.dice-flavor {
|
||||
color: var(--color-light-1);
|
||||
text-shadow: 0 0 1px black;
|
||||
border-bottom: 1px solid;
|
||||
display: flex;
|
||||
align-items: end;
|
||||
justify-content: space-between;
|
||||
padding: 0 8px;
|
||||
margin: 0 -8px 2px;
|
||||
font-weight: unset;
|
||||
}
|
||||
.dice-result {
|
||||
.duality-modifiers {
|
||||
display: flex; // Default => display: none;
|
||||
gap: 2px;
|
||||
margin-bottom: 4px;
|
||||
.duality-modifier {
|
||||
padding: 2px;
|
||||
border-radius: 6px;
|
||||
border: 1px solid;
|
||||
background: var(--color-dark-6);
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
.dice-formula,
|
||||
> .dice-total,
|
||||
.part-header {
|
||||
display: none;
|
||||
}
|
||||
.dice-tooltip {
|
||||
grid-template-rows: 1fr;
|
||||
.wrapper {
|
||||
.tooltip-part {
|
||||
display: flex;
|
||||
align-items: end;
|
||||
gap: 0.25rem;
|
||||
.dice {
|
||||
.dice-rolls {
|
||||
margin-bottom: 0;
|
||||
&.duality {
|
||||
li {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
position: relative;
|
||||
background: unset;
|
||||
line-height: unset;
|
||||
font-weight: unset;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.duality-modifier {
|
||||
display: flex;
|
||||
margin-bottom: 6px;
|
||||
color: var(--color-light-1);
|
||||
text-shadow: 0 0 1px black;
|
||||
font-size: var(--font-size-16);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.target-selection {
|
||||
label {
|
||||
color: var(--color-light-1);
|
||||
}
|
||||
}
|
||||
.target-section {
|
||||
margin: 4px 0;
|
||||
border: 2px solid;
|
||||
margin-top: 5px;
|
||||
.dice-total {
|
||||
box-shadow: unset;
|
||||
border: unset;
|
||||
border-radius: unset;
|
||||
font-size: var(--font-size-18);
|
||||
}
|
||||
}
|
||||
.dice-actions {
|
||||
justify-content: space-between;
|
||||
&.duality-alone {
|
||||
justify-content: end;
|
||||
margin-top: -20px;
|
||||
}
|
||||
> * {
|
||||
display: flex;
|
||||
color: var(--color-light-1);
|
||||
text-shadow: 0 0 1px black;
|
||||
font-weight: bold;
|
||||
background: var(--color-dark-1);
|
||||
padding: 4px;
|
||||
border-color: black;
|
||||
min-height: unset;
|
||||
height: 26px;
|
||||
flex: unset;
|
||||
margin: 0;
|
||||
}
|
||||
.duality-action {
|
||||
border-radius: 0 6px 0 0;
|
||||
margin-left: -8px;
|
||||
&.duality-action-effect {
|
||||
border-top-left-radius: 6px;
|
||||
margin-left: initial;
|
||||
}
|
||||
}
|
||||
.duality-result {
|
||||
border-radius: 6px 0 0 0;
|
||||
margin-right: -8px;
|
||||
}
|
||||
}
|
||||
.duality-result {
|
||||
display: flex;
|
||||
color: var(--color-light-1);
|
||||
text-shadow: 0 0 1px black;
|
||||
font-weight: bold;
|
||||
background: var(--color-dark-1);
|
||||
padding: 4px;
|
||||
border-color: black;
|
||||
min-height: unset;
|
||||
height: 26px;
|
||||
flex: unset;
|
||||
margin: 0;
|
||||
margin-left: auto;
|
||||
align-self: center;
|
||||
border-radius: 6px;
|
||||
}
|
||||
}
|
||||
}
|
||||
button {
|
||||
&.inner-button {
|
||||
color: var(--color-light-1);
|
||||
text-shadow: 0 0 1px black;
|
||||
font-weight: bold;
|
||||
background: var(--color-dark-1);
|
||||
border-color: black;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
// .theme-colorful {
|
||||
// .chat-message.duality {
|
||||
// border-color: black;
|
||||
// padding: 8px 0 0 0;
|
||||
// fieldset.daggerheart.chat {
|
||||
// border-top-width: 0;
|
||||
// display: contents;
|
||||
// legend {
|
||||
// &:before,
|
||||
// &:after {
|
||||
// display: none;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// .message-header {
|
||||
// color: var(--color-light-3);
|
||||
// padding: 0 8px;
|
||||
// }
|
||||
// &.hope {
|
||||
// background: linear-gradient(0, rgba(165, 42, 42, 0.6) 40px, rgba(0, 0, 0, 0.6));
|
||||
// }
|
||||
// &.fear {
|
||||
// background: linear-gradient(0, @fearBackgroundEnd, @fearBackgroundStart);
|
||||
// }
|
||||
// &.critical {
|
||||
// background: linear-gradient(0, @criticalBackgroundEnd, @criticalBackgroundStart);
|
||||
// }
|
||||
// .chat-message header {
|
||||
// color: var(--color-light-3);
|
||||
// }
|
||||
// > * {
|
||||
// padding: 0 8px;
|
||||
// }
|
||||
// .message-content {
|
||||
// .duality-modifiers,
|
||||
// .duality-result,
|
||||
// .dice-title {
|
||||
// display: flex;
|
||||
// }
|
||||
// .duality-modifiers {
|
||||
// display: flex;
|
||||
// gap: 2px;
|
||||
// margin-bottom: 4px;
|
||||
// flex-wrap: wrap;
|
||||
// .duality-modifier {
|
||||
// padding: 2px;
|
||||
// border-radius: 6px;
|
||||
// border: 1px solid;
|
||||
// background: var(--color-dark-6);
|
||||
// font-size: 12px;
|
||||
// white-space: nowrap;
|
||||
// }
|
||||
// }
|
||||
// .dice-flavor {
|
||||
// color: var(--color-light-1);
|
||||
// text-shadow: 0 0 1px black;
|
||||
// border-bottom: 1px solid;
|
||||
// display: flex;
|
||||
// align-items: end;
|
||||
// justify-content: space-between;
|
||||
// padding: 0 8px;
|
||||
// margin: 0 -8px 2px;
|
||||
// font-weight: unset;
|
||||
// }
|
||||
// .dice-result {
|
||||
// .duality-modifiers {
|
||||
// display: flex; // Default => display: none;
|
||||
// gap: 2px;
|
||||
// margin-bottom: 4px;
|
||||
// .duality-modifier {
|
||||
// padding: 2px;
|
||||
// border-radius: 6px;
|
||||
// border: 1px solid;
|
||||
// background: var(--color-dark-6);
|
||||
// font-size: 12px;
|
||||
// }
|
||||
// }
|
||||
// .dice-formula,
|
||||
// > .dice-total,
|
||||
// .part-header {
|
||||
// display: none;
|
||||
// }
|
||||
// .dice-tooltip {
|
||||
// grid-template-rows: 1fr;
|
||||
// .wrapper {
|
||||
// .tooltip-part {
|
||||
// display: flex;
|
||||
// align-items: end;
|
||||
// gap: 0.25rem;
|
||||
// .dice {
|
||||
// .dice-rolls {
|
||||
// margin-bottom: 0;
|
||||
// &.duality {
|
||||
// li {
|
||||
// display: flex;
|
||||
// align-items: center;
|
||||
// justify-content: center;
|
||||
// position: relative;
|
||||
// background: unset;
|
||||
// line-height: unset;
|
||||
// font-weight: unset;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// .duality-modifier {
|
||||
// display: flex;
|
||||
// margin-bottom: 6px;
|
||||
// color: var(--color-light-1);
|
||||
// text-shadow: 0 0 1px black;
|
||||
// font-size: var(--font-size-16);
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// .target-selection {
|
||||
// label {
|
||||
// color: var(--color-light-1);
|
||||
// }
|
||||
// }
|
||||
// .target-section {
|
||||
// margin: 4px 0;
|
||||
// border: 2px solid;
|
||||
// margin-top: 5px;
|
||||
// .dice-total {
|
||||
// box-shadow: unset;
|
||||
// border: unset;
|
||||
// border-radius: unset;
|
||||
// font-size: var(--font-size-18);
|
||||
// }
|
||||
// }
|
||||
// .dice-actions {
|
||||
// justify-content: space-between;
|
||||
// &.duality-alone {
|
||||
// justify-content: end;
|
||||
// margin-top: -20px;
|
||||
// }
|
||||
// > * {
|
||||
// display: flex;
|
||||
// color: var(--color-light-1);
|
||||
// text-shadow: 0 0 1px black;
|
||||
// font-weight: bold;
|
||||
// background: var(--color-dark-1);
|
||||
// padding: 4px;
|
||||
// border-color: black;
|
||||
// min-height: unset;
|
||||
// height: 26px;
|
||||
// flex: unset;
|
||||
// margin: 0;
|
||||
// }
|
||||
// .duality-action {
|
||||
// border-radius: 0 6px 0 0;
|
||||
// margin-left: -8px;
|
||||
// &.duality-action-effect {
|
||||
// border-top-left-radius: 6px;
|
||||
// margin-left: initial;
|
||||
// }
|
||||
// }
|
||||
// .duality-result {
|
||||
// border-radius: 6px 0 0 0;
|
||||
// margin-right: -8px;
|
||||
// }
|
||||
// }
|
||||
// .duality-result {
|
||||
// display: flex;
|
||||
// color: var(--color-light-1);
|
||||
// text-shadow: 0 0 1px black;
|
||||
// font-weight: bold;
|
||||
// background: var(--color-dark-1);
|
||||
// padding: 4px;
|
||||
// border-color: black;
|
||||
// min-height: unset;
|
||||
// height: 26px;
|
||||
// flex: unset;
|
||||
// margin: 0;
|
||||
// margin-left: auto;
|
||||
// align-self: center;
|
||||
// border-radius: 6px;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// button {
|
||||
// &.inner-button {
|
||||
// color: var(--color-light-1);
|
||||
// text-shadow: 0 0 1px black;
|
||||
// font-weight: bold;
|
||||
// background: var(--color-dark-1);
|
||||
// border-color: black;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
|
|
|
|||
|
|
@ -19,3 +19,7 @@
|
|||
@import './resources/resources.less';
|
||||
|
||||
@import './settings/settings.less';
|
||||
|
||||
|
||||
|
||||
@import './chat/chat-temp.less';
|
||||
|
|
|
|||
|
|
@ -4,10 +4,26 @@
|
|||
@golden: #f3c267;
|
||||
@golden-10: #f3c26710;
|
||||
@golden-40: #f3c26740;
|
||||
@golden-bg: #f3c2671a;
|
||||
|
||||
@fear: #8f87ee;
|
||||
@fear-10: #8f87ee10;
|
||||
@fear-40: #8f87ee40;
|
||||
@fear-bg: #14142599;
|
||||
|
||||
@critical: #f3c267;
|
||||
@critical-10: #f3c26710;
|
||||
@critical-40: #f3c26740;
|
||||
@critical-bg: #2a152e99;
|
||||
|
||||
@red: #a778b1;
|
||||
@red-10: #a778b110;
|
||||
@red-40: #a778b140;
|
||||
|
||||
@medium-red: #D04747;
|
||||
@medium-red-10: #D0474710;
|
||||
@medium-red-40: #D0474740;
|
||||
|
||||
@red: #e54e4e;
|
||||
@red-10: #e54e4e10;
|
||||
@red-40: #e54e4e40;
|
||||
|
||||
@dark-red: #3c0000;
|
||||
@dark-red-10: #3c000010;
|
||||
|
|
@ -55,11 +71,11 @@
|
|||
@positive: #699969;
|
||||
@secondaryShadow: gold;
|
||||
@primaryAccent: #778899;
|
||||
@hope: #ffe760;
|
||||
@fear: #0032b1;
|
||||
// @hope: #ffe760;
|
||||
// @fear: #0032b1;
|
||||
@fearBackgroundStart: rgba(15, 15, 97, 0.6);
|
||||
@fearBackgroundEnd: rgba(0, 0, 255, 0.6);
|
||||
@critical: #430070;
|
||||
// @critical: #430070;
|
||||
@criticalBackgroundStart: rgba(37, 8, 37, 0.6);
|
||||
@criticalBackgroundEnd: rgba(128, 0, 128, 0.6);
|
||||
@primary-color-fear: rgba(9, 71, 179, 0.75);
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<li class="chat-message message flexcol {{cssClass}}" data-message-id="{{message._id}}"
|
||||
{{#if borderColor}}style="border-color:{{borderColor}}"{{/if}}>
|
||||
{{#if borderColor}}style="border-color:{{borderColor}}"{{/if}}>{{log @root}}
|
||||
<header class="message-header flexrow">
|
||||
<div class="message-header-main">
|
||||
<img class="actor-img" src="{{actor.img}}" />
|
||||
|
|
|
|||
176
templates/ui/chat/duality-roll-temp.hbs
Normal file
176
templates/ui/chat/duality-roll-temp.hbs
Normal file
|
|
@ -0,0 +1,176 @@
|
|||
<div class="chat-roll">
|
||||
{{!-- Roll Start --}}
|
||||
<div class="roll-part roll-section">
|
||||
<div class="roll-part-header"><span>Finesse Check</span></div>
|
||||
<div class="roll-part-content">
|
||||
<div class="roll-result-container">
|
||||
<span class="roll-result-value">18</span>
|
||||
<span class="roll-result-desc">with hope</span>
|
||||
</div>
|
||||
<span class="roll-difficulty">difficulty 15</span>
|
||||
</div>
|
||||
<div class="dice-roll" data-action="expandRoll">
|
||||
<div class="roll-part-header"><div><span>Formula</span></div></div>
|
||||
<div class="roll-part-content dice-result">
|
||||
<div class="dice-tooltip">
|
||||
<div class="wrapper">
|
||||
<div class="roll-dice">
|
||||
<div class="roll-die">
|
||||
<label>Hope</label>
|
||||
<div>12 <img class="dice-icon" src="systems/daggerheart/assets/icons/dice/hope/d20.svg" alt=""></div>
|
||||
</div>
|
||||
<div class="roll-die">
|
||||
<label></label>
|
||||
<div>+</div>
|
||||
</div>
|
||||
<div class="roll-die">
|
||||
<label>Fear</label>
|
||||
<div>6 <img class="dice-icon" src="systems/daggerheart/assets/icons/dice/fear/d12.svg" alt=""></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="roll-formula">
|
||||
1d12 + 1d12 + 0
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{{!-- Roll End --}}
|
||||
{{!-- Damage Start --}}
|
||||
<div class="roll-part damage-section dice-roll" data-action="expandRoll">
|
||||
<div class="roll-part-header"><div><span>Damage</span></div></div>
|
||||
<div class="roll-part-extra on-reduced">
|
||||
<div class="wrapper">
|
||||
<div class="roll-formula">Hit Points: 10</div>
|
||||
<div class="roll-formula">Stress: 10</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="roll-part-content dice-result">
|
||||
<div class="dice-tooltip">
|
||||
<div class="wrapper">
|
||||
<fieldset>
|
||||
<legend>
|
||||
Hit Points <div class="roll-formula">Total: 10</div>
|
||||
</legend>
|
||||
<label class="roll-part-header"><span>Physical <div class="roll-formula">10</div></span></label>
|
||||
<div class="roll-dice">
|
||||
<div class="roll-die">
|
||||
<div>4 <img class="dice-icon" src="systems/daggerheart/assets/icons/dice/default/d20.svg" alt=""></div>
|
||||
</div>
|
||||
<div class="roll-die">
|
||||
<div>+</div>
|
||||
</div>
|
||||
<div class="roll-die">
|
||||
<div>6</div>
|
||||
</div>
|
||||
</div>
|
||||
<label class="roll-part-header"><span>Magical <div class="roll-formula">10</div></span></label>
|
||||
<div class="roll-dice">
|
||||
<div class="roll-die">
|
||||
<div>4 <img class="dice-icon" src="systems/daggerheart/assets/icons/dice/default/d20.svg" alt=""></div>
|
||||
</div>
|
||||
<div class="roll-die">
|
||||
<div>+</div>
|
||||
</div>
|
||||
<div class="roll-die">
|
||||
<div>6</div>
|
||||
</div>
|
||||
</div>
|
||||
<label class="roll-part-header"><span>Phy/Mag <div class="roll-formula">10</div></span></label>
|
||||
<div class="roll-dice">
|
||||
<div class="roll-die">
|
||||
<div>4 <img class="dice-icon" src="systems/daggerheart/assets/icons/dice/default/d20.svg" alt=""></div>
|
||||
</div>
|
||||
<div class="roll-die">
|
||||
<div>+</div>
|
||||
</div>
|
||||
<div class="roll-die">
|
||||
<div>6</div>
|
||||
</div>
|
||||
</div>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend>
|
||||
Stress <div class="roll-formula">Total: 10</div>
|
||||
</legend>
|
||||
<div class="roll-dice">
|
||||
<div class="roll-die">
|
||||
<div>4 <img class="dice-icon" src="systems/daggerheart/assets/icons/dice/default/d20.svg" alt=""></div>
|
||||
</div>
|
||||
<div class="roll-die">
|
||||
<div>+</div>
|
||||
</div>
|
||||
<div class="roll-die">
|
||||
<div>6</div>
|
||||
</div>
|
||||
</div>
|
||||
</fieldset>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{{!-- Damage End --}}
|
||||
{{!-- Target Start --}}
|
||||
<div class="roll-part target-section dice-roll" data-action="expandRoll">
|
||||
<div class="roll-part-header"><div><span>Target</span></div></div>
|
||||
<div class="roll-part-extra on-reduced">
|
||||
<div class="wrapper">
|
||||
<div class="target-hit-status">2 Hits</div>
|
||||
<div class="target-hit-status is-miss">2 Miss</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="roll-part-content dice-result">
|
||||
<div class="dice-tooltip">
|
||||
<div class="wrapper">
|
||||
<div class="target-selector">
|
||||
<div class="roll-part-header"><div></div></div>
|
||||
<div class="target-choice"><div class="target-selected">Hit</div><div>Current</div></div>
|
||||
<div class="roll-part-header"><div></div></div>
|
||||
</div>
|
||||
<div class="roll-part-extra">Reaction Roll All Targets<i class="fa-solid fa-shield fa-lg"></i></div>
|
||||
<div class="roll-target">
|
||||
<img class="target-img" src="images/goliath_ranger.jpg">
|
||||
<div class="target-data">
|
||||
<div class="target-name">Archer Squadron</div>
|
||||
<div class="target-hit-status is-hit">Hit</div>
|
||||
</div>
|
||||
<i class="fa-solid fa-shield fa-lg"></i>
|
||||
</div>
|
||||
<div class="roll-target">
|
||||
<img class="target-img" src="images/goliath_ranger.jpg">
|
||||
<div class="target-data">
|
||||
<div class="target-name">Conscript</div>
|
||||
<div class="target-hit-status is-miss">Miss</div>
|
||||
</div>
|
||||
<i class="fa-solid fa-shield fa-lg"></i>
|
||||
</div>
|
||||
<div class="roll-target">
|
||||
<img class="target-img" src="images/goliath_ranger.jpg">
|
||||
<div class="target-data">
|
||||
<div class="target-name">Elite Soldier</div>
|
||||
<div class="target-hit-status is-hit">Hit</div>
|
||||
</div>
|
||||
<i class="fa-solid fa-shield fa-lg"></i>
|
||||
</div>
|
||||
<div class="roll-target">
|
||||
<img class="target-img" src="images/goliath_ranger.jpg">
|
||||
<div class="target-data">
|
||||
<div class="target-name">Knight of the Realm</div>
|
||||
<div class="target-hit-status is-miss">Miss</div>
|
||||
</div>
|
||||
<i class="fa-solid fa-shield fa-lg"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{{!-- Target End --}}
|
||||
<div class="roll-part-header"><div></div></div>
|
||||
</div>
|
||||
{{!-- Button Start --}}
|
||||
<div class="roll-buttons">
|
||||
<button>Deal Damage</button>
|
||||
<button>Apply Effects</button>
|
||||
</div>
|
||||
{{!-- Button End --}}
|
||||
|
|
@ -201,10 +201,6 @@
|
|||
{{/if}}
|
||||
</span></button>
|
||||
{{/if}}
|
||||
{{!-- {{else}}
|
||||
{{#if hasHealing}}
|
||||
<button class="duality-action duality-action-healing" data-value="{{roll.total}}"><span>{{localize "DAGGERHEART.UI.Chat.attackRoll.rollHealing"}}</span></button>
|
||||
{{/if}} --}}
|
||||
{{/if}}
|
||||
{{#if hasEffect}}
|
||||
<button class="duality-action-effect" data-value="{{roll.total}}"><span>{{localize "DAGGERHEART.UI.Chat.attackRoll.applyEffect"}}</span></button>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue