diff --git a/posimai-dev/index.html b/posimai-dev/index.html index 90c86e5a..a9a47f8c 100644 --- a/posimai-dev/index.html +++ b/posimai-dev/index.html @@ -74,23 +74,38 @@ } .status-badge.disconnected { background: rgba(239,68,68,0.12); color: #F87171; } - /* セッションバッジ(チャットバー内) */ - .session-badge { - font-size: 10px; font-weight: 400; color: rgba(255,255,255,0.25); - font-family: monospace; display: none; white-space: nowrap; - overflow: hidden; text-overflow: ellipsis; max-width: 180px; - } - .session-badge.visible { display: block; } - /* Claude開始ボタン — アイコンのみ */ .claude-btn { - width: 32px; height: 32px; border-radius: 8px; border: none; cursor: pointer; + width: 36px; height: 36px; border-radius: 8px; border: none; cursor: pointer; background: var(--accent-dim); color: var(--accent); display: flex; align-items: center; justify-content: center; flex-shrink: 0; transition: background 0.15s; } .claude-btn:hover { background: rgba(167,139,250,0.25); } + /* マイクボタン */ + .mic-btn { + width: 38px; height: 38px; border-radius: 10px; border: none; + background: rgba(255,255,255,0.05); color: rgba(255,255,255,0.35); cursor: pointer; + display: none; align-items: center; justify-content: center; + flex-shrink: 0; transition: background 0.15s, color 0.15s; + } + .mic-btn.available { display: flex; } + .mic-btn:hover { background: rgba(255,255,255,0.1); color: #F3F4F6; } + .mic-btn.listening { + background: rgba(239,68,68,0.15); color: #F87171; + animation: mic-pulse 1s ease-in-out infinite; + } + @keyframes mic-pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.55; } } + + /* 設定パネル内セッション表示 */ + .session-info-row { + display: flex; align-items: center; gap: 8px; margin-top: 8px; + font-size: 11px; color: rgba(255,255,255,0.35); font-family: monospace; + background: rgba(255,255,255,0.04); border-radius: 8px; padding: 8px 10px; + } + .session-info-row.hidden { display: none; } + /* ── Terminal ── */ #terminal-container { flex: 1; @@ -98,8 +113,8 @@ padding: 12px 12px 0; min-height: 0; background: - radial-gradient(ellipse at 15% 60%, rgba(34,211,238,0.07) 0%, transparent 55%), - radial-gradient(ellipse at 85% 25%, rgba(167,139,250,0.07) 0%, transparent 55%), + radial-gradient(ellipse at 15% 60%, rgba(34,211,238,0.14) 0%, transparent 55%), + radial-gradient(ellipse at 85% 25%, rgba(167,139,250,0.14) 0%, transparent 55%), var(--dev-bg); } #terminal-container .xterm { height: 100%; } @@ -173,7 +188,11 @@
セッション
- + + 過去のセッションを見る @@ -190,7 +209,7 @@
@@ -220,12 +240,14 @@