fix: use Button's size prop instead of direct font-size class
This commit is contained in:
@@ -61,13 +61,10 @@ function handleReset() {
|
||||
{#each SORT_OPTIONS as option}
|
||||
<Button
|
||||
variant="ghost"
|
||||
size={isMobileOrTabletPortrait ? 'sm' : 'md'}
|
||||
size={isMobileOrTabletPortrait ? 'xs' : 'sm'}
|
||||
active={sortStore.value === option}
|
||||
onclick={() => sortStore.set(option)}
|
||||
class={cn(
|
||||
'font-bold uppercase tracking-wide font-primary, px-0',
|
||||
isMobileOrTabletPortrait ? 'text-[0.5625rem]' : 'text-[0.625rem]',
|
||||
)}
|
||||
class="tracking-wide px-0"
|
||||
>
|
||||
{option}
|
||||
</Button>
|
||||
@@ -78,12 +75,9 @@ function handleReset() {
|
||||
<!-- Reset_Filters -->
|
||||
<Button
|
||||
variant="ghost"
|
||||
size={isMobileOrTabletPortrait ? 'sm' : 'md'}
|
||||
size={isMobileOrTabletPortrait ? 'xs' : 'sm'}
|
||||
onclick={handleReset}
|
||||
class={cn(
|
||||
'group text-[0.5625rem] md:text-[0.625rem] font-mono font-bold uppercase tracking-widest text-neutral-400',
|
||||
isMobileOrTabletPortrait && 'px-0',
|
||||
)}
|
||||
class={cn('group font-mono tracking-widest text-neutral-400', isMobileOrTabletPortrait && 'px-0')}
|
||||
iconPosition="left"
|
||||
>
|
||||
{#snippet icon()}
|
||||
|
||||
@@ -70,19 +70,21 @@ let {
|
||||
-->
|
||||
<ButtonGroup>
|
||||
<ToggleButton
|
||||
size="sm"
|
||||
active={comparisonStore.side === 'A'}
|
||||
onclick={() => comparisonStore.side = 'A'}
|
||||
class="flex-1 tracking-wide font-bold uppercase text-[0.625rem]"
|
||||
class="flex-1 tracking-wide font-bold uppercase"
|
||||
>
|
||||
<span>Left Font</span>
|
||||
</ToggleButton>
|
||||
|
||||
<ToggleButton
|
||||
class="flex-1 tracking-wide font-bold uppercase text-[0.625rem]"
|
||||
size="sm"
|
||||
class="flex-1 tracking-wide font-bold uppercase"
|
||||
active={comparisonStore.side === 'B'}
|
||||
onclick={() => comparisonStore.side = 'B'}
|
||||
>
|
||||
<span class="uppercase">Right Font</span>
|
||||
<span>Right Font</span>
|
||||
</ToggleButton>
|
||||
</ButtonGroup>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user