- Updated BottomControlsIsland for improved layout and styling. - Refactored LayersSheet to enhance usability and visual consistency. - Modified ToolOverlay for better tool selection experience. - Improved BrushControls with new ColorPicker and Slider components. - Enhanced PanControls and TransformControls for better user interaction. - Updated ZoomControls for consistent button sizes and styles. - Introduced new styles for bottom controls in styles.ts and index.css. - Added BottomControlColorPicker, BottomControlSelectMenu, and BottomControlSlider components for better modularity and reusability.
32 lines
942 B
TypeScript
32 lines
942 B
TypeScript
export function bottomControlMenuClass() {
|
|
return "flex w-full items-center justify-center gap-4 tabular-nums";
|
|
}
|
|
|
|
export function bottomControlFieldClass() {
|
|
return "flex items-center gap-3";
|
|
}
|
|
|
|
export function bottomControlDividerClass() {
|
|
return "h-8 w-px bg-white/15";
|
|
}
|
|
|
|
export function bottomControlLabelClass() {
|
|
return "text-sm text-white/60";
|
|
}
|
|
|
|
export function bottomControlValueClass() {
|
|
return "min-w-16 text-center text-base text-white";
|
|
}
|
|
|
|
export function bottomControlInputClass() {
|
|
return "h-10 w-20 px-2 text-center text-base text-white outline-none transition placeholder:text-white/30 focus:text-white";
|
|
}
|
|
|
|
export function bottomControlIconSlotClass() {
|
|
return "grid size-12 place-items-center rounded-full text-white/80";
|
|
}
|
|
|
|
export function bottomControlButtonClass() {
|
|
return `${bottomControlIconSlotClass()} transition hover:bg-white/10 hover:text-white focus:outline-none focus-visible:outline-none`;
|
|
}
|