{"id":13783399,"url":"https://github.com/UNICKCHENG/logseq-developer-theme","last_synced_at":"2025-05-11T19:30:43.326Z","repository":{"id":63603446,"uuid":"569064048","full_name":"UNICKCHENG/logseq-developer-theme","owner":"UNICKCHENG","description":"A more developer-friendly minimalist theme. For more theme styles see: https://github.com/logseq/awesome-logseq","archived":false,"fork":false,"pushed_at":"2024-07-14T19:30:14.000Z","size":4294,"stargazers_count":43,"open_issues_count":8,"forks_count":3,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-04-13T15:45:53.607Z","etag":null,"topics":["logseq","logseq-themes","scss"],"latest_commit_sha":null,"homepage":"https://docs.unickcheng.cc/#/page/logseq-developer-theme","language":"SCSS","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/UNICKCHENG.png","metadata":{"files":{"readme":"readme-zh.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2022-11-22T02:02:15.000Z","updated_at":"2025-04-06T09:35:33.000Z","dependencies_parsed_at":"2025-04-13T15:51:26.034Z","dependency_job_id":null,"html_url":"https://github.com/UNICKCHENG/logseq-developer-theme","commit_stats":null,"previous_names":[],"tags_count":34,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/UNICKCHENG%2Flogseq-developer-theme","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/UNICKCHENG%2Flogseq-developer-theme/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/UNICKCHENG%2Flogseq-developer-theme/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/UNICKCHENG%2Flogseq-developer-theme/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/UNICKCHENG","download_url":"https://codeload.github.com/UNICKCHENG/logseq-developer-theme/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":253620941,"owners_count":21937445,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["logseq","logseq-themes","scss"],"created_at":"2024-08-03T19:00:20.547Z","updated_at":"2025-05-11T19:30:42.768Z","avatar_url":"https://github.com/UNICKCHENG.png","language":"SCSS","readme":"# logseq-developer-theme\n\n## 更新于 2023-05-31\n有不少用户反映 bullet 线条错乱，此处提供一个解决方案，即在 `logseq/custom.css` 中配置下述代码。更多细节可参考 [logseq-dev-theme#95](https://github.com/pengx17/logseq-dev-theme/issues/95)。\n\n```css\n.ls-block[haschild] \u003e div \u003e .block-content-wrapper::before {\n    /* 请尝试调整 left 的变量值，如 -21px */\n    left: -21px;\n}\n\n.ls-block \u003e div \u003e div.items-center::before {\n    /* 请尝试调整 right 的变量值，如 10px */\n    right: 10px !important;\n}\n```\n\n![](assets/bullet_line.png)\n\n---\n\n[logseq-developer-theme](https://github.com/UNICKCHENG/logseq-developer-theme)  是将 [logseq-dev-theme](https://github.com/pengx17/logseq-dev-theme) 主题作为上游的二次开发，您可以在 [main.scss](scss/main.scss) 看到 `@import` 引用信息。如果您想知道二者的区别，可以通过各自的网站清楚地比较 [logseq-dev-theme](https://pengx17.github.io/knowledge-garden/)  和 [logseq-developer-theme](https://docs.unickcheng.cc) [^1] [^2]，同时这个项目也在 [这篇文章](https://docs.unickcheng.cc/#/page/logseq-developer-theme)下进行跟进。\n\n**logseq-developer-theme 并不会成为 logseq-dev-theme 2.0**，仅仅因为 logseq-dev-theme 让我更关注于开发期望的 css 样式，因此这个项目不是一个 fork，而是通过 `@import` 来引用它。\n\n声明下，我并没有前端的开发经验，但是最好的学习方法应该从一个项目开始。尽管 [scss](https://sass-lang.com/documentation/syntax) 并不是很复杂，可我写的代码确实很差劲。所以我将持续优化代码，您也可以在 [issues](https://github.com/UNICKCHENG/logseq-developer-theme/issues) 中提醒我，或者参与进来。\n\n## ✨Features\n\n- [X] 代码块样式增强，尤其颜色\n- [X] 支持部分标签高亮显示，如 `#docs`、`#bug`、`#feat` 等\n- [X] 适配中文字体样式\n- [X] 支持用户自定义主题颜色\n- [X] 支持在插件市场下载 [#297](https://github.com/logseq/marketplace/pull/297)\n- [X] 支持离线模式下使用\n- [X] 支持自定义 pdf 页面相关颜色\n\n## 🎉使用方法\n\n### 快速开始\n\n您可以借助  jsDelivr CDN 来快速在您的 `custom.css` 中配置\n\n```css\n@import url(\"https://cdn.jsdelivr.net/gh/unickcheng/logseq-developer-theme@release/custom.css\");\n```\n⚠️ 请注意，虽然  jsDelivr CDN 比使用 GitHub 自带的方式更快速，但是它无法做到实时更新到最新版本 [^3]。\n\n###  从插件市场下载（推荐）\n\n![](assets/Pasted%20image%2020221216222925.png)\n\n如果您无法从插件市场下载，可以在 [GitHub Release](https://github.com/UNICKCHENG/logseq-developer-theme/releases) 进行下载，解压后再导入到 logseq\n\n![](assets/Pasted%20image%2020221216223400.png)\n\n![](assets/Pasted%20image%2020221216223545.png)\n\n 📌 从 1.0.0 版本开始，GitHub Release 或者 Plugin Marketplace 下载，支持离线使用。因为会一起将字体等依赖下载到本地 `~/.logseq/plugins` 目录下。\n\n## 效果图 (可能已过时)\n\n![](assets/Pasted%20image%2020221210174733.png)\n\n![](assets/Pasted%20image%2020221210174750.png)\n\n![](assets/Pasted%20image%2020221216232448.png)\n\n### 修改主题样式\n\n从 0.4.0 版本开始，您也可以自定义主题颜色 😎\n\n```css\n@import url(\"https://cdn.jsdelivr.net/gh/unickcheng/logseq-developer-theme@release/custom.css\");\n\n.dark-theme,\nhtml[data-theme=dark] {\n    --ls-custom-theme-color: #6096BA;\n    --ls-primary-background-color: #272C35;\n    --ls-secondary-background-color: #313942;\n\n    --ls-code-color: #fff;\n    --ls-code-language-color: gray;\n    --ls-code-background-color: #34343c;\n    --ls-code-selected-background-color: #32445A;\n\n    --ls-bullet-threading-background-color: #34343c;\n    --ls-task-done-text-color: gray;\n}\n```\n\n![](assets/Pasted%20image%2020221216231143.png)\n\n```css\n@import url(\"https://cdn.jsdelivr.net/gh/unickcheng/logseq-developer-theme@release/custom.css\");\n.white-theme,\nhtml[data-theme=light] {\n    --ls-custom-theme-color: rgb(224, 80, 27);\n    --ls-primary-background-color: #ffC017;\n    --ls-secondary-background-color: #ffcf4d;\n\n    --ls-code-color: gray;\n    --ls-code-language-color: gray;\n    --ls-code-background-color: #fff;\n    --ls-code-selected-background-color: #C0E6FD;\n\n    --ls-bullet-threading-background-color: #ffcf4d;\n    --ls-task-done-text-color: gray;\n}\n```\n![](assets/Pasted%20image%2020221216231911.png)\n\n\u003e 更多自定义颜色样式见  [custom-color](custom-color.md)\n\n### 标签的加强\n\n![](assets/Pasted%20image%2020230117145915.png)\n\n考虑到可能会对您原先的文本产生影响，以及多个标签影响内容的阅读性等因素，目前只设置了上图中几个标签的加强。如果您有需要，可以在 `custom.css` 中进行设置，可参考 [#4](https://github.com/UNICKCHENG/logseq-developer-theme/issues/4)\n\n## 🚀 本地开发\n\n**第一步，验证本地环境**\n```bash\nnode -v\nnpm -v\ngit -v\n```\n\n**第二步，安装依赖**\n```bash\n# \u003e step 1 下载源码\ngit clone https://github.com/UNICKCHENG/logseq-developer-theme.git\ncd logseq-developer-theme\n# \u003e step 2 安装依赖\nnpm install\n```\n\n**第三步，修改 `package.json` 中的配置**\n- 请将 `localPath` 变量值修改为您的文件路径\n```\n{\n\t...\n    \"config\": {\n        \"localPath\": \"C:\\\\Users\\\\hi\\\\LocalStation\\\\BLOG\\\\docs\"\n    },\n\t...\n}\n```\n⚠️ 这里的目的是直接将 SCSS 编译后输出到 `../logseq/custom.css`\n\n**第四步，运行**\n```bash\n# 如果您是 windows 用户\nnpm run dev:win\n\n# 如果您是 Mac 或者 Linux 用户\nnpm run dev\n```\n\n\n## ✍️日志\n\n您可以在 [logseq-developer-theme](https://docs.unickcheng.cc/#/page/logseq-developer-theme) 查看相关信息\n\n\n## 💖 感谢\n\n- [logseq team](https://github.com/logseq/logseq)\n- [pengx17/logseq-dev-theme](https://github.com/pengx17/logseq-dev-theme)\n- [flowerornament/logseq-simple-parametric-theme](https://github.com/flowerornament/logseq-simple-parametric-theme) 代码块模块样式\n- [ryanoasis/nerd-fonts](https://github.com/ryanoasis/nerd-fonts) 关于 DejaVuSansMono 字体支持\n- [lxgw/LxgwWenKai-Lite](https://github.com/lxgw/LxgwWenKai-Lite) 关于  LXGWWenKaiLite-Regular 字体支持\n- [awesome-logseq](https://github.com/logseq/awesome-logseq) 提供了一份 Logseq 主题清单\n- [RemNote](https://github.com/orgs/remnoteio/repositories) 默认主题样式\n- 感谢所有开源项目分享的想法和技术\n\n\n[^1]: https://pengx17.github.io/knowledge-garden/\n[^2]: https://docs.unickcheng.cc\n[^3]: https://blog.juanertu.com/archives/cbcd1946","funding_links":[],"categories":["🎨 CSS Themes","SCSS"],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FUNICKCHENG%2Flogseq-developer-theme","html_url":"https://awesome.ecosyste.ms/projects/github.com%2FUNICKCHENG%2Flogseq-developer-theme","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FUNICKCHENG%2Flogseq-developer-theme/lists"}