refactor: tighten AI-CAD viewport layout
This commit is contained in:
Your Name
parent
0414983f64
commit
00464f518f
@ -2103,15 +2103,15 @@ function AiCadToolbarGroup({
|
||||
return (
|
||||
<div
|
||||
className={cn(
|
||||
"flex flex-wrap items-center gap-2 border border-[#e6e0d3] bg-white px-2 py-1",
|
||||
"flex flex-wrap items-center gap-1.5 border border-[#e6e0d3] bg-white px-1.5 py-1",
|
||||
className
|
||||
)}
|
||||
>
|
||||
<span className="pl-1 text-[#8a8272] text-[10px] uppercase tracking-[0.18em]">
|
||||
<span className="pl-0.5 text-[#8a8272] text-[10px] uppercase tracking-[0.18em]">
|
||||
{label}
|
||||
</span>
|
||||
<Separator className="h-5 bg-[#e7e1d4]" orientation="vertical" />
|
||||
<div className="flex flex-wrap items-center gap-1.5">{children}</div>
|
||||
<Separator className="h-4 bg-[#e7e1d4]" orientation="vertical" />
|
||||
<div className="flex flex-wrap items-center gap-1">{children}</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@ -3674,23 +3674,23 @@ export function AiCadWorkbench() {
|
||||
</div>
|
||||
|
||||
<div className="flex min-h-0 flex-1 flex-col overflow-hidden">
|
||||
<div className="border-[#e6e0d3] border-b bg-white px-3 py-2">
|
||||
<div className="flex flex-wrap items-center justify-between gap-2">
|
||||
<div className="flex flex-wrap items-center gap-2">
|
||||
<div className="border-[#e6e0d3] border-b bg-white px-3 py-1.5">
|
||||
<div className="flex flex-wrap items-center justify-between gap-1.5">
|
||||
<div className="flex flex-wrap items-center gap-1.5">
|
||||
<button
|
||||
className="inline-flex h-8 items-center gap-2 rounded-[9px] border border-[#e2dccf] bg-white px-3 text-[#383329] text-[12px] transition hover:bg-[#faf7ef]"
|
||||
className="inline-flex h-7 items-center gap-1.5 rounded-[8px] border border-[#e2dccf] bg-white px-2.5 text-[#383329] text-[12px] transition hover:bg-[#faf7ef]"
|
||||
type="button"
|
||||
>
|
||||
<WandSparkles className="h-4 w-4 text-[#31df86]" />
|
||||
<WandSparkles className="h-3.5 w-3.5 text-[#31df86]" />
|
||||
Start Design
|
||||
</button>
|
||||
<Badge className="rounded-full border-[#e2dccf] bg-white px-2.5 py-1 text-[#5f594d] text-[11px]">
|
||||
<Badge className="rounded-full border-[#e2dccf] bg-white px-2 py-0.5 text-[#5f594d] text-[10px]">
|
||||
{activeVersion
|
||||
? `Focus V${activeVersion.versionNumber}`
|
||||
: "Ready for first pass"}
|
||||
</Badge>
|
||||
</div>
|
||||
<div className="flex flex-wrap items-center gap-3 text-[#7f7768] text-[11px]">
|
||||
<div className="flex flex-wrap items-center gap-2.5 text-[#7f7768] text-[10px]">
|
||||
<span
|
||||
className={cn(
|
||||
"inline-flex items-center gap-1.5",
|
||||
@ -3719,11 +3719,11 @@ export function AiCadWorkbench() {
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="mt-1.5 flex flex-wrap items-center gap-2">
|
||||
<div className="mt-1 flex flex-wrap items-center gap-1.5">
|
||||
<AiCadToolbarGroup label="Mode">
|
||||
<button
|
||||
className={cn(
|
||||
"inline-flex h-8 items-center gap-2 rounded-[8px] border px-2.5 text-[12px] transition-all duration-150 ease-out",
|
||||
"inline-flex h-7 items-center gap-1.5 rounded-[7px] border px-2 text-[12px] transition-all duration-150 ease-out",
|
||||
activeResultTab === "preview"
|
||||
? "border-[#bfd9c9] bg-[#ecfbf2] text-[#173225]"
|
||||
: "border-[#ddd7ca] bg-white text-[#5f594d] hover:bg-[#faf7ef]"
|
||||
@ -3739,7 +3739,7 @@ export function AiCadWorkbench() {
|
||||
</button>
|
||||
<button
|
||||
className={cn(
|
||||
"inline-flex h-8 items-center gap-2 rounded-[8px] border px-2.5 text-[12px] transition-all duration-150 ease-out",
|
||||
"inline-flex h-7 items-center gap-1.5 rounded-[7px] border px-2 text-[12px] transition-all duration-150 ease-out",
|
||||
activeResultTab === "code"
|
||||
? "border-[#bfd9c9] bg-[#ecfbf2] text-[#173225]"
|
||||
: "border-[#ddd7ca] bg-white text-[#5f594d] hover:bg-[#faf7ef]"
|
||||
@ -3758,7 +3758,7 @@ export function AiCadWorkbench() {
|
||||
<AiCadToolbarGroup label="Display">
|
||||
<button
|
||||
className={cn(
|
||||
"inline-flex h-8 w-8 items-center justify-center rounded-[8px] border transition-all duration-150 ease-out",
|
||||
"inline-flex h-7 w-7 items-center justify-center rounded-[7px] border transition-all duration-150 ease-out",
|
||||
viewerSettings.showGrid
|
||||
? "border-[#bfd9c9] bg-[#ecfbf2] text-[#173225]"
|
||||
: "border-[#ddd7ca] bg-white text-[#5f594d] hover:bg-[#faf7ef]"
|
||||
@ -3776,7 +3776,7 @@ export function AiCadWorkbench() {
|
||||
</button>
|
||||
<button
|
||||
className={cn(
|
||||
"inline-flex h-8 w-8 items-center justify-center rounded-[8px] border transition-all duration-150 ease-out",
|
||||
"inline-flex h-7 w-7 items-center justify-center rounded-[7px] border transition-all duration-150 ease-out",
|
||||
viewerSettings.autoRotate
|
||||
? "border-[#bfd9c9] bg-[#ecfbf2] text-[#173225]"
|
||||
: "border-[#ddd7ca] bg-white text-[#5f594d] hover:bg-[#faf7ef]"
|
||||
@ -3794,7 +3794,7 @@ export function AiCadWorkbench() {
|
||||
</button>
|
||||
<button
|
||||
className={cn(
|
||||
"inline-flex h-8 w-8 items-center justify-center rounded-[8px] border transition-all duration-150 ease-out",
|
||||
"inline-flex h-7 w-7 items-center justify-center rounded-[7px] border transition-all duration-150 ease-out",
|
||||
viewerSettings.wireframe
|
||||
? "border-[#bfd9c9] bg-[#ecfbf2] text-[#173225]"
|
||||
: "border-[#ddd7ca] bg-white text-[#5f594d] hover:bg-[#faf7ef]"
|
||||
@ -3813,16 +3813,16 @@ export function AiCadWorkbench() {
|
||||
</AiCadToolbarGroup>
|
||||
|
||||
<AiCadToolbarGroup className="lg:ml-auto" label="Session">
|
||||
<Badge className="rounded-md border-[#ddd7ca] bg-white px-2 py-0.5 text-[#5f594d] text-[11px]">
|
||||
<Badge className="rounded-md border-[#ddd7ca] bg-white px-1.5 py-0.5 text-[#5f594d] text-[10px]">
|
||||
{generationProvider === "kittycad-cad"
|
||||
? "Zoo CAD"
|
||||
: "Tripo3D"}
|
||||
</Badge>
|
||||
<Badge className="rounded-md border-[#ddd7ca] bg-white px-2 py-0.5 text-[#5f594d] text-[11px]">
|
||||
<Badge className="rounded-md border-[#ddd7ca] bg-white px-1.5 py-0.5 text-[#5f594d] text-[10px]">
|
||||
{viewerSettings.envPreset}
|
||||
</Badge>
|
||||
{activeVersion ? (
|
||||
<Badge className="rounded-md border-[#ddd7ca] bg-white px-2 py-0.5 text-[#5f594d] text-[11px]">
|
||||
<Badge className="rounded-md border-[#ddd7ca] bg-white px-1.5 py-0.5 text-[#5f594d] text-[10px]">
|
||||
V{activeVersion.versionNumber}
|
||||
</Badge>
|
||||
) : null}
|
||||
@ -3833,7 +3833,7 @@ export function AiCadWorkbench() {
|
||||
<div className="min-h-0 flex-1 overflow-hidden bg-white">
|
||||
<PanelGroup
|
||||
autoSaveId={`ai-cad-panel-layout:${panelDirection}`}
|
||||
className="flex h-full min-h-[720px]"
|
||||
className="flex h-full min-h-0"
|
||||
direction={panelDirection}
|
||||
>
|
||||
<Panel
|
||||
@ -4889,22 +4889,28 @@ export function AiCadWorkbench() {
|
||||
<div className="flex h-full min-h-0 flex-col bg-white text-[#201c16]">
|
||||
<div
|
||||
className={cn(
|
||||
"flex items-center justify-between border-[#e6e0d3] border-b px-4 py-3",
|
||||
!activeVersion && "min-h-12"
|
||||
"flex min-h-10 items-center justify-between border-[#e6e0d3] border-b px-4 py-2",
|
||||
!activeVersion && "min-h-10"
|
||||
)}
|
||||
>
|
||||
<div className="flex items-start justify-between gap-4">
|
||||
<div>
|
||||
<div className="flex items-center gap-2 font-medium text-[15px]">
|
||||
<Orbit className="h-4 w-4 text-[#6f695d]" />
|
||||
{activeVersion ? "建模画布" : "Canvas"}
|
||||
</div>
|
||||
<div className="mt-1 text-[#7f7768] text-[12px]">
|
||||
{activeVersion
|
||||
? "Preview-first canvas for the active model."
|
||||
: "The center canvas stays focused on the current model."}
|
||||
</div>
|
||||
<div className="flex min-w-0 items-center gap-2">
|
||||
<Orbit className="h-4 w-4 text-[#6f695d]" />
|
||||
<div className="font-medium text-[15px]">
|
||||
{activeVersion ? "建模画布" : "Canvas"}
|
||||
</div>
|
||||
{activeVersion ? null : (
|
||||
<div className="truncate text-[#8b8375] text-[12px]">
|
||||
The center canvas stays focused on the current
|
||||
model.
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
<div className="flex items-center gap-2">
|
||||
{activeVersion ? (
|
||||
<div className="text-[#8b8375] text-[11px]">
|
||||
Preview-first canvas
|
||||
</div>
|
||||
) : null}
|
||||
{activeVersion ? (
|
||||
<Badge className="rounded-md border-[#ddd7ca] bg-white text-[#5f594d]">
|
||||
V{activeVersion.versionNumber}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user