{"id":49561412,"url":"https://github.com/adogecheems/alist-beautification","last_synced_at":"2026-05-03T09:07:56.915Z","repository":{"id":295373036,"uuid":"985616252","full_name":"adogecheems/alist-beautification","owner":"adogecheems","description":"Alist/OpenList 动态美化方案 | Alist/OpenList Dynamic Beautification Solution","archived":false,"fork":false,"pushed_at":"2026-02-11T02:40:46.000Z","size":46,"stargazers_count":37,"open_issues_count":0,"forks_count":15,"subscribers_count":1,"default_branch":"main","last_synced_at":"2026-02-11T06:50:50.661Z","etag":null,"topics":["alist","beautifier","beautify","dynamic","openlist","oplist"],"latest_commit_sha":null,"homepage":"https://github.com/adogecheems/alist-beautification","language":"HTML","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"agpl-3.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/adogecheems.png","metadata":{"files":{"readme":"README.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,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2025-05-18T06:38:46.000Z","updated_at":"2026-02-11T02:40:49.000Z","dependencies_parsed_at":"2026-02-05T02:00:47.150Z","dependency_job_id":null,"html_url":"https://github.com/adogecheems/alist-beautification","commit_stats":null,"previous_names":["adogecheems/alist-beautification"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/adogecheems/alist-beautification","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/adogecheems%2Falist-beautification","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/adogecheems%2Falist-beautification/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/adogecheems%2Falist-beautification/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/adogecheems%2Falist-beautification/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/adogecheems","download_url":"https://codeload.github.com/adogecheems/alist-beautification/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/adogecheems%2Falist-beautification/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":32563564,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-03T06:36:36.687Z","status":"ssl_error","status_checked_at":"2026-05-03T06:36:09.306Z","response_time":103,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"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":["alist","beautifier","beautify","dynamic","openlist","oplist"],"created_at":"2026-05-03T09:07:54.582Z","updated_at":"2026-05-03T09:07:56.904Z","avatar_url":"https://github.com/adogecheems.png","language":"HTML","funding_links":[],"categories":[],"sub_categories":[],"readme":"# ALIST-BEAUTIFICATION\n\n这是一个alist/openlist美化代码存储库，但特别的是，它提供了一种与传统美化代码不同的、全新的实现原理。\n\n事实上，它并非是按照以往的做法，对alist/openlist的前端元素进行枚举修改，而是加载了一个动态的美化监视器，自动地对带有背景色的元素进行替换颜色，从而在alist/openlist前端功能更新时有更好的适应性。\n\n可以在[我的文章](https://blog.mmoe.work/alist-js-beautification/)查看相关介绍。\n\n## 组件\n\n- `head.html`: 自定义头部，不过事实上与这个项目的主体没有什么关系，是自定义字体一类的传统的美化代码。\n- `body.html`: 自定义内容，这个项目的核心，包含了动态美化监视器。\n- `src/beautifier.js`: 动态美化监视器的js代码， 是`body.html`的一部分。\n\n## 使用方法\n\n直接将`head.html`和`body.html`的内容复制到alist的自定义头部和自定义内容中即可（位于`/设置/全局`中）\n\n### 通过cdn引入\n\n 如果你只需要美化alist背景色，而不需要自定义头部提供的功能，可以直接从cdn引入`beautifier.js`：\n\n```html\n\u003c!-- 修正部分区域的透明 --\u003e\n\u003cstyle\u003e\n    .hope-ui-light,\n    .hope-ui-dark {\n        --hope-colors-background: transparent;\n    }\n\u003c/style\u003e\n\n\u003cscript type=\"module\" src=\"https://fastly.jsdelivr.net/gh/adogecheems/alist-beautification@latest/src/beautifier.js\"\u003e\u003c/script\u003e\n```\n\n### 控制台\n\n美化器实例暴露了三个方法：\n\n- `observe()`: 开始监听页面变化并美化背景色\n- `disconnect()`: 停止监听页面变化\n- `undo()`: 恢复页面背景色到默认状态\n\n你可以通过window对象访问美化器实例，比如在控制台中输入以下命令可以完全消除美化效果：\n\n```javascript\nwindow.beautifier.undo();\n```\n\n### 对默认背景色不满意？\n\n在`body.html`的第58行附近（在`beautifier.js`中是47行）找到以下代码，你可以修改这些变量来调整默认背景色：\n\n```javascript\nstatic lightBgColor = 'rgba(255, 255, 255, 0.8)';\nstatic darkBgColor = 'rgb(32, 36, 37)';\n//                                         ^\n// 这里可以修改为你想要的默认背景色\n//比如为黑夜模式也加入半透明：\nstatic lightBgColor = 'rgba(255, 255, 255, 0.8)';\nstatic darkBgColor = 'rgba(32, 36, 37, 0.8)';\n```\n\n## 对登录界面的美化\n\n如果你想要对alist的登录界面进行美化，可以使用`body_with_login.html`替换`body.html`的内容。\n\n## 关于\n\n对你有用的话，就请给我点个star支持一下吧！  \n作者：adogecheems  \n许可：AGPL-3.0\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fadogecheems%2Falist-beautification","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fadogecheems%2Falist-beautification","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fadogecheems%2Falist-beautification/lists"}