refactor: replace px text sizes in Button, Loader, Footnote with named tokens
This commit is contained in:
@@ -150,11 +150,11 @@ const variantStyles: Record<ButtonVariant, string> = {
|
||||
};
|
||||
|
||||
const sizeStyles: Record<ButtonSize, string> = {
|
||||
xs: 'h-6 px-2 text-[9px] gap-1',
|
||||
sm: 'h-8 px-3 text-[10px] gap-1.5',
|
||||
md: 'h-10 px-4 text-[11px] gap-2',
|
||||
lg: 'h-12 px-6 text-[12px] gap-2',
|
||||
xl: 'h-14 px-8 text-[13px] gap-2.5',
|
||||
xs: 'h-6 px-2 text-3xs gap-1',
|
||||
sm: 'h-8 px-3 text-2xs gap-1.5',
|
||||
md: 'h-10 px-4 text-xs gap-2',
|
||||
lg: 'h-12 px-6 text-xs gap-2',
|
||||
xl: 'h-14 px-8 text-sm gap-2.5',
|
||||
};
|
||||
|
||||
// Square padding for icon-only mode
|
||||
|
||||
@@ -27,14 +27,14 @@ const { children, class: className, render }: Props = $props();
|
||||
{#if render}
|
||||
{@render render({
|
||||
class: cn(
|
||||
'font-mono text-[0.5625rem] sm:text-[0.625rem] lowercase tracking-[0.2em] text-text-soft',
|
||||
'font-mono text-3xs sm:text-2xs lowercase tracking-wider-mono text-text-soft',
|
||||
className,
|
||||
),
|
||||
})}
|
||||
{:else if children}
|
||||
<span
|
||||
class={cn(
|
||||
'font-mono text-[0.5625rem] sm:text-[0.625rem] lowercase tracking-[0.2em] text-text-soft',
|
||||
'font-mono text-3xs sm:text-2xs lowercase tracking-wider-mono text-text-soft',
|
||||
className,
|
||||
)}
|
||||
>
|
||||
|
||||
@@ -71,7 +71,7 @@ let { size = 20, class: className = '', message = 'analyzing_data' }: Props = $p
|
||||
<div class="w-px h-3 bg-text-muted/50"></div>
|
||||
|
||||
<!-- Message -->
|
||||
<span class="font-mono text-[10px] uppercase tracking-[0.2em] text-text-subtle font-medium">
|
||||
<span class="font-mono text-2xs uppercase tracking-wider-mono text-text-subtle font-medium">
|
||||
{message}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user