199 - Tooltips (#311)

* Set up templates for all 'advanced' tooltips * Fixed ItemFeature Header label * Fixed less import
2026-01-12 03:31:07 +01:00 · 2025-07-11 22:26:56 +02:00 · 2025-07-11 22:26:56 +02:00 · b6195127fe
commit b6195127fe
parent 72436478c1
23 changed files with 505 additions and 54 deletions
--- a/lang/en.json
+++ b/lang/en.json
@ -973,6 +973,10 @@
                "singular": "Character",
                "plural": "Characters"
            },
+            "Cost": {
+                "single": "Cost",
+                "plural": "Costs"
+            },
            "Damage": {
                "severe": "Severe",
                "major": "Major",
@ -1078,6 +1082,7 @@
                "specialization": "Specialization",
                "mastery": "Mastery",
                "optional": "Optional",
+                "recovery": "Recovery",
                "setup": "Setup",
                "equipment": "Equipment"
            },
@ -1099,6 +1104,8 @@
            "burden": "Burden",
            "check": "{check} Check",
            "criticalSuccess": "Critical Success",
+            "damage": "Damage",
+            "damageType": "Damage Type",
            "description": "Description",
            "duality": "Duality",
            "dualityRoll": "Duality Roll",
@ -1111,17 +1118,25 @@
            "inactiveEffects": "Inactive Effects",
            "inventory": "Inventory",
            "level": "Level",
+            "max": "Max",
            "modifier": "Modifier",
            "multiclass": "Multiclass",
+            "none": "None",
            "quantity": "Quantity",
            "range": "Range",
+            "recovery": "Recovery",
+            "scalable": "Scalable",
            "stress": "Stress",
            "take": "Take",
            "target": "Target",
            "title": "Title",
+            "true": "True",
            "type": "Type",
            "unarmored": "Unarmored",
-            "use": "Use"
+            "use": "Use",
+            "used": "Used",
+            "uses": "Uses",
+            "value": "Value"
        },
        "ITEMS": {
            "Armor": {
@ -1178,6 +1193,7 @@
                "spellcastingTrait": "Spellcasting Trait"
            },
            "Weapon": {
+                "weaponType": "Weapon Type",
                "primaryWeapon": "Primary Weapon",
                "secondaryWeapon": "Secondary Weapon"
            }
@ -1386,7 +1402,8 @@
                "unequip": "Unequip",
                "sendToVault": "Send to Vault",
                "sendToLoadout": "Send to Loadout",
-                "makeDeathMove": "Make a Death Move"
+                "makeDeathMove": "Make a Death Move",
+                "rangeAndTarget": "Range & Target"
            }
        }
    }
--- a/module/config/actorConfig.mjs
+++ b/module/config/actorConfig.mjs
@ -113,7 +113,7 @@ export const adversaryTypes = {
    },
    social: {
        id: 'social',
-        label: 'DAGGERHEART.CONFIG.AdversaryTypee.social.label',
+        label: 'DAGGERHEART.CONFIG.AdversaryType.social.label',
        description: 'DAGGERHEART.ACTORS.Adversary.social.description'
    },
    solo: {
--- a/module/data/item/armor.mjs
+++ b/module/data/item/armor.mjs
@ -44,6 +44,12 @@ export default class DHArmor extends BaseDataItem {
        };
    }

+    get customActions() {
+        return this.actions.filter(
+            action => !this.armorFeatures.some(feature => feature.actionIds.includes(action.id))
+        );
+    }
+
    async _preUpdate(changes, options, user) {
        const allowed = await super._preUpdate(changes, options, user);
        if (allowed === false) return false;
--- a/module/data/item/weapon.mjs
+++ b/module/data/item/weapon.mjs
@ -73,6 +73,12 @@ export default class DHWeapon extends BaseDataItem {
        return [this.attack, ...this.actions];
    }

+    get customActions() {
+        return this.actions.filter(
+            action => !this.weaponFeatures.some(feature => feature.actionIds.includes(action.id))
+        );
+    }
+
    async _preUpdate(changes, options, user) {
        const allowed = await super._preUpdate(changes, options, user);
        if (allowed === false) return false;
--- a/module/documents/tooltipManager.mjs
+++ b/module/documents/tooltipManager.mjs
@ -2,15 +2,33 @@ export default class DhTooltipManager extends foundry.helpers.interaction.Toolti
    async activate(element, options = {}) {
        let html = options.html;
        if (element.dataset.tooltip?.startsWith('#item#')) {
-            const item = await foundry.utils.fromUuid(element.dataset.tooltip.slice(6));
+            const splitValues = element.dataset.tooltip.slice(6).split('#action#');
+            const itemUuid = splitValues[0];
+            const actionId = splitValues.length > 1 ? splitValues[1] : null;
+
+            const baseItem = await foundry.utils.fromUuid(itemUuid);
+            const item = actionId ? baseItem.system.actions.find(x => x.id === actionId) : baseItem;
            if (item) {
+                const type = actionId ? 'action' : item.type;
                html = await foundry.applications.handlebars.renderTemplate(
-                    `systems/daggerheart/templates/ui/tooltip/${item.type}.hbs`,
-                    item
+                    `systems/daggerheart/templates/ui/tooltip/${type}.hbs`,
+                    {
+                        item: item,
+                        config: CONFIG.DH
+                    }
                );
+
+                this.tooltip.innerHTML = html;
+                options.direction = this._determineItemTooltipDirection(element);
            }
        }

        super.activate(element, { ...options, html: html });
    }
+
+    _determineItemTooltipDirection(element) {
+        const pos = element.getBoundingClientRect();
+        const dirs = this.constructor.TOOLTIP_DIRECTIONS;
+        return dirs[pos.x - this.tooltip.offsetWidth < 0 ? 'DOWN' : 'LEFT'];
+    }
 }
--- a/module/helpers/handlebarsHelper.mjs
+++ b/module/helpers/handlebarsHelper.mjs
@ -1,47 +1,49 @@
-import { getWidthOfText } from './utils.mjs';
-
 export default class RegisterHandlebarsHelpers {
    static registerHelpers() {
        Handlebars.registerHelper({
-            times: this.times,
-            join: this.join,
            add: this.add,
-            subtract: this.subtract,
            includes: this.includes,
-            case: this.case
+            times: this.times,
+            damageFormula: this.damageFormula,
+            damageSymbols: this.damageSymbols,
+            tertiary: this.tertiary,
+            signedNumber: this.signedNumber
        });
    }

-    static times(nr, block) {
-        var accum = '';
-        for (var i = 0; i < nr; ++i) accum += block.fn(i);
-        return accum;
-    }
-
-    static join(...options) {
-        return options.slice(0, options.length - 1);
-    }
-
    static add(a, b) {
        const aNum = Number.parseInt(a);
        const bNum = Number.parseInt(b);
        return (Number.isNaN(aNum) ? 0 : aNum) + (Number.isNaN(bNum) ? 0 : bNum);
    }

-    static subtract(a, b) {
-        const aNum = Number.parseInt(a);
-        const bNum = Number.parseInt(b);
-        return (Number.isNaN(aNum) ? 0 : aNum) - (Number.isNaN(bNum) ? 0 : bNum);
-    }
-
    static includes(list, item) {
        return list.includes(item);
    }

-    static case(value, options) {
-        if (value == this.switch_value) {
-            this.switch_break = true;
-            return options.fn(this);
-        }
+    static times(nr, block) {
+        var accum = '';
+        for (var i = 0; i < nr; ++i) accum += block.fn(i);
+        return accum;
+    }
+
+    static damageFormula(attack, actor) {
+        const traitTotal = actor.system.traits?.[attack.roll.trait]?.total;
+        const instances = [
+            attack.damage.parts.map(x => Roll.replaceFormulaData(x.value.getFormula(), actor)).join(' + '),
+            traitTotal
+        ].filter(x => x);
+
+        return instances.join(traitTotal > 0 ? ' + ' : ' - ');
+    }
+
+    static damageSymbols(damageParts) {
+        const symbols = new Set();
+        damageParts.forEach(part => symbols.add(...CONFIG.DH.GENERAL.damageTypes[part.type].icon));
+        return new Handlebars.SafeString(Array.from(symbols).map(symbol => `<i class="fa-solid ${symbol}"></i>`));
+    }
+
+    static tertiary(a, b) {
+        return a ?? b;
    }
 }
--- a/module/systemRegistration/handlebars.mjs
+++ b/module/systemRegistration/handlebars.mjs
@ -22,6 +22,7 @@ export const preloadHandlebarsTemplates = async function () {
        'systems/daggerheart/templates/actionTypes/beastform.hbs',
        'systems/daggerheart/templates/settings/components/settings-item-line.hbs',
        'systems/daggerheart/templates/ui/chat/parts/damage-chat.hbs',
-        'systems/daggerheart/templates/ui/chat/parts/target-chat.hbs'
+        'systems/daggerheart/templates/ui/chat/parts/target-chat.hbs',
+        'systems/daggerheart/templates/ui/tooltip/parts/tooltipTags.hbs'
    ]);
 };
--- a/styles/daggerheart.less
+++ b/styles/daggerheart.less
@ -12,4 +12,6 @@

@import './less/ui/index.less';

+@import './less/ux/index.less';
+
@import '../node_modules/@yaireo/tagify/dist/tagify.css';
--- a/styles/less/ux/index.less
+++ b/styles/less/ux/index.less
@ -0,0 +1 @@
+@import './tooltip/tooltip.less';
--- a/styles/less/ux/tooltip/tooltip.less
+++ b/styles/less/ux/tooltip/tooltip.less
@ -0,0 +1,106 @@
+.daggerheart.dh-style.tooltip {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 4px;
+
+    .tooltip-title {
+        margin: 0;
+        text-align: center;
+    }
+
+    .tooltip-image {
+        height: 180px;
+        width: 180px;
+    }
+
+    .tooltip-description {
+        font-style: italic;
+    }
+
+    .tooltip-sub-title {
+        margin: 0;
+        color: light-dark(@dark-blue, @beige);
+    }
+
+    .tooltip-information-section {
+        width: 100%;
+        display: grid;
+        grid-template-columns: 1fr 1fr;
+        gap: 4px;
+
+        &.triple {
+            grid-template-columns: 1fr 1fr 1fr;
+        }
+
+        &.border {
+            border: 1px solid light-dark(@dark-blue, @golden);
+            border-radius: 6px;
+            padding: 2px;
+        }
+
+        .tooltip-information {
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            gap: 2px;
+
+            &.full-width {
+                grid-column: span 2;
+            }
+
+            label {
+                font-weight: bold;
+            }
+
+            label,
+            div {
+                white-space: nowrap;
+            }
+        }
+    }
+
+    .tooltip-tags {
+        width: 100%;
+        display: flex;
+        flex-direction: column;
+        gap: 4px;
+
+        .tooltip-tag {
+            width: 100%;
+            display: grid;
+            grid-template-columns: 80px 1fr;
+            align-items: start;
+            gap: 8px;
+            padding: 4px;
+            border: 1px solid light-dark(@dark-blue, @golden);
+            border-radius: 6px;
+
+            .tooltip-tag-label-container {
+                display: flex;
+                align-items: center;
+                flex-direction: column;
+                gap: 2px;
+
+                .tooltip-tag-image {
+                    width: 40px;
+                    height: 40px;
+                }
+            }
+
+            .tooltip-tag-label {
+                font-weight: bold;
+                text-align: center;
+            }
+
+            .tooltip-tag-description {
+                display: flex;
+                flex-wrap: wrap;
+            }
+        }
+    }
+
+    .spaced {
+        margin-bottom: 4px;
+    }
+}
--- a/templates/sheets/global/tabs/tab-actions.hbs
+++ b/templates/sheets/global/tabs/tab-actions.hbs
@ -10,6 +10,7 @@
                <div class="action-item"
                    data-action="editAction"
                    data-index="{{index}}"
+                    data-tooltip="{{concat "#item#" @root.document.uuid "#action#" action.id}}"
                >
                    <img class="image" src="{{action.img}}" />
                    <span>{{action.name}}</span>
--- a/templates/sheets/global/tabs/tab-features.hbs
+++ b/templates/sheets/global/tabs/tab-features.hbs
@ -11,7 +11,7 @@
                    data-action="editFeature"
                    id="{{feature.id}}"
                >
-                    <img class="image" src="{{feature.img}}" />
+                    <img class="image" src="{{feature.img}}" data-tooltip="{{concat "#item#" feature.uuid}}" />
                    <span>{{feature.name}}</span>
                    <div class="controls">
                        <a data-action="removeFeature" id="{{feature.id}}"><i class="fa-solid fa-trash"></i></a>
--- a/templates/sheets/items/feature/header.hbs
+++ b/templates/sheets/items/feature/header.hbs
@ -4,7 +4,7 @@
        <line-div></line-div>
        <h1 class='item-name'><input type='text' name='name' value='{{source.name}}' /></h1>
        <div class='item-description'>
-            <h3>{{localize (concat 'TYPES.Item.feature' source.system.type)}}</h3>
+            <h3>{{localize 'TYPES.Item.feature'}}</h3>
        </div>
    </div>
 </header>
--- a/templates/ui/tooltip/action.hbs
+++ b/templates/ui/tooltip/action.hbs
@ -0,0 +1,83 @@
+<div class="daggerheart dh-style tooltip">
+    <h2 class="tooltip-title">{{item.name}}</h2>
+    <img class="tooltip-image" src="{{item.img}}" />
+    <div class="tooltip-description">{{{item.description}}}</div>
+
+    {{#if item.uses.max}}
+        <h4 class="tooltip-sub-title">{{localize "DAGGERHEART.GENERAL.uses"}}</h4>
+        <div class="tooltip-information-section triple spaced">
+            <div class="tooltip-information">
+                <label>{{localize "DAGGERHEART.GENERAL.used"}}</label>
+                <div>{{item.uses.value}}</div>
+            </div>
+            <div class="tooltip-information">
+                <label>{{localize "DAGGERHEART.GENERAL.max"}}</label>
+                <div>{{item.uses.max}}</div>
+            </div>
+            <div class="tooltip-information">
+                <label>{{localize "DAGGERHEART.GENERAL.recovery"}}</label>
+                {{#with (lookup config.GENERAL.refreshTypes item.uses.recovery) as | type |}}
+                    <div>{{localize type.label}}</div>
+                {{/with}}
+            </div>
+        </div>
+    {{/if}}
+
+    {{#if (gt item.cost.length 0)}}
+        <h4 class="tooltip-sub-title">{{localize "DAGGERHEART.GENERAL.Cost.plural"}}</h4>
+        {{#each item.cost as | cost |}}
+            <div class="tooltip-information-section border spaced">
+                <div class="tooltip-information">
+                    <label>{{localize "Type"}}</label>
+                    {{#with (lookup @root.config.GENERAL.abilityCosts cost.type) as | type |}}
+                        <div>{{localize type.label}}</div>
+                    {{/with}}
+                </div>
+                <div class="tooltip-information">
+                    <label>{{localize "DAGGERHEART.GENERAL.value"}}</label>
+                    <div>{{cost.value}}</div>
+                </div>
+                {{#if cost.scalable}}
+                    <div class="tooltip-information">
+                        <label>{{localize "DAGGERHEART.GENERAL.scalable"}}</label>
+                        <div>{{localize "DAGGERHEART.GENERAL.true"}}</div>
+                    </div>
+                    <div class="tooltip-information">
+                        <label>{{localize "DAGGERHEART.GENERAL.value"}}</label>
+                        <div>{{cost.step}}</div>
+                    </div>
+                {{/if}}
+            </div>
+        {{/each}}
+    {{/if}}
+
+    {{#if (or item.range item.target)}}
+        <h4 class="tooltip-sub-title">{{localize "DAGGERHEART.UI.Tooltip.rangeAndTarget"}}</h4>
+        <div class="tooltip-information-section border spaced">
+            <div class="tooltip-information">
+                <label>{{localize "DAGGERHEART.GENERAL.range"}}</label>
+                <div>
+                    {{#if item.range}}
+                        {{#with (lookup @root.config.GENERAL.range item.range) as | range |}}
+                            <div>{{localize range.label}}</div>
+                        {{/with}}
+                    {{else}}
+                        <div>{{localize "DAGGERHEART.GENERAL.none"}}</div>
+                    {{/if}}
+                </div>
+            </div>
+            <div class="tooltip-information">
+                <label>{{localize "DAGGERHEART.GENERAL.target"}}</label>
+                <div>
+                    {{#if item.target.type}}
+                        {{#with (lookup @root.config.ACTIONS.targetTypes item.target.type) as | target |}}
+                            <div>{{@root.item.target.amount}} {{localize target.label}}</div>
+                        {{/with}}
+                    {{else}}
+                        <div>{{localize "DAGGERHEART.GENERAL.none"}}</div>
+                    {{/if}}
+                </div>
+            </div>
+        </div>
+    {{/if}}
+</div>
--- a/templates/ui/tooltip/adversary.hbs
+++ b/templates/ui/tooltip/adversary.hbs
@ -0,0 +1,64 @@
+<div class="daggerheart dh-style tooltip">
+    <h2 class="tooltip-title">{{item.name}}</h2>
+    <img class="tooltip-image" src="{{item.img}}" />
+    <div class="tooltip-description">{{{item.system.description}}}</div>
+
+    <div class="tooltip-information-section triple spaced">
+        <div class="tooltip-information">
+            <label>{{localize "DAGGERHEART.GENERAL.Tiers.singular"}}</label>
+            {{#with (lookup config.GENERAL.tiers item.system.tier) as | tier |}}
+                <div>{{localize tier.label}}</div>
+            {{/with}}
+        </div>
+        <div class="tooltip-information">
+            <label>{{localize "Type"}}</label>
+            {{#with (lookup config.ACTOR.adversaryTypes item.system.type) as | type |}}
+                <div>{{localize type.label}}</div>
+            {{/with}}
+        </div>
+        <div class="tooltip-information">
+            <label>{{localize "DAGGERHEART.ACTORS.Adversary.FIELDS.difficulty.label"}}</label>
+            <div>{{item.system.difficulty}}</div>
+        </div>
+    </div>
+    <div class="tooltip-information-section spaced">
+        <div class="tooltip-information">
+            <label>{{localize "DAGGERHEART.GENERAL.hitPoints"}}</label>
+            <div>{{item.system.resources.hitPoints.max}}</div>
+        </div>
+        <div class="tooltip-information">
+            <label>{{localize "DAGGERHEART.GENERAL.stress"}}</label>
+            <div>{{item.system.resources.stress.max}}</div>
+        </div>
+        <div class="tooltip-information">
+            <label>{{localize "DAGGERHEART.ITEMS.Armor.baseThresholds.major"}}</label>
+            <div>{{item.system.damageThresholds.major}}</div>
+        </div>
+        <div class="tooltip-information">
+            <label>{{localize "DAGGERHEART.ITEMS.Armor.baseThresholds.severe"}}</label>
+            <div>{{item.system.damageThresholds.severe}}</div>
+        </div>
+        <div class="tooltip-information">
+            <label>{{localize "DAGGERHEART.GENERAL.attack"}}</label>
+            <div>{{numberFormat item.system.attack.roll.bonus sign=true}}</div>
+        </div>
+        <div class="tooltip-information">
+            <label>{{localize "DAGGERHEART.GENERAL.damage"}}</label>
+            <div>{{damageFormula item.system.attack item}}</div>
+        </div>
+    </div>
+
+    <strong>{{localize "DAGGERHEART.GENERAL.Experience.plural"}}</strong>
+    {{#each item.system.experiences as | experience |}}
+        <div>{{experience.name}} {{numberFormat experience.total sign=true}}</div>
+    {{/each}}
+
+    <div class="tooltip-information-section">
+        <div class="tooltip-information full-width">
+            <label>{{localize "DAGGERHEART.ACTORS.Adversary.FIELDS.motivesAndTactics.label"}}</label>
+            <div>{{item.system.motivesAndTactics}}</div>
+        </div>
+    </div>
+
+    {{> "systems/daggerheart/templates/ui/tooltip/parts/tooltipTags.hbs" features=item.system.features }}
+</div>
--- a/templates/ui/tooltip/armor.hbs
+++ b/templates/ui/tooltip/armor.hbs
@ -1,5 +1,37 @@
-<div>
-    <div>{{name}}</div>
-    <img src="{{img}}" />
-    <div>{{{system.description}}}</div>
+<div class="daggerheart dh-style tooltip">
+    <h2 class="tooltip-title">{{item.name}}</h2>
+    <img class="tooltip-image" src="{{item.img}}" />
+    <div class="tooltip-description">{{{item.system.description}}}</div>
+
+    <div class="tooltip-information-section">
+        <div class="tooltip-information full-width">
+            <label>{{localize "DAGGERHEART.ITEMS.Armor.baseScore"}}</label>
+            <div>{{item.system.baseScore}}</div>
+        </div>
+        
+        <div class="tooltip-information">
+            <label>{{localize "DAGGERHEART.ITEMS.Armor.baseThresholds.major"}}</label>
+            <div>{{item.system.baseThresholds.major}}</div>
+        </div>
+        <div class="tooltip-information">
+            <label>{{localize "DAGGERHEART.ITEMS.Armor.baseThresholds.severe"}}</label>
+            <div>{{item.system.baseThresholds.severe}}</div>
+        </div>
+    </div>
+
+    {{#if (gt item.system.armorFeatures.length 0)}}<h4 class="tooltip-sub-title">{{localize "DAGGERHEART.GENERAL.features"}}</h4>{{/if}}
+    <div class="tooltip-tags">
+        {{#each item.system.armorFeatures}}
+            {{#with (lookup ../config.ITEM.armorFeatures this.value) as | feature | }}
+                <div class="tooltip-tag">
+                    <div class="tooltip-tag-label-container">
+                        <div class="tooltip-tag-label">{{localize feature.label}}</div>
+                    </div>
+                    <div class="tooltip-tag-description">{{{localize feature.description}}}</div>
+                </div>
+            {{/with}}
+        {{/each}}
+    </div>
+
+    {{> "systems/daggerheart/templates/ui/tooltip/parts/tooltipTags.hbs" features=item.system.customActions label=(localize "DAGGERHEART.GENERAL.Action.plural")}}
 </div>
--- a/templates/ui/tooltip/beastform.hbs
+++ b/templates/ui/tooltip/beastform.hbs
@ -1,6 +0,0 @@
-<div>
-    <div>{{name}}</div>
-    <img src="{{system.tokenImg}}" />
-    <div>{{{system.examples}}}</div>
-    <div>{{system.advantageOn}}</div>
-</div>
--- a/templates/ui/tooltip/consumable.hbs
+++ b/templates/ui/tooltip/consumable.hbs
@ -0,0 +1,14 @@
+<div class="daggerheart dh-style tooltip">
+    <h2 class="tooltip-title">{{item.name}}</h2>
+    <img class="tooltip-image" src="{{item.img}}" />
+    <div class="tooltip-description">{{{item.system.description}}}</div>
+
+    <div class="tooltip-information-section">
+        <div class="tooltip-information full-width">
+            <label>{{localize "DAGGERHEART.GENERAL.quantity"}}</label>
+            <div>{{item.system.quantity}}</div>
+        </div>
+    </div>
+
+    {{> "systems/daggerheart/templates/ui/tooltip/parts/tooltipTags.hbs" features=item.system.actions label=(localize "DAGGERHEART.GENERAL.Action.plural") }}
+</div>
--- a/templates/ui/tooltip/domainCard.hbs
+++ b/templates/ui/tooltip/domainCard.hbs
@ -1,5 +1,31 @@
-<div>
-    <div>{{name}}</div>
-    <img src="{{img}}" />
-    <div>{{{system.description}}}</div>
+<div class="daggerheart dh-style tooltip">
+    <h2 class="tooltip-title">{{item.name}}</h2>
+    <img class="tooltip-image" src="{{item.img}}" />
+    <div class="tooltip-description">{{{item.system.description}}}</div>
+
+    <div class="tooltip-information-section">
+        <div class="tooltip-information">
+            <label>{{localize "DAGGERHEART.GENERAL.Domain.single"}}</label>
+            {{#with (lookup config.DOMAIN.domains item.system.domain) as | domain |}}
+                <div>{{localize domain.label}}</div>
+            {{/with}}
+        </div>
+        
+        <div class="tooltip-information">
+            <label>{{localize "Type"}}</label>
+            {{#with (lookup config.DOMAIN.cardTypes item.system.type) as | type |}}
+                <div>{{localize type.label}}</div>
+            {{/with}}
+        </div>
+        <div class="tooltip-information">
+            <label>{{localize "DAGGERHEART.GENERAL.level"}}</label>
+            <div>{{item.system.level}}</div>
+        </div>
+        <div class="tooltip-information">
+            <label>{{localize "DAGGERHEART.ITEMS.DomainCard.recallCost"}}</label>
+            <div>{{item.system.recallCost}}</div>
+        </div>
+    </div>
+
+    {{> "systems/daggerheart/templates/ui/tooltip/parts/tooltipTags.hbs" features=item.system.actions label=(localize "DAGGERHEART.GENERAL.Action.plural") }}
 </div>
--- a/templates/ui/tooltip/feature.hbs
+++ b/templates/ui/tooltip/feature.hbs
@ -0,0 +1,8 @@
+<div class="daggerheart dh-style tooltip">
+    <h2 class="tooltip-title">{{item.name}}</h2>
+    <img class="tooltip-image" src="{{item.img}}" />
+    <div class="tooltip-description">{{{item.system.description}}}</div>
+
+    {{> "systems/daggerheart/templates/ui/tooltip/parts/tooltipTags.hbs" features=item.system.actions label=(localize "DAGGERHEART.GENERAL.Action.plural") }}
+    {{> "systems/daggerheart/templates/ui/tooltip/parts/tooltipTags.hbs" features=item.effects label=(localize "DAGGERHEART.GENERAL.Effect.plural") }}
+</div>
--- a/templates/ui/tooltip/miscellaneous.hbs
+++ b/templates/ui/tooltip/miscellaneous.hbs
@ -0,0 +1,7 @@
+<div class="daggerheart dh-style tooltip">
+    <h2 class="tooltip-title">{{item.name}}</h2>
+    <img class="tooltip-image" src="{{item.img}}" />
+    <div class="tooltip-description">{{{item.system.description}}}</div>
+
+    {{> "systems/daggerheart/templates/ui/tooltip/parts/tooltipTags.hbs" features=item.system.actions label=(localize "DAGGERHEART.GENERAL.Action.plural") }}
+</div>
--- a/templates/ui/tooltip/parts/tooltipTags.hbs
+++ b/templates/ui/tooltip/parts/tooltipTags.hbs
@ -0,0 +1,12 @@
+{{#if (gt features.length 0)}}<h4 class="tooltip-sub-title">{{label}}</h4>{{/if}}
+<div class="tooltip-tags">
+    {{#each features as | feature |}}
+        <div class="tooltip-tag">
+            <div class="tooltip-tag-label-container">
+                    <div class="tooltip-tag-label">{{localize feature.name}}</div>
+                    {{#if feature.img}}<img class="tooltip-tag-image" src="{{feature.img}}" />{{/if}}
+                </div>
+            <div class="tooltip-tag-description">{{{localize (tertiary feature.description feature.system.description)}}}</div>
+        </div>
+    {{/each}}
+</div>
--- a/templates/ui/tooltip/weapon.hbs
+++ b/templates/ui/tooltip/weapon.hbs
@ -1,5 +1,56 @@
-<div>
-    <div>{{name}}</div>
-    <img src="{{img}}" />
-    <div>{{{system.description}}}</div>
+<div class="daggerheart dh-style tooltip">
+    <h2 class="tooltip-title">{{item.name}}</h2>
+    <img class="tooltip-image" src="{{item.img}}" />
+    <div class="tooltip-description">{{{item.system.description}}}</div>
+
+    <div class="tooltip-information-section">
+        <div class="tooltip-information">
+            <label>{{localize "DAGGERHEART.ITEMS.Weapon.weaponType"}}</label>
+            <div>{{#if item.system.secondaryWeapon}}{{localize "DAGGERHEART.ITEMS.Weapon.secondaryWeapon"}}{{else}}{{localize "DAGGERHEART.ITEMS.Weapon.primaryWeapon"}}{{/if}}</div>
+        </div>
+        <div class="tooltip-information">
+            <label>{{localize "DAGGERHEART.GENERAL.burden"}}</label>
+            {{#with (lookup config.GENERAL.burden item.system.burden) as | burden |}}
+                <div>{{localize burden.label}}</div>
+            {{/with}}
+        </div>
+        {{#if item.system.attack.roll.trait}}
+            <div class="tooltip-information">
+                <label>{{localize "DAGGERHEART.GENERAL.Trait.single"}}</label>
+                {{#with (lookup config.ACTOR.abilities item.system.attack.roll.trait) as | trait |}}
+                    <div>{{localize trait.label}}</div>
+                {{/with}}
+            </div>
+        {{/if}}
+        <div class="tooltip-information">
+            <label>{{localize "DAGGERHEART.GENERAL.range"}}</label>
+            {{#with (lookup config.GENERAL.range item.system.attack.range) as | range |}}
+                <div>{{localize range.label}}</div>
+            {{/with}}
+        </div>
+        <div class="tooltip-information">
+            <label>{{localize "DAGGERHEART.GENERAL.damage"}}</label>
+            <div>{{{damageFormula item.system.attack item.parent}}}</div>
+        </div>
+        <div class="tooltip-information">
+            <label>{{localize "DAGGERHEART.GENERAL.damageType"}}</label>
+            <div>{{{damageSymbols item.system.attack.damage.parts}}}</div>
+        </div>
+    </div>
+
+    {{#if (gt item.system.weaponFeatures.length 0)}}<h4 class="tooltip-sub-title">{{localize "DAGGERHEART.GENERAL.features"}}</h4>{{/if}}
+    <div class="tooltip-tags">
+        {{#each item.system.weaponFeatures}}
+            {{#with (lookup ../config.ITEM.weaponFeatures this.value) as | feature | }}
+                <div class="tooltip-tag">
+                    <div class="tooltip-tag-label-container">
+                        <div class="tooltip-tag-label">{{localize feature.label}}</div>
+                    </div>
+                    <div class="tooltip-tag-description">{{{localize feature.description}}}</div>
+                </div>
+            {{/with}}
+        {{/each}}
+    </div>
+    
+    {{> "systems/daggerheart/templates/ui/tooltip/parts/tooltipTags.hbs" features=item.system.customActions label=(localize "DAGGERHEART.GENERAL.Action.plural") }}
 </div>