wooo/awoooi
1
1
Fork 0
Code Issues 2 Pull Requests 1 Actions 3 Packages Projects Releases Wiki Activity

fix(ui): sidebar font sizes to standard + remove dead NemoClaw SVG from openclaw-panel
All checks were successful
CD Pipeline / build-and-deploy (push) Successful in 6m47s
Details
E2E Health Check / e2e-health (push) Successful in 17s
Details

Browse Source
This commit is contained in:
OG T
2026-04-01 21:24:52 +08:00
parent 5dd28b2fc6
commit 0ae210a433
2 changed files with 4 additions and 232 deletions
Download Patch File Download Diff File Expand all files Collapse all files

228
apps/web/src/components/ai/openclaw-panel.tsx
View File

@@ -49,234 +49,6 @@ const STATUS_MESSAGES: Record<OpenClawStatus, string> = {
complete: '[SYS] Analysis complete',
}
// =============================================================================
// NemoClaw 3D Ceramic SVG Component (Lab-White Style)
// =============================================================================
function NemoClaw({ isActive, isPulsing }: { isActive: boolean; isPulsing: boolean }) {
return (
<svg
viewBox="0 0 140 140"
className="w-full h-full drop-shadow-lg"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<defs>
{/* 3D Ceramic gradient - white/cream tones */}
<linearGradient id="ceramic3d" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stopColor="#FFFFFF" />
<stop offset="40%" stopColor="#F8F8F8" />
<stop offset="70%" stopColor="#E8E8E8" />
<stop offset="100%" stopColor="#D8D8D8" />
</linearGradient>
{/* Core glow filter - stronger */}
<filter id="coreGlow" x="-100%" y="-100%" width="300%" height="300%">
<feGaussianBlur stdDeviation="6" result="blur" />
<feComposite in="SourceGraphic" in2="blur" operator="over" />
</filter>
{/* Pulse glow animation filter */}
<filter id="pulseGlow" x="-100%" y="-100%" width="300%" height="300%">
<feGaussianBlur stdDeviation="8" result="blur">
<animate attributeName="stdDeviation" values="6;10;6" dur="1.5s" repeatCount="indefinite" />
</feGaussianBlur>
<feComposite in="SourceGraphic" in2="blur" operator="over" />
</filter>
{/* Shadow for 3D effect */}
<filter id="shadow3d" x="-20%" y="-20%" width="140%" height="140%">
<feDropShadow dx="2" dy="4" stdDeviation="3" floodOpacity="0.15" />
</filter>
</defs>
{/* Base shadow */}
<ellipse cx="70" cy="125" rx="35" ry="8" fill="rgba(0,0,0,0.08)" />
{/* Main body - 3D ceramic sphere */}
<circle
cx="70"
cy="70"
r="32"
fill="url(#ceramic3d)"
filter="url(#shadow3d)"
stroke="#E0E0E0"
strokeWidth="1"
/>
{/* Inner ring - depth effect */}
<circle
cx="70"
cy="70"
r="26"
fill="none"
stroke="#D0D0D0"
strokeWidth="1"
opacity="0.5"
/>
{/* Core LED - Blue pulsing (the eye) */}
<circle
cx="70"
cy="70"
r="16"
fill={isActive ? '#4A90D9' : '#B0B0B0'}
filter={isPulsing ? 'url(#pulseGlow)' : 'url(#coreGlow)'}
className="transition-all duration-500"
>
{isPulsing && (
<animate
attributeName="r"
values="14;17;14"
dur="1s"
repeatCount="indefinite"
/>
)}
</circle>
{/* Core highlight */}
<circle
cx="70"
cy="70"
r="8"
fill="white"
opacity={isActive ? 0.9 : 0.4}
className="transition-opacity duration-300"
/>
{/* Claw arms - ceramic white 3D style */}
{/* Top arm */}
<g filter="url(#shadow3d)">
<path
d="M 70 38 L 70 18 L 58 6 M 70 18 L 82 6"
stroke="url(#ceramic3d)"
strokeWidth="6"
strokeLinecap="round"
strokeLinejoin="round"
fill="none"
/>
<path
d="M 70 38 L 70 18 L 58 6 M 70 18 L 82 6"
stroke={isActive ? '#4A90D9' : '#C0C0C0'}
strokeWidth="3"
strokeLinecap="round"
strokeLinejoin="round"
fill="none"
opacity="0.6"
/>
{/* Claw tips */}
<circle cx="58" cy="6" r="4" fill="url(#ceramic3d)" stroke={isActive ? '#4A90D9' : '#D0D0D0'} strokeWidth="1.5" />
<circle cx="82" cy="6" r="4" fill="url(#ceramic3d)" stroke={isActive ? '#4A90D9' : '#D0D0D0'} strokeWidth="1.5" />
</g>
{/* Left arm */}
<g filter="url(#shadow3d)">
<path
d="M 38 70 L 18 70 L 6 58 M 18 70 L 6 82"
stroke="url(#ceramic3d)"
strokeWidth="6"
strokeLinecap="round"
strokeLinejoin="round"
fill="none"
/>
<path
d="M 38 70 L 18 70 L 6 58 M 18 70 L 6 82"
stroke={isActive ? '#4A90D9' : '#C0C0C0'}
strokeWidth="3"
strokeLinecap="round"
strokeLinejoin="round"
fill="none"
opacity="0.6"
/>
<circle cx="6" cy="58" r="4" fill="url(#ceramic3d)" stroke={isActive ? '#4A90D9' : '#D0D0D0'} strokeWidth="1.5" />
<circle cx="6" cy="82" r="4" fill="url(#ceramic3d)" stroke={isActive ? '#4A90D9' : '#D0D0D0'} strokeWidth="1.5" />
</g>
{/* Right arm */}
<g filter="url(#shadow3d)">
<path
d="M 102 70 L 122 70 L 134 58 M 122 70 L 134 82"
stroke="url(#ceramic3d)"
strokeWidth="6"
strokeLinecap="round"
strokeLinejoin="round"
fill="none"
/>
<path
d="M 102 70 L 122 70 L 134 58 M 122 70 L 134 82"
stroke={isActive ? '#4A90D9' : '#C0C0C0'}
strokeWidth="3"
strokeLinecap="round"
strokeLinejoin="round"
fill="none"
opacity="0.6"
/>
<circle cx="134" cy="58" r="4" fill="url(#ceramic3d)" stroke={isActive ? '#4A90D9' : '#D0D0D0'} strokeWidth="1.5" />
<circle cx="134" cy="82" r="4" fill="url(#ceramic3d)" stroke={isActive ? '#4A90D9' : '#D0D0D0'} strokeWidth="1.5" />
</g>
{/* Bottom left arm */}
<g filter="url(#shadow3d)">
<path
d="M 48 92 L 28 112 L 16 116"
stroke="url(#ceramic3d)"
strokeWidth="6"
strokeLinecap="round"
strokeLinejoin="round"
fill="none"
/>
<path
d="M 48 92 L 28 112 L 16 116"
stroke={isActive ? '#4A90D9' : '#C0C0C0'}
strokeWidth="3"
strokeLinecap="round"
strokeLinejoin="round"
fill="none"
opacity="0.6"
/>
<circle cx="16" cy="116" r="4" fill="url(#ceramic3d)" stroke={isActive ? '#4A90D9' : '#D0D0D0'} strokeWidth="1.5" />
</g>
{/* Bottom right arm */}
<g filter="url(#shadow3d)">
<path
d="M 92 92 L 112 112 L 124 116"
stroke="url(#ceramic3d)"
strokeWidth="6"
strokeLinecap="round"
strokeLinejoin="round"
fill="none"
/>
<path
d="M 92 92 L 112 112 L 124 116"
stroke={isActive ? '#4A90D9' : '#C0C0C0'}
strokeWidth="3"
strokeLinecap="round"
strokeLinejoin="round"
fill="none"
opacity="0.6"
/>
<circle cx="124" cy="116" r="4" fill="url(#ceramic3d)" stroke={isActive ? '#4A90D9' : '#D0D0D0'} strokeWidth="1.5" />
</g>
{/* Orbit ring when active */}
{isActive && (
<circle
cx="70"
cy="70"
r="42"
fill="none"
stroke="#4A90D9"
strokeWidth="1"
strokeDasharray="6 6"
opacity="0.4"
className="animate-spin"
style={{ animationDuration: '8s', transformOrigin: '70px 70px' }}
/>
)}
</svg>
)
}
// =============================================================================
// Typewriter Hook

8
apps/web/src/components/layout/sidebar.tsx
View File

@@ -193,7 +193,7 @@ export function Sidebar({
{/* 分區標題（collapsed 時隱藏）*/}
{!collapsed && (
<div style={{
fontSize: 8,
fontSize: 11,
color: '#b0ad9f',
letterSpacing: '1.5px',
textTransform: 'uppercase' as const,
@@ -216,7 +216,7 @@ export function Sidebar({
gap: collapsed ? 0 : 8,
justifyContent: collapsed ? 'center' : 'flex-start',
padding: collapsed ? '8px 0' : '6px 12px',
fontSize: 11,
fontSize: 13,
color: active ? '#141413' : '#87867f',
fontWeight: active ? 600 : 400,
borderRight: active ? '2px solid #d97757' : '2px solid transparent',
@@ -231,7 +231,7 @@ export function Sidebar({
{item.badge && count > 0 && (
<span style={{
marginLeft: 'auto',
fontSize: 8,
fontSize: 11,
background: '#d97757',
color: 'white',
borderRadius: 10,
@@ -263,7 +263,7 @@ export function Sidebar({
gap: collapsed ? 0 : 8,
justifyContent: collapsed ? 'center' : 'flex-start',
padding: collapsed ? '7px 0' : '5px 12px',
fontSize: 10,
fontSize: 12,
color: active ? '#141413' : '#87867f',
fontWeight: active ? 600 : 400,
borderRight: active ? '2px solid #d97757' : '2px solid transparent',