diff --git a/src/bytedesk-integration/config/bytedesk.config.js b/src/bytedesk-integration/config/bytedesk.config.js index a5676304..9d12247e 100644 --- a/src/bytedesk-integration/config/bytedesk.config.js +++ b/src/bytedesk-integration/config/bytedesk.config.js @@ -35,6 +35,13 @@ export const bytedeskConfig = { subtitle: '点击咨询', // 副标题 }, + // 按钮大小配置 + buttonConfig: { + show: true, + width: 40, + height: 40, + }, + // 主题配置 theme: { mode: 'system', // light | dark | system diff --git a/src/components/PerformancePanel.tsx b/src/components/PerformancePanel.tsx index c286c9af..b63a67a3 100644 --- a/src/components/PerformancePanel.tsx +++ b/src/components/PerformancePanel.tsx @@ -100,7 +100,7 @@ export const PerformancePanel: React.FC = () => { aria-label="Open performance panel" icon={} position="fixed" - bottom="20px" + bottom="100px" right="20px" colorScheme="blue" size="lg" diff --git a/src/styles/bytedesk-override.css b/src/styles/bytedesk-override.css index 2e705635..884a6651 100644 --- a/src/styles/bytedesk-override.css +++ b/src/styles/bytedesk-override.css @@ -23,6 +23,10 @@ iframe[src*="/chat/"], iframe[src*="/visitor/"] { position: fixed !important; z-index: 999999 !important; + max-height: 80vh !important; /* 限制最大高度为视口的80% */ + max-width: 40vh !important; /* 限制最大高度为视口的80% */ + bottom: 10px !important; /* 确保底部有足够空间 */ + right: 10px !important; /* 右侧边距 */ } /* Bytedesk 覆盖层(如果存在) */ @@ -37,16 +41,6 @@ iframe[src*="/visitor/"] { z-index: 1000000 !important; } -/* ========== H5 端客服组件整体缩小 ========== */ -@media (max-width: 768px) { - /* 整个客服容器缩小(包括按钮和提示框) */ - [class*="bytedesk"], - [id*="bytedesk"], - [class*="BytedeskWeb"] { - transform: scale(0.7) !important; - transform-origin: bottom right !important; - } -} /* ========== 提示框 3 秒后自动消失 ========== */ /* 提示框("在线客服 点击咨询"气泡)- 扩展选择器 */