├── .editorconfig ├── .gitignore ├── LICENSE ├── README.md ├── annotation-setting.yaml ├── build.gradle ├── docs ├── above.png ├── metadata.png ├── renderings.png ├── sponsor.png └── user.png ├── gradle └── wrapper │ ├── gradle-wrapper.jar │ └── gradle-wrapper.properties ├── gradlew ├── gradlew.bat ├── gulpfile.js ├── package.json ├── settings.gradle ├── settings.yaml ├── src ├── font │ ├── CircularBody.min.css │ ├── CircularBody │ │ ├── CircularBody.ttf │ │ └── CircularBody.woff │ ├── HarmonyOS_Regular.min.css │ └── HarmonyOS_Regular │ │ ├── HarmonyOS_Regular.a.woff2 │ │ ├── HarmonyOS_Regular.a0.woff2 │ │ ├── HarmonyOS_Regular.a1.woff2 │ │ ├── HarmonyOS_Regular.aa.woff2 │ │ ├── HarmonyOS_Regular.ab.woff2 │ │ ├── HarmonyOS_Regular.ac.woff2 │ │ ├── HarmonyOS_Regular.ad.woff2 │ │ ├── HarmonyOS_Regular.ae.woff2 │ │ ├── HarmonyOS_Regular.af.woff2 │ │ ├── HarmonyOS_Regular.ag.woff2 │ │ ├── HarmonyOS_Regular.ah.woff2 │ │ ├── HarmonyOS_Regular.ai.woff2 │ │ ├── HarmonyOS_Regular.aj.woff2 │ │ ├── HarmonyOS_Regular.ak.woff2 │ │ ├── HarmonyOS_Regular.al.woff2 │ │ ├── HarmonyOS_Regular.am.woff2 │ │ ├── HarmonyOS_Regular.an.woff2 │ │ ├── HarmonyOS_Regular.ao.woff2 │ │ ├── HarmonyOS_Regular.ap.woff2 │ │ ├── HarmonyOS_Regular.aq.woff2 │ │ ├── HarmonyOS_Regular.ar.woff2 │ │ ├── HarmonyOS_Regular.as.woff2 │ │ ├── HarmonyOS_Regular.at.woff2 │ │ ├── HarmonyOS_Regular.au.woff2 │ │ ├── HarmonyOS_Regular.av.woff2 │ │ ├── HarmonyOS_Regular.aw.woff2 │ │ ├── HarmonyOS_Regular.ax.woff2 │ │ ├── HarmonyOS_Regular.ay.woff2 │ │ ├── HarmonyOS_Regular.az.woff2 │ │ ├── HarmonyOS_Regular.b.woff2 │ │ ├── HarmonyOS_Regular.c.woff2 │ │ ├── HarmonyOS_Regular.d.woff2 │ │ ├── HarmonyOS_Regular.e.woff2 │ │ ├── HarmonyOS_Regular.f.woff2 │ │ ├── HarmonyOS_Regular.g.woff2 │ │ ├── HarmonyOS_Regular.h.woff2 │ │ ├── HarmonyOS_Regular.i.woff2 │ │ ├── HarmonyOS_Regular.j.woff2 │ │ ├── HarmonyOS_Regular.k.woff2 │ │ ├── HarmonyOS_Regular.l.woff2 │ │ ├── HarmonyOS_Regular.m.woff2 │ │ ├── HarmonyOS_Regular.n.woff2 │ │ ├── HarmonyOS_Regular.o.woff2 │ │ ├── HarmonyOS_Regular.p.woff2 │ │ ├── HarmonyOS_Regular.q.woff2 │ │ ├── HarmonyOS_Regular.r.woff2 │ │ ├── HarmonyOS_Regular.s.woff2 │ │ ├── HarmonyOS_Regular.t.woff2 │ │ ├── HarmonyOS_Regular.u.woff2 │ │ ├── HarmonyOS_Regular.v.woff2 │ │ ├── HarmonyOS_Regular.w.woff2 │ │ ├── HarmonyOS_Regular.x.woff2 │ │ ├── HarmonyOS_Regular.y.woff2 │ │ └── HarmonyOS_Regular.z.woff2 ├── html │ ├── archives.html │ ├── categories.html │ ├── category.html │ ├── index.html │ ├── links.html │ ├── moments.html │ ├── page.html │ ├── photos.html │ ├── post.html │ ├── tag.html │ ├── tags.html │ └── views │ │ ├── aside.html │ │ ├── components.html │ │ ├── config.html │ │ ├── footer.html │ │ ├── header.html │ │ ├── layout.html │ │ └── nav.html ├── js │ ├── core │ │ ├── App.js │ │ ├── _decorator.js │ │ ├── _lazyLoad.js │ │ ├── _message.js │ │ ├── _universe.js │ │ ├── _util.js │ │ ├── common.js │ │ ├── scroll.js │ │ └── theme.js │ ├── modules │ │ ├── AmplifyImg.js │ │ ├── CodeBlock.js │ │ ├── Pagination.js │ │ └── Render.js │ └── page │ │ ├── archives.js │ │ ├── categories.js │ │ ├── category.js │ │ ├── index.js │ │ ├── links.js │ │ ├── moments.js │ │ ├── photos.js │ │ ├── post.js │ │ ├── single.js │ │ ├── tag.js │ │ └── tags.js ├── plugins │ ├── cursor │ │ ├── simple.min.css │ │ └── simple │ │ │ ├── default.cur │ │ │ └── pointer.cur │ ├── fontawesome │ │ ├── fontawesome.min.css │ │ └── webfonts │ │ │ ├── fa-brands-400.ttf │ │ │ ├── fa-brands-400.woff2 │ │ │ ├── fa-duotone-900.ttf │ │ │ ├── fa-duotone-900.woff2 │ │ │ ├── fa-light-300.ttf │ │ │ ├── fa-light-300.woff2 │ │ │ ├── fa-regular-400.ttf │ │ │ ├── fa-regular-400.woff2 │ │ │ ├── fa-solid-900.ttf │ │ │ ├── fa-solid-900.woff2 │ │ │ ├── fa-thin-100.ttf │ │ │ ├── fa-thin-100.woff2 │ │ │ ├── fa-v4compatibility.ttf │ │ │ └── fa-v4compatibility.woff2 │ ├── loading │ │ ├── circle.js │ │ ├── cross_line.js │ │ ├── dot.js │ │ └── hourglass.js │ └── prism │ │ ├── prism.min.css │ │ ├── prism.min.js │ │ └── themes │ │ ├── prism-a11y-dark.css │ │ ├── prism-atom-dark.css │ │ ├── prism-base16-ateliersulphurpool.light.css │ │ ├── prism-cb.css │ │ ├── prism-coldark-cold.css │ │ ├── prism-coldark-dark.css │ │ ├── prism-coy-without-shadows.css │ │ ├── prism-darcula.css │ │ ├── prism-dracula.css │ │ ├── prism-duotone-dark.css │ │ ├── prism-duotone-earth.css │ │ ├── prism-duotone-forest.css │ │ ├── prism-duotone-light.css │ │ ├── prism-duotone-sea.css │ │ ├── prism-duotone-space.css │ │ ├── prism-ghcolors.css │ │ ├── prism-gruvbox-dark.css │ │ ├── prism-gruvbox-light.css │ │ ├── prism-holi-theme.css │ │ ├── prism-hopscotch.css │ │ ├── prism-lucario.css │ │ ├── prism-material-dark.css │ │ ├── prism-material-light.css │ │ ├── prism-material-oceanic.css │ │ ├── prism-night-owl.css │ │ ├── prism-nord.css │ │ ├── prism-one-dark.css │ │ ├── prism-one-light.css │ │ ├── prism-pojoaque.css │ │ ├── prism-shades-of-purple.css │ │ ├── prism-solarized-dark-atom.css │ │ ├── prism-synthwave84.css │ │ ├── prism-vs.css │ │ ├── prism-vsc-dark-plus.css │ │ ├── prism-xonokai.css │ │ └── prism-z-touch.css └── scss │ ├── core │ ├── _base.scss │ ├── _button.scss │ ├── _message.scss │ ├── _reset.scss │ ├── _util.scss │ ├── aside.scss │ ├── common.scss │ ├── footer.scss │ ├── header.scss │ ├── index.scss │ ├── main.scss │ └── nav.scss │ ├── modules │ ├── codeBlock.scss │ ├── components.scss │ └── render.scss │ └── page │ ├── archives.scss │ ├── categories.scss │ ├── category.scss │ ├── index.scss │ ├── links.scss │ ├── moments.scss │ ├── photos.scss │ ├── post.scss │ ├── single.scss │ ├── tag.scss │ └── tags.scss └── theme.yaml /.editorconfig: -------------------------------------------------------------------------------- 1 | # EditorConfig is awesome: https://EditorConfig.org 2 | # top-most EditorConfig file 3 | root = true 4 | 5 | [*] 6 | indent_style = space 7 | indent_size = 2 8 | end_of_line = lf 9 | charset = utf-8 10 | trim_trailing_whitespace = false 11 | insert_final_newline = false -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # Logs 2 | logs 3 | *.log 4 | npm-debug.log* 5 | yarn-debug.log* 6 | yarn-error.log* 7 | pnpm-debug.log* 8 | lerna-debug.log* 9 | 10 | node_modules 11 | dist 12 | theme-butterfly-dist.zip 13 | dist-ssr 14 | *.local 15 | 16 | # Editor directories and files 17 | .vscode/* 18 | !.vscode/extensions.json 19 | .idea 20 | .DS_Store 21 | *.suo 22 | *.ntvs* 23 | *.njsproj 24 | *.sln 25 | *.sw? 26 | 27 | .gradle 28 | build 29 | pnpm-lock.yaml 30 | templates 31 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 |

Index 主题 Halo 2.0

2 | 3 | > `Index` 是Hexo社区[hexo-theme-Index](https://github.com/jerryc127) 此次移植`pug`模板引擎调整为 `thymeleaf`， 4 | > 希望大家喜欢 ❤️ ！同时也要在此感谢原作者 [Jerry](https://github.com/jerryc127) 5 | > 欢迎大家加入 [halo-theme-Index 交流群：916571927](https://jq.qq.com/?_wv=1027&k=LfbGKBVG) 6 | 7 | ## 👀 [预览主题](https://dhjdd.cn) 8 | 9 | **效果图** 👇 10 | 11 | ![效果图](https://cdn.jsdelivr.net/npm/halo-theme-butterfly/docs/renderings.png) 12 | 13 | ## 🌈 安装 14 | 15 | - 主题仓库地址 `https://github.com/dhjddcn/halo-theme-butterfly.git` 16 | - 在 [Release](https://github.com/dhjddcn/halo-theme-butterfly/releases) 页面下载最新版本 `zip` 17 | 后，通过 `Halo Console` 安装上传即可。 18 | 19 | ## ⚠️ 注意 20 | 21 | 安装主题后，需要在 `Halo Console - 主题 - 基本 - metadata.name` 22 | 中进行配置，否则主题无法正常使用。此处配置的名称可以在 `Halo Console - 用户 - 用户详情 - 用户名` 中获取。 23 | 24 | ![效果图](https://cdn.jsdelivr.net/npm/halo-theme-butterfly/docs/user.png) 25 | ![效果图](https://cdn.jsdelivr.net/npm/halo-theme-butterfly/docs/metadata.png) 26 | 27 | ## 🌐 免费可用的 npm cdn 28 | 29 | - https://unpkg.com/halo-theme-butterfly/templates/assets/ 30 | - https://cdn.jsdelivr.net/npm/halo-theme-butterfly/templates/assets/ 31 | - https://jsd.onmicrosoft.cn/npm/halo-theme-butterfly/templates/assets/ 32 | - https://fastly.jsdelivr.net/npm/halo-theme-butterfly@latest/templates/assets/ 33 | 34 | ## ⭐️ 主题功能 35 | 36 | - [x] 二维码打赏 37 | - [x] 预制主题字体 38 | - [x] 自定义背景图 39 | - [x] 页面顶部自定义图 40 | - [x] 文章列表（列表/平铺） 41 | - [x] 侧边栏 全局/单独控制 42 | - [x] 分类/标签页UI优化 43 | - [x] 社交账号配置 44 | - [x] 代码高亮 + 行号 + 复制 + 折叠 45 | - [x] 随机图片api配置 46 | - [x] 统计页面 总访问量 47 | - [x] 站点运行时间 48 | - [x] 主题模式（深色/浅色） 49 | 50 | ### 📃 TODO 51 | 52 | > 目前仍有部分功能不完善，暂时没时间做，后面继续迭代。 53 | 54 | - 页面元数据控制 55 | 百度收录查询 + 主动推送 56 | - 全站 Pjax 57 | - 相册页开发 58 | - 多种布局切换 59 | - 页面动画效果优化 60 | - 自定义标签 61 | - 数学公式 62 | - 局部优化 63 | - 移动端侧边栏优化 64 |
65 | 66 | ## 💡 如何自定义导航条菜单图标？ 67 | 68 | > 主题本次移植使用的是 `fontawesome` 字体图标，你可以在 [fontawesome](https://fontawesome.com/search) 69 | > 上找到你想要的图标，然后复制图标的 `class` 名称，如下所示：
70 | > 如我站点首页图标为 `fa-home fa-solid fa-bolt-auto` ，则在 `菜单-图标` 填入 `fa-home fa-solid fa-bolt-auto` 即可
71 | 72 | ## 🛡️ 许可证 73 | 74 | [![license](https://img.shields.io/github/license/halo-dev/halo.svg?style=flat-square)](https://github.com/halo-dev/halo/blob/master/LICENSE) 75 | 76 | Halo 使用 GPL-v3.0 协议开源，请遵守开源协议。 77 | 78 | ## 🍹 赞助 79 | 80 | 如果你觉得这个主题不错，你可以帮作者买一杯果汁表示鼓励 🍹。（赞助的时候记得加上备注 😁） 81 | 82 | ![赞助](https://cdn.jsdelivr.net/npm/halo-theme-butterfly/docs/sponsor.png) 83 | 84 | | 时间 | 小伙伴 | 平台 | 金额 | 备注 | 85 | |:-----------|:-----|:-------|:------|:---| 86 | | 2022-07-25 | 咕咕鸽 | QQ | 50 | 🍹 | 87 | | 2023-03-14 | Cary | Alipay | 10 | 🍹 | 88 | | 2023-03-14 | *哦 | Wechat | 50 | 🍹 | 89 | | 2023-03-22 | 心底. | Wechat | 28.88 | 🍹 | 90 | | 2023-03-22 | xx鹏 | Alipay | 3.33 | 🍹 | 91 | | 2024-06-23 | *! | Wechat | 18.88 | 🍹 | 92 | -------------------------------------------------------------------------------- /annotation-setting.yaml: -------------------------------------------------------------------------------- 1 | apiVersion: v1alpha1 2 | kind: AnnotationSetting 3 | metadata: 4 | generateName: annotation-setting- 5 | spec: 6 | targetRef: 7 | group: "" 8 | kind: MenuItem 9 | formSchema: 10 | - $formkit: "text" 11 | name: "icon" 12 | label: "图标" 13 | 14 | --- 15 | apiVersion: v1alpha1 16 | kind: AnnotationSetting 17 | metadata: 18 | generateName: annotation-setting- 19 | spec: 20 | targetRef: 21 | group: content.halo.run 22 | kind: Post 23 | formSchema: 24 | - $formkit: "radio" 25 | name: "enable_code_copy" 26 | label: "启用代码复制" 27 | help: "本篇文章代码块复制按钮" 28 | value: "true" 29 | options: 30 | - label: 启用 31 | value: "true" 32 | - label: 禁用 33 | value: "false" -------------------------------------------------------------------------------- /build.gradle: -------------------------------------------------------------------------------- 1 | plugins { 2 | id 'java' 3 | } 4 | 5 | group 'run.halo' 6 | version '1.0' 7 | 8 | repositories { 9 | mavenCentral() 10 | } 11 | 12 | dependencies { 13 | implementation('org.thymeleaf:thymeleaf:3.0.12.RELEASE') 14 | } 15 | -------------------------------------------------------------------------------- /docs/above.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/docs/above.png -------------------------------------------------------------------------------- /docs/metadata.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/docs/metadata.png -------------------------------------------------------------------------------- /docs/renderings.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/docs/renderings.png -------------------------------------------------------------------------------- /docs/sponsor.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/docs/sponsor.png -------------------------------------------------------------------------------- /docs/user.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/docs/user.png -------------------------------------------------------------------------------- /gradle/wrapper/gradle-wrapper.jar: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/gradle/wrapper/gradle-wrapper.jar -------------------------------------------------------------------------------- /gradle/wrapper/gradle-wrapper.properties: -------------------------------------------------------------------------------- 1 | distributionBase=GRADLE_USER_HOME 2 | distributionPath=wrapper/dists 3 | distributionUrl=https\://services.gradle.org/distributions/gradle-7.6-bin.zip 4 | zipStoreBase=GRADLE_USER_HOME 5 | zipStorePath=wrapper/dists 6 | -------------------------------------------------------------------------------- /gradlew.bat: -------------------------------------------------------------------------------- 1 | @rem 2 | @rem Copyright 2015 the original author or authors. 3 | @rem 4 | @rem Licensed under the Apache License, Version 2.0 (the "License"); 5 | @rem you may not use this file except in compliance with the License. 6 | @rem You may obtain a copy of the License at 7 | @rem 8 | @rem https://www.apache.org/licenses/LICENSE-2.0 9 | @rem 10 | @rem Unless required by applicable law or agreed to in writing, software 11 | @rem distributed under the License is distributed on an "AS IS" BASIS, 12 | @rem WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 13 | @rem See the License for the specific language governing permissions and 14 | @rem limitations under the License. 15 | @rem 16 | 17 | @if "%DEBUG%" == "" @echo off 18 | @rem ########################################################################## 19 | @rem 20 | @rem Gradle startup script for Windows 21 | @rem 22 | @rem ########################################################################## 23 | 24 | @rem Set local scope for the variables with windows NT shell 25 | if "%OS%"=="Windows_NT" setlocal 26 | 27 | set DIRNAME=%~dp0 28 | if "%DIRNAME%" == "" set DIRNAME=. 29 | set APP_BASE_NAME=%~n0 30 | set APP_HOME=%DIRNAME% 31 | 32 | @rem Resolve any "." and ".." in APP_HOME to make it shorter. 33 | for %%i in ("%APP_HOME%") do set APP_HOME=%%~fi 34 | 35 | @rem Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script. 36 | set DEFAULT_JVM_OPTS="-Xmx64m" "-Xms64m" 37 | 38 | @rem Find java.exe 39 | if defined JAVA_HOME goto findJavaFromJavaHome 40 | 41 | set JAVA_EXE=java.exe 42 | %JAVA_EXE% -version >NUL 2>&1 43 | if "%ERRORLEVEL%" == "0" goto execute 44 | 45 | echo. 46 | echo ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH. 47 | echo. 48 | echo Please set the JAVA_HOME variable in your environment to match the 49 | echo location of your Java installation. 50 | 51 | goto fail 52 | 53 | :findJavaFromJavaHome 54 | set JAVA_HOME=%JAVA_HOME:"=% 55 | set JAVA_EXE=%JAVA_HOME%/bin/java.exe 56 | 57 | if exist "%JAVA_EXE%" goto execute 58 | 59 | echo. 60 | echo ERROR: JAVA_HOME is set to an invalid directory: %JAVA_HOME% 61 | echo. 62 | echo Please set the JAVA_HOME variable in your environment to match the 63 | echo location of your Java installation. 64 | 65 | goto fail 66 | 67 | :execute 68 | @rem Setup the command line 69 | 70 | set CLASSPATH=%APP_HOME%\gradle\wrapper\gradle-wrapper.jar 71 | 72 | 73 | @rem Execute Gradle 74 | "%JAVA_EXE%" %DEFAULT_JVM_OPTS% %JAVA_OPTS% %GRADLE_OPTS% "-Dorg.gradle.appname=%APP_BASE_NAME%" -classpath "%CLASSPATH%" org.gradle.wrapper.GradleWrapperMain %* 75 | 76 | :end 77 | @rem End local scope for the variables with windows NT shell 78 | if "%ERRORLEVEL%"=="0" goto mainEnd 79 | 80 | :fail 81 | rem Set variable GRADLE_EXIT_CONSOLE if you need the _script_ return code instead of 82 | rem the _cmd.exe /c_ return code! 83 | if not "" == "%GRADLE_EXIT_CONSOLE%" exit 1 84 | exit /b 1 85 | 86 | :mainEnd 87 | if "%OS%"=="Windows_NT" endlocal 88 | 89 | :omega -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "halo-theme-butterfly", 3 | "version": "2.0.7", 4 | "description": "一个Halo博客主题，Butterfly", 5 | "scripts": { 6 | "dev": "gulp watch", 7 | "clean": "gulp clean", 8 | "zip": "gulp zip", 9 | "build-css": "gulp css", 10 | "build-js": "gulp js", 11 | "build-html": "gulp html", 12 | "copy-folder": "gulp copy-folder", 13 | "build-zip": "npm run clean && gulp && npm run zip", 14 | "build": "npm run clean && gulp && gulp js-plugins-loading", 15 | "release": "gulp release" 16 | }, 17 | "files": [ 18 | "templates/assets/", 19 | "docs/" 20 | ], 21 | "keywords": [ 22 | "halo", 23 | "halo-theme", 24 | "halo-theme-butterfly" 25 | ], 26 | "homepage": "https://github.com/dhjddcn/halo-theme-butterfly#readme", 27 | "bugs": { 28 | "url": "https://github.com/dhjddcn/halo-theme-butterfly/issues" 29 | }, 30 | "author": { 31 | "name": "小红", 32 | "url": "https://github.com/dhjddcn", 33 | "email": "dhjddcn@qq.com" 34 | }, 35 | "maintainers": [ 36 | { 37 | "name": "小红", 38 | "url": "https://github.com/dhjddcn", 39 | "email": "dhjddcn@qq.com" 40 | } 41 | ], 42 | "license": "GPL-3.0", 43 | "repository": { 44 | "url": "https://github.com/dhjddcn/halo-theme-butterfly", 45 | "type": "git" 46 | }, 47 | "devDependencies": { 48 | "@babel/core": "^7.15.5", 49 | "@babel/plugin-proposal-decorators": "^7.24.1", 50 | "@babel/plugin-transform-runtime": "^7.15.0", 51 | "@babel/preset-env": "^7.15.6", 52 | "@babel/runtime": "^7.20.7", 53 | "@fancyapps/ui": "^5.0.35", 54 | "@halo-dev/api-client": "^2.17.0", 55 | "animate.css": "^4.1.1", 56 | "autoprefixer": "^10.4.18", 57 | "axios": "^1.7.2", 58 | "babel-eslint": "^10.1.0", 59 | "babel-loader": "^8.2.3", 60 | "clipboard": "^2.0.11", 61 | "css-loader": "^7.0.0", 62 | "css-mqpacker": "^7.0.0", 63 | "cssnano": "^6.0.3", 64 | "echarts": "^5.3.2", 65 | "gulp": "^4.0.2", 66 | "gulp-autoprefixer": "^8.0.0", 67 | "gulp-babel": "^8.0.0", 68 | "gulp-clean": "^0.4.0", 69 | "gulp-clean-css": "^4.3.0", 70 | "gulp-concat": "^2.6.1", 71 | "gulp-copy": "^4.0.1", 72 | "gulp-cssmin": "^0.2.0", 73 | "gulp-cssnano": "^2.1.3", 74 | "gulp-csso": "^4.0.1", 75 | "gulp-gzip": "^1.4.2", 76 | "gulp-htmlmin": "^5.0.1", 77 | "gulp-minify-css": "^1.2.4", 78 | "gulp-postcss": "^9.1.0", 79 | "gulp-rename": "^2.0.0", 80 | "gulp-sass": "^5.1.0", 81 | "gulp-uglify": "^3.0.2", 82 | "gulp-zip": "^5.1.0", 83 | "inquirer": "^7.3.3", 84 | "jquery": "^3.7.1", 85 | "jszip": "^3.10.1", 86 | "pace-js": "^1.2.4", 87 | "postcss-import": "^16.1.0", 88 | "postcss-merge-media-queries": "^1.0.1", 89 | "postcss-merge-rules": "^6.0.3", 90 | "postcss-nested": "^6.0.1", 91 | "postcss-sass": "^0.5.0", 92 | "prismjs": "^1.29.0", 93 | "sass": "^1.63.6", 94 | "tocbot": "^4.25.0", 95 | "typed.js": "^2.1.0", 96 | "webpack": "^5.68.0", 97 | "webpack-stream": "^7.0.0", 98 | "yamljs": "^0.3.0", 99 | "terser-webpack-plugin": "^5.3.10" 100 | } 101 | } 102 | -------------------------------------------------------------------------------- /settings.gradle: -------------------------------------------------------------------------------- 1 | rootProject.name = 'halo-theme-butterfly' 2 | -------------------------------------------------------------------------------- /src/font/CircularBody.min.css: -------------------------------------------------------------------------------- 1 | @font-face{font-family:"Butterfly Font";font-style:normal;font-weight:400;font-display:swap;src:url(CircularBody/CircularBody.woff) format('woff')} -------------------------------------------------------------------------------- /src/font/CircularBody/CircularBody.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/CircularBody/CircularBody.ttf -------------------------------------------------------------------------------- /src/font/CircularBody/CircularBody.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/CircularBody/CircularBody.woff -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.a.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.a.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.a0.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.a0.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.a1.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.a1.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.aa.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.aa.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.ab.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.ab.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.ac.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.ac.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.ad.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.ad.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.ae.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.ae.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.af.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.af.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.ag.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.ag.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.ah.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.ah.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.ai.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.ai.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.aj.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.aj.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.ak.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.ak.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.al.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.al.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.am.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.am.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.an.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.an.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.ao.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.ao.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.ap.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.ap.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.aq.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.aq.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.ar.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.ar.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.as.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.as.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.at.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.at.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.au.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.au.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.av.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.av.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.aw.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.aw.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.ax.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.ax.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.ay.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.ay.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.az.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.az.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.b.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.b.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.c.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.c.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.d.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.d.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.e.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.e.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.f.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.f.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.g.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.g.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.h.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.h.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.i.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.i.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.j.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.j.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.k.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.k.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.l.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.l.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.m.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.m.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.n.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.n.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.o.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.o.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.p.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.p.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.q.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.q.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.r.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.r.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.s.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.s.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.t.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.t.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.u.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.u.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.v.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.v.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.w.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.w.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.x.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.x.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.y.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.y.woff2 -------------------------------------------------------------------------------- /src/font/HarmonyOS_Regular/HarmonyOS_Regular.z.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/font/HarmonyOS_Regular/HarmonyOS_Regular.z.woff2 -------------------------------------------------------------------------------- /src/html/archives.html: -------------------------------------------------------------------------------- 1 | 10 | 11 | 12 | 30 | 31 | 32 | 33 | 34 |
35 | 36 | 37 | 38 | 39 |
40 |
41 |

归档

42 |
43 |
44 |
45 | 46 | 47 | 48 | 49 | 50 |
51 | 52 | 53 |
54 | 55 |
56 | 57 |
    58 | 59 |
  • 60 | 61 |
    • 62 | 63 | 64 |
  • 66 | 67 | 68 | 69 | 70 | 71 |
    72 | 73 | 74 | 75 |
    76 | 77 |
    • 78 | 79 |     80 |     81 |
82 | 83 | 84 | 85 | 86 |
87 | 88 | 89 | 90 | -------------------------------------------------------------------------------- /src/html/categories.html: -------------------------------------------------------------------------------- 1 | 10 | 11 | 12 | 17 | 18 | 27 | 28 | 29 | 30 | 31 |
32 | 33 | 34 | 35 | 36 |
37 |
38 |

分类

39 |
40 |
41 |
42 | 43 | 44 | 45 | 46 | 47 |
48 | 49 |
50 | 51 | 52 | 53 |
54 | 55 | 56 | -------------------------------------------------------------------------------- /src/html/category.html: -------------------------------------------------------------------------------- 1 | 10 | 11 | 12 | 28 | 29 | 30 | 31 | 32 | 33 |
34 | 35 | 36 | 37 | 38 |
39 |
40 |

分类列表

41 |
42 |
43 |
44 | 45 | 46 | 47 | 48 | 49 |
50 | 51 |
52 | 53 | 54 | -------------------------------------------------------------------------------- /src/html/index.html: -------------------------------------------------------------------------------- 1 | 10 | 11 | 12 | 13 | 14 | 35 | 36 | 37 | 38 | 39 | 40 |
41 | 42 | 43 | 44 | 45 |
46 |
47 |

48 |
49 | 50 |
51 |
52 |
53 |
54 | 55 | 56 | 57 | 58 | 59 |
60 | 61 |
62 | 63 | 64 | -------------------------------------------------------------------------------- /src/html/links.html: -------------------------------------------------------------------------------- 1 | 10 | 11 | 12 | 19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 |
31 |
32 |

链接管理

33 |
34 |
35 |
36 | 37 | 38 | 39 | 40 | 41 |
42 | 43 |
44 |
45 |

46 | 47 |
48 | 49 | 50 |
51 |

52 |

53 |
54 | 55 |
56 | 57 |
58 |
59 | 60 | 61 | 62 | 63 |
64 | 65 | 66 | -------------------------------------------------------------------------------- /src/html/moments.html: -------------------------------------------------------------------------------- 1 | 10 | 11 | 12 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 |
29 |
30 |

瞬间

31 |
32 |
33 |
34 | 35 | 36 | 37 | 38 | 39 | 40 |
41 |
    42 |
  • 43 |
    44 | 45 |
    46 | 47 | 48 | 49 | 50 | 51 |
    52 | 53 |
    54 |
    • 55 |
56 | 57 |
58 | 59 | 60 | -------------------------------------------------------------------------------- /src/html/page.html: -------------------------------------------------------------------------------- 1 | 10 | 11 | 12 | 19 | 20 | 21 | 22 | 23 | 24 |
25 | 26 | 27 | 28 | 29 |
30 |
31 |

32 |
33 |
34 |
35 | 36 | 37 | 38 | 39 | 40 |
41 |
42 | 48 |
49 | 50 | 51 | -------------------------------------------------------------------------------- /src/html/photos.html: -------------------------------------------------------------------------------- 1 | 10 | 11 | 12 | 19 | 20 | 21 | 22 | 23 | 24 |
25 | 26 | 27 | 28 | 29 |
30 |
31 |

图库

32 |
33 |
34 |
35 | 36 | 37 | 38 | 39 | 40 |
41 |
42 |
图库分类
43 |
44 | 45 | 全部 46 | 47 | 48 | 49 | 50 |
51 | 52 |
53 |
54 | 55 |
56 |
57 | 58 | 59 | -------------------------------------------------------------------------------- /src/html/tag.html: -------------------------------------------------------------------------------- 1 | 10 | 11 | 12 | 28 | 29 | 30 | 31 | 32 | 33 |
34 | 35 | 36 | 37 | 38 |
39 |
40 |

标签

41 |
42 |
43 |
44 | 45 | 46 | 47 | 48 | 49 | 50 |
51 | 52 |
53 | 54 | 55 | -------------------------------------------------------------------------------- /src/html/tags.html: -------------------------------------------------------------------------------- 1 | 10 | 11 | 12 | 19 | 20 | 21 | 22 | 23 | 24 |
25 | 26 | 27 | 28 | 29 |
30 |
31 |

标签

32 |
33 |
34 |
35 | 36 | 37 | 38 | 39 | 40 |
41 | 42 |
43 | 44 |
45 | 51 |
52 | 53 | 54 | 55 |
56 | 57 | 58 | -------------------------------------------------------------------------------- /src/html/views/config.html: -------------------------------------------------------------------------------- 1 | 2 | 15 | 16 | 17 | 54 | 55 | 56 | 57 | -------------------------------------------------------------------------------- /src/html/views/footer.html: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/html/views/header.html: -------------------------------------------------------------------------------- 1 | 2 |
3 |
4 |

5 |
6 | 7 |
8 |
9 |
10 | 11 | 12 |
13 |
14 |

15 | 65 |
66 |
67 | 68 | 69 |
70 |
71 |

归档

72 |
73 |
74 | 75 | 76 |
77 |
78 |

标签

79 |
80 |
81 | 82 |
83 |
84 |

标签

85 |
86 |
87 | 88 | 89 |
94 | 95 | 96 | 97 | 98 | 99 |
100 | 101 | -------------------------------------------------------------------------------- /src/html/views/layout.html: -------------------------------------------------------------------------------- 1 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 |
36 | 37 | 38 |
39 | 40 | 41 | 42 | 43 |
44 | 45 | 46 | 47 | 48 | 49 | 50 | -------------------------------------------------------------------------------- /src/html/views/nav.html: -------------------------------------------------------------------------------- 1 | 2 | 68 | -------------------------------------------------------------------------------- /src/js/core/App.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2024/3/30 3 | * @author: 小红 4 | * @fileName: App 5 | * @Description: 注册应用 6 | */ 7 | 8 | import {useClearPage} from '../core/_util'; 9 | import Message from './_message'; 10 | import Theme from './theme'; 11 | import Scroll from './scroll'; 12 | import Common from './common'; 13 | /** 14 | * @desc: 注册应用 15 | * @returns function(*): * 16 | * @param modules 17 | */ 18 | export default function App(modules = []) { 19 | return function(target) { 20 | Object.assign(window.MainApp, { 21 | useTheme: new Theme(), //主题 22 | useCommon: new Common(), // 公用逻辑 23 | useScroll: new Scroll(), //滚动导航侧边 24 | useMessage: new Message(), //滚动导航侧边 25 | }); 26 | 27 | const ins = new target(); 28 | 29 | const fns = Reflect.ownKeys(target.prototype); 30 | 31 | for (let i = 0; i < fns.length; i++) fns[i].startsWith('run_') && ins[fns[i]](); 32 | 33 | for (let i = 0; i < modules.length; i++) { 34 | const mods = new modules[i](); 35 | window.MainApp.modules[mods.name] = mods; 36 | } 37 | 38 | useClearPage(); 39 | 40 | return ins; 41 | }; 42 | } 43 | -------------------------------------------------------------------------------- /src/js/core/_message.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2023/11/5 3 | * @author: 小红 4 | * @fileName: _message 5 | * @Description: 消息提示 6 | */ 7 | 8 | export default class Message { 9 | 10 | #container = null; //消息容器 11 | 12 | //svg 图标 13 | #svgs = { 14 | info: ``, 15 | error: ``, 16 | }; 17 | 18 | /** 19 | * @description: 创建消息容器 20 | */ 21 | constructor() { 22 | 23 | } 24 | 25 | #createContainer() { 26 | this.#container = document.createElement('div'); 27 | this.#container.className = 'message-container'; 28 | document.body.appendChild( this.#container); 29 | } 30 | 31 | /** 32 | * @description: 创建消息包装器 33 | * @param type 类型 34 | * @param msg 消息 35 | * @param duration 持续时间 36 | */ 37 | #createWrapper(type, msg, duration) { 38 | if(!this.#container) this.#createContainer(); 39 | const wrapper = document.createElement('div'); 40 | wrapper.className = `message-wrapper ${type} animate__animated animate__fadeInDown animate__faster`; 41 | wrapper.innerHTML = `
${this.#svgs[type]}
${msg}
`; 42 | this.#container.appendChild(wrapper); 43 | this.#removeWrapper(wrapper, duration); 44 | } 45 | 46 | /** 47 | * @description 移除消息包装器 48 | * @param wrapper 49 | * @param duration 50 | */ 51 | #removeWrapper(wrapper, duration = 3000) { 52 | setTimeout(() => { 53 | wrapper.classList.remove('animate__fadeInDown', 'animate__faster'); 54 | wrapper.classList.add('animate__fadeOutUp', 'animate__faster'); 55 | setTimeout(() => wrapper.remove(), 800); 56 | }, duration); 57 | } 58 | 59 | /** 60 | * @description: 消息提示 61 | * @param msg 62 | * @param duration 63 | */ 64 | info(msg, duration) { 65 | this.#createWrapper('info', msg, duration); 66 | } 67 | 68 | /** 69 | * @description: 错误提示 70 | * @param msg 71 | * @param duration 72 | */ 73 | error(msg, duration) { 74 | this.#createWrapper('error', msg, duration); 75 | } 76 | } 77 | 78 | 79 | -------------------------------------------------------------------------------- /src/js/core/_universe.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2024/3/26 3 | * @author: 小红 4 | * @fileName: _universe 5 | * @Description: 暗黑宇宙背景 6 | */ 7 | 8 | export default class Universe { 9 | #canvas; // canvas 10 | 11 | constructor() { 12 | // this.#createCanvas() 13 | } 14 | 15 | #createCanvas() { 16 | const canvas = document.createElement('canvas'); 17 | canvas.style.position = 'fixed'; 18 | canvas.style.top = '0'; 19 | canvas.style.left = '0'; 20 | canvas.style.width = '100%'; 21 | canvas.style.height = '100%'; 22 | canvas.style.zIndex = '-1'; 23 | canvas.style.pointerEvents = 'none'; 24 | canvas.style.background = 'red' 25 | this.#canvas = canvas; 26 | document.body.appendChild(this.#canvas); 27 | } 28 | 29 | draw(mode) { 30 | // console.log(mode); 31 | } 32 | 33 | 34 | } 35 | 36 | 37 | 38 | -------------------------------------------------------------------------------- /src/js/core/common.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2024/3/2 3 | * @author: 小红 4 | * @fileName: _aside 5 | * @Description:common 6 | */ 7 | import $ from 'jquery'; 8 | import {useMask} from './_util'; 9 | import LazyLoad from './_lazyLoad'; 10 | 11 | export default class Common { 12 | 13 | constructor() { 14 | if(window.MainApp.conf.enable_above && window.MainApp.conf.above_background) this.#loadAboveBackgroundImg(); //第一屏图片预加载 15 | 16 | this.#createSingleAction(); //创建单一行为事件 17 | 18 | if(MainApp.conf.enable_aside && MainApp.conf.enable_webInfo) this.#runDay(); //站点运行时间 19 | 20 | } 21 | 22 | // 站点运行时间 23 | #runDay() { 24 | const dom = $('.main > .aside .aside-webInfo .run-day'); 25 | 26 | if(!dom.length) return; 27 | 28 | const siteDate = new Date(dom.attr('data-date')); 29 | 30 | if(siteDate.toString() === 'Invalid Date') return; 31 | 32 | const currentDate = new Date(); 33 | 34 | const date = currentDate.getTime() - siteDate.getTime(); 35 | 36 | const day = parseInt((date / (1000 * 24 * 60 * 60)).toString()); 37 | 38 | dom.html(day + ' 天'); 39 | } 40 | 41 | /** 42 | * 创建单一行为事件 43 | */ 44 | #createSingleAction() { 45 | //图片懒加载 46 | new LazyLoad({ 47 | elements_selector: 'img', threshold: 0, data_src: 'lazy-src', 48 | }); 49 | 50 | //移动端侧边栏呼出图标 51 | const sideBar = $('.side-bar'); 52 | $('.nav a.bars').click((e) => { 53 | e.preventDefault(); 54 | sideBar.addClass('active'); 55 | useMask(() => sideBar.removeClass('active')); 56 | }); 57 | 58 | //移动端侧边栏侧边菜单 59 | $('menu.bar').on('click', 'li.child', (event) => event.currentTarget.classList.toggle('active')); 60 | } 61 | 62 | //返回顶部 63 | backTop() { 64 | $('html,body').animate({scrollTop: 0}, 300); 65 | } 66 | 67 | //第一屏图片预加载 68 | #loadAboveBackgroundImg() { 69 | const img = new Image(); 70 | img.src = window.MainApp.conf.above_background; 71 | img.onload = () => { 72 | const above = document.querySelector('.header > .above'); 73 | above.style.backgroundImage = `url(${img.src})`; 74 | }; 75 | img.onerror = () => { 76 | console.error('第一屏图片预加载失败'); 77 | }; 78 | } 79 | } 80 | 81 | 82 | -------------------------------------------------------------------------------- /src/js/core/scroll.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2024/2/23 3 | * @author: 小红 4 | * @fileName: naveScroll 5 | * @Description: 滚动触发导航侧边的一些事件 6 | */ 7 | import $ from 'jquery'; 8 | import {useThrottle} from './_util'; 9 | 10 | export default class Scroll { 11 | #CHANGE_FN = null; // 回调 12 | #sideBtnDom = $('#Butterfly > .side-btn'); 13 | #navDom = $('.header > .nav'); 14 | #max = 56; // 最大值 15 | #num = 0; // 上一次滚动值 16 | 17 | // 初始化 18 | constructor(config) { 19 | window.addEventListener('scroll', useThrottle(() => { 20 | let scrollTop = window.scrollY || document.documentElement.scrollTop; 21 | 22 | // 激活头部导航栏 23 | this.#activeNav(scrollTop); 24 | 25 | // 激活侧边按钮 26 | this.#activeBtn(scrollTop); 27 | 28 | this.#CHANGE_FN && this.#CHANGE_FN(this.#max, this.#num, scrollTop); 29 | this.#num = scrollTop; 30 | }, 200)); 31 | } 32 | 33 | // 激活头部导航栏 34 | #activeNav(scrollTop) { 35 | if(scrollTop > this.#max) { 36 | this.#navDom.addClass('style'); 37 | if(this.#num <= scrollTop) { 38 | this.#navDom.removeClass('active'); 39 | } 40 | else { 41 | this.#navDom.addClass('active'); 42 | } 43 | } 44 | else { 45 | if(scrollTop === 0) this.#navDom.removeClass('active style'); 46 | } 47 | } 48 | 49 | // 激活侧边按钮 50 | #activeBtn(scrollTop) { 51 | // 滚动到顶部取消按钮 52 | if(scrollTop < this.#max && scrollTop <= 2) this.#sideBtnDom.removeClass('active'); 53 | 54 | // 向下滚动激活侧边按钮 55 | if(scrollTop > this.#max && this.#num <= scrollTop) this.#sideBtnDom.addClass('active'); 56 | } 57 | 58 | 59 | /** 60 | * 回调 61 | */ 62 | change(fn) { 63 | this.#CHANGE_FN = fn; 64 | } 65 | 66 | } 67 | 68 | 69 | 70 | -------------------------------------------------------------------------------- /src/js/core/theme.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2024/2/23 3 | * @author: 小红 4 | * @fileName: _theme 5 | * @Description: 主题切换 6 | */ 7 | import {useIsDaytime} from './_util'; 8 | 9 | export default class Theme { 10 | #LOCALSTORAGE_KEY = 'data-color-scheme'; 11 | #ATTR_KEY = 'colorScheme'; // 根元素主题属性 12 | #CHANGE_FN = null; // 主题切换回调 13 | mode = 'light'; // 主题模式 14 | 15 | // 初始化主题模式 16 | constructor() { 17 | const mes = { 18 | auto: () => useIsDaytime() ? 'light' : 'dark', 19 | user: () => localStorage.getItem(this.#LOCALSTORAGE_KEY) || 'light', 20 | light: () => 'light', 21 | dark: () => 'dark', 22 | }; 23 | this.setMode(mes[MainApp.conf.style_mode]()); 24 | } 25 | 26 | // 设置主题模式 27 | setMode(theme) { 28 | this.mode = theme; 29 | document.documentElement.dataset[this.#ATTR_KEY] = theme; 30 | localStorage.setItem(this.#LOCALSTORAGE_KEY, theme); 31 | this.#CHANGE_FN && this.#CHANGE_FN(theme); 32 | } 33 | 34 | // 获取主题模式 35 | getMode() { 36 | const rootTheme = document.documentElement.dataset.theme; 37 | const locDataTheme = localStorage.getItem(this.#LOCALSTORAGE_KEY); 38 | return this.mode || rootTheme || locDataTheme; 39 | } 40 | 41 | // 切换主题模式 42 | toggleMode() { 43 | this.setMode(this.mode === 'light' ? 'dark' : 'light'); 44 | } 45 | 46 | // 主题模式切换回调 47 | change(fn) { 48 | this.#CHANGE_FN = fn; 49 | } 50 | } -------------------------------------------------------------------------------- /src/js/modules/AmplifyImg.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2024/7/4 3 | * @author: 小红 4 | * @fileName: AmplifyImg 5 | * @Description: 图片放大 6 | */ 7 | import {Fancybox} from '@fancyapps/ui'; 8 | import $ from 'jquery'; 9 | import {useInsertStyle} from '../core/_util'; 10 | import fancyBoxCss from '@fancyapps/ui/dist/fancybox/fancybox.css'; 11 | 12 | export default class AmplifyImg { 13 | name = 'AmplifyImg'; 14 | 15 | constructor() { 16 | this.#addCss(); 17 | this.#fBox(); 18 | } 19 | 20 | #addCss() { 21 | let cssStr = ``; 22 | cssStr += fancyBoxCss.toString(); 23 | useInsertStyle(cssStr); 24 | } 25 | 26 | #fBox() { 27 | const imgs = $('.main >.content img'); 28 | 29 | imgs.each(function() { 30 | const $this = $(this); 31 | $this.wrap($(``)); 32 | }); 33 | 34 | Fancybox.bind( 35 | '[data-fancybox="fancyBoxImg"]', 36 | { 37 | Toolbar: { 38 | display: { 39 | left: ['infobar'], 40 | middle: [ 41 | 'zoomIn', 42 | 'zoomOut', 43 | 'toggle1to1', 44 | 'rotateCCW', 45 | 'rotateCW', 46 | 'flipX', 47 | 'flipY', 48 | ], 49 | right: ['slideshow', 'thumbs', 'close'], 50 | }, 51 | }, 52 | }); 53 | } 54 | } 55 | -------------------------------------------------------------------------------- /src/js/modules/Pagination.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2024/2/25 3 | * @author: 小红 4 | * @fileName: pagination 5 | * @Description:页码 6 | */ 7 | 8 | import $ from 'jquery'; 9 | 10 | export default class Pagination { 11 | name = 'Pagination'; 12 | 13 | #conf = MainApp.conf; 14 | 15 | constructor() { 16 | if(!MainApp.conf.total) return; 17 | 18 | if(this.#conf.page > this.#conf.totalPages) return; 19 | 20 | this.#createPage(); 21 | } 22 | 23 | // 获取上一页 24 | #getPrevUrl() { 25 | return this.#conf.hasPrevious ? `` : ''; 26 | } 27 | 28 | // 获取下一页 29 | #getNextUrl() { 30 | return this.#conf.hasNext ? `` : ''; 31 | } 32 | 33 | // 获取路径 34 | #getPath() { 35 | const regex = /.*?(?=\/\d+)\//; 36 | 37 | if(this.#conf.nextUrl.includes('/page/')) return this.#conf.nextUrl.match(regex)?.[0]; 38 | 39 | if(this.#conf.prevUrl.includes('/page/')) return this.#conf.prevUrl.match(regex)?.[0]; 40 | 41 | return '/'; 42 | } 43 | 44 | // 获取页码 45 | #getPage() { 46 | const {totalPages, page} = this.#conf; 47 | const path = this.#getPath(); 48 | const maxPagesToShow = 5; // 可见的最大页码数 49 | const halfMaxPagesToShow = Math.floor(maxPagesToShow / 2); 50 | let startPage, endPage; 51 | 52 | if(totalPages <= maxPagesToShow) { 53 | startPage = 1; 54 | endPage = totalPages; 55 | } 56 | else { 57 | if(page <= halfMaxPagesToShow + 1) { 58 | startPage = 1; 59 | endPage = maxPagesToShow; 60 | } 61 | else if(page >= totalPages - halfMaxPagesToShow) { 62 | startPage = totalPages - maxPagesToShow + 1; 63 | endPage = totalPages; 64 | } 65 | else { 66 | startPage = page - halfMaxPagesToShow; 67 | endPage = page + halfMaxPagesToShow; 68 | } 69 | } 70 | let html = ''; 71 | 72 | for (let i = startPage; i <= endPage; i++) { 73 | html += `${i}`; 74 | } 75 | 76 | return html; 77 | } 78 | 79 | #createPage() { 80 | $('main.main section.content').append(``); 81 | } 82 | } 83 | -------------------------------------------------------------------------------- /src/js/modules/Render.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2024/2/25 3 | * @author: 小红 4 | * @fileName: Render 5 | * @Description: 渲染html 6 | */ 7 | import $ from 'jquery'; 8 | import {useDelay} from '../core/_util'; 9 | import tocBot from 'tocbot'; 10 | 11 | export default class Render { 12 | name = 'Render'; 13 | 14 | #renderDom = $('article.render'); // 文章渲染区域 15 | 16 | #tocStickyDom = $('.aside .is-sticky'); 17 | 18 | #conf = MainApp.conf; 19 | 20 | constructor() { 21 | this.#h(); 22 | this.#domObserver(); 23 | this.#tocBotH5(); 24 | this.#copyRight(); 25 | } 26 | 27 | /** 28 | * h标题 29 | */ 30 | #h() { 31 | if(this.#conf.enable_h_icon) this.#renderDom.addClass('enable_h_icon'); 32 | } 33 | 34 | #domObserver() { 35 | const renderDom = document.querySelector('article.render'); 36 | 37 | const observer = new ResizeObserver(entries => { 38 | for (let entry of entries) { 39 | if(entry.contentRect.height > 0) { 40 | this.#tocBot(); 41 | observer.disconnect(); 42 | } 43 | } 44 | }); 45 | observer.observe(renderDom); 46 | } 47 | 48 | /** 49 | * 设置目录 50 | */ 51 | #tocBot() { 52 | tocBot.init({ 53 | contentSelector: 'article.render', 54 | tocSelector: '.aside-toc > .toc', 55 | headingSelector: 'h1,h2,h3,h4,h5,h6', 56 | hasInnerContainers: true, 57 | scrollSmooth: true, 58 | includeTitleTags: true, 59 | scrollSmoothDuration: 280, 60 | throttleTimeout: 30, 61 | headingsOffset: 20, // 目录中高亮的偏移值，和scrollSmoothOffset有关联 62 | scrollSmoothOffset: -20, // 屏幕滚动的偏移值（这里和导航条固定也有关联） 63 | fixedSidebarOffset: 'auto', 64 | onClick: (e) => e.preventDefault(), 65 | scrollEndCallback: function(e) { 66 | }, 67 | }); 68 | 69 | MainApp.useScroll.change((max, num, scrollTop) => { 70 | if(scrollTop < max || window.innerWidth <= 1100) return; 71 | if(num <= scrollTop) { 72 | this.#tocStickyDom.css('top', ''); 73 | } 74 | else { 75 | this.#tocStickyDom.css('top', '70px'); 76 | } 77 | }); 78 | 79 | const toc = $('.aside-toc > .toc'); 80 | 81 | if(!toc.html()) toc.html('暂无目录~'); 82 | 83 | } 84 | 85 | /** 86 | * h5目录 87 | */ 88 | #tocBotH5() { 89 | const adeToc = this.#tocStickyDom.find('.aside-toc'); 90 | 91 | const sideBtn = $('.side-btn'); 92 | 93 | const tocBtn = $(``); 94 | 95 | sideBtn.prepend(tocBtn); 96 | 97 | tocBtn.on('click', async () => { 98 | adeToc.toggle('fast'); 99 | 100 | await useDelay(500); 101 | 102 | adeToc.css('display') === 'none' && adeToc.attr('style', ''); 103 | }); 104 | } 105 | 106 | /** 107 | * 版权 108 | */ 109 | #copyRight() { 110 | const a = $('.copy-right a.permalink'); 111 | 112 | a.attr('href', window.location.href); 113 | 114 | a.html(decodeURI(window.location.href)); 115 | } 116 | 117 | } 118 | -------------------------------------------------------------------------------- /src/js/page/archives.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2024/4/30 3 | * @author: 小红 4 | * @fileName: archives 5 | * @Description:归档 6 | */ 7 | import {useChart} from '../core/_util'; 8 | import App from '../core/App'; 9 | import pagination from '../modules/Pagination'; 10 | import * as echarts from 'echarts'; 11 | import {LineChart} from 'echarts/charts'; 12 | import {TitleComponent, TooltipComponent, GridComponent, DataZoomComponent} from 'echarts/components'; 13 | import {CanvasRenderer} from 'echarts/renderers'; 14 | 15 | // 注册所需的组件和渲染器 16 | echarts.use([ 17 | LineChart, 18 | TitleComponent, 19 | TooltipComponent, 20 | GridComponent, 21 | DataZoomComponent, 22 | CanvasRenderer, 23 | ]); 24 | 25 | @App([pagination]) 26 | class Archives { 27 | /*** 28 | * @desc: 图表 29 | */ 30 | run_chart() { 31 | const chartDom = document.querySelector('.archives .content > .chart'); 32 | 33 | if(!chartDom) return; 34 | 35 | useChart( chartDom, () => { 36 | const data = []; 37 | 38 | for (let year of MainApp.data) { 39 | for (let months of year['months']) { 40 | data.push([ 41 | `${year['year']}-${months['month']}`, 42 | months['posts'].length, 43 | ]); 44 | } 45 | } 46 | 47 | return { 48 | color: ['#425aef'], 49 | title: { 50 | text: '归档统计📃', 51 | x: 'center', 52 | }, 53 | tooltip: { 54 | trigger: 'axis', 55 | axisPointer: { 56 | type: 'shadow', 57 | shadowStyle: { 58 | color: 'rgba(66,90,239,0.3)', 59 | }, 60 | }, 61 | }, 62 | grid: { 63 | left: '5%', // 调整左边距 64 | right: '5%', // 调整右边距 65 | }, 66 | xAxis: { 67 | type: 'category', 68 | boundaryGap: false, 69 | }, 70 | yAxis: { 71 | name: '篇', 72 | axisLine: { 73 | show: true, 74 | }, 75 | }, 76 | series: [ 77 | { 78 | zlevel: 0, 79 | z: 2, 80 | name: '文章篇数', 81 | type: 'line', 82 | smooth: true, 83 | symbol: 'none', 84 | lineStyle: { 85 | color: '#425aef', 86 | width: 1, 87 | }, 88 | areaStyle: { 89 | color: { 90 | type: 'linear', 91 | x: 0, 92 | y: 0, 93 | x2: 0, 94 | y2: 1, 95 | colorStops: [ 96 | { 97 | offset: 0, 98 | color: '#425aef', // 0% 处的颜色 99 | }, 100 | { 101 | offset: 1, 102 | color: '#FFFFFF', // 100% 处的颜色 103 | }, 104 | ], 105 | global: false, // 缺省为 false 106 | }, 107 | }, 108 | data, // 这里需要填入实际的数据 109 | }, 110 | ], 111 | }; 112 | }); 113 | } 114 | } -------------------------------------------------------------------------------- /src/js/page/categories.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2024/6/19 3 | * @author: 小红 4 | * @fileName: categories 5 | * @Description: 分类 6 | */ 7 | import {useChart} from '../core/_util'; 8 | import App from '../core/App'; 9 | import * as echarts from 'echarts'; 10 | import {PieChart} from 'echarts/charts'; 11 | import {TitleComponent, TooltipComponent, GridComponent, DataZoomComponent} from 'echarts/components'; 12 | import {CanvasRenderer} from 'echarts/renderers'; 13 | 14 | // 注册所需的组件和渲染器 15 | echarts.use([ 16 | PieChart, 17 | TitleComponent, 18 | TooltipComponent, 19 | GridComponent, 20 | DataZoomComponent, 21 | CanvasRenderer, 22 | ]); 23 | 24 | @App([]) 25 | class Categories { 26 | 27 | /** 28 | * 图表 29 | */ 30 | run_chart() { 31 | 32 | const data = []; 33 | 34 | for (let i = 0; i < MainApp.data.length; i++) { 35 | 36 | const item = MainApp.data[i]; 37 | 38 | data.push({value: item.postCount, name: item.spec.displayName}); 39 | } 40 | 41 | const chartDom = document.querySelector('section.content > .chart'); 42 | 43 | useChart( chartDom, () => { 44 | return { 45 | backgroundColor: '', 46 | title: { 47 | text: '分类统计 📇', 48 | x: 'center', 49 | }, 50 | tooltip: { 51 | formatter: '{a}
{b} : {c} ({d}%)', 52 | }, 53 | grid: { 54 | containLabel: true, 55 | bottom: '0%', 56 | left: '5%', 57 | right: '5%', 58 | }, 59 | legend: { 60 | icon: 'circle', 61 | y: '95%', 62 | bottom: 'center', 63 | }, 64 | series: [ 65 | { 66 | name: '分类统计', 67 | type: 'pie', 68 | radius: [40, 150], 69 | center: ['50%', '48%'], 70 | roseType: 'area', 71 | itemStyle: { 72 | borderRadius: 8, 73 | }, 74 | label: { 75 | formatter: '{b} : {c} ({d}%)', 76 | }, 77 | data, 78 | }, 79 | ], 80 | }; 81 | 82 | }); 83 | } 84 | } 85 | 86 | 87 | -------------------------------------------------------------------------------- /src/js/page/category.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2024/6/20 3 | * @author: 小红 4 | * @fileName: category 5 | * @Description: 分类详情 6 | */ 7 | 8 | import App from '../core/App'; 9 | import Pagination from '../modules/Pagination'; 10 | 11 | @App([Pagination]) 12 | class Category { 13 | 14 | } -------------------------------------------------------------------------------- /src/js/page/index.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2023/10/8 3 | * @author: 小红 4 | * @fileName: index 5 | * @Description: 首页 6 | */ 7 | import $ from 'jquery'; 8 | import Typed from 'typed.js'; 9 | import App from '../core/App'; 10 | import Pagination from '../modules/Pagination'; 11 | 12 | @App([Pagination]) 13 | class Index { 14 | /** 15 | * 打字机 16 | */ 17 | run_typewriter() { 18 | if(!document.querySelector('.above-subtitle--text')) return; 19 | 20 | const {typewriter_custom_text, enable_typewriter_random_text, typewriter_random_api, typewriter_api_value_format} = MainApp.conf; 21 | 22 | // 创建打字鸡 23 | const useTyped = (strings) => { 24 | new Typed('.above-subtitle--text', { 25 | strings, 26 | startDelay: 300, 27 | typeSpeed: 200, 28 | loop: true, 29 | backSpeed: 50, 30 | }); 31 | }; 32 | 33 | 34 | // 随机文字 35 | if(enable_typewriter_random_text) { 36 | $.ajax({ 37 | url: typewriter_random_api, 38 | type: 'get', 39 | success: (response) => { 40 | // 文本情况 41 | if(typeof response === 'string') { 42 | return useTyped([response]); 43 | } 44 | 45 | if(typewriter_api_value_format) { 46 | return useTyped(['随机文案API返回数据格式为JSON，请配置取值格式！']); 47 | } 48 | 49 | //json 情况 50 | const text = typewriter_api_value_format.split('.').reduce((o, i) => o[i], response); 51 | useTyped([text]); 52 | }, 53 | error: (err) => { 54 | useTyped(['获取随机文案失败，请检查API是否正常！']); 55 | }, 56 | }); 57 | return; 58 | } 59 | 60 | // 自定义文字 61 | let text = typewriter_custom_text.replaceAll('\n', '').split('|&|'); 62 | 63 | if(!text || text.toString() === '') { 64 | text = ['请填写打字文案或者配置随机文案！']; 65 | } 66 | 67 | // 其他情况 68 | useTyped(text); 69 | } 70 | } 71 | -------------------------------------------------------------------------------- /src/js/page/links.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2024/5/23 3 | * @author: 小红 4 | * @fileName: Links 5 | * @Description: 链接 6 | */ 7 | 8 | import App from '../core/App'; 9 | 10 | @App([]) 11 | class Links { 12 | 13 | } -------------------------------------------------------------------------------- /src/js/page/moments.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2024/6/21 3 | * @author: moments 4 | * @fileName: single 5 | * @Description: 瞬间 6 | */ 7 | 8 | import App from '../core/App'; 9 | import AmplifyImg from '../modules/AmplifyImg'; 10 | 11 | 12 | @App([AmplifyImg]) 13 | class Moments { 14 | 15 | 16 | } -------------------------------------------------------------------------------- /src/js/page/photos.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2024/6/21 3 | * @author: 小红 4 | * @fileName: photos 5 | * @Description: 图库 6 | */ 7 | 8 | import {getQueryParams} from '../core/_util'; 9 | import AmplifyImg from '../modules/AmplifyImg'; 10 | import App from '../core/App'; 11 | 12 | @App([AmplifyImg]) 13 | class Photos { 14 | run_active_group() { 15 | const params = getQueryParams(); 16 | 17 | const items = document.querySelectorAll('.groups-item'); 18 | 19 | for (let i = 0; i < items.length; i++) { 20 | const item = items[i]; 21 | 22 | if(window.location.search === '') { 23 | items[0].classList.add('active'); 24 | break; 25 | } 26 | 27 | if(item.dataset.group === params.group) { 28 | item.classList.add('active'); 29 | break; 30 | } 31 | } 32 | 33 | } 34 | } -------------------------------------------------------------------------------- /src/js/page/post.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2024/3/17 3 | * @author: 小红 4 | * @fileName: post 5 | * @Description: 文章 6 | */ 7 | 8 | import App from '../core/App'; 9 | import codeBlock from '../modules/CodeBlock'; 10 | import Render from '../modules/Render'; 11 | import AmplifyImg from '../modules/AmplifyImg'; 12 | 13 | @App([Render, codeBlock, AmplifyImg]) 14 | class Post { 15 | run_meta() { 16 | const render = document.querySelector('article.render'); 17 | const wordCount = document.querySelector('.wordCount > span'); 18 | const clock = document.querySelector('.clock > span'); 19 | 20 | wordCount.textContent = `字数总计 ${render.textContent.length} 字`; 21 | clock.textContent = `阅读时间 ${Math.ceil(render.textContent.length / 500)} 分钟`; 22 | } 23 | } 24 | -------------------------------------------------------------------------------- /src/js/page/single.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2024/6/21 3 | * @author: 小红 4 | * @fileName: single 5 | * @Description: 自定义页面 6 | */ 7 | 8 | import App from '../core/App'; 9 | import codeBlock from '../modules/CodeBlock'; 10 | import Render from '../modules/Render'; 11 | import AmplifyImg from '../modules/AmplifyImg'; 12 | 13 | @App([Render, codeBlock, AmplifyImg]) 14 | class Single { 15 | 16 | } -------------------------------------------------------------------------------- /src/js/page/tag.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2024/5/23 3 | * @author: 小红 4 | * @fileName: tag 5 | * @Description: 标签 6 | */ 7 | 8 | import App from '../core/App'; 9 | import Pagination from '../modules/Pagination'; 10 | 11 | @App([Pagination]) 12 | class Tag { 13 | 14 | } -------------------------------------------------------------------------------- /src/plugins/cursor/simple.min.css: -------------------------------------------------------------------------------- 1 | body {--cursor-default: url(/themes/theme-butterfly/assets/plugins/cursor/simple/default.cur), auto;--cursor-pointer: url(/themes/theme-butterfly/assets/plugins/cursor/simple/pointer.cur), auto;cursor: var(--cursor-default);a, button {cursor: var(--cursor-pointer);}} -------------------------------------------------------------------------------- /src/plugins/cursor/simple/default.cur: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/plugins/cursor/simple/default.cur -------------------------------------------------------------------------------- /src/plugins/cursor/simple/pointer.cur: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/plugins/cursor/simple/pointer.cur -------------------------------------------------------------------------------- /src/plugins/fontawesome/webfonts/fa-brands-400.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/plugins/fontawesome/webfonts/fa-brands-400.ttf -------------------------------------------------------------------------------- /src/plugins/fontawesome/webfonts/fa-brands-400.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/plugins/fontawesome/webfonts/fa-brands-400.woff2 -------------------------------------------------------------------------------- /src/plugins/fontawesome/webfonts/fa-duotone-900.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/plugins/fontawesome/webfonts/fa-duotone-900.ttf -------------------------------------------------------------------------------- /src/plugins/fontawesome/webfonts/fa-duotone-900.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/plugins/fontawesome/webfonts/fa-duotone-900.woff2 -------------------------------------------------------------------------------- /src/plugins/fontawesome/webfonts/fa-light-300.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/plugins/fontawesome/webfonts/fa-light-300.ttf -------------------------------------------------------------------------------- /src/plugins/fontawesome/webfonts/fa-light-300.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/plugins/fontawesome/webfonts/fa-light-300.woff2 -------------------------------------------------------------------------------- /src/plugins/fontawesome/webfonts/fa-regular-400.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/plugins/fontawesome/webfonts/fa-regular-400.ttf -------------------------------------------------------------------------------- /src/plugins/fontawesome/webfonts/fa-regular-400.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/plugins/fontawesome/webfonts/fa-regular-400.woff2 -------------------------------------------------------------------------------- /src/plugins/fontawesome/webfonts/fa-solid-900.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/plugins/fontawesome/webfonts/fa-solid-900.ttf -------------------------------------------------------------------------------- /src/plugins/fontawesome/webfonts/fa-solid-900.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/plugins/fontawesome/webfonts/fa-solid-900.woff2 -------------------------------------------------------------------------------- /src/plugins/fontawesome/webfonts/fa-thin-100.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/plugins/fontawesome/webfonts/fa-thin-100.ttf -------------------------------------------------------------------------------- /src/plugins/fontawesome/webfonts/fa-thin-100.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/plugins/fontawesome/webfonts/fa-thin-100.woff2 -------------------------------------------------------------------------------- /src/plugins/fontawesome/webfonts/fa-v4compatibility.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/plugins/fontawesome/webfonts/fa-v4compatibility.ttf -------------------------------------------------------------------------------- /src/plugins/fontawesome/webfonts/fa-v4compatibility.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dhjddcn/halo-theme-butterfly/de9046b47a8e04c3db85170e356dde9e68f26d77/src/plugins/fontawesome/webfonts/fa-v4compatibility.woff2 -------------------------------------------------------------------------------- /src/plugins/loading/circle.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2024/8/6 3 | * @author: 小红 4 | * @fileName: Circle 5 | * @Description: 加载loading 6 | */ 7 | 8 | class Circle { 9 | cssText = ` 10 | .loading-container { 11 | display: flex; 12 | justify-content: center; 13 | align-items: center; 14 | width:100vw; 15 | height:100vh; 16 | } 17 | .loading-body { 18 | position: relative; 19 | border: 4px solid rgba(0, 0, 0, .3); 20 | border-left-color: transparent; 21 | border-radius: 50%; 22 | width: 36px; 23 | height: 36px; 24 | animation: spin89345 1s linear infinite; 25 | } 26 | 27 | html[data-color-scheme="dark"] .loading-body { 28 | border: 4px solid rgba(118 ,104 ,104 , 0.3); 29 | border-left-color: rgb(225,225,225); 30 | } 31 | 32 | @keyframes spin89345 { 33 | 0% { 34 | transform: rotate(0deg); 35 | } 36 | 37 | 100% { 38 | transform: rotate(360deg); 39 | } 40 | } 41 | `; 42 | style = document.createElement('style'); 43 | container = document.createElement('div'); 44 | 45 | constructor() { 46 | this.style.textContent = this.cssText; 47 | document.head.appendChild(this.style); 48 | } 49 | 50 | start() { 51 | this.container.className = 'loading-container'; 52 | this.container.innerHTML = ``; 53 | document.body.appendChild(this.container); 54 | } 55 | 56 | destroy() { 57 | document.body.classList.remove('loading'); 58 | this.container.remove(); 59 | this.style.remove(); 60 | } 61 | } 62 | 63 | const Loading = new Circle(); 64 | 65 | Loading.start(); 66 | 67 | window.addEventListener('load', () => Loading.destroy()); 68 | -------------------------------------------------------------------------------- /src/plugins/loading/cross_line.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2023/1/20 3 | * @author: 小红 4 | * @fileName: cross_line 5 | * @Description: 彩色旋转加载loading 6 | */ 7 | 8 | class CrossLine { 9 | cssText = ` 10 | .loading-container { 11 | display: flex; 12 | justify-content: center; 13 | align-items: center; 14 | width:100vw; 15 | height:100vh; 16 | } 17 | .loading-body { 18 | position: relative; 19 | width: 2.5em; 20 | height: 2.5em; 21 | transform: rotate(165deg); 22 | } 23 | 24 | .loading-body:before, .loading-body:after { 25 | content: ""; 26 | position: absolute; 27 | top: 50%; 28 | left: 50%; 29 | display: block; 30 | width: 0.5em; 31 | height: 0.5em; 32 | border-radius: 0.25em; 33 | transform: translate(-50%, -50%); 34 | } 35 | 36 | .loading-body:before { 37 | animation: before8 2s infinite; 38 | } 39 | 40 | .loading-body:after { 41 | animation: after6 2s infinite; 42 | } 43 | 44 | @keyframes before8 { 45 | 0% { 46 | width: 0.5em; 47 | box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); 48 | } 49 | 50 | 35% { 51 | width: 2.5em; 52 | box-shadow: 0 -0.5em rgba(225, 20, 98, 0.75), 0 0.5em rgba(111, 202, 220, 0.75); 53 | } 54 | 55 | 70% { 56 | width: 0.5em; 57 | box-shadow: -1em -0.5em rgba(225, 20, 98, 0.75), 1em 0.5em rgba(111, 202, 220, 0.75); 58 | } 59 | 60 | 100% { 61 | box-shadow: 1em -0.5em rgba(225, 20, 98, 0.75), -1em 0.5em rgba(111, 202, 220, 0.75); 62 | } 63 | } 64 | 65 | @keyframes after6 { 66 | 0% { 67 | height: 0.5em; 68 | box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); 69 | } 70 | 71 | 35% { 72 | height: 2.5em; 73 | box-shadow: 0.5em 0 rgba(61, 184, 143, 0.75), -0.5em 0 rgba(233, 169, 32, 0.75); 74 | } 75 | 76 | 70% { 77 | height: 0.5em; 78 | box-shadow: 0.5em -1em rgba(61, 184, 143, 0.75), -0.5em 1em rgba(233, 169, 32, 0.75); 79 | } 80 | 81 | 100% { 82 | box-shadow: 0.5em 1em rgba(61, 184, 143, 0.75), -0.5em -1em rgba(233, 169, 32, 0.75); 83 | } 84 | }`; 85 | style = document.createElement('style'); 86 | container = document.createElement('div'); 87 | 88 | constructor() { 89 | this.style.textContent = this.cssText; 90 | document.head.appendChild(this.style); 91 | } 92 | 93 | start() { 94 | this.container.className = 'loading-container'; 95 | this.container.innerHTML = `
`; 96 | document.body.appendChild(this.container); 97 | } 98 | 99 | destroy() { 100 | document.body.classList.remove('loading'); 101 | this.container.remove(); 102 | this.style.remove(); 103 | } 104 | } 105 | 106 | const Loading = new CrossLine(); 107 | 108 | Loading.start(); 109 | 110 | window.addEventListener('load', () => Loading.destroy()); 111 | 112 | -------------------------------------------------------------------------------- /src/plugins/loading/dot.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2024/7/18 3 | * @author: 小红 4 | * @fileName: dot 5 | * @Description:小圆点 6 | */ 7 | 8 | class Dot { 9 | cssText = ` 10 | .loading-container { 11 | display: flex; 12 | justify-content: center; 13 | align-items: center; 14 | width:100vw; 15 | height:100vh; 16 | } 17 | .dot { 18 | animation: rotate 1s infinite; 19 | height: 50px; 20 | width: 50px; 21 | } 22 | 23 | .dot:before, 24 | .dot:after { 25 | border-radius: 50%; 26 | content: ''; 27 | display: block; 28 | height: 20px; 29 | width: 20px; 30 | } 31 | 32 | .dot:before { 33 | animation: ball1 1s infinite; 34 | background-color: #cb2025; 35 | box-shadow: 30px 0 0 #f8b334; 36 | margin-bottom: 10px; 37 | } 38 | 39 | .dot:after { 40 | animation: ball2 1s infinite; 41 | background-color: #00a096; 42 | box-shadow: 30px 0 0 #97bf0d; 43 | } 44 | 45 | @keyframes rotate { 46 | 0% { 47 | -webkit-transform: rotate(0deg) scale(0.8); 48 | -moz-transform: rotate(0deg) scale(0.8); 49 | } 50 | 51 | 50% { 52 | -webkit-transform: rotate(360deg) scale(1.2); 53 | -moz-transform: rotate(360deg) scale(1.2); 54 | } 55 | 56 | 100% { 57 | -webkit-transform: rotate(720deg) scale(0.8); 58 | -moz-transform: rotate(720deg) scale(0.8); 59 | } 60 | } 61 | 62 | @keyframes ball1 { 63 | 0% { 64 | box-shadow: 30px 0 0 #f8b334; 65 | } 66 | 67 | 50% { 68 | box-shadow: 0 0 0 #f8b334; 69 | margin-bottom: 0; 70 | -webkit-transform: translate(15px,15px); 71 | -moz-transform: translate(15px, 15px); 72 | } 73 | 74 | 100% { 75 | box-shadow: 30px 0 0 #f8b334; 76 | margin-bottom: 10px; 77 | } 78 | } 79 | 80 | @keyframes ball2 { 81 | 0% { 82 | box-shadow: 30px 0 0 #97bf0d; 83 | } 84 | 85 | 50% { 86 | box-shadow: 0 0 0 #97bf0d; 87 | margin-top: -20px; 88 | -webkit-transform: translate(15px,15px); 89 | -moz-transform: translate(15px, 15px); 90 | } 91 | 92 | 100% { 93 | box-shadow: 30px 0 0 #97bf0d; 94 | margin-top: 0; 95 | } 96 | } 97 | `; 98 | style = document.createElement('style'); 99 | container = document.createElement('div'); 100 | 101 | constructor() { 102 | this.style.textContent = this.cssText; 103 | document.head.appendChild(this.style); 104 | } 105 | 106 | start() { 107 | this.container.className = 'loading-container'; 108 | this.container.innerHTML = `
`; 109 | document.body.appendChild(this.container); 110 | } 111 | 112 | destroy() { 113 | this.container.remove(); 114 | this.style.remove(); 115 | document.body.classList.remove('loading'); 116 | } 117 | } 118 | 119 | const Loading = new Dot(); 120 | 121 | Loading.start(); 122 | 123 | window.addEventListener('load', () => Loading.destroy()); 124 | 125 | 126 | -------------------------------------------------------------------------------- /src/plugins/loading/hourglass.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2024/8/6 3 | * @author: 小红 4 | * @fileName: hourglass 5 | * @Description: 沙漏加载loading 6 | */ 7 | 8 | class Hourglass { 9 | cssText = ` 10 | .loading-container { 11 | display: flex; 12 | justify-content: center; 13 | align-items: center; 14 | width:100vw; 15 | height:100vh; 16 | } 17 | 18 | .loading-body { 19 | position: relative; 20 | --c1: #673b14; 21 | --c2: #f8b13b; 22 | width: 40px; 23 | height: 80px; 24 | border-top: 4px solid var(--c1); 25 | border-bottom: 4px solid var(--c1); 26 | background: linear-gradient(90deg, var(--c1) 2px, var(--c2) 0 5px,var(--c1) 0) 50%/7px 8px no-repeat; 27 | display: grid; 28 | overflow: hidden; 29 | animation: l5-0 2s infinite linear; 30 | } 31 | 32 | .loading-body::before, 33 | .loading-body::after { 34 | content: ""; 35 | grid-area: 1/1; 36 | width: 75%; 37 | height: calc(50% - 4px); 38 | margin: 0 auto; 39 | border: 2px solid var(--c1); 40 | border-top: 0; 41 | box-sizing: content-box; 42 | border-radius: 0 0 40% 40%; 43 | -webkit-mask: linear-gradient(#000 0 0) bottom/4px 2px no-repeat, 44 | linear-gradient(#000 0 0); 45 | -webkit-mask-composite: destination-out; 46 | mask-composite: exclude; 47 | background: linear-gradient(var(--d,0deg),var(--c2) 50%,#0000 0) bottom /100% 205%, 48 | linear-gradient(var(--c2) 0 0) center/0 100%; 49 | background-repeat: no-repeat; 50 | animation: inherit; 51 | animation-name: l5-1; 52 | } 53 | 54 | .loading-body::after { 55 | transform-origin: 50% calc(100% + 2px); 56 | transform: scaleY(-1); 57 | --s: 3px; 58 | --d: 180deg; 59 | } 60 | 61 | @keyframes l5-0 { 62 | 80% { 63 | transform: rotate(0) 64 | } 65 | 66 | 100% { 67 | transform: rotate(0.5turn) 68 | } 69 | } 70 | 71 | @keyframes l5-1 { 72 | 10%,70% { 73 | background-size: 100% 205%,var(--s,0) 100% 74 | } 75 | 76 | 70%,100% { 77 | background-position: top,center 78 | } 79 | } 80 | `; 81 | style = document.createElement('style'); 82 | container = document.createElement('div'); 83 | 84 | constructor() { 85 | this.style.textContent = this.cssText; 86 | document.head.appendChild(this.style); 87 | } 88 | 89 | start() { 90 | this.container.className = 'loading-container'; 91 | this.container.innerHTML = ``; 92 | document.body.appendChild(this.container); 93 | } 94 | 95 | destroy() { 96 | document.body.classList.remove('loading'); 97 | this.container.remove(); 98 | this.style.remove(); 99 | } 100 | } 101 | 102 | const Loading = new Hourglass(); 103 | 104 | Loading.start(); 105 | 106 | window.addEventListener('load', () => Loading.destroy()); 107 | -------------------------------------------------------------------------------- /src/plugins/prism/themes/prism-a11y-dark.css: -------------------------------------------------------------------------------- 1 | /** 2 | * a11y-dark theme for JavaScript, CSS, and HTML 3 | * Based on the okaidia theme: https://github.com/PrismJS/prism/blob/gh-pages/themes/prism-okaidia.css 4 | * @author ericwbailey 5 | */ 6 | 7 | code[class*="language-"], 8 | pre[class*="language-"] { 9 | color: #f8f8f2; 10 | background: none; 11 | font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace; 12 | text-align: left; 13 | white-space: pre; 14 | word-spacing: normal; 15 | word-break: normal; 16 | word-wrap: normal; 17 | line-height: 1.5; 18 | 19 | -moz-tab-size: 4; 20 | -o-tab-size: 4; 21 | tab-size: 4; 22 | 23 | -webkit-hyphens: none; 24 | -moz-hyphens: none; 25 | -ms-hyphens: none; 26 | hyphens: none; 27 | } 28 | 29 | /* Code blocks */ 30 | pre[class*="language-"] { 31 | padding: 1em; 32 | margin: 0.5em 0; 33 | overflow: auto; 34 | border-radius: 0.3em; 35 | } 36 | 37 | :not(pre) > code[class*="language-"], 38 | pre[class*="language-"] { 39 | background: #2b2b2b; 40 | } 41 | 42 | /* Inline code */ 43 | :not(pre) > code[class*="language-"] { 44 | padding: 0.1em; 45 | border-radius: 0.3em; 46 | white-space: normal; 47 | } 48 | 49 | .token.comment, 50 | .token.prolog, 51 | .token.doctype, 52 | .token.cdata { 53 | color: #d4d0ab; 54 | } 55 | 56 | .token.punctuation { 57 | color: #fefefe; 58 | } 59 | 60 | .token.property, 61 | .token.tag, 62 | .token.constant, 63 | .token.symbol, 64 | .token.deleted { 65 | color: #ffa07a; 66 | } 67 | 68 | .token.boolean, 69 | .token.number { 70 | color: #00e0e0; 71 | } 72 | 73 | .token.selector, 74 | .token.attr-name, 75 | .token.string, 76 | .token.char, 77 | .token.builtin, 78 | .token.inserted { 79 | color: #abe338; 80 | } 81 | 82 | .token.operator, 83 | .token.entity, 84 | .token.url, 85 | .language-css .token.string, 86 | .style .token.string, 87 | .token.variable { 88 | color: #00e0e0; 89 | } 90 | 91 | .token.atrule, 92 | .token.attr-value, 93 | .token.function { 94 | color: #ffd700; 95 | } 96 | 97 | .token.keyword { 98 | color: #00e0e0; 99 | } 100 | 101 | .token.regex, 102 | .token.important { 103 | color: #ffd700; 104 | } 105 | 106 | .token.important, 107 | .token.bold { 108 | font-weight: bold; 109 | } 110 | 111 | .token.italic { 112 | font-style: italic; 113 | } 114 | 115 | .token.entity { 116 | cursor: help; 117 | } 118 | 119 | @media screen and (-ms-high-contrast: active) { 120 | code[class*="language-"], 121 | pre[class*="language-"] { 122 | color: windowText; 123 | background: window; 124 | } 125 | 126 | :not(pre) > code[class*="language-"], 127 | pre[class*="language-"] { 128 | background: window; 129 | } 130 | 131 | .token.important { 132 | background: highlight; 133 | color: window; 134 | font-weight: normal; 135 | } 136 | 137 | .token.atrule, 138 | .token.attr-value, 139 | .token.function, 140 | .token.keyword, 141 | .token.operator, 142 | .token.selector { 143 | font-weight: bold; 144 | } 145 | 146 | .token.attr-value, 147 | .token.comment, 148 | .token.doctype, 149 | .token.function, 150 | .token.keyword, 151 | .token.operator, 152 | .token.property, 153 | .token.string { 154 | color: highlight; 155 | } 156 | 157 | .token.attr-value, 158 | .token.url { 159 | font-weight: normal; 160 | } 161 | } 162 | -------------------------------------------------------------------------------- /src/plugins/prism/themes/prism-atom-dark.css: -------------------------------------------------------------------------------- 1 | /** 2 | * atom-dark theme for `prism.js` 3 | * Based on Atom's `atom-dark` theme: https://github.com/atom/atom-dark-syntax 4 | * @author Joe Gibson (@gibsjose) 5 | */ 6 | 7 | code[class*="language-"], 8 | pre[class*="language-"] { 9 | color: #c5c8c6; 10 | text-shadow: 0 1px rgba(0, 0, 0, 0.3); 11 | font-family: Inconsolata, Monaco, Consolas, 'Courier New', Courier, monospace; 12 | direction: ltr; 13 | text-align: left; 14 | white-space: pre; 15 | word-spacing: normal; 16 | word-break: normal; 17 | line-height: 1.5; 18 | 19 | -moz-tab-size: 4; 20 | -o-tab-size: 4; 21 | tab-size: 4; 22 | 23 | -webkit-hyphens: none; 24 | -moz-hyphens: none; 25 | -ms-hyphens: none; 26 | hyphens: none; 27 | } 28 | 29 | /* Code blocks */ 30 | pre[class*="language-"] { 31 | padding: 1em; 32 | margin: .5em 0; 33 | overflow: auto; 34 | border-radius: 0.3em; 35 | } 36 | 37 | :not(pre) > code[class*="language-"], 38 | pre[class*="language-"] { 39 | background: #1d1f21; 40 | } 41 | 42 | /* Inline code */ 43 | :not(pre) > code[class*="language-"] { 44 | padding: .1em; 45 | border-radius: .3em; 46 | } 47 | 48 | .token.comment, 49 | .token.prolog, 50 | .token.doctype, 51 | .token.cdata { 52 | color: #7C7C7C; 53 | } 54 | 55 | .token.punctuation { 56 | color: #c5c8c6; 57 | } 58 | 59 | .namespace { 60 | opacity: .7; 61 | } 62 | 63 | .token.property, 64 | .token.keyword, 65 | .token.tag { 66 | color: #96CBFE; 67 | } 68 | 69 | .token.class-name { 70 | color: #FFFFB6; 71 | text-decoration: underline; 72 | } 73 | 74 | .token.boolean, 75 | .token.constant { 76 | color: #99CC99; 77 | } 78 | 79 | .token.symbol, 80 | .token.deleted { 81 | color: #f92672; 82 | } 83 | 84 | .token.number { 85 | color: #FF73FD; 86 | } 87 | 88 | .token.selector, 89 | .token.attr-name, 90 | .token.string, 91 | .token.char, 92 | .token.builtin, 93 | .token.inserted { 94 | color: #A8FF60; 95 | } 96 | 97 | .token.variable { 98 | color: #C6C5FE; 99 | } 100 | 101 | .token.operator { 102 | color: #EDEDED; 103 | } 104 | 105 | .token.entity { 106 | color: #FFFFB6; 107 | cursor: help; 108 | } 109 | 110 | .token.url { 111 | color: #96CBFE; 112 | } 113 | 114 | .language-css .token.string, 115 | .style .token.string { 116 | color: #87C38A; 117 | } 118 | 119 | .token.atrule, 120 | .token.attr-value { 121 | color: #F9EE98; 122 | } 123 | 124 | .token.function { 125 | color: #DAD085; 126 | } 127 | 128 | .token.regex { 129 | color: #E9C062; 130 | } 131 | 132 | .token.important { 133 | color: #fd971f; 134 | } 135 | 136 | .token.important, 137 | .token.bold { 138 | font-weight: bold; 139 | } 140 | 141 | .token.italic { 142 | font-style: italic; 143 | } 144 | -------------------------------------------------------------------------------- /src/plugins/prism/themes/prism-base16-ateliersulphurpool.light.css: -------------------------------------------------------------------------------- 1 | /* 2 | 3 | Name: Base16 Atelier Sulphurpool Light 4 | Author: Bram de Haan (http://atelierbram.github.io/syntax-highlighting/atelier-schemes/sulphurpool) 5 | 6 | Prism template by Bram de Haan (http://atelierbram.github.io/syntax-highlighting/prism/) 7 | Original Base16 color scheme by Chris Kempson (https://github.com/chriskempson/base16) 8 | 9 | */ 10 | code[class*="language-"], 11 | pre[class*="language-"] { 12 | font-family: Consolas, Menlo, Monaco, "Andale Mono WT", "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", "Courier New", Courier, monospace; 13 | font-size: 14px; 14 | line-height: 1.375; 15 | direction: ltr; 16 | text-align: left; 17 | white-space: pre; 18 | word-spacing: normal; 19 | word-break: normal; 20 | -moz-tab-size: 4; 21 | -o-tab-size: 4; 22 | tab-size: 4; 23 | -webkit-hyphens: none; 24 | -moz-hyphens: none; 25 | -ms-hyphens: none; 26 | hyphens: none; 27 | background: #f5f7ff; 28 | color: #5e6687; 29 | } 30 | 31 | pre > code[class*="language-"] { 32 | font-size: 1em; 33 | } 34 | 35 | pre[class*="language-"]::-moz-selection, pre[class*="language-"] ::-moz-selection, 36 | code[class*="language-"]::-moz-selection, code[class*="language-"] ::-moz-selection { 37 | text-shadow: none; 38 | background: #dfe2f1; 39 | } 40 | 41 | pre[class*="language-"]::selection, pre[class*="language-"] ::selection, 42 | code[class*="language-"]::selection, code[class*="language-"] ::selection { 43 | text-shadow: none; 44 | background: #dfe2f1; 45 | } 46 | 47 | /* Code blocks */ 48 | pre[class*="language-"] { 49 | padding: 1em; 50 | margin: .5em 0; 51 | overflow: auto; 52 | } 53 | 54 | /* Inline code */ 55 | :not(pre) > code[class*="language-"] { 56 | padding: .1em; 57 | border-radius: .3em; 58 | } 59 | 60 | .token.comment, 61 | .token.prolog, 62 | .token.doctype, 63 | .token.cdata { 64 | color: #898ea4; 65 | } 66 | 67 | .token.punctuation { 68 | color: #5e6687; 69 | } 70 | 71 | .token.namespace { 72 | opacity: .7; 73 | } 74 | 75 | .token.operator, 76 | .token.boolean, 77 | .token.number { 78 | color: #c76b29; 79 | } 80 | 81 | .token.property { 82 | color: #c08b30; 83 | } 84 | 85 | .token.tag { 86 | color: #3d8fd1; 87 | } 88 | 89 | .token.string { 90 | color: #22a2c9; 91 | } 92 | 93 | .token.selector { 94 | color: #6679cc; 95 | } 96 | 97 | .token.attr-name { 98 | color: #c76b29; 99 | } 100 | 101 | .token.entity, 102 | .token.url, 103 | .language-css .token.string, 104 | .style .token.string { 105 | color: #22a2c9; 106 | } 107 | 108 | .token.attr-value, 109 | .token.keyword, 110 | .token.control, 111 | .token.directive, 112 | .token.unit { 113 | color: #ac9739; 114 | } 115 | 116 | .token.statement, 117 | .token.regex, 118 | .token.atrule { 119 | color: #22a2c9; 120 | } 121 | 122 | .token.placeholder, 123 | .token.variable { 124 | color: #3d8fd1; 125 | } 126 | 127 | .token.deleted { 128 | text-decoration: line-through; 129 | } 130 | 131 | .token.inserted { 132 | border-bottom: 1px dotted #202746; 133 | text-decoration: none; 134 | } 135 | 136 | .token.italic { 137 | font-style: italic; 138 | } 139 | 140 | .token.important, 141 | .token.bold { 142 | font-weight: bold; 143 | } 144 | 145 | .token.important { 146 | color: #c94922; 147 | } 148 | 149 | .token.entity { 150 | cursor: help; 151 | } 152 | 153 | pre > code.highlight { 154 | outline: 0.4em solid #c94922; 155 | outline-offset: .4em; 156 | } 157 | 158 | /* overrides color-values for the Line Numbers plugin 159 | * http://prismjs.com/plugins/line-numbers/ 160 | */ 161 | .line-numbers .line-numbers-rows { 162 | border-right-color: #dfe2f1; 163 | } 164 | 165 | .line-numbers-rows > span:before { 166 | color: #979db4; 167 | } 168 | 169 | /* overrides color-values for the Line Highlight plugin 170 | * http://prismjs.com/plugins/line-highlight/ 171 | */ 172 | .line-highlight { 173 | background: rgba(107, 115, 148, 0.2); 174 | background: -webkit-linear-gradient(left, rgba(107, 115, 148, 0.2) 70%, rgba(107, 115, 148, 0)); 175 | background: linear-gradient(to right, rgba(107, 115, 148, 0.2) 70%, rgba(107, 115, 148, 0)); 176 | } 177 | -------------------------------------------------------------------------------- /src/plugins/prism/themes/prism-cb.css: -------------------------------------------------------------------------------- 1 | /* 2 | * Based on Plugin: Syntax Highlighter CB 3 | * Plugin URI: http://wp.tutsplus.com/tutorials/plugins/adding-a-syntax-highlighter-shortcode-using-prism-js 4 | * Description: Highlight your code snippets with an easy to use shortcode based on Lea Verou's Prism.js. 5 | * Version: 1.0.0 6 | * Author: c.bavota 7 | * Author URI: http://bavotasan.comhttp://wp.tutsplus.com/tutorials/plugins/adding-a-syntax-highlighter-shortcode-using-prism-js/ */ 8 | /* http://cbavota.bitbucket.org/syntax-highlighter/ */ 9 | 10 | /* ===== ===== */ 11 | code[class*="language-"], 12 | pre[class*="language-"] { 13 | color: #fff; 14 | text-shadow: 0 1px 1px #000; 15 | font-family: Menlo, Monaco, "Courier New", monospace; 16 | direction: ltr; 17 | text-align: left; 18 | word-spacing: normal; 19 | white-space: pre; 20 | word-wrap: normal; 21 | line-height: 1.4; 22 | background: none; 23 | border: 0; 24 | 25 | -moz-tab-size: 4; 26 | -o-tab-size: 4; 27 | tab-size: 4; 28 | 29 | -webkit-hyphens: none; 30 | -moz-hyphens: none; 31 | -ms-hyphens: none; 32 | hyphens: none; 33 | } 34 | 35 | pre[class*="language-"] code { 36 | float: left; 37 | padding: 0 15px 0 0; 38 | } 39 | 40 | pre[class*="language-"], 41 | :not(pre) > code[class*="language-"] { 42 | background: #222; 43 | } 44 | 45 | /* Code blocks */ 46 | pre[class*="language-"] { 47 | padding: 15px; 48 | margin: 1em 0; 49 | overflow: auto; 50 | -moz-border-radius: 8px; 51 | -webkit-border-radius: 8px; 52 | border-radius: 8px; 53 | } 54 | 55 | /* Inline code */ 56 | :not(pre) > code[class*="language-"] { 57 | padding: 5px 10px; 58 | line-height: 1; 59 | -moz-border-radius: 3px; 60 | -webkit-border-radius: 3px; 61 | border-radius: 3px; 62 | } 63 | 64 | .token.comment, 65 | .token.prolog, 66 | .token.doctype, 67 | .token.cdata { 68 | color: #797979; 69 | } 70 | 71 | .token.selector, 72 | .token.operator, 73 | .token.punctuation { 74 | color: #fff; 75 | } 76 | 77 | .token.namespace { 78 | opacity: .7; 79 | } 80 | 81 | .token.tag, 82 | .token.boolean { 83 | color: #ffd893; 84 | } 85 | 86 | .token.atrule, 87 | .token.attr-value, 88 | .token.hex, 89 | .token.string { 90 | color: #B0C975; 91 | } 92 | 93 | .token.property, 94 | .token.entity, 95 | .token.url, 96 | .token.attr-name, 97 | .token.keyword { 98 | color: #c27628; 99 | } 100 | 101 | .token.regex { 102 | color: #9B71C6; 103 | } 104 | 105 | .token.entity { 106 | cursor: help; 107 | } 108 | 109 | .token.function, 110 | .token.constant { 111 | color: #e5a638; 112 | } 113 | 114 | .token.variable { 115 | color: #fdfba8; 116 | } 117 | 118 | .token.number { 119 | color: #8799B0; 120 | } 121 | 122 | .token.important, 123 | .token.deliminator { 124 | color: #E45734; 125 | } 126 | 127 | /* Line highlight plugin */ 128 | pre[data-line] { 129 | position: relative; 130 | padding: 1em 0 1em 3em; 131 | } 132 | 133 | .line-highlight { 134 | position: absolute; 135 | left: 0; 136 | right: 0; 137 | margin-top: 1em; /* Same as .prism's padding-top */ 138 | background: rgba(255, 255, 255, .2); 139 | pointer-events: none; 140 | line-height: inherit; 141 | white-space: pre; 142 | } 143 | 144 | .line-highlight:before, 145 | .line-highlight[data-end]:after { 146 | content: attr(data-start); 147 | position: absolute; 148 | top: .3em; 149 | left: .6em; 150 | min-width: 1em; 151 | padding: 0 .5em; 152 | background-color: rgba(255, 255, 255, .3); 153 | color: #fff; 154 | font: bold 65%/1.5 sans-serif; 155 | text-align: center; 156 | -moz-border-radius: 8px; 157 | -webkit-border-radius: 8px; 158 | border-radius: 8px; 159 | text-shadow: none; 160 | } 161 | 162 | .line-highlight[data-end]:after { 163 | content: attr(data-end); 164 | top: auto; 165 | bottom: .4em; 166 | } 167 | 168 | /* for line numbers */ 169 | .line-numbers-rows { 170 | margin: 0; 171 | } 172 | 173 | .line-numbers-rows span { 174 | padding-right: 10px; 175 | border-right: 3px #d9d336 solid; 176 | } 177 | -------------------------------------------------------------------------------- /src/plugins/prism/themes/prism-coy-without-shadows.css: -------------------------------------------------------------------------------- 1 | /** 2 | * Coy without shadows 3 | * Based on Tim Shedor's Coy theme for prism.js 4 | * Author: RunDevelopment 5 | */ 6 | 7 | code[class*="language-"], 8 | pre[class*="language-"] { 9 | color: black; 10 | background: none; 11 | font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace; 12 | font-size: 1em; 13 | text-align: left; 14 | white-space: pre; 15 | word-spacing: normal; 16 | word-break: normal; 17 | word-wrap: normal; 18 | line-height: 1.5; 19 | 20 | -moz-tab-size: 4; 21 | -o-tab-size: 4; 22 | tab-size: 4; 23 | 24 | -webkit-hyphens: none; 25 | -moz-hyphens: none; 26 | -ms-hyphens: none; 27 | hyphens: none; 28 | } 29 | 30 | /* Code blocks */ 31 | pre[class*="language-"] { 32 | position: relative; 33 | border-left: 10px solid #358ccb; 34 | box-shadow: -1px 0 0 0 #358ccb, 0 0 0 1px #dfdfdf; 35 | background-color: #fdfdfd; 36 | background-image: linear-gradient(transparent 50%, rgba(69, 142, 209, 0.04) 50%); 37 | background-size: 3em 3em; 38 | background-origin: content-box; 39 | background-attachment: local; 40 | margin: .5em 0; 41 | padding: 0 1em; 42 | } 43 | 44 | pre[class*="language-"] > code { 45 | display: block; 46 | } 47 | 48 | /* Inline code */ 49 | :not(pre) > code[class*="language-"] { 50 | position: relative; 51 | padding: .2em; 52 | border-radius: 0.3em; 53 | color: #c92c2c; 54 | border: 1px solid rgba(0, 0, 0, 0.1); 55 | display: inline; 56 | white-space: normal; 57 | background-color: #fdfdfd; 58 | -webkit-box-sizing: border-box; 59 | -moz-box-sizing: border-box; 60 | box-sizing: border-box; 61 | } 62 | 63 | .token.comment, 64 | .token.block-comment, 65 | .token.prolog, 66 | .token.doctype, 67 | .token.cdata { 68 | color: #7D8B99; 69 | } 70 | 71 | .token.punctuation { 72 | color: #5F6364; 73 | } 74 | 75 | .token.property, 76 | .token.tag, 77 | .token.boolean, 78 | .token.number, 79 | .token.function-name, 80 | .token.constant, 81 | .token.symbol, 82 | .token.deleted { 83 | color: #c92c2c; 84 | } 85 | 86 | .token.selector, 87 | .token.attr-name, 88 | .token.string, 89 | .token.char, 90 | .token.function, 91 | .token.builtin, 92 | .token.inserted { 93 | color: #2f9c0a; 94 | } 95 | 96 | .token.operator, 97 | .token.entity, 98 | .token.url, 99 | .token.variable { 100 | color: #a67f59; 101 | background: rgba(255, 255, 255, 0.5); 102 | } 103 | 104 | .token.atrule, 105 | .token.attr-value, 106 | .token.keyword, 107 | .token.class-name { 108 | color: #1990b8; 109 | } 110 | 111 | .token.regex, 112 | .token.important { 113 | color: #e90; 114 | } 115 | 116 | .language-css .token.string, 117 | .style .token.string { 118 | color: #a67f59; 119 | background: rgba(255, 255, 255, 0.5); 120 | } 121 | 122 | .token.important { 123 | font-weight: normal; 124 | } 125 | 126 | .token.bold { 127 | font-weight: bold; 128 | } 129 | 130 | .token.italic { 131 | font-style: italic; 132 | } 133 | 134 | .token.entity { 135 | cursor: help; 136 | } 137 | 138 | .token.namespace { 139 | opacity: .7; 140 | } 141 | -------------------------------------------------------------------------------- /src/plugins/prism/themes/prism-darcula.css: -------------------------------------------------------------------------------- 1 | /** 2 | * Darcula theme 3 | * 4 | * Adapted from a theme based on: 5 | * IntelliJ Darcula Theme (https://github.com/bulenkov/Darcula) 6 | * 7 | * @author Alexandre Paradis 8 | * @version 1.0 9 | */ 10 | 11 | code[class*="language-"], 12 | pre[class*="language-"] { 13 | color: #a9b7c6; 14 | font-family: Consolas, Monaco, 'Andale Mono', monospace; 15 | direction: ltr; 16 | text-align: left; 17 | white-space: pre; 18 | word-spacing: normal; 19 | word-break: normal; 20 | line-height: 1.5; 21 | 22 | -moz-tab-size: 4; 23 | -o-tab-size: 4; 24 | tab-size: 4; 25 | 26 | -webkit-hyphens: none; 27 | -moz-hyphens: none; 28 | -ms-hyphens: none; 29 | hyphens: none; 30 | } 31 | 32 | pre[class*="language-"]::-moz-selection, pre[class*="language-"] ::-moz-selection, 33 | code[class*="language-"]::-moz-selection, code[class*="language-"] ::-moz-selection { 34 | color: inherit; 35 | background: rgba(33, 66, 131, .85); 36 | } 37 | 38 | pre[class*="language-"]::selection, pre[class*="language-"] ::selection, 39 | code[class*="language-"]::selection, code[class*="language-"] ::selection { 40 | color: inherit; 41 | background: rgba(33, 66, 131, .85); 42 | } 43 | 44 | /* Code blocks */ 45 | pre[class*="language-"] { 46 | padding: 1em; 47 | margin: .5em 0; 48 | overflow: auto; 49 | } 50 | 51 | :not(pre) > code[class*="language-"], 52 | pre[class*="language-"] { 53 | background: #2b2b2b; 54 | } 55 | 56 | /* Inline code */ 57 | :not(pre) > code[class*="language-"] { 58 | padding: .1em; 59 | border-radius: .3em; 60 | } 61 | 62 | .token.comment, 63 | .token.prolog, 64 | .token.cdata { 65 | color: #808080; 66 | } 67 | 68 | .token.delimiter, 69 | .token.boolean, 70 | .token.keyword, 71 | .token.selector, 72 | .token.important, 73 | .token.atrule { 74 | color: #cc7832; 75 | } 76 | 77 | .token.operator, 78 | .token.punctuation, 79 | .token.attr-name { 80 | color: #a9b7c6; 81 | } 82 | 83 | .token.tag, 84 | .token.tag .punctuation, 85 | .token.doctype, 86 | .token.builtin { 87 | color: #e8bf6a; 88 | } 89 | 90 | .token.entity, 91 | .token.number, 92 | .token.symbol { 93 | color: #6897bb; 94 | } 95 | 96 | .token.property, 97 | .token.constant, 98 | .token.variable { 99 | color: #9876aa; 100 | } 101 | 102 | .token.string, 103 | .token.char { 104 | color: #6a8759; 105 | } 106 | 107 | .token.attr-value, 108 | .token.attr-value .punctuation { 109 | color: #a5c261; 110 | } 111 | 112 | .token.attr-value .punctuation:first-child { 113 | color: #a9b7c6; 114 | } 115 | 116 | .token.url { 117 | color: #287bde; 118 | text-decoration: underline; 119 | } 120 | 121 | .token.function { 122 | color: #ffc66d; 123 | } 124 | 125 | .token.regex { 126 | background: #364135; 127 | } 128 | 129 | .token.bold { 130 | font-weight: bold; 131 | } 132 | 133 | .token.italic { 134 | font-style: italic; 135 | } 136 | 137 | .token.inserted { 138 | background: #294436; 139 | } 140 | 141 | .token.deleted { 142 | background: #484a4a; 143 | } 144 | 145 | code.language-css .token.property, 146 | code.language-css .token.property + .token.punctuation { 147 | color: #a9b7c6; 148 | } 149 | 150 | code.language-css .token.id { 151 | color: #ffc66d; 152 | } 153 | 154 | code.language-css .token.selector > .token.class, 155 | code.language-css .token.selector > .token.attribute, 156 | code.language-css .token.selector > .token.pseudo-class, 157 | code.language-css .token.selector > .token.pseudo-element { 158 | color: #ffc66d; 159 | } 160 | -------------------------------------------------------------------------------- /src/plugins/prism/themes/prism-dracula.css: -------------------------------------------------------------------------------- 1 | /** 2 | * Dracula Theme originally by Zeno Rocha [@zenorocha] 3 | * https://draculatheme.com/ 4 | * 5 | * Ported for PrismJS by Albert Vallverdu [@byverdu] 6 | */ 7 | 8 | code[class*="language-"], 9 | pre[class*="language-"] { 10 | color: #f8f8f2; 11 | background: none; 12 | text-shadow: 0 1px rgba(0, 0, 0, 0.3); 13 | font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace; 14 | text-align: left; 15 | white-space: pre; 16 | word-spacing: normal; 17 | word-break: normal; 18 | word-wrap: normal; 19 | line-height: 1.5; 20 | -moz-tab-size: 4; 21 | -o-tab-size: 4; 22 | tab-size: 4; 23 | -webkit-hyphens: none; 24 | -moz-hyphens: none; 25 | -ms-hyphens: none; 26 | hyphens: none; 27 | } 28 | 29 | /* Code blocks */ 30 | pre[class*="language-"] { 31 | padding: 1em; 32 | margin: .5em 0; 33 | overflow: auto; 34 | border-radius: 0.3em; 35 | } 36 | 37 | :not(pre) > code[class*="language-"], 38 | pre[class*="language-"] { 39 | background: #282a36; 40 | } 41 | 42 | /* Inline code */ 43 | :not(pre) > code[class*="language-"] { 44 | padding: .1em; 45 | border-radius: .3em; 46 | white-space: normal; 47 | } 48 | 49 | .token.comment, 50 | .token.prolog, 51 | .token.doctype, 52 | .token.cdata { 53 | color: #6272a4; 54 | } 55 | 56 | .token.punctuation { 57 | color: #f8f8f2; 58 | } 59 | 60 | .namespace { 61 | opacity: .7; 62 | } 63 | 64 | .token.property, 65 | .token.tag, 66 | .token.constant, 67 | .token.symbol, 68 | .token.deleted { 69 | color: #ff79c6; 70 | } 71 | 72 | .token.boolean, 73 | .token.number { 74 | color: #bd93f9; 75 | } 76 | 77 | .token.selector, 78 | .token.attr-name, 79 | .token.string, 80 | .token.char, 81 | .token.builtin, 82 | .token.inserted { 83 | color: #50fa7b; 84 | } 85 | 86 | .token.operator, 87 | .token.entity, 88 | .token.url, 89 | .language-css .token.string, 90 | .style .token.string, 91 | .token.variable { 92 | color: #f8f8f2; 93 | } 94 | 95 | .token.atrule, 96 | .token.attr-value, 97 | .token.function, 98 | .token.class-name { 99 | color: #f1fa8c; 100 | } 101 | 102 | .token.keyword { 103 | color: #8be9fd; 104 | } 105 | 106 | .token.regex, 107 | .token.important { 108 | color: #ffb86c; 109 | } 110 | 111 | .token.important, 112 | .token.bold { 113 | font-weight: bold; 114 | } 115 | 116 | .token.italic { 117 | font-style: italic; 118 | } 119 | 120 | .token.entity { 121 | cursor: help; 122 | } 123 | -------------------------------------------------------------------------------- /src/plugins/prism/themes/prism-ghcolors.css: -------------------------------------------------------------------------------- 1 | /** 2 | * GHColors theme by Avi Aryan (http://aviaryan.in) 3 | * Inspired by Github syntax coloring 4 | */ 5 | 6 | code[class*="language-"], 7 | pre[class*="language-"] { 8 | color: #393A34; 9 | font-family: "Consolas", "Bitstream Vera Sans Mono", "Courier New", Courier, monospace; 10 | direction: ltr; 11 | text-align: left; 12 | white-space: pre; 13 | word-spacing: normal; 14 | word-break: normal; 15 | font-size: .9em; 16 | line-height: 1.2em; 17 | 18 | -moz-tab-size: 4; 19 | -o-tab-size: 4; 20 | tab-size: 4; 21 | 22 | -webkit-hyphens: none; 23 | -moz-hyphens: none; 24 | -ms-hyphens: none; 25 | hyphens: none; 26 | } 27 | 28 | pre > code[class*="language-"] { 29 | font-size: 1em; 30 | } 31 | 32 | pre[class*="language-"]::-moz-selection, pre[class*="language-"] ::-moz-selection, 33 | code[class*="language-"]::-moz-selection, code[class*="language-"] ::-moz-selection { 34 | background: #b3d4fc; 35 | } 36 | 37 | pre[class*="language-"]::selection, pre[class*="language-"] ::selection, 38 | code[class*="language-"]::selection, code[class*="language-"] ::selection { 39 | background: #b3d4fc; 40 | } 41 | 42 | /* Code blocks */ 43 | pre[class*="language-"] { 44 | padding: 1em; 45 | margin: .5em 0; 46 | overflow: auto; 47 | border: 1px solid #dddddd; 48 | background-color: white; 49 | } 50 | 51 | /* Inline code */ 52 | :not(pre) > code[class*="language-"] { 53 | padding: .2em; 54 | padding-top: 1px; 55 | padding-bottom: 1px; 56 | background: #f8f8f8; 57 | border: 1px solid #dddddd; 58 | } 59 | 60 | .token.comment, 61 | .token.prolog, 62 | .token.doctype, 63 | .token.cdata { 64 | color: #999988; 65 | font-style: italic; 66 | } 67 | 68 | .token.namespace { 69 | opacity: .7; 70 | } 71 | 72 | .token.string, 73 | .token.attr-value { 74 | color: #e3116c; 75 | } 76 | 77 | .token.punctuation, 78 | .token.operator { 79 | color: #393A34; /* no highlight */ 80 | } 81 | 82 | .token.entity, 83 | .token.url, 84 | .token.symbol, 85 | .token.number, 86 | .token.boolean, 87 | .token.variable, 88 | .token.constant, 89 | .token.property, 90 | .token.regex, 91 | .token.inserted { 92 | color: #36acaa; 93 | } 94 | 95 | .token.atrule, 96 | .token.keyword, 97 | .token.attr-name, 98 | .language-autohotkey .token.selector { 99 | color: #00a4db; 100 | } 101 | 102 | .token.function, 103 | .token.deleted, 104 | .language-autohotkey .token.tag { 105 | color: #9a050f; 106 | } 107 | 108 | .token.tag, 109 | .token.selector, 110 | .language-autohotkey .token.keyword { 111 | color: #00009f; 112 | } 113 | 114 | .token.important, 115 | .token.function, 116 | .token.bold { 117 | font-weight: bold; 118 | } 119 | 120 | .token.italic { 121 | font-style: italic; 122 | } 123 | -------------------------------------------------------------------------------- /src/plugins/prism/themes/prism-gruvbox-dark.css: -------------------------------------------------------------------------------- 1 | /** 2 | * Gruvbox dark theme 3 | * 4 | * Adapted from a theme based on: 5 | * Vim Gruvbox dark Theme (https://github.com/morhetz/gruvbox) 6 | * 7 | * @author Azat S. 8 | * @version 1.0 9 | */ 10 | 11 | code[class*="language-"], 12 | pre[class*="language-"] { 13 | color: #ebdbb2; /* fg1 / fg */ 14 | font-family: Consolas, Monaco, "Andale Mono", monospace; 15 | direction: ltr; 16 | text-align: left; 17 | white-space: pre; 18 | word-spacing: normal; 19 | word-break: normal; 20 | line-height: 1.5; 21 | 22 | -moz-tab-size: 4; 23 | -o-tab-size: 4; 24 | tab-size: 4; 25 | 26 | -webkit-hyphens: none; 27 | -moz-hyphens: none; 28 | -ms-hyphens: none; 29 | hyphens: none; 30 | } 31 | 32 | pre[class*="language-"]::-moz-selection, 33 | pre[class*="language-"] ::-moz-selection, 34 | code[class*="language-"]::-moz-selection, 35 | code[class*="language-"] ::-moz-selection { 36 | color: #fbf1c7; /* fg0 */ 37 | background: #7c6f64; /* bg4 */ 38 | } 39 | 40 | pre[class*="language-"]::selection, 41 | pre[class*="language-"] ::selection, 42 | code[class*="language-"]::selection, 43 | code[class*="language-"] ::selection { 44 | color: #fbf1c7; /* fg0 */ 45 | background: #7c6f64; /* bg4 */ 46 | } 47 | 48 | /* Code blocks */ 49 | pre[class*="language-"] { 50 | padding: 1em; 51 | margin: 0.5em 0; 52 | overflow: auto; 53 | } 54 | 55 | :not(pre) > code[class*="language-"], 56 | pre[class*="language-"] { 57 | background: #1d2021; /* bg0_h */ 58 | } 59 | 60 | /* Inline code */ 61 | :not(pre) > code[class*="language-"] { 62 | padding: 0.1em; 63 | border-radius: 0.3em; 64 | } 65 | 66 | .token.comment, 67 | .token.prolog, 68 | .token.cdata { 69 | color: #a89984; /* fg4 / gray1 */ 70 | } 71 | 72 | .token.delimiter, 73 | .token.boolean, 74 | .token.keyword, 75 | .token.selector, 76 | .token.important, 77 | .token.atrule { 78 | color: #fb4934; /* red2 */ 79 | } 80 | 81 | .token.operator, 82 | .token.punctuation, 83 | .token.attr-name { 84 | color: #a89984; /* fg4 / gray1 */ 85 | } 86 | 87 | .token.tag, 88 | .token.tag .punctuation, 89 | .token.doctype, 90 | .token.builtin { 91 | color: #fabd2f; /* yellow2 */ 92 | } 93 | 94 | .token.entity, 95 | .token.number, 96 | .token.symbol { 97 | color: #d3869b; /* purple2 */ 98 | } 99 | 100 | .token.property, 101 | .token.constant, 102 | .token.variable { 103 | color: #fb4934; /* red2 */ 104 | } 105 | 106 | .token.string, 107 | .token.char { 108 | color: #b8bb26; /* green2 */ 109 | } 110 | 111 | .token.attr-value, 112 | .token.attr-value .punctuation { 113 | color: #a89984; /* fg4 / gray1 */ 114 | } 115 | 116 | .token.url { 117 | color: #b8bb26; /* green2 */ 118 | text-decoration: underline; 119 | } 120 | 121 | .token.function { 122 | color: #fabd2f; /* yellow2 */ 123 | } 124 | 125 | .token.regex { 126 | background: #b8bb26; /* green2 */ 127 | } 128 | 129 | .token.bold { 130 | font-weight: bold; 131 | } 132 | 133 | .token.italic { 134 | font-style: italic; 135 | } 136 | 137 | .token.inserted { 138 | background: #a89984; /* fg4 / gray1 */ 139 | } 140 | 141 | .token.deleted { 142 | background: #fb4934; /* red2 */ 143 | } 144 | -------------------------------------------------------------------------------- /src/plugins/prism/themes/prism-gruvbox-light.css: -------------------------------------------------------------------------------- 1 | /** 2 | * Gruvbox light theme 3 | * 4 | * Based on Gruvbox: https://github.com/morhetz/gruvbox 5 | * Adapted from PrismJS gruvbox-dark theme: https://github.com/schnerring/prism-themes/blob/master/themes/prism-gruvbox-dark.css 6 | * 7 | * @author Michael Schnerring (https://schnerring.net) 8 | * @version 1.0 9 | */ 10 | 11 | code[class*="language-"], 12 | pre[class*="language-"] { 13 | color: #3c3836; /* fg1 / fg */ 14 | font-family: Consolas, Monaco, "Andale Mono", monospace; 15 | direction: ltr; 16 | text-align: left; 17 | white-space: pre; 18 | word-spacing: normal; 19 | word-break: normal; 20 | line-height: 1.5; 21 | 22 | -moz-tab-size: 4; 23 | -o-tab-size: 4; 24 | tab-size: 4; 25 | 26 | -webkit-hyphens: none; 27 | -moz-hyphens: none; 28 | -ms-hyphens: none; 29 | hyphens: none; 30 | } 31 | 32 | pre[class*="language-"]::-moz-selection, 33 | pre[class*="language-"] ::-moz-selection, 34 | code[class*="language-"]::-moz-selection, 35 | code[class*="language-"] ::-moz-selection { 36 | color: #282828; /* fg0 */ 37 | background: #a89984; /* bg4 */ 38 | } 39 | 40 | pre[class*="language-"]::selection, 41 | pre[class*="language-"] ::selection, 42 | code[class*="language-"]::selection, 43 | code[class*="language-"] ::selection { 44 | color: #282828; /* fg0 */ 45 | background: #a89984; /* bg4 */ 46 | } 47 | 48 | /* Code blocks */ 49 | pre[class*="language-"] { 50 | padding: 1em; 51 | margin: 0.5em 0; 52 | overflow: auto; 53 | } 54 | 55 | :not(pre) > code[class*="language-"], 56 | pre[class*="language-"] { 57 | background: #f9f5d7; /* bg0_h */ 58 | } 59 | 60 | /* Inline code */ 61 | :not(pre) > code[class*="language-"] { 62 | padding: 0.1em; 63 | border-radius: 0.3em; 64 | } 65 | 66 | .token.comment, 67 | .token.prolog, 68 | .token.cdata { 69 | color: #7c6f64; /* fg4 / gray1 */ 70 | } 71 | 72 | .token.delimiter, 73 | .token.boolean, 74 | .token.keyword, 75 | .token.selector, 76 | .token.important, 77 | .token.atrule { 78 | color: #9d0006; /* red2 */ 79 | } 80 | 81 | .token.operator, 82 | .token.punctuation, 83 | .token.attr-name { 84 | color: #7c6f64; /* fg4 / gray1 */ 85 | } 86 | 87 | .token.tag, 88 | .token.tag .punctuation, 89 | .token.doctype, 90 | .token.builtin { 91 | color: #b57614; /* yellow2 */ 92 | } 93 | 94 | .token.entity, 95 | .token.number, 96 | .token.symbol { 97 | color: #8f3f71; /* purple2 */ 98 | } 99 | 100 | .token.property, 101 | .token.constant, 102 | .token.variable { 103 | color: #9d0006; /* red2 */ 104 | } 105 | 106 | .token.string, 107 | .token.char { 108 | color: #797403; /* green2 */ 109 | } 110 | 111 | .token.attr-value, 112 | .token.attr-value .punctuation { 113 | color: #7c6f64; /* fg4 / gray1 */ 114 | } 115 | 116 | .token.url { 117 | color: #797403; /* green2 */ 118 | text-decoration: underline; 119 | } 120 | 121 | .token.function { 122 | color: #b57614; /* yellow2 */ 123 | } 124 | 125 | .token.regex { 126 | background: #797403; /* green2 */ 127 | } 128 | 129 | .token.bold { 130 | font-weight: bold; 131 | } 132 | 133 | .token.italic { 134 | font-style: italic; 135 | } 136 | 137 | .token.inserted { 138 | background: #7c6f64; /* fg4 / gray1 */ 139 | } 140 | 141 | .token.deleted { 142 | background: #9d0006; /* red2 */ 143 | } 144 | -------------------------------------------------------------------------------- /src/plugins/prism/themes/prism-holi-theme.css: -------------------------------------------------------------------------------- 1 | /** 2 | * MIT License 3 | * Copyright (c) 2021 Ayush Saini 4 | * Holi Theme for prism.js 5 | * @author Ayush Saini <@AyushCodes on Twitter> 6 | */ 7 | 8 | code[class*='language-'], 9 | pre[class*='language-'] { 10 | color: #d6e7ff; 11 | background: #030314; 12 | text-shadow: none; 13 | font-family: Consolas, Monaco, "Andale Mono", "Ubuntu Mono", monospace; 14 | font-size: 1em; 15 | line-height: 1.5; 16 | letter-spacing: .2px; 17 | white-space: pre; 18 | word-spacing: normal; 19 | word-break: normal; 20 | word-wrap: normal; 21 | text-align: left; 22 | 23 | -moz-tab-size: 4; 24 | -o-tab-size: 4; 25 | tab-size: 4; 26 | 27 | -webkit-hyphens: none; 28 | -moz-hyphens: none; 29 | -ms-hyphens: none; 30 | hyphens: none; 31 | } 32 | 33 | pre[class*='language-']::-moz-selection, 34 | pre[class*='language-'] ::-moz-selection, 35 | code[class*='language-']::-moz-selection, 36 | code[class*='language-'] ::-moz-selection, 37 | pre[class*='language-']::selection, 38 | pre[class*='language-'] ::selection, 39 | code[class*='language-']::selection, 40 | code[class*='language-'] ::selection { 41 | color: inherit; 42 | background: #1d3b54; 43 | text-shadow: none; 44 | } 45 | 46 | pre[class*='language-'] { 47 | border: 1px solid #2a4555; 48 | border-radius: 5px; 49 | padding: 1.5em 1em; 50 | margin: 1em 0; 51 | overflow: auto; 52 | } 53 | 54 | :not(pre) > code[class*='language-'] { 55 | color: #f0f6f6; 56 | background: #2a4555; 57 | padding: 0.2em 0.3em; 58 | border-radius: 0.2em; 59 | box-decoration-break: clone; 60 | } 61 | 62 | .token.comment, 63 | .token.prolog, 64 | .token.doctype, 65 | .token.cdata { 66 | color: #446e69; 67 | } 68 | 69 | .token.punctuation { 70 | color: #d6b007; 71 | } 72 | 73 | .token.property, 74 | .token.tag, 75 | .token.boolean, 76 | .token.number, 77 | .token.constant, 78 | .token.symbol, 79 | .token.deleted { 80 | color: #d6e7ff; 81 | } 82 | 83 | .token.selector, 84 | .token.attr-name, 85 | .token.builtin, 86 | .token.inserted { 87 | color: #e60067; 88 | } 89 | 90 | .token.string, 91 | .token.char { 92 | color: #49c6ec; 93 | } 94 | 95 | .token.operator, 96 | .token.entity, 97 | .token.url, 98 | .language-css .token.string, 99 | .style .token.string { 100 | color: #ec8e01; 101 | background: transparent; 102 | } 103 | 104 | .token.atrule, 105 | .token.attr-value, 106 | .token.keyword { 107 | color: #0fe468; 108 | } 109 | 110 | .token.function, 111 | .token.class-name { 112 | color: #78f3e9; 113 | } 114 | 115 | .token.regex, 116 | .token.important, 117 | .token.variable { 118 | color: #d6e7ff; 119 | } 120 | -------------------------------------------------------------------------------- /src/plugins/prism/themes/prism-hopscotch.css: -------------------------------------------------------------------------------- 1 | @import url(https://fonts.googleapis.com/css?family=Fira+Mono); 2 | /* 3 | * Hopscotch 4 | * by Jan T. Sott 5 | * https://github.com/idleberg/Hopscotch 6 | * 7 | * This work is licensed under the Creative Commons CC0 1.0 Universal License 8 | */ 9 | 10 | code[class*="language-"], 11 | pre[class*="language-"] { 12 | font-family: "Fira Mono", Menlo, Monaco, "Lucida Console", "Courier New", Courier, monospace; 13 | font-size: 16px; 14 | line-height: 1.375; 15 | direction: ltr; 16 | text-align: left; 17 | word-spacing: normal; 18 | 19 | -moz-tab-size: 4; 20 | -o-tab-size: 4; 21 | tab-size: 4; 22 | 23 | -webkit-hyphens: none; 24 | -moz-hyphens: none; 25 | -ms-hyphens: none; 26 | hyphens: none; 27 | white-space: pre; 28 | white-space: pre-wrap; 29 | word-break: break-all; 30 | word-wrap: break-word; 31 | background: #322931; 32 | color: #b9b5b8; 33 | } 34 | 35 | pre > code[class*="language-"] { 36 | font-size: 1em; 37 | } 38 | 39 | /* Code blocks */ 40 | pre[class*="language-"] { 41 | padding: 1em; 42 | margin: .5em 0; 43 | overflow: auto; 44 | } 45 | 46 | /* Inline code */ 47 | :not(pre) > code[class*="language-"] { 48 | padding: .1em; 49 | border-radius: .3em; 50 | } 51 | 52 | .token.comment, 53 | .token.prolog, 54 | .token.doctype, 55 | .token.cdata { 56 | color: #797379; 57 | } 58 | 59 | .token.punctuation { 60 | color: #b9b5b8; 61 | } 62 | 63 | .namespace { 64 | opacity: .7; 65 | } 66 | 67 | .token.null, 68 | .token.operator, 69 | .token.boolean, 70 | .token.number { 71 | color: #fd8b19; 72 | } 73 | 74 | .token.property { 75 | color: #fdcc59; 76 | } 77 | 78 | .token.tag { 79 | color: #1290bf; 80 | } 81 | 82 | .token.string { 83 | color: #149b93; 84 | } 85 | 86 | .token.selector { 87 | color: #c85e7c; 88 | } 89 | 90 | .token.attr-name { 91 | color: #fd8b19; 92 | } 93 | 94 | .token.entity, 95 | .token.url, 96 | .language-css .token.string, 97 | .style .token.string { 98 | color: #149b93; 99 | } 100 | 101 | .token.attr-value, 102 | .token.keyword, 103 | .token.control, 104 | .token.directive, 105 | .token.unit { 106 | color: #8fc13e; 107 | } 108 | 109 | .token.statement, 110 | .token.regex, 111 | .token.atrule { 112 | color: #149b93; 113 | } 114 | 115 | .token.placeholder, 116 | .token.variable { 117 | color: #1290bf; 118 | } 119 | 120 | .token.important { 121 | color: #dd464c; 122 | font-weight: bold; 123 | } 124 | 125 | .token.entity { 126 | cursor: help; 127 | } 128 | 129 | pre > code.highlight { 130 | outline: .4em solid red; 131 | outline-offset: .4em; 132 | } 133 | -------------------------------------------------------------------------------- /src/plugins/prism/themes/prism-lucario.css: -------------------------------------------------------------------------------- 1 | /** 2 | * Lucario Theme originally by Raphael Amorim [@raphamorim] 3 | * https://github.com/raphamorim/lucario 4 | * 5 | * Ported for PrismJS by Christopher Kapic [@christopher-kapic] 6 | */ 7 | 8 | code[class*="language-"], 9 | pre[class*="language-"] { 10 | color: #f8f8f2; 11 | background: none; 12 | text-shadow: 0 1px rgba(0, 0, 0, 0.3); 13 | font-family: Monaco, Consolas, 'Andale Mono', 'Ubuntu Mono', monospace; 14 | text-align: left; 15 | white-space: pre; 16 | word-spacing: normal; 17 | word-break: normal; 18 | word-wrap: normal; 19 | line-height: 1.5; 20 | -moz-tab-size: 4; 21 | -o-tab-size: 4; 22 | tab-size: 4; 23 | -webkit-hyphens: none; 24 | -moz-hyphens: none; 25 | -ms-hyphens: none; 26 | hyphens: none; 27 | } 28 | 29 | /* Code blocks */ 30 | pre[class*="language-"] { 31 | padding: 1em; 32 | margin: .5em 0; 33 | overflow: auto; 34 | border-radius: 0.3em; 35 | } 36 | 37 | :not(pre) > code[class*="language-"], 38 | pre[class*="language-"] { 39 | background: #263E52; 40 | } 41 | 42 | /* Inline code */ 43 | :not(pre) > code[class*="language-"] { 44 | padding: .1em; 45 | border-radius: .3em; 46 | white-space: normal; 47 | } 48 | 49 | .token.comment, 50 | .token.prolog, 51 | .token.doctype, 52 | .token.cdata { 53 | color: #5c98cd; 54 | } 55 | 56 | .token.punctuation { 57 | color: #f8f8f2; 58 | } 59 | 60 | .namespace { 61 | opacity: .7; 62 | } 63 | 64 | .token.property, 65 | .token.tag, 66 | .token.constant, 67 | .token.symbol, 68 | .token.deleted { 69 | color: #F05E5D; 70 | } 71 | 72 | .token.boolean, 73 | .token.number { 74 | color: #BC94F9; 75 | } 76 | 77 | .token.selector, 78 | .token.attr-name, 79 | .token.string, 80 | .token.char, 81 | .token.builtin, 82 | .token.inserted { 83 | color: #FCFCD6; 84 | } 85 | 86 | .token.operator, 87 | .token.entity, 88 | .token.url, 89 | .language-css .token.string, 90 | .style .token.string, 91 | .token.variable { 92 | color: #f8f8f2; 93 | } 94 | 95 | .token.atrule, 96 | .token.attr-value, 97 | .token.function, 98 | .token.class-name { 99 | color: #66D8EF; 100 | } 101 | 102 | .token.keyword { 103 | color: #6EB26E; 104 | } 105 | 106 | .token.regex, 107 | .token.important { 108 | color: #F05E5D; 109 | } 110 | 111 | .token.important, 112 | .token.bold { 113 | font-weight: bold; 114 | } 115 | 116 | .token.italic { 117 | font-style: italic; 118 | } 119 | 120 | .token.entity { 121 | cursor: help; 122 | } 123 | -------------------------------------------------------------------------------- /src/plugins/prism/themes/prism-material-dark.css: -------------------------------------------------------------------------------- 1 | code[class*="language-"], 2 | pre[class*="language-"] { 3 | text-align: left; 4 | white-space: pre; 5 | word-spacing: normal; 6 | word-break: normal; 7 | word-wrap: normal; 8 | color: #eee; 9 | background: #2f2f2f; 10 | font-family: Roboto Mono, monospace; 11 | font-size: 1em; 12 | line-height: 1.5em; 13 | 14 | -moz-tab-size: 4; 15 | -o-tab-size: 4; 16 | tab-size: 4; 17 | 18 | -webkit-hyphens: none; 19 | -moz-hyphens: none; 20 | -ms-hyphens: none; 21 | hyphens: none; 22 | } 23 | 24 | code[class*="language-"]::-moz-selection, 25 | pre[class*="language-"]::-moz-selection, 26 | code[class*="language-"] ::-moz-selection, 27 | pre[class*="language-"] ::-moz-selection { 28 | background: #363636; 29 | } 30 | 31 | code[class*="language-"]::selection, 32 | pre[class*="language-"]::selection, 33 | code[class*="language-"] ::selection, 34 | pre[class*="language-"] ::selection { 35 | background: #363636; 36 | } 37 | 38 | :not(pre) > code[class*="language-"] { 39 | white-space: normal; 40 | border-radius: 0.2em; 41 | padding: 0.1em; 42 | } 43 | 44 | pre[class*="language-"] { 45 | overflow: auto; 46 | position: relative; 47 | margin: 0.5em 0; 48 | padding: 1.25em 1em; 49 | } 50 | 51 | .language-css > code, 52 | .language-sass > code, 53 | .language-scss > code { 54 | color: #fd9170; 55 | } 56 | 57 | [class*="language-"] .namespace { 58 | opacity: 0.7; 59 | } 60 | 61 | .token.atrule { 62 | color: #c792ea; 63 | } 64 | 65 | .token.attr-name { 66 | color: #ffcb6b; 67 | } 68 | 69 | .token.attr-value { 70 | color: #a5e844; 71 | } 72 | 73 | .token.attribute { 74 | color: #a5e844; 75 | } 76 | 77 | .token.boolean { 78 | color: #c792ea; 79 | } 80 | 81 | .token.builtin { 82 | color: #ffcb6b; 83 | } 84 | 85 | .token.cdata { 86 | color: #80cbc4; 87 | } 88 | 89 | .token.char { 90 | color: #80cbc4; 91 | } 92 | 93 | .token.class { 94 | color: #ffcb6b; 95 | } 96 | 97 | .token.class-name { 98 | color: #f2ff00; 99 | } 100 | 101 | .token.comment { 102 | color: #616161; 103 | } 104 | 105 | .token.constant { 106 | color: #c792ea; 107 | } 108 | 109 | .token.deleted { 110 | color: #ff6666; 111 | } 112 | 113 | .token.doctype { 114 | color: #616161; 115 | } 116 | 117 | .token.entity { 118 | color: #ff6666; 119 | } 120 | 121 | .token.function { 122 | color: #c792ea; 123 | } 124 | 125 | .token.hexcode { 126 | color: #f2ff00; 127 | } 128 | 129 | .token.id { 130 | color: #c792ea; 131 | font-weight: bold; 132 | } 133 | 134 | .token.important { 135 | color: #c792ea; 136 | font-weight: bold; 137 | } 138 | 139 | .token.inserted { 140 | color: #80cbc4; 141 | } 142 | 143 | .token.keyword { 144 | color: #c792ea; 145 | } 146 | 147 | .token.number { 148 | color: #fd9170; 149 | } 150 | 151 | .token.operator { 152 | color: #89ddff; 153 | } 154 | 155 | .token.prolog { 156 | color: #616161; 157 | } 158 | 159 | .token.property { 160 | color: #80cbc4; 161 | } 162 | 163 | .token.pseudo-class { 164 | color: #a5e844; 165 | } 166 | 167 | .token.pseudo-element { 168 | color: #a5e844; 169 | } 170 | 171 | .token.punctuation { 172 | color: #89ddff; 173 | } 174 | 175 | .token.regex { 176 | color: #f2ff00; 177 | } 178 | 179 | .token.selector { 180 | color: #ff6666; 181 | } 182 | 183 | .token.string { 184 | color: #a5e844; 185 | } 186 | 187 | .token.symbol { 188 | color: #c792ea; 189 | } 190 | 191 | .token.tag { 192 | color: #ff6666; 193 | } 194 | 195 | .token.unit { 196 | color: #fd9170; 197 | } 198 | 199 | .token.url { 200 | color: #ff6666; 201 | } 202 | 203 | .token.variable { 204 | color: #ff6666; 205 | } 206 | -------------------------------------------------------------------------------- /src/plugins/prism/themes/prism-material-light.css: -------------------------------------------------------------------------------- 1 | code[class*="language-"], 2 | pre[class*="language-"] { 3 | text-align: left; 4 | white-space: pre; 5 | word-spacing: normal; 6 | word-break: normal; 7 | word-wrap: normal; 8 | color: #90a4ae; 9 | background: #fafafa; 10 | font-family: Roboto Mono, monospace; 11 | font-size: 1em; 12 | line-height: 1.5em; 13 | 14 | -moz-tab-size: 4; 15 | -o-tab-size: 4; 16 | tab-size: 4; 17 | 18 | -webkit-hyphens: none; 19 | -moz-hyphens: none; 20 | -ms-hyphens: none; 21 | hyphens: none; 22 | } 23 | 24 | code[class*="language-"]::-moz-selection, 25 | pre[class*="language-"]::-moz-selection, 26 | code[class*="language-"] ::-moz-selection, 27 | pre[class*="language-"] ::-moz-selection { 28 | background: #cceae7; 29 | color: #263238; 30 | } 31 | 32 | code[class*="language-"]::selection, 33 | pre[class*="language-"]::selection, 34 | code[class*="language-"] ::selection, 35 | pre[class*="language-"] ::selection { 36 | background: #cceae7; 37 | color: #263238; 38 | } 39 | 40 | :not(pre) > code[class*="language-"] { 41 | white-space: normal; 42 | border-radius: 0.2em; 43 | padding: 0.1em; 44 | } 45 | 46 | pre[class*="language-"] { 47 | overflow: auto; 48 | position: relative; 49 | margin: 0.5em 0; 50 | padding: 1.25em 1em; 51 | } 52 | 53 | .language-css > code, 54 | .language-sass > code, 55 | .language-scss > code { 56 | color: #f76d47; 57 | } 58 | 59 | [class*="language-"] .namespace { 60 | opacity: 0.7; 61 | } 62 | 63 | .token.atrule { 64 | color: #7c4dff; 65 | } 66 | 67 | .token.attr-name { 68 | color: #39adb5; 69 | } 70 | 71 | .token.attr-value { 72 | color: #f6a434; 73 | } 74 | 75 | .token.attribute { 76 | color: #f6a434; 77 | } 78 | 79 | .token.boolean { 80 | color: #7c4dff; 81 | } 82 | 83 | .token.builtin { 84 | color: #39adb5; 85 | } 86 | 87 | .token.cdata { 88 | color: #39adb5; 89 | } 90 | 91 | .token.char { 92 | color: #39adb5; 93 | } 94 | 95 | .token.class { 96 | color: #39adb5; 97 | } 98 | 99 | .token.class-name { 100 | color: #6182b8; 101 | } 102 | 103 | .token.comment { 104 | color: #aabfc9; 105 | } 106 | 107 | .token.constant { 108 | color: #7c4dff; 109 | } 110 | 111 | .token.deleted { 112 | color: #e53935; 113 | } 114 | 115 | .token.doctype { 116 | color: #aabfc9; 117 | } 118 | 119 | .token.entity { 120 | color: #e53935; 121 | } 122 | 123 | .token.function { 124 | color: #7c4dff; 125 | } 126 | 127 | .token.hexcode { 128 | color: #f76d47; 129 | } 130 | 131 | .token.id { 132 | color: #7c4dff; 133 | font-weight: bold; 134 | } 135 | 136 | .token.important { 137 | color: #7c4dff; 138 | font-weight: bold; 139 | } 140 | 141 | .token.inserted { 142 | color: #39adb5; 143 | } 144 | 145 | .token.keyword { 146 | color: #7c4dff; 147 | } 148 | 149 | .token.number { 150 | color: #f76d47; 151 | } 152 | 153 | .token.operator { 154 | color: #39adb5; 155 | } 156 | 157 | .token.prolog { 158 | color: #aabfc9; 159 | } 160 | 161 | .token.property { 162 | color: #39adb5; 163 | } 164 | 165 | .token.pseudo-class { 166 | color: #f6a434; 167 | } 168 | 169 | .token.pseudo-element { 170 | color: #f6a434; 171 | } 172 | 173 | .token.punctuation { 174 | color: #39adb5; 175 | } 176 | 177 | .token.regex { 178 | color: #6182b8; 179 | } 180 | 181 | .token.selector { 182 | color: #e53935; 183 | } 184 | 185 | .token.string { 186 | color: #f6a434; 187 | } 188 | 189 | .token.symbol { 190 | color: #7c4dff; 191 | } 192 | 193 | .token.tag { 194 | color: #e53935; 195 | } 196 | 197 | .token.unit { 198 | color: #f76d47; 199 | } 200 | 201 | .token.url { 202 | color: #e53935; 203 | } 204 | 205 | .token.variable { 206 | color: #e53935; 207 | } 208 | -------------------------------------------------------------------------------- /src/plugins/prism/themes/prism-material-oceanic.css: -------------------------------------------------------------------------------- 1 | code[class*="language-"], 2 | pre[class*="language-"] { 3 | text-align: left; 4 | white-space: pre; 5 | word-spacing: normal; 6 | word-break: normal; 7 | word-wrap: normal; 8 | color: #c3cee3; 9 | background: #263238; 10 | font-family: Roboto Mono, monospace; 11 | font-size: 1em; 12 | line-height: 1.5em; 13 | 14 | -moz-tab-size: 4; 15 | -o-tab-size: 4; 16 | tab-size: 4; 17 | 18 | -webkit-hyphens: none; 19 | -moz-hyphens: none; 20 | -ms-hyphens: none; 21 | hyphens: none; 22 | } 23 | 24 | code[class*="language-"]::-moz-selection, 25 | pre[class*="language-"]::-moz-selection, 26 | code[class*="language-"] ::-moz-selection, 27 | pre[class*="language-"] ::-moz-selection { 28 | background: #363636; 29 | } 30 | 31 | code[class*="language-"]::selection, 32 | pre[class*="language-"]::selection, 33 | code[class*="language-"] ::selection, 34 | pre[class*="language-"] ::selection { 35 | background: #363636; 36 | } 37 | 38 | :not(pre) > code[class*="language-"] { 39 | white-space: normal; 40 | border-radius: 0.2em; 41 | padding: 0.1em; 42 | } 43 | 44 | pre[class*="language-"] { 45 | overflow: auto; 46 | position: relative; 47 | margin: 0.5em 0; 48 | padding: 1.25em 1em; 49 | } 50 | 51 | .language-css > code, 52 | .language-sass > code, 53 | .language-scss > code { 54 | color: #fd9170; 55 | } 56 | 57 | [class*="language-"] .namespace { 58 | opacity: 0.7; 59 | } 60 | 61 | .token.atrule { 62 | color: #c792ea; 63 | } 64 | 65 | .token.attr-name { 66 | color: #ffcb6b; 67 | } 68 | 69 | .token.attr-value { 70 | color: #c3e88d; 71 | } 72 | 73 | .token.attribute { 74 | color: #c3e88d; 75 | } 76 | 77 | .token.boolean { 78 | color: #c792ea; 79 | } 80 | 81 | .token.builtin { 82 | color: #ffcb6b; 83 | } 84 | 85 | .token.cdata { 86 | color: #80cbc4; 87 | } 88 | 89 | .token.char { 90 | color: #80cbc4; 91 | } 92 | 93 | .token.class { 94 | color: #ffcb6b; 95 | } 96 | 97 | .token.class-name { 98 | color: #f2ff00; 99 | } 100 | 101 | .token.color { 102 | color: #f2ff00; 103 | } 104 | 105 | .token.comment { 106 | color: #546e7a; 107 | } 108 | 109 | .token.constant { 110 | color: #c792ea; 111 | } 112 | 113 | .token.deleted { 114 | color: #f07178; 115 | } 116 | 117 | .token.doctype { 118 | color: #546e7a; 119 | } 120 | 121 | .token.entity { 122 | color: #f07178; 123 | } 124 | 125 | .token.function { 126 | color: #c792ea; 127 | } 128 | 129 | .token.hexcode { 130 | color: #f2ff00; 131 | } 132 | 133 | .token.id { 134 | color: #c792ea; 135 | font-weight: bold; 136 | } 137 | 138 | .token.important { 139 | color: #c792ea; 140 | font-weight: bold; 141 | } 142 | 143 | .token.inserted { 144 | color: #80cbc4; 145 | } 146 | 147 | .token.keyword { 148 | color: #c792ea; 149 | font-style: italic; 150 | } 151 | 152 | .token.number { 153 | color: #fd9170; 154 | } 155 | 156 | .token.operator { 157 | color: #89ddff; 158 | } 159 | 160 | .token.prolog { 161 | color: #546e7a; 162 | } 163 | 164 | .token.property { 165 | color: #80cbc4; 166 | } 167 | 168 | .token.pseudo-class { 169 | color: #c3e88d; 170 | } 171 | 172 | .token.pseudo-element { 173 | color: #c3e88d; 174 | } 175 | 176 | .token.punctuation { 177 | color: #89ddff; 178 | } 179 | 180 | .token.regex { 181 | color: #f2ff00; 182 | } 183 | 184 | .token.selector { 185 | color: #f07178; 186 | } 187 | 188 | .token.string { 189 | color: #c3e88d; 190 | } 191 | 192 | .token.symbol { 193 | color: #c792ea; 194 | } 195 | 196 | .token.tag { 197 | color: #f07178; 198 | } 199 | 200 | .token.unit { 201 | color: #f07178; 202 | } 203 | 204 | .token.url { 205 | color: #fd9170; 206 | } 207 | 208 | .token.variable { 209 | color: #f07178; 210 | } 211 | -------------------------------------------------------------------------------- /src/plugins/prism/themes/prism-night-owl.css: -------------------------------------------------------------------------------- 1 | /** 2 | * MIT License 3 | * Copyright (c) 2018 Sarah Drasner 4 | * Sarah Drasner's[@sdras] Night Owl 5 | * Ported by Sara vieria [@SaraVieira] 6 | * Added by Souvik Mandal [@SimpleIndian] 7 | */ 8 | 9 | code[class*="language-"], 10 | pre[class*="language-"] { 11 | color: #d6deeb; 12 | font-family: Consolas, Monaco, "Andale Mono", "Ubuntu Mono", monospace; 13 | text-align: left; 14 | white-space: pre; 15 | word-spacing: normal; 16 | word-break: normal; 17 | word-wrap: normal; 18 | line-height: 1.5; 19 | font-size: 1em; 20 | 21 | -moz-tab-size: 4; 22 | -o-tab-size: 4; 23 | tab-size: 4; 24 | 25 | -webkit-hyphens: none; 26 | -moz-hyphens: none; 27 | -ms-hyphens: none; 28 | hyphens: none; 29 | } 30 | 31 | pre[class*="language-"]::-moz-selection, 32 | pre[class*="language-"] ::-moz-selection, 33 | code[class*="language-"]::-moz-selection, 34 | code[class*="language-"] ::-moz-selection { 35 | text-shadow: none; 36 | background: rgba(29, 59, 83, 0.99); 37 | } 38 | 39 | pre[class*="language-"]::selection, 40 | pre[class*="language-"] ::selection, 41 | code[class*="language-"]::selection, 42 | code[class*="language-"] ::selection { 43 | text-shadow: none; 44 | background: rgba(29, 59, 83, 0.99); 45 | } 46 | 47 | @media print { 48 | code[class*="language-"], 49 | pre[class*="language-"] { 50 | text-shadow: none; 51 | } 52 | } 53 | 54 | /* Code blocks */ 55 | pre[class*="language-"] { 56 | padding: 1em; 57 | margin: 0.5em 0; 58 | overflow: auto; 59 | } 60 | 61 | :not(pre) > code[class*="language-"], 62 | pre[class*="language-"] { 63 | color: white; 64 | background: #011627; 65 | } 66 | 67 | :not(pre) > code[class*="language-"] { 68 | padding: 0.1em; 69 | border-radius: 0.3em; 70 | white-space: normal; 71 | } 72 | 73 | .token.comment, 74 | .token.prolog, 75 | .token.cdata { 76 | color: rgb(99, 119, 119); 77 | font-style: italic; 78 | } 79 | 80 | .token.punctuation { 81 | color: rgb(199, 146, 234); 82 | } 83 | 84 | .namespace { 85 | color: rgb(178, 204, 214); 86 | } 87 | 88 | .token.deleted { 89 | color: rgba(239, 83, 80, 0.56); 90 | font-style: italic; 91 | } 92 | 93 | .token.symbol, 94 | .token.property { 95 | color: rgb(128, 203, 196); 96 | } 97 | 98 | .token.tag, 99 | .token.operator, 100 | .token.keyword { 101 | color: rgb(127, 219, 202); 102 | } 103 | 104 | .token.boolean { 105 | color: rgb(255, 88, 116); 106 | } 107 | 108 | .token.number { 109 | color: rgb(247, 140, 108); 110 | } 111 | 112 | .token.constant, 113 | .token.function, 114 | .token.builtin, 115 | .token.char { 116 | color: rgb(130, 170, 255); 117 | } 118 | 119 | .token.selector, 120 | .token.doctype { 121 | color: rgb(199, 146, 234); 122 | font-style: italic; 123 | } 124 | 125 | .token.attr-name, 126 | .token.inserted { 127 | color: rgb(173, 219, 103); 128 | font-style: italic; 129 | } 130 | 131 | .token.string, 132 | .token.url, 133 | .token.entity, 134 | .language-css .token.string, 135 | .style .token.string { 136 | color: rgb(173, 219, 103); 137 | } 138 | 139 | .token.class-name, 140 | .token.atrule, 141 | .token.attr-value { 142 | color: rgb(255, 203, 139); 143 | } 144 | 145 | .token.regex, 146 | .token.important, 147 | .token.variable { 148 | color: rgb(214, 222, 235); 149 | } 150 | 151 | .token.important, 152 | .token.bold { 153 | font-weight: bold; 154 | } 155 | 156 | .token.italic { 157 | font-style: italic; 158 | } 159 | -------------------------------------------------------------------------------- /src/plugins/prism/themes/prism-nord.css: -------------------------------------------------------------------------------- 1 | /** 2 | * Nord Theme Originally by Arctic Ice Studio 3 | * https://nordtheme.com 4 | * 5 | * Ported for PrismJS by Zane Hitchcoxc (@zwhitchcox) and Gabriel Ramos (@gabrieluizramos) 6 | */ 7 | 8 | code[class*="language-"], 9 | pre[class*="language-"] { 10 | color: #f8f8f2; 11 | background: none; 12 | font-family: "Fira Code", Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace; 13 | text-align: left; 14 | white-space: pre; 15 | word-spacing: normal; 16 | word-break: normal; 17 | word-wrap: normal; 18 | line-height: 1.5; 19 | -moz-tab-size: 4; 20 | -o-tab-size: 4; 21 | tab-size: 4; 22 | -webkit-hyphens: none; 23 | -moz-hyphens: none; 24 | -ms-hyphens: none; 25 | hyphens: none; 26 | } 27 | 28 | /* Code blocks */ 29 | pre[class*="language-"] { 30 | padding: 1em; 31 | margin: .5em 0; 32 | overflow: auto; 33 | border-radius: 0.3em; 34 | } 35 | 36 | :not(pre) > code[class*="language-"], 37 | pre[class*="language-"] { 38 | background: #2E3440; 39 | } 40 | 41 | /* Inline code */ 42 | :not(pre) > code[class*="language-"] { 43 | padding: .1em; 44 | border-radius: .3em; 45 | white-space: normal; 46 | } 47 | 48 | .token.comment, 49 | .token.prolog, 50 | .token.doctype, 51 | .token.cdata { 52 | color: #636f88; 53 | } 54 | 55 | .token.punctuation { 56 | color: #81A1C1; 57 | } 58 | 59 | .namespace { 60 | opacity: .7; 61 | } 62 | 63 | .token.property, 64 | .token.tag, 65 | .token.constant, 66 | .token.symbol, 67 | .token.deleted { 68 | color: #81A1C1; 69 | } 70 | 71 | .token.number { 72 | color: #B48EAD; 73 | } 74 | 75 | .token.boolean { 76 | color: #81A1C1; 77 | } 78 | 79 | .token.selector, 80 | .token.attr-name, 81 | .token.string, 82 | .token.char, 83 | .token.builtin, 84 | .token.inserted { 85 | color: #A3BE8C; 86 | } 87 | 88 | .token.operator, 89 | .token.entity, 90 | .token.url, 91 | .language-css .token.string, 92 | .style .token.string, 93 | .token.variable { 94 | color: #81A1C1; 95 | } 96 | 97 | .token.atrule, 98 | .token.attr-value, 99 | .token.function, 100 | .token.class-name { 101 | color: #88C0D0; 102 | } 103 | 104 | .token.keyword { 105 | color: #81A1C1; 106 | } 107 | 108 | .token.regex, 109 | .token.important { 110 | color: #EBCB8B; 111 | } 112 | 113 | .token.important, 114 | .token.bold { 115 | font-weight: bold; 116 | } 117 | 118 | .token.italic { 119 | font-style: italic; 120 | } 121 | 122 | .token.entity { 123 | cursor: help; 124 | } 125 | -------------------------------------------------------------------------------- /src/plugins/prism/themes/prism-solarized-dark-atom.css: -------------------------------------------------------------------------------- 1 | /** 2 | * Solarized dark atom theme for `prism.js` 3 | * Based on Atom's `atom-dark` theme: https://github.com/atom/atom-dark-syntax 4 | * @author Pranay Chauhan (@PranayChauhan2516) 5 | */ 6 | 7 | code[class*="language-"], 8 | pre[class*="language-"] { 9 | color: #839496; 10 | text-shadow: 0 1px rgba(0, 0, 0, 0.3); 11 | font-family: Inconsolata, Monaco, Consolas, 'Courier New', Courier, monospace; 12 | direction: ltr; 13 | text-align: left; 14 | white-space: pre; 15 | word-spacing: normal; 16 | word-break: normal; 17 | line-height: 1.5; 18 | 19 | -moz-tab-size: 4; 20 | -o-tab-size: 4; 21 | tab-size: 4; 22 | 23 | -webkit-hyphens: none; 24 | -moz-hyphens: none; 25 | -ms-hyphens: none; 26 | hyphens: none; 27 | } 28 | 29 | /* Code blocks */ 30 | pre[class*="language-"] { 31 | padding: 1em; 32 | margin: .5em 0; 33 | overflow: auto; 34 | border-radius: 0.3em; 35 | } 36 | 37 | :not(pre) > code[class*="language-"], 38 | pre[class*="language-"] { 39 | background: #002b36; 40 | } 41 | 42 | /* Inline code */ 43 | :not(pre) > code[class*="language-"] { 44 | padding: .1em; 45 | border-radius: .3em; 46 | } 47 | 48 | .token.comment, 49 | .token.prolog, 50 | .token.doctype, 51 | .token.cdata { 52 | color: #586e75; 53 | } 54 | 55 | .token.punctuation { 56 | color: #93a1a1; 57 | } 58 | 59 | .namespace { 60 | opacity: .7; 61 | } 62 | 63 | .token.property, 64 | .token.keyword, 65 | .token.tag { 66 | color: #268bd2; 67 | } 68 | 69 | .token.class-name { 70 | color: #FFFFB6; 71 | text-decoration: underline; 72 | } 73 | 74 | .token.boolean, 75 | .token.constant { 76 | color: #b58900; 77 | } 78 | 79 | .token.symbol, 80 | .token.deleted { 81 | color: #dc322f; 82 | } 83 | 84 | .token.number { 85 | color: #859900; 86 | } 87 | 88 | .token.selector, 89 | .token.attr-name, 90 | .token.string, 91 | .token.char, 92 | .token.builtin, 93 | .token.inserted { 94 | color: #859900; 95 | } 96 | 97 | .token.variable { 98 | color: #268bd2; 99 | } 100 | 101 | .token.operator { 102 | color: #EDEDED; 103 | } 104 | 105 | .token.function { 106 | color: #268bd2; 107 | } 108 | 109 | .token.regex { 110 | color: #E9C062; 111 | } 112 | 113 | .token.important { 114 | color: #fd971f; 115 | } 116 | 117 | .token.entity { 118 | color: #FFFFB6; 119 | cursor: help; 120 | } 121 | 122 | .token.url { 123 | color: #96CBFE; 124 | } 125 | 126 | .language-css .token.string, 127 | .style .token.string { 128 | color: #87C38A; 129 | } 130 | 131 | .token.important, 132 | .token.bold { 133 | font-weight: bold; 134 | } 135 | 136 | .token.italic { 137 | font-style: italic; 138 | } 139 | 140 | .token.atrule, 141 | .token.attr-value { 142 | color: #F9EE98; 143 | } 144 | -------------------------------------------------------------------------------- /src/plugins/prism/themes/prism-synthwave84.css: -------------------------------------------------------------------------------- 1 | /* 2 | * Synthwave '84 Theme originally by Robb Owen [@Robb0wen] for Visual Studio Code 3 | * Demo: https://marc.dev/demo/prism-synthwave84 4 | * 5 | * Ported for PrismJS by Marc Backes [@themarcba] 6 | */ 7 | 8 | code[class*="language-"], 9 | pre[class*="language-"] { 10 | color: #f92aad; 11 | text-shadow: 0 0 2px #100c0f, 0 0 5px #dc078e33, 0 0 10px #fff3; 12 | background: none; 13 | font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace; 14 | font-size: 1em; 15 | text-align: left; 16 | white-space: pre; 17 | word-spacing: normal; 18 | word-break: normal; 19 | word-wrap: normal; 20 | line-height: 1.5; 21 | 22 | -moz-tab-size: 4; 23 | -o-tab-size: 4; 24 | tab-size: 4; 25 | 26 | -webkit-hyphens: none; 27 | -moz-hyphens: none; 28 | -ms-hyphens: none; 29 | hyphens: none; 30 | } 31 | 32 | /* Code blocks */ 33 | pre[class*="language-"] { 34 | padding: 1em; 35 | margin: .5em 0; 36 | overflow: auto; 37 | } 38 | 39 | :not(pre) > code[class*="language-"], 40 | pre[class*="language-"] { 41 | background-color: transparent !important; 42 | background-image: linear-gradient(to bottom, #2a2139 75%, #34294f); 43 | } 44 | 45 | /* Inline code */ 46 | :not(pre) > code[class*="language-"] { 47 | padding: .1em; 48 | border-radius: .3em; 49 | white-space: normal; 50 | } 51 | 52 | .token.comment, 53 | .token.block-comment, 54 | .token.prolog, 55 | .token.doctype, 56 | .token.cdata { 57 | color: #8e8e8e; 58 | } 59 | 60 | .token.punctuation { 61 | color: #ccc; 62 | } 63 | 64 | .token.tag, 65 | .token.attr-name, 66 | .token.namespace, 67 | .token.number, 68 | .token.unit, 69 | .token.hexcode, 70 | .token.deleted { 71 | color: #e2777a; 72 | } 73 | 74 | .token.property, 75 | .token.selector { 76 | color: #72f1b8; 77 | text-shadow: 0 0 2px #100c0f, 0 0 10px #257c5575, 0 0 35px #21272475; 78 | } 79 | 80 | .token.function-name { 81 | color: #6196cc; 82 | } 83 | 84 | .token.boolean, 85 | .token.selector .token.id, 86 | .token.function { 87 | color: #fdfdfd; 88 | text-shadow: 0 0 2px #001716, 0 0 3px #03edf975, 0 0 5px #03edf975, 0 0 8px #03edf975; 89 | } 90 | 91 | .token.class-name { 92 | color: #fff5f6; 93 | text-shadow: 0 0 2px #000, 0 0 10px #fc1f2c75, 0 0 5px #fc1f2c75, 0 0 25px #fc1f2c75; 94 | } 95 | 96 | .token.constant, 97 | .token.symbol { 98 | color: #f92aad; 99 | text-shadow: 0 0 2px #100c0f, 0 0 5px #dc078e33, 0 0 10px #fff3; 100 | } 101 | 102 | .token.important, 103 | .token.atrule, 104 | .token.keyword, 105 | .token.selector .token.class, 106 | .token.builtin { 107 | color: #f4eee4; 108 | text-shadow: 0 0 2px #393a33, 0 0 8px #f39f0575, 0 0 2px #f39f0575; 109 | } 110 | 111 | .token.string, 112 | .token.char, 113 | .token.attr-value, 114 | .token.regex, 115 | .token.variable { 116 | color: #f87c32; 117 | } 118 | 119 | .token.operator, 120 | .token.entity, 121 | .token.url { 122 | color: #67cdcc; 123 | } 124 | 125 | .token.important, 126 | .token.bold { 127 | font-weight: bold; 128 | } 129 | 130 | .token.italic { 131 | font-style: italic; 132 | } 133 | 134 | .token.entity { 135 | cursor: help; 136 | } 137 | 138 | .token.inserted { 139 | color: green; 140 | } 141 | -------------------------------------------------------------------------------- /src/plugins/prism/themes/prism-vs.css: -------------------------------------------------------------------------------- 1 | /** 2 | * VS theme by Andrew Lock (https://andrewlock.net) 3 | * Inspired by Visual Studio syntax coloring 4 | */ 5 | 6 | code[class*="language-"], 7 | pre[class*="language-"] { 8 | color: #393A34; 9 | font-family: "Consolas", "Bitstream Vera Sans Mono", "Courier New", Courier, monospace; 10 | direction: ltr; 11 | text-align: left; 12 | white-space: pre; 13 | word-spacing: normal; 14 | word-break: normal; 15 | font-size: .9em; 16 | line-height: 1.2em; 17 | 18 | -moz-tab-size: 4; 19 | -o-tab-size: 4; 20 | tab-size: 4; 21 | 22 | -webkit-hyphens: none; 23 | -moz-hyphens: none; 24 | -ms-hyphens: none; 25 | hyphens: none; 26 | } 27 | 28 | pre > code[class*="language-"] { 29 | font-size: 1em; 30 | } 31 | 32 | pre[class*="language-"]::-moz-selection, pre[class*="language-"] ::-moz-selection, 33 | code[class*="language-"]::-moz-selection, code[class*="language-"] ::-moz-selection { 34 | background: #C1DEF1; 35 | } 36 | 37 | pre[class*="language-"]::selection, pre[class*="language-"] ::selection, 38 | code[class*="language-"]::selection, code[class*="language-"] ::selection { 39 | background: #C1DEF1; 40 | } 41 | 42 | /* Code blocks */ 43 | pre[class*="language-"] { 44 | padding: 1em; 45 | margin: .5em 0; 46 | overflow: auto; 47 | border: 1px solid #dddddd; 48 | background-color: white; 49 | } 50 | 51 | /* Inline code */ 52 | :not(pre) > code[class*="language-"] { 53 | padding: .2em; 54 | padding-top: 1px; 55 | padding-bottom: 1px; 56 | background: #f8f8f8; 57 | border: 1px solid #dddddd; 58 | } 59 | 60 | .token.comment, 61 | .token.prolog, 62 | .token.doctype, 63 | .token.cdata { 64 | color: #008000; 65 | font-style: italic; 66 | } 67 | 68 | .token.namespace { 69 | opacity: .7; 70 | } 71 | 72 | .token.string { 73 | color: #A31515; 74 | } 75 | 76 | .token.punctuation, 77 | .token.operator { 78 | color: #393A34; /* no highlight */ 79 | } 80 | 81 | .token.url, 82 | .token.symbol, 83 | .token.number, 84 | .token.boolean, 85 | .token.variable, 86 | .token.constant, 87 | .token.inserted { 88 | color: #36acaa; 89 | } 90 | 91 | .token.atrule, 92 | .token.keyword, 93 | .token.attr-value, 94 | .language-autohotkey .token.selector, 95 | .language-json .token.boolean, 96 | .language-json .token.number, 97 | code[class*="language-css"] { 98 | color: #0000ff; 99 | } 100 | 101 | .token.function { 102 | color: #393A34; 103 | } 104 | 105 | .token.deleted, 106 | .language-autohotkey .token.tag { 107 | color: #9a050f; 108 | } 109 | 110 | .token.selector, 111 | .language-autohotkey .token.keyword { 112 | color: #00009f; 113 | } 114 | 115 | .token.important { 116 | color: #e90; 117 | } 118 | 119 | .token.important, 120 | .token.bold { 121 | font-weight: bold; 122 | } 123 | 124 | .token.italic { 125 | font-style: italic; 126 | } 127 | 128 | .token.class-name, 129 | .language-json .token.property { 130 | color: #2B91AF; 131 | } 132 | 133 | .token.tag, 134 | .token.selector { 135 | color: #800000; 136 | } 137 | 138 | .token.attr-name, 139 | .token.property, 140 | .token.regex, 141 | .token.entity { 142 | color: #ff0000; 143 | } 144 | 145 | .token.directive.tag .tag { 146 | background: #ffff00; 147 | color: #393A34; 148 | } 149 | 150 | /* overrides color-values for the Line Numbers plugin 151 | * http://prismjs.com/plugins/line-numbers/ 152 | */ 153 | .line-numbers .line-numbers-rows { 154 | border-right-color: #a5a5a5; 155 | } 156 | 157 | .line-numbers-rows > span:before { 158 | color: #2B91AF; 159 | } 160 | 161 | /* overrides color-values for the Line Highlight plugin 162 | * http://prismjs.com/plugins/line-highlight/ 163 | */ 164 | .line-highlight { 165 | background: rgba(193, 222, 241, 0.2); 166 | background: -webkit-linear-gradient(left, rgba(193, 222, 241, 0.2) 70%, rgba(221, 222, 241, 0)); 167 | background: linear-gradient(to right, rgba(193, 222, 241, 0.2) 70%, rgba(221, 222, 241, 0)); 168 | } 169 | -------------------------------------------------------------------------------- /src/plugins/prism/themes/prism-xonokai.css: -------------------------------------------------------------------------------- 1 | /** 2 | * xonokai theme for JavaScript, CSS and HTML 3 | * based on: https://github.com/MoOx/sass-prism-theme-base by Maxime Thirouin ~ MoOx --> http://moox.fr/ , which is Loosely based on Monokai textmate theme by http://www.monokai.nl/ 4 | * license: MIT; http://moox.mit-license.org/ 5 | */ 6 | code[class*="language-"], 7 | pre[class*="language-"] { 8 | -moz-tab-size: 2; 9 | -o-tab-size: 2; 10 | tab-size: 2; 11 | -webkit-hyphens: none; 12 | -moz-hyphens: none; 13 | -ms-hyphens: none; 14 | hyphens: none; 15 | white-space: pre; 16 | white-space: pre-wrap; 17 | word-wrap: normal; 18 | font-family: Menlo, Monaco, "Courier New", monospace; 19 | font-size: 14px; 20 | color: #76d9e6; 21 | text-shadow: none; 22 | } 23 | 24 | pre > code[class*="language-"] { 25 | font-size: 1em; 26 | } 27 | 28 | pre[class*="language-"], 29 | :not(pre) > code[class*="language-"] { 30 | background: #2a2a2a; 31 | } 32 | 33 | pre[class*="language-"] { 34 | padding: 15px; 35 | border-radius: 4px; 36 | border: 1px solid #e1e1e8; 37 | overflow: auto; 38 | position: relative; 39 | } 40 | 41 | pre[class*="language-"] code { 42 | white-space: pre; 43 | display: block; 44 | } 45 | 46 | :not(pre) > code[class*="language-"] { 47 | padding: 0.15em 0.2em 0.05em; 48 | border-radius: .3em; 49 | border: 0.13em solid #7a6652; 50 | box-shadow: 1px 1px 0.3em -0.1em #000 inset; 51 | } 52 | 53 | .token.namespace { 54 | opacity: .7; 55 | } 56 | 57 | .token.comment, 58 | .token.prolog, 59 | .token.doctype, 60 | .token.cdata { 61 | color: #6f705e; 62 | } 63 | 64 | .token.operator, 65 | .token.boolean, 66 | .token.number { 67 | color: #a77afe; 68 | } 69 | 70 | .token.attr-name, 71 | .token.string { 72 | color: #e6d06c; 73 | } 74 | 75 | .token.entity, 76 | .token.url, 77 | .language-css .token.string, 78 | .style .token.string { 79 | color: #e6d06c; 80 | } 81 | 82 | .token.selector, 83 | .token.inserted { 84 | color: #a6e22d; 85 | } 86 | 87 | .token.atrule, 88 | .token.attr-value, 89 | .token.keyword, 90 | .token.important, 91 | .token.deleted { 92 | color: #ef3b7d; 93 | } 94 | 95 | .token.regex, 96 | .token.statement { 97 | color: #76d9e6; 98 | } 99 | 100 | .token.placeholder, 101 | .token.variable { 102 | color: #fff; 103 | } 104 | 105 | .token.important, 106 | .token.statement, 107 | .token.bold { 108 | font-weight: bold; 109 | } 110 | 111 | .token.punctuation { 112 | color: #bebec5; 113 | } 114 | 115 | .token.entity { 116 | cursor: help; 117 | } 118 | 119 | .token.italic { 120 | font-style: italic; 121 | } 122 | 123 | code.language-markup { 124 | color: #f9f9f9; 125 | } 126 | 127 | code.language-markup .token.tag { 128 | color: #ef3b7d; 129 | } 130 | 131 | code.language-markup .token.attr-name { 132 | color: #a6e22d; 133 | } 134 | 135 | code.language-markup .token.attr-value { 136 | color: #e6d06c; 137 | } 138 | 139 | code.language-markup .token.style, 140 | code.language-markup .token.script { 141 | color: #76d9e6; 142 | } 143 | 144 | code.language-markup .token.script .token.keyword { 145 | color: #76d9e6; 146 | } 147 | 148 | /* Line highlight plugin */ 149 | pre[class*="language-"][data-line] { 150 | position: relative; 151 | padding: 1em 0 1em 3em; 152 | } 153 | 154 | pre[data-line] .line-highlight { 155 | position: absolute; 156 | left: 0; 157 | right: 0; 158 | padding: 0; 159 | margin-top: 1em; 160 | background: rgba(255, 255, 255, 0.08); 161 | pointer-events: none; 162 | line-height: inherit; 163 | white-space: pre; 164 | } 165 | 166 | pre[data-line] .line-highlight:before, 167 | pre[data-line] .line-highlight[data-end]:after { 168 | content: attr(data-start); 169 | position: absolute; 170 | top: .4em; 171 | left: .6em; 172 | min-width: 1em; 173 | padding: 0.2em 0.5em; 174 | background-color: rgba(255, 255, 255, 0.4); 175 | color: black; 176 | font: bold 65%/1 sans-serif; 177 | height: 1em; 178 | line-height: 1em; 179 | text-align: center; 180 | border-radius: 999px; 181 | text-shadow: none; 182 | box-shadow: 0 1px 1px rgba(255, 255, 255, 0.7); 183 | } 184 | 185 | pre[data-line] .line-highlight[data-end]:after { 186 | content: attr(data-end); 187 | top: auto; 188 | bottom: .4em; 189 | } 190 | -------------------------------------------------------------------------------- /src/plugins/prism/themes/prism-z-touch.css: -------------------------------------------------------------------------------- 1 | /* 2 | * Z-Toch 3 | * by Zeel Codder 4 | * https://github.com/zeel-codder 5 | * 6 | */ 7 | code[class*="language-"], 8 | pre[class*="language-"] { 9 | color: #22da17; 10 | font-family: monospace; 11 | text-align: left; 12 | white-space: pre; 13 | word-spacing: normal; 14 | word-break: normal; 15 | word-wrap: normal; 16 | -moz-tab-size: 4; 17 | -o-tab-size: 4; 18 | tab-size: 4; 19 | -webkit-hyphens: none; 20 | -moz-hyphens: none; 21 | -ms-hyphens: none; 22 | hyphens: none; 23 | line-height: 25px; 24 | font-size: 18px; 25 | margin: 5px 0; 26 | } 27 | 28 | pre[class*="language-"] * { 29 | font-family: monospace; 30 | } 31 | 32 | :not(pre) > code[class*="language-"], 33 | pre[class*="language-"] { 34 | color: white; 35 | background: #0a143c; 36 | padding: 22px; 37 | } 38 | 39 | /* Code blocks */ 40 | pre[class*="language-"] { 41 | padding: 1em; 42 | margin: 0.5em 0; 43 | overflow: auto; 44 | } 45 | 46 | pre[class*="language-"]::-moz-selection, 47 | pre[class*="language-"] ::-moz-selection, 48 | code[class*="language-"]::-moz-selection, 49 | code[class*="language-"] ::-moz-selection { 50 | text-shadow: none; 51 | background: rgba(29, 59, 83, 0.99); 52 | } 53 | 54 | pre[class*="language-"]::selection, 55 | pre[class*="language-"] ::selection, 56 | code[class*="language-"]::selection, 57 | code[class*="language-"] ::selection { 58 | text-shadow: none; 59 | background: rgba(29, 59, 83, 0.99); 60 | } 61 | 62 | @media print { 63 | code[class*="language-"], 64 | pre[class*="language-"] { 65 | text-shadow: none; 66 | } 67 | } 68 | 69 | :not(pre) > code[class*="language-"] { 70 | padding: 0.1em; 71 | border-radius: 0.3em; 72 | white-space: normal; 73 | } 74 | 75 | .token.comment, 76 | .token.prolog, 77 | .token.cdata { 78 | color: rgb(99, 119, 119); 79 | font-style: italic; 80 | } 81 | 82 | .token.punctuation { 83 | color: rgb(199, 146, 234); 84 | } 85 | 86 | .namespace { 87 | color: rgb(178, 204, 214); 88 | } 89 | 90 | .token.deleted { 91 | color: rgba(239, 83, 80, 0.56); 92 | font-style: italic; 93 | } 94 | 95 | .token.symbol, 96 | .token.property { 97 | color: rgb(128, 203, 196); 98 | } 99 | 100 | .token.tag, 101 | .token.operator, 102 | .token.keyword { 103 | color: rgb(127, 219, 202); 104 | } 105 | 106 | .token.boolean { 107 | color: rgb(255, 88, 116); 108 | } 109 | 110 | .token.number { 111 | color: rgb(247, 140, 108); 112 | } 113 | 114 | .token.constant, 115 | .token.function, 116 | .token.builtin, 117 | .token.char { 118 | color: rgb(34 183 199); 119 | } 120 | 121 | .token.selector, 122 | .token.doctype { 123 | color: rgb(199, 146, 234); 124 | font-style: italic; 125 | } 126 | 127 | .token.attr-name, 128 | .token.inserted { 129 | color: rgb(173, 219, 103); 130 | font-style: italic; 131 | } 132 | 133 | .token.string, 134 | .token.url, 135 | .token.entity, 136 | .language-css .token.string, 137 | .style .token.string { 138 | color: rgb(173, 219, 103); 139 | } 140 | 141 | .token.class-name, 142 | .token.atrule, 143 | .token.attr-value { 144 | color: rgb(255, 203, 139); 145 | } 146 | 147 | .token.regex, 148 | .token.important, 149 | .token.variable { 150 | color: rgb(214, 222, 235); 151 | } 152 | 153 | .token.important, 154 | .token.bold { 155 | font-weight: bold; 156 | } 157 | 158 | .token.italic { 159 | font-style: italic; 160 | } 161 | -------------------------------------------------------------------------------- /src/scss/core/_base.scss: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2024/1/16 3 | * @author: 小红 4 | * @fileName: body 5 | * @Description: 样式 6 | */ 7 | @use "_util"; 8 | 9 | body { 10 | @include util.useThemeVar(( 11 | text-color:(rgb(76, 73, 72), rgba(255, 255, 255, 0.7)), 12 | mask-color:(rgba(255, 255, 255, 0.6), rgba(0, 0, 0, 0.6)), 13 | )); 14 | 15 | & { 16 | font-family: "Butterfly Font", "Microsoft YaHei", "微软雅黑", Arial, "sans-serif"; 17 | font-size: 14px; 18 | line-height: 2; 19 | -webkit-tap-highlight-color: transparent; 20 | -webkit-text-size-adjust: 100%; 21 | overflow-y: overlay; 22 | scroll-behavior: smooth; 23 | padding-bottom: env(safe-area-inset-bottom); 24 | background: var(--body-background); 25 | color: var(--text-color); 26 | } 27 | } 28 | 29 | #Butterfly { 30 | position: relative; 31 | display: flex; 32 | flex-direction: column; 33 | min-height: 100vh; 34 | 35 | 36 | > .mask { 37 | @keyframes m_show { 38 | 0% { 39 | opacity: 0 40 | } 41 | 42 | 100% { 43 | opacity: 1; 44 | filter: none 45 | } 46 | } 47 | 48 | @keyframes m_hide { 49 | 0% { 50 | opacity: 1; 51 | filter: none 52 | } 53 | 54 | 100% { 55 | opacity: 0; 56 | display: none; 57 | } 58 | } 59 | 60 | & { 61 | position: fixed; 62 | display: none; 63 | z-index: 100; 64 | width: 100%; 65 | height: 100%; 66 | background-color: var(--mask-color); 67 | backdrop-filter: blur(20px) saturate(1.5); 68 | transform: translateZ(0); 69 | -webkit-transform-style: preserve-3d; 70 | } 71 | 72 | &.active { 73 | animation: 0.6s ease 0s 1 normal none running m_show; 74 | } 75 | 76 | &.hide { 77 | animation: 0.6s ease 0s 1 normal none running m_hide; 78 | } 79 | 80 | } 81 | 82 | img[data-lazy-src]:not(.loaded,.error,.loading) { 83 | filter: blur(50px) brightness(1); 84 | } 85 | } 86 | 87 | ::-webkit-scrollbar { 88 | height: 6px; 89 | width: 6px 90 | } 91 | 92 | ::-webkit-scrollbar-thumb { 93 | background: var(--theme); 94 | cursor: var(--cursor-pointer); 95 | } 96 | 97 | ::-webkit-scrollbar-track { 98 | background-color: transparent 99 | } 100 | 101 | ::selection { 102 | color: #fff; 103 | background-color: #00c4b6; 104 | } 105 | 106 | -------------------------------------------------------------------------------- /src/scss/core/_button.scss: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2024/1/23 3 | * @author: 小红 4 | * @fileName: button 5 | * @Description: 按钮 6 | */ 7 | 8 | @use "util"; 9 | 10 | //定义变量 11 | @include util.useThemeVar(( 12 | button-text-color:( 13 | rgba(255, 255, 255, 1), 14 | rgba(255, 255, 255, 0.7) 15 | ), 16 | button-background-color:( 17 | var(--theme), 18 | var(--theme) 19 | ), 20 | button-hover-background-color:( 21 | lighten(#49b1f5, 10%), 22 | #fff 23 | ) 24 | )); 25 | 26 | 27 | @mixin button() { 28 | @keyframes slide-in-top { 29 | 0% { 30 | transform: scale(0); 31 | opacity: 0; 32 | } 33 | 34 | 100% { 35 | opacity: 1; 36 | } 37 | } 38 | 39 | .button { 40 | @include util.flex-center; 41 | position: relative; 42 | border-radius: 10px; 43 | background-color: var(--theme); 44 | color: var(--button-text-color); 45 | transition: filter 0.35s, transform 0.35s; 46 | 47 | &:active { 48 | transform: scale(0.96); 49 | } 50 | 51 | &:hover { 52 | filter: hue-rotate(100deg); 53 | } 54 | 55 | } 56 | } 57 | 58 | @include button; -------------------------------------------------------------------------------- /src/scss/core/_message.scss: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2024/5/17 3 | * @author: 小红 4 | * @fileName: _message 5 | * @Description: 消息提示 6 | */ 7 | 8 | @use "_util"; 9 | 10 | 11 | .message { 12 | //@keyframes messageMoveOut { 13 | // 0% { 14 | // opacity: 1 15 | // } 16 | // 17 | // to { 18 | // padding: 0; 19 | // opacity: 0 20 | // } 21 | //} 22 | // 23 | //@keyframes MessageMoveIn { 24 | // 0% { 25 | // transform: translateY(-100%); 26 | // transform-origin: 0 0; 27 | // opacity: 0 28 | // } 29 | // 30 | // to { 31 | // transform: translateY(0); 32 | // transform-origin: 0 0; 33 | // opacity: 1 34 | // } 35 | //} 36 | 37 | &-container { 38 | z-index: 10000; 39 | position: fixed; 40 | height: 0; 41 | overflow: visible; 42 | display: flex; 43 | flex-direction: column; 44 | align-items: center; 45 | top: 12px; 46 | left: 0; 47 | right: 0; 48 | } 49 | 50 | 51 | &-wrapper { 52 | margin: 0 0 8px 0; 53 | z-index: 0; 54 | transform-origin: top center; 55 | display: flex; 56 | } 57 | 58 | &-item { 59 | display: flex; 60 | align-items: center; 61 | padding: .3rem .8rem; 62 | border-radius: 3px; 63 | flex-wrap: nowrap; 64 | overflow: hidden; 65 | max-width: 720px; 66 | color: rgb(51, 54, 57); 67 | background-color: #fff; 68 | flex-shrink: 0; 69 | box-shadow: 0 3px 6px -4px rgba(0, 0, 0, .12), 0 6px 16px 0 rgba(0, 0, 0, .08), 0 9px 28px 8px rgba(0, 0, 0, .05); 70 | 71 | svg { 72 | width: 20px; 73 | height: 20px; 74 | margin-right: 8px; 75 | } 76 | } 77 | 78 | 79 | } -------------------------------------------------------------------------------- /src/scss/core/_reset.scss: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2024/1/16 3 | * @author: 小红 4 | * @fileName: reset 5 | * @Description: 重置 6 | */ 7 | *, ::after, ::before { 8 | box-sizing: border-box; 9 | cursor: inherit; 10 | } 11 | 12 | h1, h2, h3, h4, h5, h6 { 13 | font-size: inherit; 14 | font-weight: inherit; 15 | } 16 | 17 | a { 18 | color: inherit; 19 | text-decoration: inherit; 20 | overflow-wrap: break-word; 21 | transition: color .3s; 22 | } 23 | 24 | b, strong { 25 | font-weight: bolder 26 | } 27 | 28 | code, kbd, pre, samp { 29 | font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; 30 | font-feature-settings: normal; 31 | font-variation-settings: normal; 32 | font-size: 1em 33 | } 34 | 35 | small { 36 | font-size: 80% 37 | } 38 | 39 | sub, sup { 40 | font-size: 75%; 41 | line-height: 0; 42 | position: relative; 43 | vertical-align: baseline 44 | } 45 | 46 | sub { 47 | bottom: -.25em 48 | } 49 | 50 | sup { 51 | top: -.5em 52 | } 53 | 54 | table { 55 | text-indent: 0; 56 | border-color: inherit; 57 | border-collapse: collapse; 58 | border-spacing: 0 59 | } 60 | 61 | button, input, optgroup, select, textarea { 62 | font-family: inherit; 63 | font-feature-settings: inherit; 64 | font-variation-settings: inherit; 65 | font-size: 100%; 66 | font-weight: inherit; 67 | line-height: inherit; 68 | color: inherit; 69 | margin: 0; 70 | padding: 0; 71 | border: none; 72 | } 73 | 74 | button, select { 75 | text-transform: none 76 | } 77 | 78 | [type=button], [type=reset], [type=submit], button { 79 | -webkit-appearance: button; 80 | background-color: transparent; 81 | background-image: none 82 | } 83 | 84 | progress { 85 | vertical-align: baseline 86 | } 87 | 88 | ::-webkit-inner-spin-button, ::-webkit-outer-spin-button { 89 | height: auto 90 | } 91 | 92 | [type=search] { 93 | -webkit-appearance: textfield; 94 | outline-offset: -2px 95 | } 96 | 97 | ::-webkit-search-decoration { 98 | -webkit-appearance: none 99 | } 100 | 101 | ::-webkit-file-upload-button { 102 | -webkit-appearance: button; 103 | font: inherit 104 | } 105 | 106 | summary { 107 | display: list-item 108 | } 109 | 110 | blockquote, dd, dl, figure, h1, h2, h3, h4, h5, h6, hr, p, pre { 111 | margin: 0 112 | } 113 | 114 | fieldset, body { 115 | margin: 0; 116 | padding: 0 117 | } 118 | 119 | dialog, legend { 120 | padding: 0 121 | } 122 | 123 | menu, ol, ul { 124 | list-style: none; 125 | margin: 0; 126 | padding: 0 127 | } 128 | 129 | textarea { 130 | resize: vertical 131 | } 132 | 133 | input::placeholder, textarea::placeholder { 134 | opacity: 1; 135 | color: #9ca3af 136 | } 137 | 138 | [role=button], button { 139 | cursor: pointer 140 | } 141 | 142 | :disabled { 143 | cursor: default 144 | } 145 | 146 | audio, canvas, embed, iframe, img, object, svg, video { 147 | vertical-align: middle 148 | } 149 | 150 | img, video { 151 | max-width: 100%; 152 | height: auto; 153 | transition: transform .25s; 154 | object-fit: cover; 155 | } 156 | 157 | [hidden] { 158 | display: none 159 | } -------------------------------------------------------------------------------- /src/scss/core/_util.scss: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2024/1/16 3 | * @author: 小红 4 | * @fileName: utilities 5 | * @Description: 工具 6 | */ 7 | 8 | $w-sm: 640px; 9 | $w-md: 768px; 10 | $w-lg: 1024px; 11 | $w-xl: 1280px; 12 | $w-2xl: 1536px; 13 | 14 | /** 15 | 变量 16 | */ 17 | @mixin useThemeVar($vars) { 18 | @at-root html { 19 | &[data-color-scheme='light'] { 20 | @each $key, $value in $vars { 21 | --#{$key}: #{nth($value,1)}; 22 | } 23 | } 24 | 25 | &[data-color-scheme='dark'] { 26 | @each $key, $value in $vars { 27 | --#{$key}: #{nth($value,2)}; 28 | } 29 | } 30 | } 31 | } 32 | 33 | 34 | //$size 表示最大最小 35 | @mixin useResponsive($width,$level:'&',$size:max) { 36 | $unit: #{$size}-width; 37 | 38 | $maps: ( 39 | '&':&, // 子级 不带 # 40 | '#&':#Butterfly#{&}, // 带 # 41 | '# &':#Butterfly &, // 子级 不带 # 42 | ); 43 | 44 | $selector: map-get($maps, $level); 45 | 46 | @at-root #{$selector} { 47 | @media ($unit: $width) { 48 | @content; 49 | } 50 | } 51 | 52 | } 53 | 54 | 55 | //居中 56 | @mixin flex-center { 57 | display: flex; 58 | justify-content: center; 59 | align-items: center; 60 | } 61 | 62 | // 1行文字省略号 63 | @mixin text-overflow { 64 | overflow: hidden; 65 | text-overflow: ellipsis; 66 | white-space: nowrap; 67 | } 68 | 69 | @mixin wh100 { 70 | width: 100%; 71 | height: 100%; 72 | } 73 | 74 | 75 | @mixin text-clamp($clamp:1) { 76 | display: -webkit-box; 77 | overflow: hidden; 78 | text-overflow: ellipsis; 79 | -webkit-line-clamp: $clamp; 80 | -webkit-box-orient: vertical; 81 | } 82 | 83 | -------------------------------------------------------------------------------- /src/scss/core/aside.scss: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2024/2/18 3 | * @author: 小红 4 | * @fileName: aside 5 | * @Description: 侧部栏 6 | */ 7 | 8 | @use "util"; 9 | 10 | .aside { 11 | .card { 12 | padding: 16px 23px; 13 | 14 | &:not(:first-child) { 15 | margin-top: 15px; 16 | } 17 | 18 | > .title { 19 | font-size: 1rem; 20 | font-weight: 600; 21 | margin-bottom: 5px; 22 | 23 | > i { 24 | margin-right: 2px; 25 | font-size: 1.1rem; 26 | } 27 | } 28 | } 29 | 30 | &-user { 31 | text-align: center; 32 | 33 | > .avatar { 34 | width: 110px; 35 | height: 110px; 36 | border-radius: 70px; 37 | transition: transform .3s; 38 | margin: 0 auto; 39 | 40 | &:hover { 41 | filter: brightness(1.2); 42 | transform: rotate(360deg); 43 | cursor: var(--cursor-pointer); 44 | } 45 | } 46 | 47 | > .name { 48 | font-size: 1.5rem; 49 | margin: 6px 0 -5px 0; 50 | } 51 | 52 | > .data { 53 | display: table; 54 | margin: 14px 0 4px; 55 | table-layout: fixed; 56 | width: 100%; 57 | 58 | .item { 59 | display: table-cell; 60 | } 61 | 62 | .headline { 63 | font-size: 1rem; 64 | } 65 | 66 | .num { 67 | font-size: 1.4rem; 68 | color: var(--text-obs-color); 69 | } 70 | 71 | } 72 | 73 | > a > .button { 74 | width: 95%; 75 | margin: 0 auto; 76 | padding: 5px 10px; 77 | } 78 | 79 | .social { 80 | display: flex; 81 | justify-content: center; 82 | line-height: 1; 83 | margin: 15px 0 0; 84 | 85 | > .link { 86 | font-size: 1.35em; 87 | margin: 0 8px; 88 | transition: transform .3s; 89 | 90 | &:hover { 91 | transform: scale(1.1); 92 | } 93 | } 94 | } 95 | } 96 | 97 | &-notice { 98 | > .title > i { 99 | color: rgb(246, 8, 8); 100 | } 101 | } 102 | 103 | &-category { 104 | > .title > i { 105 | color: #108aec; 106 | } 107 | 108 | > .content { 109 | > .link { 110 | display: flex; 111 | position: relative; 112 | flex-direction: row; 113 | padding: 3px 10px 3px 25px; 114 | 115 | &:hover { 116 | filter: hue-rotate(38deg); 117 | 118 | .name { 119 | transform: translateX(5px); 120 | } 121 | } 122 | 123 | &:before { 124 | position: absolute; 125 | top: 8px; 126 | left: 0; 127 | width: 14px; 128 | height: 14px; 129 | border: 4px solid var(--theme); 130 | border-radius: 50%; 131 | background: 0 0; 132 | content: ""; 133 | cursor: var(--cursor-pointer); 134 | transition: border-color .3s, box-shadow .25s ease 0s; 135 | } 136 | 137 | > .name { 138 | width: 75%; 139 | margin-right: auto; 140 | transition: transform .3s; 141 | } 142 | 143 | > span { 144 | @include util.text-overflow; 145 | } 146 | } 147 | } 148 | } 149 | 150 | &-tags { 151 | > .title > i { 152 | color: #cf9128; 153 | } 154 | 155 | > .content { 156 | display: flex; 157 | flex-direction: row; 158 | flex-wrap: wrap; 159 | 160 | > .link { 161 | transition: transform .2s; 162 | padding: 0 4px; 163 | 164 | > .num { 165 | font-size: 0.7rem; 166 | } 167 | 168 | &:hover { 169 | transform: translateY(-3px); 170 | } 171 | } 172 | } 173 | } 174 | 175 | &-webInfo { 176 | > .title > i { 177 | color: #30b786; 178 | } 179 | 180 | .content { 181 | > .item { 182 | padding: 5px 0; 183 | display: flex; 184 | align-items: center; 185 | justify-content: space-between; 186 | } 187 | } 188 | } 189 | } -------------------------------------------------------------------------------- /src/scss/core/footer.scss: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2024/2/16 3 | * @author: 小红 4 | * @fileName: footer 5 | * @Description: footer 6 | */ 7 | .footer { 8 | text-align: center; 9 | padding: 1.5rem 1rem; 10 | 11 | .halo { 12 | color: #2f55d4; 13 | } 14 | 15 | .theme { 16 | color: var(--theme); 17 | } 18 | 19 | .police { 20 | display: flex; 21 | align-items: center; 22 | justify-content: center; 23 | 24 | img { 25 | transition: none; 26 | margin-right: 5px; 27 | top: -2px; 28 | } 29 | 30 | } 31 | 32 | a:hover { 33 | color: var(--theme); 34 | } 35 | } 36 | -------------------------------------------------------------------------------- /src/scss/core/header.scss: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2024/1/24 3 | * @author: 小红 4 | * @fileName: header 5 | * @Description: 头部 6 | */ 7 | @use "util"; 8 | 9 | .header { 10 | @import "nav"; 11 | 12 | & { 13 | position: relative; 14 | width: 100%; 15 | min-height: 60px; 16 | } 17 | 18 | @keyframes above-down { 19 | 0% { 20 | opacity: 0; 21 | transform: translate3d(0, -50px, 0) 22 | } 23 | 24 | to { 25 | opacity: 1; 26 | transform: translate3d(0, 0, 0) 27 | } 28 | } 29 | 30 | 31 | .above { 32 | position: relative; 33 | width: 100%; 34 | height: 500px; 35 | background-position: center center; 36 | background-size: cover; 37 | background-repeat: no-repeat; 38 | backface-visibility: hidden; 39 | //animation: above-down .8s; 40 | transition: .35s; 41 | background-blend-mode: multiply; 42 | background-color: var(--above-mask-color); 43 | @include util.flex-center; 44 | 45 | @include util.useThemeVar(( 46 | above-mask-color:(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.6)), 47 | )); 48 | 49 | //&::before { 50 | // position: absolute; 51 | // width: 100%; 52 | // height: 100%; 53 | // background-color: var(--above-mask-color); 54 | // content: ''; 55 | //} 56 | 57 | &-info { 58 | width: 100%; 59 | position: absolute; 60 | padding: 0 10px; 61 | text-align: center; 62 | } 63 | 64 | &-title { 65 | @keyframes above-title-scale { 66 | 0% { 67 | opacity: 0; 68 | transform: scale(.7) 69 | } 70 | 71 | 100% { 72 | opacity: 1; 73 | transform: scale(1) 74 | } 75 | } 76 | 77 | @include util.useThemeVar(( 78 | above-title-color: (rgb(255, 255, 255), rgba(255, 255, 255, 0.9)), 79 | )); 80 | 81 | @include util.useResponsive(util.$w-md) { 82 | font-size: 1.85em; 83 | } 84 | 85 | & { 86 | font-size: 2.3em; 87 | text-shadow: 2px 2px 4px rgba(0, 0, 0, .15); 88 | line-height: 1.5; 89 | font-weight: 700; 90 | color: var(--above-title-color); 91 | animation: above-title-scale 1s; 92 | } 93 | } 94 | } 95 | 96 | &.dp .nav { 97 | background-color: var(--nav-active-background-color); 98 | box-shadow: var(--nav-active-shadow); 99 | 100 | .link { 101 | text-shadow: none; 102 | color: var(--nav-active-font-color); 103 | } 104 | } 105 | } 106 | 107 | -------------------------------------------------------------------------------- /src/scss/core/index.scss: -------------------------------------------------------------------------------- 1 | @use "_reset"; 2 | @use "_base"; 3 | @use "_message"; 4 | @use "_button"; 5 | @use "common"; 6 | @use "header"; 7 | @use "main"; 8 | @use "footer"; 9 | @import 'animate.css/animate.min.css'; 10 | -------------------------------------------------------------------------------- /src/scss/core/main.scss: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2024/1/18 3 | * @author: 小红 4 | * @fileName: main 5 | * @Description: main 6 | */ 7 | @use "util"; 8 | 9 | .main { 10 | @import "aside"; 11 | 12 | @include util.useThemeVar(( 13 | card-background-color: (rgba(255, 255, 255, 1), rgba(40, 47, 62, 0.9)), 14 | )); 15 | 16 | 17 | & { 18 | width: 100%; 19 | display: flex; 20 | margin: 0 auto; 21 | max-width: 1250px; 22 | padding: 28px 15px; 23 | flex-direction: row; 24 | } 25 | 26 | .card { 27 | background-color: var(--card-background-color); 28 | border-radius: var(--card-border-radius); 29 | box-shadow: var(--card-box-shadow); 30 | transition: transform .25s, box-shadow .25s; 31 | 32 | &:hover { 33 | box-shadow: 0 3px 8px 6px rgba(7, 17, 27, 0.09); 34 | } 35 | } 36 | 37 | 38 | > .content { 39 | width: 100%; 40 | align-self: flex-start; 41 | padding: 1.5rem; 42 | 43 | @include util.useResponsive($width: util.$w-md) { 44 | padding: 1.2rem .8rem; 45 | } 46 | } 47 | 48 | > .aside { 49 | width: 25%; 50 | align-self: flex-start; 51 | } 52 | 53 | &.off-aside > .content { 54 | width: 100%; 55 | } 56 | 57 | &.aside-left { 58 | flex-direction: row-reverse; 59 | 60 | > .content { 61 | width: 74%; 62 | } 63 | } 64 | 65 | &.aside-right { 66 | flex-direction: row; 67 | 68 | > .content { 69 | width: 74%; 70 | } 71 | } 72 | 73 | &:is(.aside-left) .aside { 74 | margin-right: 18px; 75 | } 76 | 77 | &:is(.aside-right) .aside { 78 | margin-left: 18px; 79 | } 80 | 81 | 82 | @include util.useResponsive(1100px, '# &') { 83 | flex-direction: column; 84 | > .content { 85 | width: 100%; 86 | } 87 | > .aside { 88 | width: 100%; 89 | margin: 20px 0 0; 90 | } 91 | } 92 | 93 | @include util.useResponsive(util.$w-md) { 94 | padding: 18px 8px; 95 | } 96 | 97 | @include util.useResponsive($width: 2000px, $size: min) { 98 | max-width: 60%; 99 | } 100 | 101 | } -------------------------------------------------------------------------------- /src/scss/page/archives.scss: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2024/4/30 3 | * @author: 小红 4 | * @fileName: archives 5 | * @Description: 归档 6 | */ 7 | 8 | @use '../core'; 9 | @use "../core/util"; 10 | @use "../modules/components"; 11 | 12 | .archives { 13 | .chart { 14 | width: 100%; 15 | height: 380px; 16 | } 17 | 18 | .axis { 19 | @include util.useThemeVar(( 20 | axis-line-background-color: (#fff, rgba(40, 47, 62, 0.9)), 21 | )); 22 | 23 | &-title { 24 | position: relative; 25 | margin-left: 18px; 26 | padding-bottom: 20px; 27 | padding-left: 18px; 28 | font-size: 1.5rem; 29 | 30 | &:before { 31 | position: absolute; 32 | top: calc(((100% - 48px) / 2)); 33 | left: -9px; 34 | z-index: 1; 35 | width: 10px; 36 | height: 10px; 37 | border-radius: 10px; 38 | background-color: var(--axis-line-background-color); 39 | content: ''; 40 | line-height: 10px; 41 | transition: color .2s ease-in-out; 42 | border: 5px solid var(--theme); 43 | box-sizing: content-box; 44 | } 45 | 46 | 47 | &:after { 48 | position: absolute; 49 | bottom: 0; 50 | left: 0; 51 | z-index: 0; 52 | width: 2px; 53 | height: 1.8em; 54 | background-color: var(--theme); 55 | content: ''; 56 | top: 28px; 57 | } 58 | } 59 | 60 | &-list { 61 | margin-left: 18px; 62 | padding-left: 20px; 63 | border-left: 2px solid var(--theme); 64 | 65 | &--item { 66 | margin: 0 0 20px 10px; 67 | transition: .2s ease-in-out; 68 | position: relative; 69 | display: flex; 70 | align-items: center; 71 | 72 | &:before { 73 | position: absolute; 74 | left: calc(-20px - 17px); 75 | width: 6px; 76 | height: 6px; 77 | border-radius: 6px; 78 | background-color: var(--axis-line-background-color); 79 | content: ''; 80 | border: 3px solid var(--theme); 81 | box-sizing: content-box; 82 | margin: auto; 83 | top: 0; 84 | bottom: 0; 85 | } 86 | 87 | &.year { 88 | font-size: 1.43em; 89 | 90 | &:before { 91 | filter: hue-rotate(135deg); 92 | top: 10px; 93 | margin: 0; 94 | } 95 | } 96 | 97 | &:hover { 98 | &:before { 99 | filter: hue-rotate(135deg); 100 | } 101 | } 102 | 103 | .cover { 104 | width: 6rem; 105 | height: 6rem; 106 | border-radius: 8px; 107 | transition: transform .3s; 108 | @include util.text-overflow; 109 | position: relative; 110 | 111 | img { 112 | width: 100%; 113 | height: 100%; 114 | object-fit: cover; 115 | 116 | &:hover { 117 | transform: scale(1.1); 118 | } 119 | } 120 | } 121 | 122 | .info { 123 | padding: 0 16px; 124 | flex: 1; 125 | 126 | time { 127 | color: var(--text-obs-color); 128 | font-size: 95%; 129 | } 130 | 131 | .title { 132 | font-size: 1rem; 133 | transition: transform .3s; 134 | @include util.text-clamp(2); 135 | 136 | &:hover { 137 | color: var(--link-hover-color); 138 | //transform: translateX(10px); 139 | } 140 | } 141 | } 142 | } 143 | } 144 | } 145 | 146 | @include components.pagination; 147 | } -------------------------------------------------------------------------------- /src/scss/page/categories.scss: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2024/6/19 3 | * @author: 小红 4 | * @fileName: categories 5 | * @Description: 分类 6 | */ 7 | 8 | @use '../core'; 9 | @use "../core/util"; 10 | @use "../modules/components"; 11 | 12 | .categories { 13 | .chart { 14 | width: 100%; 15 | height: 450px; 16 | } 17 | 18 | } -------------------------------------------------------------------------------- /src/scss/page/category.scss: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2024/6/19 3 | * @author: 小红 4 | * @fileName: categories 5 | * @Description: 分类 6 | */ 7 | 8 | @use '../core'; 9 | @use "../core/util"; 10 | @use "../modules/components"; 11 | 12 | .category { 13 | .main { 14 | > .content { 15 | padding: 0; 16 | } 17 | } 18 | 19 | @include components.essayList; 20 | @include components.pagination; 21 | } 22 | 23 | -------------------------------------------------------------------------------- /src/scss/page/index.scss: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2024/1/18 3 | * @author: 小红 4 | * @fileName: index 5 | * @Description: 首页 6 | */ 7 | @use '../core'; 8 | @use "../core/util"; 9 | @use "../modules/components"; 10 | 11 | 12 | .index { 13 | .header .above { 14 | height: 100vh; 15 | 16 | @include util.useThemeVar(( 17 | above-index-subtitle-color: (#eee, rgba(255, 255, 255, 0.7)), 18 | )); 19 | 20 | &-subtitle { 21 | font-size: 1.5em; 22 | line-height: 1.5; 23 | color: var(--above-index-subtitle-color); 24 | text-shadow: 2px 2px 4px rgba(0, 0, 0, .15); 25 | animation: above-title-scale 1s; 26 | 27 | @include util.useResponsive(util.$w-md) { 28 | font-size: 1.15em; 29 | } 30 | } 31 | } 32 | 33 | .main { 34 | > .content { 35 | padding: 0; 36 | } 37 | } 38 | 39 | @include components.essayList; 40 | @include components.pagination; 41 | } 42 | 43 | -------------------------------------------------------------------------------- /src/scss/page/links.scss: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2024/6/19 3 | * @author: 小红 4 | * @fileName: links 5 | * @Description: 链接 6 | */ 7 | 8 | @use '../core'; 9 | @use "../core/util"; 10 | @use "../modules/components"; 11 | 12 | .links { 13 | .groups { 14 | --w: 60px; 15 | 16 | .item { 17 | .name { 18 | font-size: 1.2rem; 19 | margin: 15px 0; 20 | } 21 | 22 | .logo { 23 | width: var(--w); 24 | height: 60px; 25 | border-radius: 50%; 26 | transition: width .3s; 27 | } 28 | 29 | .list { 30 | display: grid; 31 | grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); 32 | gap: 16px; 33 | } 34 | 35 | 36 | .link { 37 | padding: 16px; 38 | display: flex; 39 | align-items: center; 40 | gap: 16px; 41 | text-decoration: none; 42 | transition: .3s; 43 | position: relative; 44 | overflow: hidden; 45 | height: 100px; 46 | border: 3px solid #eef1ef; 47 | border-radius: 15px; 48 | 49 | &:hover { 50 | border-color: var(--theme); 51 | } 52 | 53 | .info { 54 | width: calc(100% - var(--w) - 16px); 55 | display: flex; 56 | flex-direction: column; 57 | justify-content: space-between; 58 | } 59 | 60 | .n { 61 | @include util.text-clamp(1); 62 | font-size: .9rem; 63 | font-weight: 700; 64 | } 65 | 66 | .d { 67 | @include util.text-clamp(2); 68 | line-height: 1.3; 69 | font-size: .8rem; 70 | } 71 | } 72 | } 73 | 74 | } 75 | } 76 | 77 | 78 | -------------------------------------------------------------------------------- /src/scss/page/moments.scss: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2024/6/21 3 | * @author: 小红 4 | * @fileName: moments 5 | * @Description: 瞬间 6 | */ 7 | 8 | @use '../core'; 9 | @use "../core/util"; 10 | @use "../modules/components"; 11 | @use "../modules/render"; 12 | 13 | .moments { 14 | 15 | @include util.useThemeVar(( 16 | m-color: (#363636, #F7F7FA), 17 | )); 18 | 19 | 20 | .content { 21 | > .list { 22 | 23 | .item { 24 | margin-bottom: 15px; 25 | padding: 10px; 26 | //border-radius: 10px; 27 | //box-shadow: 1px 1px 5px 0 #d8d8d8; 28 | border-bottom: var(--theme) dashed 1px; 29 | } 30 | 31 | .h { 32 | font-weight: 700; 33 | color: var(--m-color); 34 | font-size: .8rem; 35 | } 36 | 37 | .medium { 38 | display: flex; 39 | flex-direction: row; 40 | flex-wrap: wrap; 41 | 42 | img, video, audio { 43 | width: 170px; 44 | height: 110px; 45 | border-radius: 5px; 46 | margin-right: 10px; 47 | } 48 | 49 | video { 50 | object-fit: cover; 51 | object-position: center; 52 | } 53 | } 54 | 55 | .in { 56 | 57 | } 58 | } 59 | } 60 | 61 | } -------------------------------------------------------------------------------- /src/scss/page/post.scss: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2024/3/16 3 | * @author: 小红 4 | * @fileName: post 5 | * @Description: 文章 6 | */ 7 | @use '../core'; 8 | @use "../core/util"; 9 | @use "../modules/components"; 10 | @use "../modules/render"; 11 | 12 | .post { 13 | .header .above { 14 | &-info { 15 | padding: 0 8%; 16 | transition: bottom .3s, padding .3s; 17 | text-align: center; 18 | 19 | @include util.useResponsive(900px) { 20 | bottom: 30px; 21 | text-align: left; 22 | } 23 | 24 | @include util.useResponsive(util.$w-md) { 25 | bottom: 22px; 26 | padding: 0 22px; 27 | } 28 | } 29 | } 30 | 31 | //.main > .content { 32 | // padding: 1.5rem 1.8rem; 33 | //} 34 | 35 | @include util.useThemeVar(( 36 | post-title-color: (#ffffff, rgba(255, 255, 255, 0.9)), 37 | post-meta-color: (#eeeeee, rgba(255, 255, 255, 0.7)), 38 | )); 39 | 40 | &-title { 41 | font-weight: 400; 42 | margin-bottom: 8px; 43 | color: var(--post-title-color); 44 | font-size: 2.2rem; 45 | line-height: 1.5; 46 | transition: font-size .3s; 47 | @include util.text-clamp(3); 48 | 49 | @include util.useResponsive(util.$w-md) { 50 | font-size: 1.8rem; 51 | } 52 | 53 | @include util.useResponsive(650px) { 54 | font-size: 1.5rem; 55 | } 56 | } 57 | 58 | &-meta { 59 | color: var(--post-meta-color); 60 | font-size: 95%; 61 | user-select: none; 62 | 63 | .row { 64 | .wp:not(:last-child):after { 65 | content: '|'; 66 | margin: 0 5px; 67 | } 68 | 69 | .wp.category, .wp.tag { 70 | .lk:not(:last-child):after { 71 | content: '•'; 72 | margin: 0 5px; 73 | color: var(--post-meta-color); 74 | } 75 | } 76 | 77 | } 78 | } 79 | } -------------------------------------------------------------------------------- /src/scss/page/single.scss: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2024/6/21 3 | * @author: 小红 4 | * @fileName: single 5 | * @Description: 自定义页面 6 | */ 7 | 8 | @use '../core'; 9 | @use "../core/util"; 10 | @use "../modules/components"; 11 | @use "../modules/render"; 12 | 13 | .single { 14 | 15 | } -------------------------------------------------------------------------------- /src/scss/page/tag.scss: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2024/6/19 3 | * @author: 小红 4 | * @fileName: tag 5 | * @Description: 标签详情 6 | */ 7 | 8 | @use '../core'; 9 | @use "../core/util"; 10 | @use "../modules/components"; 11 | 12 | 13 | .tag { 14 | .main { 15 | > .content { 16 | padding: 0; 17 | } 18 | } 19 | 20 | @include components.essayList; 21 | @include components.pagination; 22 | } 23 | 24 | 25 | -------------------------------------------------------------------------------- /src/scss/page/tags.scss: -------------------------------------------------------------------------------- 1 | /** 2 | * @date: 2024/5/23 3 | * @author: 小红 4 | * @fileName: tags 5 | * @Description: 标签 6 | */ 7 | @use '../core'; 8 | @use "../core/util"; 9 | @use "../modules/components"; 10 | 11 | .tags { 12 | .chart { 13 | width: 100%; 14 | height: 360px; 15 | } 16 | 17 | .equinox { 18 | display: flex; 19 | flex-direction: row; 20 | flex-wrap: wrap; 21 | gap: 25px; 22 | justify-content: center; 23 | 24 | .link { 25 | position: relative; 26 | transition: transform .2s ease-in-out; 27 | font-size: 1.5em; 28 | 29 | &:hover { 30 | transform: scale(1.1); 31 | } 32 | 33 | &::before { 34 | position: absolute; 35 | content: attr(data-postCount); 36 | font-size: 75%; 37 | right: -10px; 38 | top: -5px; 39 | } 40 | } 41 | } 42 | } 43 | 44 | 45 | -------------------------------------------------------------------------------- /theme.yaml: -------------------------------------------------------------------------------- 1 | apiVersion: theme.halo.run/v1alpha1 2 | kind: Theme 3 | metadata: 4 | name: theme-butterfly 5 | spec: 6 | displayName: Butterfly 7 | author: 8 | name: 小红 9 | website: 'https://dhjdd.cn' 10 | description: '一个Halo博客主题，Butterfly 🦋' 11 | logo: 'https://halo.run/logo' 12 | website: 'https://dhjdd.cn' 13 | repo: 'https://github.com/dhjddcn/halo-theme-butterfly.git' 14 | settingName: theme-butterfly-setting 15 | configMapName: theme-butterfly-configMap 16 | version: 2.0.7 17 | require: 2.0.0 18 | --------------------------------------------------------------------------------