alice.pds.demo.boltless.dev
This repository has no description
web/components: optically centre the issue state pill label
Inter's ascent/descent split isn't symmetric within the line box, so the
mathematically centred label sat visibly high — measured 7.25px of ink above
versus 10px below on 'Closed'. nudging the label alone by 1.5px balances it
without moving the icon or changing the pill's 28px height.
Signed-off-by: eti <eti@eti.tf>
author
eti
committer
dawn
date
(Jul 31, 2026, 10:57 PM +0300)
commit
6fc71410
6fc71410c461e9b29252bc367c356bf69aa5af1f
parent
866b1d4a
866b1d4ac006f2d2cf77b5f1ac9311d53d3f6411
change-id
mpovvykr
mpovvykrzpuqrspsmptxopmmntwuxtst
+6
-1
+6
-1
web/src/lib/components/repo/issues/IssueStatePill.svelte
+6
-1
web/src/lib/components/repo/issues/IssueStatePill.svelte
···
34
34
35
35
<span class={issueStatePill({ state, class: className })}>
36
36
<Icon class="size-3 shrink-0" aria-hidden="true" />
37
-
{label}
37
+
<!--
38
+
Inter's ascent/descent split isn't symmetric in the line box, so a mathematically
39
+
centred label reads high. nudge the text alone (a transform, so the icon and the
40
+
pill's height are untouched) to land it on the optical centre.
41
+
-->
42
+
<span class="translate-y-[1.5px]">{label}</span>
38
43
</span>