diff --git a/components/ai-chat-message/ai-chat-message.vue b/components/ai-chat-message/ai-chat-message.vue index 8fb053e..119b3a6 100644 --- a/components/ai-chat-message/ai-chat-message.vue +++ b/components/ai-chat-message/ai-chat-message.vue @@ -1627,12 +1627,20 @@ $radius-lg: 36rpx; text-align: right; .message-bubble { - background: linear-gradient(135deg, #8cb4ff 0%, #a0c4ff 100%); - color: white; - border-radius: $radius-md $radius-sm $radius-md $radius-md; - box-shadow: 0 4rpx 12rpx rgba(134, 117, 169, 0.2); - backdrop-filter: blur(2rpx); - + background: linear-gradient(135deg, #ffadd2, #f783ac) !important; /* 粉色渐变 */ + color: white !important; + border-radius: 16rpx 16rpx 4rpx 16rpx; /* 右对齐气泡尖角适配 */ + box-shadow: 0 8rpx 20rpx rgba(247, 131, 172, 0.3) !important; + border: none !important; + /* ✅ 关键:允许内容撑开高度 */ + min-height: auto; + height: auto; + padding: 24rpx 32rpx; /* 保留内边距 */ + display: inline-block; /* 让宽度也随内容收缩(可选) */ + max-width: 80%; /* 防止过宽 */ + word-break: break-word; + white-space: pre-wrap; /* 保留用户输入的换行符 */ + line-height: 1.6; &::before { content: ''; position: absolute; @@ -1668,9 +1676,19 @@ $radius-lg: 36rpx; .ai-message { .message-content { .message-bubble { - background: $bg-card; - border-radius: $radius-sm $radius-md $radius-md $radius-md; - + background: linear-gradient(135deg, #dbeafe, #bfdbfe) !important; /* 蓝色浅渐变 */ + color: #2c3e50 !important; + border-radius: 16rpx 16rpx 16rpx 4rpx; /* 左对齐气泡尖角适配 */ + box-shadow: 0 8rpx 20rpx rgba(191, 219, 254, 0.4) !important; + border: 1rpx solid #dbeafe !important; + min-height: auto; + height: auto; + padding: 24rpx 32rpx; + display: inline-block; + max-width: 80%; + word-break: break-word; + white-space: pre-wrap; + line-height: 1.6; &::before { content: ''; position: absolute;