需创建custom-theme目录并配置三类css文件，修改背景色、代码块色和链接色以适配暗光与品牌色，通过webapplaf指向新路径并重启服务生效，再集成jquery ui自定义主题确保组件样式统一。
☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 多模态理解力帮你轻松跨越从0到1的创作门槛☜☜☜
你想让Grok的Web界面不再使用默认的灰蓝配色、单调字体和固定布局，而是按团队品牌色统一视觉、提升代码阅读舒适度、适配暗光环境——这需要直接干预其主题系统的核心配置层，而非仅靠浏览器插件或临时CSS注入。
创建自定义主题目录结构
进入OpenGrok部署根目录下的opengrok-web/src/main/webapp/路径，在该目录下新建文件夹custom-theme。
在custom-theme内依次创建css、img、font三个子目录；其中css必须包含style.css（主样式）、print.css（打印样式）、mandoc.css（文档渲染样式）三个文件，缺一不可，否则启动时会因资源加载失败导致页面白屏。
这一步操作起来很简单，直接把文件夹拖进去就行。
修改主样式文件并覆盖关键变量
复制opengrok-web/src/main/webapp/default/style-1.0.4.css到custom-theme/css/style.css，用文本编辑器打开。
搜索background-color和color声明，重点修改以下三组值：
- 全局背景：
body { background-color: #f8f9fa; }→ 改为#121212（深色模式基底） - 代码块高亮：
.source .line { background-color: #2d2d2d; }→ 改为#1e1e1e（避免与行号背景混淆） - 链接文字：
a { color: #4a90e2; }→ 改为#6a5acd（适配紫灰系品牌色）
【务必保留原有注释块和@media查询结构】，否则响应式断点失效会导致移动端布局错乱。
配置webappLAF参数启用新主题
第一步：找到OpenGrok配置文件configuration.xml或通过opengrok-indexer命令行参数传入。
第二步：定位<webapplaf></webapplaf>标签，将其内容由/default改为/custom-theme。
第三步：保存后重启OpenGrok服务，执行java -jar opengrok.jar -c /path/to/ctags -s /src -d /opengrok-data -W /path/to/configuration.xml重新索引并加载配置。
若未重启服务，新主题路径不会被PageConfig.getCssDir()方法识别，所有CSS引用仍指向/default/目录。
集成jQuery UI自定义主题
方法一：复用现有主题包
下载jQuery UI官方主题生成器导出的jquery-ui-1.12.1-custom.theme.min.css，放入custom-theme/css/目录，确保文件名完全一致。
方法二：手动注入变量
在custom-theme/css/style.css末尾添加如下覆盖规则：
.ui-widget-content { background: #1e1e1e !important; border-color: #333 !important; }
.ui-button { font-weight: 600 !important; text-transform: none !important; }
注意：jQuery UI组件的!important声明必须加在选择器末尾，否则会被default/jquery-ui-*.min.css中的同名规则覆盖。
