Polish macOS layer styling
All checks were successful
Deploy blog-frontend / build-and-deploy (push) Successful in 2m10s

This commit is contained in:
박원엽
2026-05-29 14:18:02 +09:00
parent 8e854a1afa
commit b371200515
23 changed files with 200 additions and 137 deletions

View File

@@ -7,7 +7,7 @@ export interface SegmentedControlOption<T extends string> {
interface SegmentedControlProps<T extends string> {
ariaLabel: string;
options: SegmentedControlOption<T>[];
options: readonly SegmentedControlOption<T>[];
value: T;
onChange: (value: T) => void;
className?: string;
@@ -23,7 +23,7 @@ export default function SegmentedControl<T extends string>({
return (
<div
className={clsx(
'inline-flex h-9 rounded-full border border-[var(--color-line)] bg-[var(--color-control)] p-1 shadow-[var(--shadow-control)] backdrop-blur-xl',
'inline-flex h-9 rounded-full border border-[var(--control-border)] bg-[var(--color-control)] p-1 shadow-[var(--shadow-control)] backdrop-blur-[18px]',
className,
)}
role="group"
@@ -41,8 +41,8 @@ export default function SegmentedControl<T extends string>({
className={clsx(
'min-w-14 rounded-full px-3 text-sm font-semibold transition duration-150',
isSelected
? 'bg-[var(--color-surface-strong)] text-[var(--color-text)] shadow-sm'
: 'text-[var(--color-text-muted)] hover:bg-black/[0.04] hover:text-[var(--color-text)] dark:hover:bg-white/10',
? 'bg-[var(--card-bg-strong)] text-[var(--color-text)] shadow-sm'
: 'text-[var(--color-text-muted)] hover:bg-[var(--card-bg)] hover:text-[var(--color-text)]',
)}
>
{option.label}