diff --git a/ui/src/ui/components/claw-computer-panel.ts b/ui/src/ui/components/claw-computer-panel.ts index c9ab8b83212..5e009a0bf5d 100644 --- a/ui/src/ui/components/claw-computer-panel.ts +++ b/ui/src/ui/components/claw-computer-panel.ts @@ -45,111 +45,44 @@ export class ClawComputerPanel extends LitElement { height: 100%; display: flex; flex-direction: column; - padding: 16px; - } - h2 { - text-align: center; - margin: 0 0 16px 0; - color: #ddd; - } - .controls { - background: #1a1a1a; - padding: 16px; - border-radius: 8px; - margin-bottom: 16px; - border: 1px solid #333; - } - label { - display: block; - margin-bottom: 6px; - font-weight: 500; - } - input { - width: 100%; - padding: 10px; - background: #222; - border: 1px solid #444; - color: #eee; - border-radius: 6px; - margin-bottom: 12px; - } - .btn-group { - display: flex; - gap: 8px; - margin: 12px 0; - flex-wrap: wrap; - } - button { - padding: 10px 16px; - background: #0066cc; - color: white; - border: none; - border-radius: 6px; - cursor: pointer; - font-weight: bold; - } - button:hover:not(:disabled) { - background: #007fff; - } - button:disabled { - opacity: 0.5; - cursor: not-allowed; - } - .active { - background: #0088ff !important; + position: relative; } .screen-container { flex: 1; - min-height: 400px; + width: 100%; + height: 100%; background: #000; - border: 2px solid #444; - border-radius: 8px; overflow: hidden; position: relative; + display: flex; + align-items: center; + justify-content: center; } .screen { width: 100%; height: 100%; } - .status { - margin-top: 8px; - text-align: center; - font-weight: bold; - min-height: 24px; + .status-overlay { + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + background: rgba(0, 0, 0, 0.7); + padding: 16px 24px; + border-radius: 8px; + color: #fff; + font-weight: 500; + pointer-events: none; + z-index: 10; } `; render() { return html`
- ${this.vncUrl}(已轉發到你的 10.75.171.0:25900) -
-