zephyr/horse
1
0
Fork 0
Code Issues 13 Pull Requests Actions Packages Projects Releases Wiki Activity

zenno: fix margins on skill tips with multiple activations

Browse Source
This commit is contained in:
Branden J Brown
2026-05-27 02:26:49 -04:00
parent 40a015363c
commit 223495a04a
1 changed files with 5 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
zenno/src/lib/Skill.svelte
View File

@@ -36,7 +36,7 @@
} }
return l[0]; return l[0];
}); });
const activationClass = $derived(s.activations.length === 1 ? null : 'm2 border rounded-md'); const activationClass = $derived(s.activations.length === 1 ? null : 'my-2 border rounded-md');
const spanClass = $derived(mention ? 'italic' : 'font-bold'); const spanClass = $derived(mention ? 'italic' : 'font-bold');
</script> </script>
@@ -51,7 +51,7 @@
{/snippet} {/snippet}
{#snippet abilities(abils: Ability[])} {#snippet abilities(abils: Ability[])}
{#each abils as a (a.type)} {#each abils as a, i (i)}
<div class="text-sm"> <div class="text-sm">
{ABILITY_TYPE_FORMAT[a.type](a.value)} {ABILITY_TYPE_FORMAT[a.type](a.value)}
{ABILITY_SCALE_NAME[a.value_usage]} {ABILITY_SCALE_NAME[a.value_usage]}
@@ -62,7 +62,7 @@
{/each} {/each}
{/snippet} {/snippet}
<div class="group relative inline-block"> <span class="group relative inline-block">
<div <div
class="skill-tip invisible absolute bottom-4 -left-1/2 flex w-80 flex-col rounded-lg border px-2 text-center opacity-0 shadow-lg transition-all group-hover:visible group-hover:bottom-6 group-hover:opacity-100" class="skill-tip invisible absolute bottom-4 -left-1/2 flex w-80 flex-col rounded-lg border px-2 text-center opacity-0 shadow-lg transition-all group-hover:visible group-hover:bottom-6 group-hover:opacity-100"
role="tooltip" role="tooltip"
@@ -83,7 +83,7 @@
</div> </div>
<div class="py-1"> <div class="py-1">
{@render abilities(act.abilities)} {@render abilities(act.abilities)}
{#if act.duration} {#if act.duration != null && act.duration > 0}
<div class="text-sm"> <div class="text-sm">
for {tenThousandths(act.duration)}s for {tenThousandths(act.duration)}s
{DURATION_SCALE_NAME[act.dur_scale]} {DURATION_SCALE_NAME[act.dur_scale]}
@@ -94,4 +94,4 @@
{/each} {/each}
</div> </div>
<span class={spanClass}>{s.name}</span> <span class={spanClass}>{s.name}</span>
</div> </span>