/* assets/style.css */ /* 全局字体 */ body { font-family: "微软雅黑", "Microsoft YaHei", sans-serif; background-color: #f0f4f8; } /* 标题栏 */ .app-header { background-color: #2E8B57; /* SeaGreen */ color: white; } /* 卡片通用样式 */ .func-card { width: 100%; padding: 1rem; box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05); background-color: white; border-radius: 0.5rem; } /* 核心功能区顶部边框 */ .card-core { border-top: 4px solid #16a34a; /* green-600 */ } /* 数据管理区顶部边框 */ .card-data { border-top: 4px solid #3b82f6; /* blue-500 */ } /* 系统操作区顶部边框 */ .card-system { border-top: 4px solid #ef4444; /* red-500 */ } .card-logging { border-top: 4px solid #9c1be0; } /* 标题文字 */ .section-title { font-size: 1.125rem; font-weight: 700; margin-bottom: 0.5rem; } /* 绿色标题 */ .text-green { color: #166534; } /* 蓝色标题 */ .text-blue { color: #1e40af; } /* 红色标题 */ .text-red { color: #991b1b; } /* assets/style.css */ /* ... (原有的样式) ... */ /* ---------------------------------- */ /* 滚动条隐藏样式 */ /* ---------------------------------- */ /* * 1. 隐藏 Webkit 内核浏览器 (Chrome, Safari, Edge) 的滚动条 * 适用于 NiceGUI 默认的 Chromium 浏览器 */ .hide-scrollbar::-webkit-scrollbar { /* 完全隐藏滚动条 */ width: 0px; background: transparent; /* 使滚动条轨道透明 */ } /* 2. 隐藏 Firefox 浏览器的滚动条 */ .hide-scrollbar { /* 设置滚动条宽度为 thin (细),比 auto (默认) 要窄 */ scrollbar-width: none; /* 'none' 是最新且更彻底的隐藏方式 */ /* 确保容器内容溢出时可以滚动 */ overflow: auto; } /* 示例:如果你只想隐藏日志区的滚动条 */ .card-logging .q-expansion-item__content .nicegui-log .q-scrollarea__content { /* 如果 nicegui-log 内部使用了 q-scrollarea,可能需要针对其内容应用样式 */ scrollbar-width: none; } /* ---------------------------------- */ /* 滚动条美化(可选 - 不隐藏,但变细变淡) */ /* 如果完全隐藏不好,可以试试这个更温和的方案 */ /* ---------------------------------- */ .thin-scrollbar::-webkit-scrollbar { width: 6px; /* 调整宽度 */ height: 6px; /* 调整高度 */ } .thin-scrollbar::-webkit-scrollbar-thumb { background-color: #a0a0a0; /* 拇指颜色 */ border-radius: 3px; border: 1px solid #f0f4f8; /* 边框颜色 */ } .thin-scrollbar::-webkit-scrollbar-track { background: transparent; } .thin-scrollbar { scrollbar-width: thin; /* Firefox 细滚动条 */ scrollbar-color: #a0a0a0 transparent; /* Firefox 颜色设置 */ } *::-webkit-scrollbar { /* 完全隐藏滚动条 */ width: 0px !important; height: 0px !important; background: transparent !important; } #nicegui-content, #q-app { /* 确保容器内容可以滚动,但滚动条被隐藏 */ overflow: auto; /* Firefox 隐藏滚动条 */ scrollbar-width: none; /* IE/Edge 隐藏滚动条 */ -ms-overflow-style: none; }