cosmo/daggerheart
1
0
Fork 0
mirror of https://github.com/Foundryborne/daggerheart.git synced 2026-01-17 15:39:02 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

Fixed styling for downtime tooltip

Browse source
This commit is contained in:
WBHarry 2025-07-17 17:47:13 +02:00
parent 15ca55bacf
commit 01ddc4f9e7
10 changed files with 122 additions and 32 deletions
Download patch file Download diff file Expand all files Collapse all files

4
module/applications/dialogs/downtime.mjs
View file

@ -25,8 +25,8 @@ export default class DhpDowntime extends HandlebarsApplicationMixin(ApplicationV
static DEFAULT_OPTIONS = {
tag: 'form',
classes: ['daggerheart', 'views', 'dh-style', 'downtime'],
position: { width: 680, height: 'auto' },
classes: ['daggerheart', 'views', 'dh-style', 'dialog', 'downtime'],
position: { width: 600, height: 'auto' },
actions: {
selectMove: this.selectMove,
takeDowntime: this.takeDowntime

19
module/config/generalConfig.mjs
View file

@ -130,6 +130,7 @@ export const defaultRestOptions = {
tendToWounds: {
id: 'tendToWounds',
name: game.i18n.localize('DAGGERHEART.APPLICATIONS.Downtime.shortRest.tendToWounds.name'),
icon: 'fa-solid fa-bandage',
img: 'icons/magic/life/cross-worn-green.webp',
description: game.i18n.localize('DAGGERHEART.APPLICATIONS.Downtime.shortRest.tendToWounds.description'),
actions: [
@ -153,6 +154,7 @@ export const defaultRestOptions = {
clearStress: {
id: 'clearStress',
name: game.i18n.localize('DAGGERHEART.APPLICATIONS.Downtime.shortRest.clearStress.name'),
icon: 'fa-regular fa-face-surprise',
img: 'icons/magic/perception/eye-ringed-green.webp',
description: game.i18n.localize('DAGGERHEART.APPLICATIONS.Downtime.shortRest.clearStress.description'),
actions: [
@ -176,6 +178,7 @@ export const defaultRestOptions = {
repairArmor: {
id: 'repairArmor',
name: game.i18n.localize('DAGGERHEART.APPLICATIONS.Downtime.shortRest.repairArmor.name'),
icon: 'fa-solid fa-hammer',
img: 'icons/skills/trades/smithing-anvil-silver-red.webp',
description: game.i18n.localize('DAGGERHEART.APPLICATIONS.Downtime.shortRest.repairArmor.description'),
actions: []
@ -183,6 +186,7 @@ export const defaultRestOptions = {
prepare: {
id: 'prepare',
name: game.i18n.localize('DAGGERHEART.APPLICATIONS.Downtime.shortRest.prepare.name'),
icon: 'fa-solid fa-dumbbell',
img: 'icons/skills/trades/academics-merchant-scribe.webp',
description: game.i18n.localize('DAGGERHEART.APPLICATIONS.Downtime.shortRest.prepare.description'),
actions: []
@ -192,6 +196,7 @@ export const defaultRestOptions = {
tendToWounds: {
id: 'tendToWounds',
name: game.i18n.localize('DAGGERHEART.APPLICATIONS.Downtime.longRest.tendToWounds.name'),
icon: 'fa-solid fa-bandage',
img: 'icons/magic/life/cross-worn-green.webp',
description: game.i18n.localize('DAGGERHEART.APPLICATIONS.Downtime.longRest.tendToWounds.description'),
actions: []
@ -199,6 +204,7 @@ export const defaultRestOptions = {
clearStress: {
id: 'clearStress',
name: game.i18n.localize('DAGGERHEART.APPLICATIONS.Downtime.longRest.clearStress.name'),
icon: 'fa-regular fa-face-surprise',
img: 'icons/magic/perception/eye-ringed-green.webp',
description: game.i18n.localize('DAGGERHEART.APPLICATIONS.Downtime.longRest.clearStress.description'),
actions: []
@ -206,6 +212,7 @@ export const defaultRestOptions = {
repairArmor: {
id: 'repairArmor',
name: game.i18n.localize('DAGGERHEART.APPLICATIONS.Downtime.longRest.repairArmor.name'),
icon: 'fa-solid fa-hammer',
img: 'icons/skills/trades/smithing-anvil-silver-red.webp',
description: game.i18n.localize('DAGGERHEART.APPLICATIONS.Downtime.longRest.repairArmor.description'),
actions: []
@ -213,6 +220,7 @@ export const defaultRestOptions = {
prepare: {
id: 'prepare',
name: game.i18n.localize('DAGGERHEART.APPLICATIONS.Downtime.longRest.prepare.name'),
icon: 'fa-solid fa-dumbbell',
img: 'icons/skills/trades/academics-merchant-scribe.webp',
description: game.i18n.localize('DAGGERHEART.APPLICATIONS.Downtime.longRest.prepare.description'),
actions: []
@ -220,19 +228,12 @@ export const defaultRestOptions = {
workOnAProject: {
id: 'workOnAProject',
name: game.i18n.localize('DAGGERHEART.APPLICATIONS.Downtime.longRest.workOnAProject.name'),
icon: 'fa-solid fa-diagram-project',
img: 'icons/skills/social/thumbsup-approval-like.webp',
description: game.i18n.localize('DAGGERHEART.APPLICATIONS.Downtime.longRest.workOnAProject.description'),
actions: []
}
}),
custom: {
id: 'customActivity',
name: '',
img: 'icons/skills/trades/academics-investigation-puzzles.webp',
description: '',
namePlaceholder: 'DAGGERHEART.APPLICATIONS.Downtime.custom.namePlaceholder',
placeholder: 'DAGGERHEART.APPLICATIONS.Downtime.custom.placeholder'
}
})
};
export const deathMoves = {

2
module/data/settings/Homebrew.mjs
View file

@ -54,6 +54,7 @@ export default class DhHomebrew extends foundry.abstract.DataModel {
moves: new fields.TypedObjectField(
new fields.SchemaField({
name: new fields.StringField({ required: true }),
icon: new fields.StringField({ required: true }),
img: new fields.FilePathField({
initial: 'icons/magic/life/cross-worn-green.webp',
categories: ['IMAGE'],
@ -70,6 +71,7 @@ export default class DhHomebrew extends foundry.abstract.DataModel {
moves: new fields.TypedObjectField(
new fields.SchemaField({
name: new fields.StringField({ required: true }),
icon: new fields.StringField({ required: true }),
img: new fields.FilePathField({
initial: 'icons/magic/life/cross-worn-green.webp',
categories: ['IMAGE'],

51
module/documents/tooltipManager.mjs
View file

@ -21,14 +21,61 @@ export default class DhTooltipManager extends foundry.helpers.interaction.Toolti
this.tooltip.innerHTML = html;
options.direction = this._determineItemTooltipDirection(element);
}
} else {
const shortRest = element.dataset.tooltip?.startsWith('#shortRest#');
const longRest = element.dataset.tooltip?.startsWith('#longRest#');
if (shortRest || longRest) {
const key = element.dataset.tooltip.slice(shortRest ? 11 : 10);
const downtimeOptions = shortRest
? CONFIG.DH.GENERAL.defaultRestOptions.shortRest()
: CONFIG.DH.GENERAL.defaultRestOptions.longRest();
const move = downtimeOptions[key];
html = await foundry.applications.handlebars.renderTemplate(
`systems/daggerheart/templates/ui/tooltip/downtime.hbs`,
{
move: move
}
);
this.tooltip.innerHTML = html;
options.direction = this._determineItemTooltipDirection(
element,
this.constructor.TOOLTIP_DIRECTIONS.UP
);
}
}
super.activate(element, { ...options, html: html });
}
_determineItemTooltipDirection(element) {
_determineItemTooltipDirection(element, prefered = this.constructor.TOOLTIP_DIRECTIONS.LEFT) {
const pos = element.getBoundingClientRect();
const dirs = this.constructor.TOOLTIP_DIRECTIONS;
return dirs[pos.x - this.tooltip.offsetWidth < 0 ? 'DOWN' : 'LEFT'];
switch (prefered) {
case this.constructor.TOOLTIP_DIRECTIONS.LEFT:
return dirs[
pos.x - this.tooltip.offsetWidth < 0
? this.constructor.TOOLTIP_DIRECTIONS.DOWN
: this.constructor.TOOLTIP_DIRECTIONS.LEFT
];
case this.constructor.TOOLTIP_DIRECTIONS.UP:
return dirs[
pos.y - this.tooltip.offsetHeight < 0
? this.constructor.TOOLTIP_DIRECTIONS.RIGHT
: this.constructor.TOOLTIP_DIRECTIONS.UP
];
case this.constructor.TOOLTIP_DIRECTIONS.RIGHT:
return dirs[
pos.x + this.tooltip.offsetWidth > document.body.clientWidth
? this.constructor.TOOLTIP_DIRECTIONS.DOWN
: this.constructor.TOOLTIP_DIRECTIONS.RIGHT
];
case this.constructor.TOOLTIP_DIRECTIONS.DOWN:
return dirs[
pos.y + this.tooltip.offsetHeight > document.body.clientHeight
? this.constructor.TOOLTIP_DIRECTIONS.LEFT
: this.constructor.TOOLTIP_DIRECTIONS.DOWN
];
}
}
}

38
styles/less/dialog/downtime/downtime-container.less
View file

@ -1,13 +1,14 @@
@import '../../utils/spacing.less';
@import '../../utils/colors.less';
.daggerheart.views {
.downtime-header {
margin: 0;
color: light-dark(@dark-blue, @golden);
text-align: center;
width: 100%;
.theme-light .daggerheart.dh-style.views.downtime {
.downtime-container .activity-container .activity-selected-marker {
background-image: url(../assets/parchments/dh-parchment-dark.png);
}
}
.daggerheart.dh-style.views.downtime {
font-family: @font-body;
.downtime-container {
.activities-container {
@ -28,16 +29,32 @@
font-size: 8px;
flex: none;
color: light-dark(#18162e, #f3c267);
margin-right: 8px;
margin-right: 4px;
}
.activity-select-section {
display: flex;
align-items: center;
gap: 4px;
.activity-icon {
min-width: 24px;
text-align: center;
}
}
}
.activity-selected-marker {
font-size: 14px;
border: 1px solid light-dark(@dark-blue, @golden);
border-radius: 6px;
color: light-dark(@beige, @dark);
background-image: url(../assets/parchments/dh-parchment-light.png);
padding: 0 8px;
line-height: 1;
font-weight: bold;
}
}
}
}
@ -45,11 +62,10 @@
margin-top: 8px;
display: flex;
gap: 8px;
}
&.downtime {
.activity-text-area {
resize: none;
button {
flex: 1;
font-family: 'Montserrat', sans-serif;
}
}
}

14
styles/less/ux/tooltip/tooltip.less
View file

@ -4,6 +4,20 @@
align-items: center;
gap: 4px;
.tooltip-title-container {
width: 100%;
display: flex;
align-items: center;
gap: 16px;
.tooltip-image {
height: 40px;
width: 40px;
border-radius: 6px;
border: 1px solid @golden;
}
}
.tooltip-title {
margin: 0;
text-align: center;

10
templates/dialogs/downtime/activities.hbs
View file

@ -5,13 +5,13 @@
{{#each moves as |move key|}}
<div class="activity-container">
<div class="activity-inner-container">
<i class="fa-solid fa-circle activity-marker"></i>
<a class="activity-select-section" data-action="selectMove" data-category="{{../category}}" data-move="{{key}}">
<i class="fa-solid fa-hammer activtiy-icon"></i>
<div>{{move.name}}{{#if move.selected}} ({{move.selected}}){{/if}}</div>
<i class="{{#if move.selected}}fa-solid{{else}}fa-regular{{/if}} fa-circle activity-marker"></i>
<a class="activity-select-section" data-action="selectMove" data-category="{{../category}}" data-move="{{key}}" data-tooltip="{{concat "#" ../category "#" key}}">
<i class="{{move.icon}} activity-icon"></i>
<div>{{move.name}}</div>
</a>
</div>
<a><i class="fa-solid fa-chevron-up expand-icon"></i></a>
{{#if move.selected}}<div class="activity-selected-marker">{{move.selected}}</div>{{/if}}
</div>
{{/each}}
</div>

7
templates/dialogs/downtime/downtime.hbs
View file

@ -1,10 +1,13 @@
<div>
<h2 class="downtime-header">{{localize "DAGGERHEART.APPLICATIONS.Downtime.downtimeHeader"}}</h2>
<header class="dialog-header">
<h1>{{localize "DAGGERHEART.APPLICATIONS.Downtime.downtimeHeader"}}</h1>
</header>
<div class="downtime-container two-columns even">
{{#if shortRestMoves.moves}}{{> "systems/daggerheart/templates/dialogs/downtime/activities.hbs" moves=shortRestMoves.moves category='shortRest' nrChoices=nrChoices.shortRest}}{{/if}}
{{#if longRestMoves.moves}}{{> "systems/daggerheart/templates/dialogs/downtime/activities.hbs" moves=longRestMoves.moves category='longRest' nrChoices=nrChoices.longRest}}{{/if}}
</div>
<footer class="flexrow">
<footer>
<button type="button" data-action="close">{{localize "Cancel"}}</button>
<button type="button" data-action="takeDowntime" {{#if disabledDowntime}}disabled{{/if}}>{{localize "DAGGERHEART.APPLICATIONS.Downtime.takeDowntime"}}</button>
</footer>

2
templates/settings/automation-settings.hbs
View file

@ -6,7 +6,7 @@
</div>
{{formGroup settingFields.schema.fields.actionPoints value=settingFields._source.actionPoints localize=true}}
s {{formGroup settingFields.schema.fields.hordeDamage value=settingFields._source.hordeDamage localize=true}}
{{formGroup settingFields.schema.fields.hordeDamage value=settingFields._source.hordeDamage localize=true}}
<footer class="form-footer">
<button data-action="reset">

7
templates/ui/tooltip/downtime.hbs Normal file
View file

@ -0,0 +1,7 @@
<div class="daggerheart dh-style tooltip">
<div class="tooltip-title-container">
<img class="tooltip-image" src="{{move.img}}" />
<h2 class="tooltip-title">{{move.name}}</h2>
</div>
<div class="tooltip-description">{{{move.description}}}</div>
</div>