yanxulong/AIEC-new
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

first commit

Browse Source
This commit is contained in:
闫旭隆
2025-10-17 09:31:28 +08:00
commit 4698145045
589 changed files with 196795 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

284
AIEC-server/css/zoom-support.css Normal file
View File

@ -0,0 +1,284 @@
/* ===== 页面缩放支持 ===== */
/* 基础缩放适配 */
html {
/* 使用视口单位确保缩放时正确响应 */
font-size: clamp(14px, 1vw, 18px);
}
/* 容器缩放响应 */
.container {
width: 100%;
max-width: min(1536px, 95vw);
margin: 0 auto;
padding-left: clamp(1rem, 2vw, 2rem);
padding-right: clamp(1rem, 2vw, 2rem);
}
/* 侧边栏缩放适配 */
.sidebar {
width: clamp(220px, 18vw, 280px);
font-size: clamp(0.875rem, 0.9vw, 1rem);
}
.sidebar.collapsed {
width: clamp(60px, 5vw, 80px);
}
/* 主内容区域缩放 */
.main-content {
margin-left: clamp(220px, 18vw, 280px);
padding: clamp(1rem, 2vw, 2rem);
}
.sidebar.collapsed + .main-content {
margin-left: clamp(60px, 5vw, 80px);
}
/* 文字大小缩放适配 */
h1 { font-size: clamp(1.5rem, 2.5vw, 2.5rem); }
h2 { font-size: clamp(1.25rem, 2vw, 2rem); }
h3 { font-size: clamp(1.125rem, 1.5vw, 1.5rem); }
h4 { font-size: clamp(1rem, 1.25vw, 1.25rem); }
p, .text-base { font-size: clamp(0.875rem, 1vw, 1.125rem); }
.text-sm { font-size: clamp(0.75rem, 0.875vw, 1rem); }
.text-xs { font-size: clamp(0.625rem, 0.75vw, 0.875rem); }
/* 输入框缩放适配 */
.input-area {
padding: clamp(1rem, 2vw, 2rem);
border-radius: clamp(16px, 1.5vw, 24px);
}
.input-area textarea {
font-size: clamp(14px, 1vw, 16px);
min-height: clamp(40px, 5vh, 60px);
max-height: clamp(120px, 15vh, 200px);
padding: clamp(0.5rem, 1vw, 1rem);
}
/* 按钮缩放适配 */
button, .btn {
padding: clamp(0.5rem, 0.75vw, 0.75rem) clamp(1rem, 1.5vw, 1.5rem);
font-size: clamp(0.75rem, 0.9vw, 1rem);
border-radius: clamp(0.375rem, 0.5vw, 0.5rem);
min-height: clamp(36px, 3.5vh, 48px);
}
.feature-btn {
padding: clamp(0.75rem, 1vw, 1rem) clamp(1rem, 1.5vw, 1.5rem);
font-size: clamp(0.75rem, 0.875vw, 0.875rem);
}
.feature-btn i {
font-size: clamp(1rem, 1.25vw, 1.5rem);
}
/* 聊天消息缩放 */
.chat-messages {
height: clamp(300px, 50vh, 600px);
padding: clamp(0.75rem, 1.5vw, 1.5rem);
}
.message-item {
margin-bottom: clamp(0.5rem, 1vw, 1rem);
}
.user-message,
.ai-message {
padding: clamp(0.625rem, 1vw, 1rem) clamp(0.875rem, 1.25vw, 1.25rem);
font-size: clamp(0.813rem, 0.95vw, 1rem);
border-radius: clamp(12px, 1vw, 18px);
max-width: min(600px, 70%);
}
/* 3D新闻卡片样式已移至image-size-fix.css处理 */
/* .ticker-* 相关样式已被image-size-fix.css覆盖 */
.news-content {
font-size: clamp(11px, 0.8vw, 14px);
}
/* 菜单项缩放 */
.menu-item {
padding: clamp(0.5rem, 0.75vw, 0.75rem) clamp(0.625rem, 1vw, 1rem);
font-size: clamp(0.75rem, 0.875vw, 0.875rem);
}
.menu-icon {
width: clamp(24px, 2vw, 30px);
height: clamp(24px, 2vw, 30px);
font-size: clamp(1.125rem, 1.5vw, 1.5rem);
}
/* 聊天历史项缩放 */
.chat-history-item {
padding: clamp(0.5rem, 0.75vw, 0.75rem) clamp(0.75rem, 1vw, 1rem);
}
.chat-title {
font-size: clamp(0.75rem, 0.875vw, 0.875rem);
}
/* 深度研究控制面板缩放 */
.deep-research-controls {
padding: clamp(0.75rem, 1vw, 1rem);
margin-top: clamp(0.5rem, 0.75vw, 0.75rem);
border-radius: clamp(0.5rem, 0.75vw, 0.75rem);
}
.toggle-switch {
width: clamp(40px, 3vw, 48px);
height: clamp(20px, 1.5vw, 24px);
}
.toggle-slider span {
width: clamp(16px, 1.2vw, 20px);
height: clamp(16px, 1.2vw, 20px);
}
/* 工具提示缩放 */
.tooltip-text {
font-size: clamp(11px, 0.8vw, 13px);
padding: clamp(4px, 0.5vw, 6px) clamp(8px, 1vw, 10px);
}
/* Markdown内容缩放 */
.markdown-content {
font-size: clamp(0.813rem, 0.95vw, 1rem);
line-height: clamp(1.4, 1.6vw, 1.8);
}
.markdown-content h1 { font-size: clamp(1.25rem, 1.75vw, 1.75rem); }
.markdown-content h2 { font-size: clamp(1.125rem, 1.5vw, 1.5rem); }
.markdown-content h3 { font-size: clamp(1rem, 1.25vw, 1.25rem); }
.markdown-content code {
font-size: clamp(0.75rem, 0.875vw, 0.875rem);
padding: clamp(0.125rem, 0.2vw, 0.25rem) clamp(0.25rem, 0.4vw, 0.5rem);
}
.markdown-content pre {
padding: clamp(0.75rem, 1vw, 1rem);
font-size: clamp(0.75rem, 0.875vw, 0.875rem);
}
/* 视口单位限制 - 防止过度缩放 */
@media (min-width: 1920px) {
html { font-size: 16px; }
}
@media (max-width: 1280px) {
html { font-size: 15px; }
}
@media (max-width: 1024px) {
html { font-size: 14px; }
}
/* 浏览器缩放级别适配 */
@media (min-resolution: 120dpi) {
/* 125% 缩放 */
.container { max-width: 1280px; }
}
@media (min-resolution: 144dpi) {
/* 150% 缩放 */
.container { max-width: 1024px; }
.sidebar { width: 240px; }
.main-content { margin-left: 240px; }
}
@media (min-resolution: 192dpi) {
/* 200% 缩放 */
.container { max-width: 768px; }
.sidebar { width: 220px; }
.main-content { margin-left: 220px; }
/* 调整间距 */
.message-item { margin-bottom: 0.75rem; }
.feature-btn { margin: 0.25rem; }
}
/* 页面缩放时保持比例 */
* {
/* 使用相对单位 */
line-height: inherit;
letter-spacing: inherit;
}
/* 图片和媒体缩放 */
img, video, iframe {
max-width: 100%;
height: auto;
}
/* 固定定位元素缩放 */
.fixed {
/* 使用视口单位定位 */
}
#chatModeInput {
padding: clamp(0.5rem, 1vw, 1rem);
}
/* 滚动条缩放 */
::-webkit-scrollbar {
width: clamp(4px, 0.5vw, 8px);
}
/* 动画时间缩放适配 */
@media (prefers-reduced-motion: no-preference) {
* {
animation-duration: inherit;
transition-duration: inherit;
}
}
/* 确保缩放时不出现水平滚动条 */
body {
overflow-x: hidden;
min-width: 320px;
}
/* 响应式网格缩放 */
.grid {
gap: clamp(0.5rem, 1vw, 1rem);
}
/* 阴影缩放 */
.shadow-sm { box-shadow: 0 clamp(1px, 0.1vw, 2px) clamp(2px, 0.2vw, 4px) rgba(0, 0, 0, 0.05); }
.shadow { box-shadow: 0 clamp(1px, 0.1vw, 2px) clamp(3px, 0.3vw, 6px) rgba(0, 0, 0, 0.1); }
.shadow-md { box-shadow: 0 clamp(4px, 0.4vw, 8px) clamp(6px, 0.6vw, 12px) rgba(0, 0, 0, 0.1); }
.shadow-lg { box-shadow: 0 clamp(10px, 1vw, 20px) clamp(15px, 1.5vw, 30px) rgba(0, 0, 0, 0.1); }
/* 边框缩放 */
.border { border-width: clamp(1px, 0.1vw, 2px); }
.border-2 { border-width: clamp(2px, 0.2vw, 3px); }
/* 圆角缩放 */
.rounded { border-radius: clamp(0.25rem, 0.4vw, 0.5rem); }
.rounded-md { border-radius: clamp(0.375rem, 0.5vw, 0.75rem); }
.rounded-lg { border-radius: clamp(0.5rem, 0.75vw, 1rem); }
.rounded-xl { border-radius: clamp(0.75rem, 1vw, 1.5rem); }
.rounded-2xl { border-radius: clamp(1rem, 1.5vw, 2rem); }
/* 确保最小可读性 */
@supports (font-size: clamp(1rem, 1vw, 2rem)) {
/* 现代浏览器使用 clamp */
}
@supports not (font-size: clamp(1rem, 1vw, 2rem)) {
/* 旧浏览器回退方案 */
html { font-size: 16px; }
@media (max-width: 1200px) {
html { font-size: 15px; }
}
@media (max-width: 768px) {
html { font-size: 14px; }
}
}