Fix custom activity icon display.

foundryvtt · Aug 30, 2024 · b0ef575 · b0ef575
1 parent c8e5656
commit b0ef575
Show file tree

Hide file tree

Showing 3 changed files with 29 additions and 11 deletions.
diff --git a/less/v2/activities.less b/less/v2/activities.less
@@ -156,12 +156,24 @@
     align-items: center;
     padding: 6px 56px 6px 6px;
 
-    > span {
+    > .name {
       flex: 1;
       text-transform: none;
       font-family: var(--dnd5e-font-roboto-slab);
       line-height: normal;
       font-size: var(--font-size-14);
     }
+
+    > .icon {
+      flex: 0 0 50px;
+      height: 24px;
+      text-align: left;
+    }
+
+    .gold-icon {
+      border-width: 1px;
+      width: 24px;
+      height: 24px;
+    }
   }
 }
diff --git a/less/v2/items.less b/less/v2/items.less
@@ -518,9 +518,13 @@
         --icon-size: 24px;
         --icon-fill: var(--color-text-dark-primary);
         flex: 0 0 50px;
-        width: 24px;
         height: 24px;
-        .gold-icon { border-width: 1px; }
+
+        .gold-icon {
+          border-width: 1px;
+          width: 24px;
+          height: 24px;
+        }
       }
 
       > .name {

diff --git a/templates/activity/activity-choices.hbs b/templates/activity/activity-choices.hbs
@@ -3,14 +3,16 @@
         {{#each activities}}
         <li>
             <button type="button" data-action="choose" data-activity-id="{{ id }}">
-                {{#with icon}}
-                {{#if svg}}
-                <dnd5e-icon src="{{ src }}"></dnd5e-icon>
-                {{else}}
-                <img src="{{ src }}" alt="{{ ../name }}">
-                {{/if}}
-                {{/with}}
-                <span>{{ name }}</span>
+                <span class="icon">
+                    {{#with icon}}
+                    {{#if svg}}
+                    <dnd5e-icon src="{{ src }}"></dnd5e-icon>
+                    {{else}}
+                    <img src="{{ src }}" alt="{{ ../name }}" class="gold-icon">
+                    {{/if}}
+                    {{/with}}
+                </span>
+                <span class="name">{{ name }}</span>
             </button>
         </li>
         {{/each}}