teedoc 主题插件

    teedoc-plugin-theme-default: 默认主题插件

    插件配置

    site_config.json中配置插件

        "plugins": {
            "teedoc-plugin-theme-default":{
                "from": "pypi",
                "config": {
                    "dark": true,
                    "env":{
                        "main_color": "#4caf7d",
                        "sidebar_width": "300px"
                    },
                    "css": "/static/css/custom.css",
                    "js": "/static/js/custom.js",
                    "code_highlight_css":  "/static/css/prism.css",
                    "code_highlight_js": "/static/js/prism.js"
                }
            }
        }
    
    • main_color: 主题主颜色
    • sidebar_width: 侧边目录栏默认宽度, 可以是"300px", 300, "30%" 这样的格式
    • css: css文件 URL,可以覆盖默认的样式,会被插入到页面的head标签中
    • jsjs文件 URL,可以写js程序,会被放在页面的末尾加载

    默认代码高亮使用了prismjs, 默认勾选了部分常用语言的支持,js文件 + css文件共100KiB左右,如果你需要的代码无法高亮,或者想节约流量或缩减加载时间,可以到这里查看默认勾选的以及勾选自己需要的语言和功能, 最后获得一个css文件和一个js文件放到static/js/目录下,然后需要在 site_config.json 中设置URL比如:

        "route": {
            "assets": {
                "/static/": "static"
            }
        }
    

    这会将static目录下所有文件拷贝到输出文件夹static目录下面

    • code_highlight_css: code高亮css文件 URL,会取代默认的高亮css文件,会被插入到页面的head标签中
    • code_highlight_jscode高亮js文件 URL,会取代默认的高亮js文件,会被放在页面的末尾加载

    支持 白天夜间 模式, 夜间模式会在body加一个dark类, 如果要该夜间模式的css样式,可以基于这个类名修改

    class 支持

    主题支持几个常用的classid, 可以在config.json(/config.yaml) 或者或者.md文件的classid关键字中设置,就可以直接使用这个样式了

    比如在config.json中设置

    {
        "class": "language_zh",
        "navbar": {
            ...
        }
    }
    

    则这个文档下面所有生成的页面的html标签都会包含这个类, 比如language_zh会让右边页面目录的标题从罗马数字变成中文一、二、三...

    class有:

    • language_zh: 会让右边页面目录的标题从罗马数字变成中文一、二、三...
    • md_page: 普通 markdown 文件渲染成 html 页面,可以加上这个类,会居中显示而不是左对齐