外观(Look)
设置主题的样式、颜色、站点标识、站点图标等。
样式 style
assets/scss/_variables_project.scss
可以覆盖主题原有的变量值(在assets/scss/_variables.scss
找到主题原有的变量值)和 Bootstrap 变量默认值。assets/scss/_styles_project.scss
可以添加自己的自定义 SCSS 样式的地方,包括覆盖 Docsy 主题 SCSS 文件中的任何样式。
颜色 color
在 assets/scss/_variables_project.scss
中设置:
站点标识 logo
将图片放在 assets/icons/logo.svg
会覆盖默认的站点标识。
通过配置 navbar_logo: false
也可以不显示站点标识。
站点图标 favicon
将图标放在 static/favicons/
中会覆盖默认的站点图标。
因为主题会在头文件中插入下面引用 themes/docsy/layouts/partials/favicons.html
1
2<!-- Favicons as generated by http://cthedot.de/icongen -->
3<link rel="shortcut icon" href="{{ "favicons/favicon.ico" | relURL }}" >
4<link rel="apple-touch-icon" href="{{ "favicons/apple-touch-icon-180x180.png" | relURL }}" sizes="180x180">
5<link rel="icon" type="image/png" href="{{ "favicons/favicon-16x16.png" | relURL }}" sizes="16x16">
6<link rel="icon" type="image/png" href="{{ "favicons/favicon-32x32.png" | relURL }}" sizes="32x32">
7<link rel="icon" type="image/png" href="{{ "favicons/android-36x36.png" | relURL }}" sizes="36x36">
8<link rel="icon" type="image/png" href="{{ "favicons/android-48x48.png" | relURL }}" sizes="48x48">
9<link rel="icon" type="image/png" href="{{ "favicons/android-72x72.png" | relURL }}" sizes="72x72">
10<link rel="icon" type="image/png" href="{{ "favicons/android-96x96.png" | relURL }}" sizes="96x96">
11<link rel="icon" type="image/png" href="{{ "favicons/android-144x144.png" | relURL }}" sizes="144x144">
12<link rel="icon" type="image/png" href="{{ "favicons/android-192x192.png" | relURL }}" sizes="192x192">
Tips: 通过 http://cthedot.de/icongen(允许您从单个图像创建各种图标大小和选项)或 https://favicon.io 可以快速创建一组网站图标。
图标样式 icon
https://fontawesome.com/icons?d=gallery&m=free
Last modified November 4, 2023: Correcting content dir (da1a055)