- Adjusted button styles across various components for consistency and better UX. - Enhanced layout of action controls to utilize whitespace more effectively. - Updated slider styles for a more modern appearance and improved usability. - Refined input fields and labels for better accessibility and readability. - Introduced new app surface styles for a cohesive design across the application. - Added tests for canvas cursor behavior to ensure correct cursor display during operations.
32 lines
1.1 KiB
TypeScript
32 lines
1.1 KiB
TypeScript
export function bottomControlMenuClass() {
|
|
return "flex max-w-full min-w-0 flex-nowrap items-center justify-center gap-2 whitespace-nowrap tabular-nums";
|
|
}
|
|
|
|
export function bottomControlFieldClass() {
|
|
return "flex min-w-0 shrink items-center gap-2 whitespace-nowrap";
|
|
}
|
|
|
|
export function bottomControlDividerClass() {
|
|
return "h-8 w-px bg-white/15";
|
|
}
|
|
|
|
export function bottomControlLabelClass() {
|
|
return "shrink-0 text-xs text-white/60";
|
|
}
|
|
|
|
export function bottomControlValueClass() {
|
|
return "min-w-12 text-center text-xs font-medium text-white/85";
|
|
}
|
|
|
|
export function bottomControlInputClass() {
|
|
return "h-7 w-12 rounded bg-transparent px-1.5 text-right font-mono text-xs text-white/90 outline-none transition placeholder:text-white/25 hover:bg-white/[0.04] focus:bg-white/[0.06] focus:ring-1 focus:ring-sky-300/50";
|
|
}
|
|
|
|
export function bottomControlIconSlotClass() {
|
|
return "grid size-8 place-items-center rounded-lg text-white/70";
|
|
}
|
|
|
|
export function bottomControlButtonClass() {
|
|
return `${bottomControlIconSlotClass()} transition hover:bg-white/10 hover:text-white focus:outline-none focus-visible:outline-none`;
|
|
}
|