Compare commits
219 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 57f98b48c5 | |||
| 1d07b40d08 | |||
| 47b7c969f1 | |||
| 152e7fa5a2 | |||
| df90a0eb96 | |||
| 5f1e79f49c | |||
| 8b6806bbf3 | |||
| c65852d882 | |||
| 224621b114 | |||
| e0940bd4d3 | |||
| 8782b46f53 | |||
| 9f378691f1 | |||
| 9f4d33a670 | |||
| 3c449a9017 | |||
| 65e9f2ff92 | |||
| 54fe7bdc83 | |||
| 0bc1862853 | |||
| b680d609a1 | |||
| a9c29b1641 | |||
| 7bdd0c5869 | |||
| 8d7703a418 | |||
| da2f085969 | |||
| e3acdb9732 | |||
| ece55d0d36 | |||
| a73416e2be | |||
| 9e2f388022 | |||
| 610fa1d561 | |||
| a5a7b98c95 | |||
| a5d24f395e | |||
| f5509e5b82 | |||
| d35dd6a120 | |||
| 5322a15ceb | |||
| a254e10136 | |||
| 15b415ff2e | |||
| 2c0b48370b | |||
| e07eefd506 | |||
| 7a28234de3 | |||
| 0d6af76f06 | |||
| 10da1f731f | |||
| bfee4041d6 | |||
| 78f1a8583a | |||
| 3e4cb8d699 | |||
| b274b1b33b | |||
| 06419f7968 | |||
| 3326ea4515 | |||
| 5811b21f02 | |||
| 54fb90388f | |||
| 3242dbf2fb | |||
| 966ace5a66 | |||
| 20c0997cc5 | |||
| 69920e0140 | |||
| d81d1a0ff4 | |||
| e6625fb118 | |||
| 405024989c | |||
| 874337f7d1 | |||
| b95a29e6e4 | |||
| 6188165504 | |||
| e4bd5731df | |||
| 391d2ecd56 | |||
| b5419ef704 | |||
| a2d756777f | |||
| 43c439eee0 | |||
| e58bdd4db5 | |||
| 5453d3d136 | |||
| c86566fa8e | |||
| ed451351d6 | |||
| 8efdce73d1 | |||
| c6b5c825ed | |||
| a96ba665ac | |||
| 52ab989c96 | |||
| 9da44f0885 | |||
| 0f35108699 | |||
| 658f03d1e5 | |||
| bfef6c5359 | |||
| 069ddd1c84 | |||
| daa075340e | |||
| 743ecd20d0 | |||
| 76530ceb16 | |||
| 5ee8272b57 | |||
| 994a5d45b5 | |||
| 575499d7db | |||
| 3c2fb3ec54 | |||
| 1012fdc240 | |||
| d076ebf2e1 | |||
| ea140e35f8 | |||
| fb0c00e274 | |||
| 279021d591 | |||
| 8af8e806d7 | |||
| e30b9db23b | |||
| a5f362f5ff | |||
| 5cad4d3df9 | |||
| 47247e01c5 | |||
| 4b3f33f35a | |||
| db85dcbaf1 | |||
| b7db52eb7e | |||
| 17d7bc1781 | |||
| 6f83bc6da5 | |||
| 01eadc4356 | |||
| 68d9a352c3 | |||
| a696f3b1bd | |||
| 6070061b6b | |||
| 47ebabd677 | |||
| 43dd1c72d9 | |||
| a7bae572a1 | |||
| c057a0d578 | |||
| 9ed063f32d | |||
| 53620404e4 | |||
| c7ed62c51e | |||
| f7ec3e374d | |||
| 5862699d46 | |||
| 031691a1e4 | |||
| b8ec5f16d7 | |||
| f5b030b4eb | |||
| 03ca90b49f | |||
| eeff00f8c7 | |||
| 17164f42d0 | |||
| 03d81f0785 | |||
| a4a0eb1f3b | |||
| 76f809794f | |||
| 20f59e0fe2 | |||
| bc3fb3a717 | |||
| ddbf47df7f | |||
| ba369aec14 | |||
| 0fe8e100df | |||
| 4a60d805fa | |||
| a7cf34367d | |||
| 5b43c2b6a3 | |||
| 038f602bc5 | |||
| 7cab906676 | |||
| 0c30f4c57d | |||
| f78e5b9e8f | |||
| aa3b591846 | |||
| 14a965f9c1 | |||
| f76b6a1f1c | |||
| 4ffd531d63 | |||
| 78778dad08 | |||
| a4fcc5ed59 | |||
| 47299db5d3 | |||
| a9b380cada | |||
| f764563358 | |||
| a7503c446c | |||
| 76de476b41 | |||
| 91d483a808 | |||
| cd7b1e70b8 | |||
| 819051eebf | |||
| ebcf22d2bc | |||
| ed8ec5c2c8 | |||
| caf2b08013 | |||
| a82d8c3b87 | |||
| d59bb2de6b | |||
| ebf1e7e109 | |||
| ee299ce372 | |||
| f544826d9d | |||
| 57206e5224 | |||
| 16e966095f | |||
| 97ddee080f | |||
| f91154744e | |||
| a2d4b465f7 | |||
| e68200a9e0 | |||
| 4e0c3d8fc4 | |||
| 12187b0856 | |||
| e4580190e9 | |||
| 26b0556b9e | |||
| e90a249375 | |||
| 55b80953a1 | |||
| 799618fd3e | |||
| dd6d320654 | |||
| de6894b817 | |||
| 9c04cfd47a | |||
| e68bdb374b | |||
| 502e427a0c | |||
| cedff8610b | |||
| 530bc6cef6 | |||
| 5e6e2904ff | |||
| e68d10d7d9 | |||
| 5fe681ccc5 | |||
| f9c7e1d991 | |||
| 95664509a0 | |||
| 4158ebffbd | |||
| 95644808a1 | |||
| 295717a52d | |||
| 1b3490ba3a | |||
| 77bb00ce5c | |||
| 09e08d0772 | |||
| b406a569f8 | |||
| 9ada69ed71 | |||
| 4982231d5f | |||
| 9e400518ad | |||
| 1e0d1affaf | |||
| 3dd16e691f | |||
| 557a59d7fd | |||
| b0a17196c1 | |||
| aef8eaf936 | |||
| 5f100a6cca | |||
| 75ee1624bd | |||
| d45f6b1550 | |||
| 673be1e8c0 | |||
| e527289140 | |||
| 66dc7bc5af | |||
| 29ece68332 | |||
| b172fd416d | |||
| 4cba468b4e | |||
| 741ef191bf | |||
| 164a699701 | |||
| e0a0086f03 | |||
| 11954d833f | |||
| cfa9bef6ac | |||
| 7338930c9f | |||
| 92b0a6b56e | |||
| 9132b408c6 | |||
| a53ef80035 | |||
| 0f2712f182 | |||
| d5aa013106 | |||
| d9e45154ff | |||
| b09555981b | |||
| 65ad407cd0 | |||
| 9e384b666f | |||
| 96b4b4512c | |||
| de38644d75 |
@@ -0,0 +1,21 @@
|
||||
FROM mcr.microsoft.com/devcontainers/javascript-node:24
|
||||
|
||||
# Install Hugo Extended
|
||||
ARG HUGO_VERSION
|
||||
RUN curl -sLJO "https://github.com/gohugoio/hugo/releases/download/v${HUGO_VERSION}/hugo_extended_${HUGO_VERSION}_linux-amd64.tar.gz" \
|
||||
&& tar -C /usr/local/bin -xf "hugo_extended_${HUGO_VERSION}_linux-amd64.tar.gz" hugo \
|
||||
&& rm "hugo_extended_${HUGO_VERSION}_linux-amd64.tar.gz"
|
||||
|
||||
# Install Dart Sass
|
||||
ARG DART_SASS_VERSION
|
||||
RUN curl -sLJO "https://github.com/sass/dart-sass/releases/download/${DART_SASS_VERSION}/dart-sass-${DART_SASS_VERSION}-linux-x64.tar.gz" \
|
||||
&& tar -C /usr/local -xf "dart-sass-${DART_SASS_VERSION}-linux-x64.tar.gz" \
|
||||
&& ln -s /usr/local/dart-sass/sass /usr/local/bin/sass \
|
||||
&& rm "dart-sass-${DART_SASS_VERSION}-linux-x64.tar.gz"
|
||||
|
||||
# Install Go
|
||||
ARG GO_VERSION
|
||||
RUN curl -sLJO "https://go.dev/dl/go${GO_VERSION}.linux-amd64.tar.gz" \
|
||||
&& tar -C /usr/local -xf "go${GO_VERSION}.linux-amd64.tar.gz" \
|
||||
&& rm "go${GO_VERSION}.linux-amd64.tar.gz"
|
||||
ENV PATH="/usr/local/go/bin:${PATH}"
|
||||
@@ -0,0 +1,27 @@
|
||||
{
|
||||
"name": "FixIt Theme",
|
||||
"build": {
|
||||
"dockerfile": "Dockerfile",
|
||||
"args": {
|
||||
"HUGO_VERSION": "0.161.0",
|
||||
"DART_SASS_VERSION": "1.99.0",
|
||||
"GO_VERSION": "1.24.4"
|
||||
}
|
||||
},
|
||||
"postCreateCommand": "pnpm install",
|
||||
"customizations": {
|
||||
"vscode": {
|
||||
"extensions": [
|
||||
"budparr.language-hugo-vscode",
|
||||
"kaellarkin.hugo-shortcode-syntax",
|
||||
"lruihao.hugo-partials-refs",
|
||||
"tamasfe.even-better-toml",
|
||||
"casualjim.gotemplate",
|
||||
"SomewhatStationery.some-sass",
|
||||
"gruntfuggly.todo-tree",
|
||||
"antfu.unocss",
|
||||
"antfu.iconify"
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,9 @@
|
||||
root = true
|
||||
|
||||
[*]
|
||||
charset = utf-8
|
||||
end_of_line = lf
|
||||
indent_style = space
|
||||
indent_size = 2
|
||||
insert_final_newline = true
|
||||
trim_trailing_whitespace = true
|
||||
@@ -1,14 +1,16 @@
|
||||
<!-- Thank you for contributing! -->
|
||||
<!--
|
||||
Thank you for contributing!
|
||||
|
||||
Before submitting the PR, please make sure you do the following:
|
||||
|
||||
- Read the [Contributing Guidelines](https://github.com/hugo-fixit/FixIt/blob/main/CONTRIBUTING.md).
|
||||
- Provide a description in this PR that addresses **what** the PR is solving. If this PR is going to solve an existing issue, please reference the issue (e.g. `close #123`).
|
||||
-->
|
||||
|
||||
### Description
|
||||
|
||||
<!-- Please insert your description here and provide especially info about the "what" this PR is solving -->
|
||||
|
||||
### Before submitting the PR, please make sure you do the following <!-- (put an "X" next to an item) -->
|
||||
|
||||
- [ ] Read the [Contributing Guidelines](https://github.com/hugo-fixit/FixIt/blob/main/CONTRIBUTING.md).
|
||||
- [ ] Provide a description in this PR that addresses **what** the PR is solving. If this PR is going to solve an existing issue, please reference the issue (e.g. `close #123`).
|
||||
|
||||
### What is the purpose of this pull request? <!-- (put an "X" next to an item) -->
|
||||
|
||||
- [ ] Bug fix
|
||||
|
||||
@@ -2,3 +2,4 @@ name: CodeQL config
|
||||
|
||||
paths-ignore:
|
||||
- assets/lib/**
|
||||
- assets/js/lib/mermaid.js
|
||||
|
||||
@@ -1,315 +1,104 @@
|
||||
# FixIt 编码标准和指导原则
|
||||
# FixIt Coding Standards and Guidelines
|
||||
|
||||
本文档定义了 FixIt 主题项目的编码标准、最佳实践和开发指导原则。所有贡献者和 AI 助手在参与项目开发时都应遵循这些规范。
|
||||
This document defines the detailed coding standards for the FixIt theme project. For project overview, architecture, and development commands, see [CLAUDE.md](../../CLAUDE.md).
|
||||
|
||||
## 项目概述
|
||||
## SCSS Coding Standards
|
||||
|
||||
FixIt 是一个面向 Hugo 静态网站生成器的现代化、响应式主题。项目基于以下技术栈:
|
||||
### Naming
|
||||
|
||||
- **Hugo**: 静态网站生成器(≥ 0.156.0)
|
||||
- **SCSS**: CSS 预处理器,用于样式开发
|
||||
- **JavaScript**: ES6+ 标准,用于前端交互功能
|
||||
- **Go Templates**: Hugo 模板引擎
|
||||
- **Node.js**: 开发环境和构建工具
|
||||
- **pnpm**: 包管理器
|
||||
- **CSS classes**: BEM or semantic naming (`header-desktop`, `menu-item`, `post-tag`)
|
||||
- **SCSS variables**: hyphen-separated, semantic (`$global-font-family`, `$code-background-color`)
|
||||
- **CSS custom properties**: prefixed with `fi-` / `--fi-`
|
||||
|
||||
## 目录结构约定
|
||||
### SCSS Guidelines
|
||||
|
||||
```
|
||||
FixIt/
|
||||
├── apps/ # 最小化站点
|
||||
│ ├── demo/ # 演示站点
|
||||
│ └── test/ # 测试站点
|
||||
├── archetypes/ # 内容模板
|
||||
├── assets/ # 主题资源文件
|
||||
│ ├── css/ # SCSS 样式文件
|
||||
│ ├── js/ # JavaScript 文件
|
||||
│ ├── images/ # 图像资源
|
||||
│ └── lib/ # 第三方库
|
||||
├── i18n/ # 国际化翻译文件
|
||||
├── layouts/ # Hugo 模板文件
|
||||
│ ├── _markup/ # Hugo 渲染钩子
|
||||
│ ├── _partials/ # 可复用模板组件
|
||||
│ └── _shortcodes/ # 自定义短代码
|
||||
├── packages/ # 主题相关包
|
||||
├── static/ # 静态文件
|
||||
├── hugo.toml # 主题默认配置
|
||||
└── package.json # npm 脚本和依赖
|
||||
```
|
||||
- Use 2-space indentation
|
||||
- Use CSS variables for theme switching support
|
||||
- Prefer relative units (rem, em, %) over absolute units
|
||||
- Use SCSS variables for colors — no hardcoded values
|
||||
- Keep selector nesting shallow
|
||||
|
||||
## SCSS/CSS 编码规范
|
||||
## UnoCSS Guidelines
|
||||
|
||||
### 文件组织结构
|
||||
- Use UnoCSS atomic classes for common utilities (`hidden`, `me-1`, `text-center`, etc.)
|
||||
- Theme colors: `bg-primary`, `text-success`, `text-danger`, etc. (mapped via `@theme` in `uno.config.ts`)
|
||||
- Responsive: `sm:` (>=680px), `md:` (>=960px), `lg:` (>=1200px), `xl:` (>=1440px). Use `max-sm:` for xs (<680px)
|
||||
- Wrap SVG elements with `<!-- @unocss-skip-start -->` / `<!-- @unocss-skip-end -->` to avoid false positives from `d` attribute values
|
||||
- Dynamically generated classes (e.g., `order-*`) must be added to `safelist` in `uno.config.ts`
|
||||
- Run `pnpm unocss` after modifying `uno.config.ts` or templates that use UnoCSS classes
|
||||
|
||||
1. **主入口文件**: `assets/css/style.scss`
|
||||
2. **变量文件**: `assets/css/_variables.scss` - 全局变量定义
|
||||
3. **覆写文件**: `assets/css/_override.scss` - 用户自定义覆写
|
||||
4. **组织结构**:
|
||||
- `_core/`: 核心样式(基础、布局、媒体查询等)
|
||||
- `_mixin/`: SCSS mixins 和函数
|
||||
- `_page/`: 页面特定样式
|
||||
- `_partials/`: 组件样式
|
||||
- `_shortcodes/`: 短代码样式
|
||||
## TypeScript Coding Standards
|
||||
|
||||
### 命名约定
|
||||
### Architecture
|
||||
|
||||
1. **CSS 类名**: 使用 BEM 方法论或语义化命名
|
||||
Service-class architecture with direct constructor calls:
|
||||
|
||||
```scss
|
||||
.header-desktop {}
|
||||
.menu-item {}
|
||||
.single-title {}
|
||||
.post-tag {}
|
||||
```
|
||||
- **`TypedEventBus`** (`core/event-bus.ts`) — Module-level singleton (`eventBus`) wrapping DOM `CustomEvents` with typed event map.
|
||||
- **Service interfaces** (`core/tokens.ts`) — Typed contracts for each module (`CoreService`, `ThemeService`, `CodeService`, etc.).
|
||||
- **Module classes** (`modules/*.ts`) — Each module implements its service interface. Dependencies are constructor-injected.
|
||||
|
||||
2. **SCSS 变量**: 使用连字符分隔,语义化命名
|
||||
### Module Pattern
|
||||
|
||||
```scss
|
||||
$global-font-family: system-ui, sans-serif;
|
||||
$code-background-color: #f6f8fa;
|
||||
$header-height: 3.5rem;
|
||||
```
|
||||
```typescript
|
||||
export class ExampleModule implements ExampleService {
|
||||
#privateState: any // ES6 # private fields, not _ prefix
|
||||
|
||||
3. **CSS 自定义属性**: 使用前缀约定
|
||||
constructor(private readonly core: CoreService) {}
|
||||
|
||||
```scss
|
||||
$prefix: fi-;
|
||||
$rootPrefix: --fi-;
|
||||
```
|
||||
|
||||
### 样式组织原则
|
||||
|
||||
1. **主题切换支持**: 使用 CSS 变量实现主题切换
|
||||
|
||||
```scss
|
||||
.element {
|
||||
color: var(#{$rootPrefix}global-font-color);
|
||||
}
|
||||
```
|
||||
|
||||
2. **Mixin 使用**: 提高代码复用性
|
||||
|
||||
```scss
|
||||
@include border-radius;
|
||||
@include transition(all 0.2s ease);
|
||||
@include blur;
|
||||
```
|
||||
|
||||
### 代码质量要求
|
||||
|
||||
1. **缩进**: 使用 2 个空格
|
||||
2. **注释**: 为复杂逻辑添加注释
|
||||
3. **颜色**: 使用变量而非硬编码颜色值
|
||||
4. **单位**: 优先使用相对单位(rem、em、%)
|
||||
|
||||
## JavaScript 编码规范
|
||||
|
||||
### 代码风格
|
||||
|
||||
1. **ES6+ 标准**: 使用现代 JavaScript 语法
|
||||
2. **模块化**: 使用 ES6 模块系统
|
||||
|
||||
### 文件组织
|
||||
|
||||
1. **主题核心**: `assets/js/theme.js` - 主题核心逻辑
|
||||
2. **工具函数**: `assets/js/util.js` - 通用工具函数
|
||||
3. **特定功能**: 按功能划分独立模块
|
||||
|
||||
### 编码实例
|
||||
|
||||
```javascript
|
||||
// 使用 ES6 类
|
||||
export default class Util {
|
||||
static copyText(text) {
|
||||
// ...
|
||||
}
|
||||
}
|
||||
|
||||
// 主题类组织
|
||||
class FixIt {
|
||||
constructor() {
|
||||
this.config = window.config
|
||||
this.scrollTop = Util.getScrollTop()
|
||||
}
|
||||
|
||||
init() {
|
||||
this.initTheme()
|
||||
this.initComponents()
|
||||
}
|
||||
publicMethod(): void { /* ... */ }
|
||||
#privateHelper(): void { /* ... */ }
|
||||
}
|
||||
```
|
||||
|
||||
### 最佳实践
|
||||
### Key Rules
|
||||
|
||||
1. **错误处理**: 使用 try-catch 处理异常
|
||||
2. **异步操作**: 优先使用 async/await
|
||||
3. **事件处理**: 合理使用事件委托
|
||||
4. **性能优化**: 避免不必要的 DOM 操作
|
||||
- Use ES6 `#` private fields — not TypeScript `private` with `_` prefix
|
||||
- Keep modules focused: one module per file, one service interface per module
|
||||
- Import the shared `eventBus` singleton from `core/event-bus` for cross-module communication
|
||||
- Constructor injection for dependencies — no global state access
|
||||
- `window.fixit` exposes a typed public API (`FixItPublicAPI`) for user custom scripts
|
||||
- Comment style: follow [TSDoc](https://tsdoc.org/) conventions
|
||||
|
||||
## Hugo 模板规范
|
||||
### Utilities
|
||||
|
||||
### 模板组织
|
||||
- Pure functions only in `utils/` — no side effects, no DOM state
|
||||
- Re-export everything through `utils/index.ts`
|
||||
|
||||
1. **布局模板**: `layouts/` 目录下的主要模板
|
||||
2. **局部模板**: `layouts/_partials/` 下的可复用组件
|
||||
3. **短代码**: `layouts/_shortcodes/` 下的内容短代码
|
||||
## Hugo Template Standards
|
||||
|
||||
### 编码约定
|
||||
### Conventions
|
||||
|
||||
1. **变量命名**: 使用驼峰命名法
|
||||
- **Variable naming**: camelCase (`$footerConfig`, `$fingerprint`)
|
||||
- **Comments**: Hugo syntax `{{- /* comment */ -}}`
|
||||
- **Translation**: Use `T` function for i18n (`{{ T "header.switchTheme" }}`)
|
||||
- **Whitespace**: Use `{{- -}}` trim markers to control whitespace output
|
||||
|
||||
```go-html-template
|
||||
{{- $footerConfig := .Site.Params.footer -}}
|
||||
{{- $fingerprint := .Site.Store.Get "fingerprint" -}}
|
||||
```
|
||||
### Hugo Template Guidelines
|
||||
|
||||
2. **注释规范**: 使用 Hugo 注释语法
|
||||
- Use `partialCached` for expensive partials that don't change per page
|
||||
- Use `.Site.Store` for shared computed values (e.g. fingerprint)
|
||||
- Check `hugo.IsProduction` before adding analytics or minification
|
||||
|
||||
```go-html-template
|
||||
{{- /* 这是模板注释 */ -}}
|
||||
{{- /*
|
||||
多行注释
|
||||
可以跨越多行
|
||||
*/ -}}
|
||||
```
|
||||
## Git Workflow
|
||||
|
||||
3. **条件判断**: 清晰的条件结构
|
||||
### Commit Convention
|
||||
|
||||
```go-html-template
|
||||
{{- if ne $config.enable false -}}
|
||||
<!-- 内容 -->
|
||||
{{- end -}}
|
||||
```
|
||||
|
||||
4. **循环遍历**: 合理使用 range
|
||||
|
||||
```go-html-template
|
||||
{{- range $index, $value := .Pages -}}
|
||||
<!-- 处理逻辑 -->
|
||||
{{- end -}}
|
||||
```
|
||||
|
||||
### 国际化处理
|
||||
|
||||
1. **翻译函数**: 使用 `T` 函数
|
||||
|
||||
```go-html-template
|
||||
{{ T "header.switchTheme" }}
|
||||
```
|
||||
|
||||
2. **多语言支持**: 考虑多语言环境
|
||||
|
||||
```go-html-template
|
||||
{{- if hugo.IsMultilingual -}}
|
||||
<!-- 多语言逻辑 -->
|
||||
{{- end -}}
|
||||
```
|
||||
|
||||
## 开发工作流程
|
||||
|
||||
### 环境设置
|
||||
|
||||
1. **前置要求**:
|
||||
- Node.js (≥ 20.0.0)
|
||||
- Hugo Extended (≥ 0.156.0)
|
||||
- pnpm (包管理器)
|
||||
|
||||
2. **开发命令**:
|
||||
|
||||
```bash
|
||||
pnpm dev:demo # 启动 demo 站点开发服务器
|
||||
pnpm dev:test # 启动 test 站点开发服务器
|
||||
pnpm dev:docs # 启动文档开发服务器(需有 fixit-docs 作为同级目录)
|
||||
pnpm build:demo # 构建 demo 站点
|
||||
pnpm build:test # 构建 test 站点
|
||||
pnpm build # 一键构建所有站点
|
||||
pnpm preview # 预览构建后的站点(需先构建)
|
||||
```
|
||||
|
||||
### 代码质量
|
||||
|
||||
1. **代码审查**: 提交前进行自我审查
|
||||
2. **测试验证**: 在多个环境中测试功能
|
||||
3. **文档更新**: 必要时更新相关文档
|
||||
4. **向后兼容**: 确保更改不破坏现有功能
|
||||
|
||||
### Git 提交规范
|
||||
|
||||
遵循 [Conventional Commits](https://www.conventionalcommits.org/) 规范:
|
||||
Follows [Conventional Commits](https://www.conventionalcommits.org/):
|
||||
|
||||
```
|
||||
feat: 新增功能
|
||||
fix: 修复 bug
|
||||
docs: 文档更新
|
||||
style: 代码格式调整
|
||||
refactor: 代码重构
|
||||
test: 测试相关
|
||||
chore: 构建过程或工具相关
|
||||
<type>(<scope>): <subject>
|
||||
```
|
||||
|
||||
## 性能优化指导
|
||||
Types: `feat`, `fix`, `refactor`, `chore`, `docs`, `perf`, `style`, `test`, `ci`, `build`
|
||||
|
||||
### CSS 性能
|
||||
Scopes: `workflow`, `archetypes`, `assets`, `i18n`, `layouts`, `config`, or specific directories.
|
||||
|
||||
1. **选择器优化**: 避免过深的嵌套
|
||||
2. **媒体查询**: 合理组织响应式断点
|
||||
3. **动画优化**: 使用 transform 和 opacity
|
||||
4. **资源压缩**: 生产环境启用压缩
|
||||
### Pre-commit Hooks
|
||||
|
||||
### JavaScript 性能
|
||||
Pre-commit runs: versioning (dev mode), typecheck, lint-staged (eslint --fix on staged files).
|
||||
|
||||
1. **延迟加载**: 非关键脚本使用 defer
|
||||
2. **事件优化**: 合理使用防抖和节流
|
||||
3. **内存管理**: 及时清理事件监听器
|
||||
4. **模块化**: 按需加载功能模块
|
||||
## Browser Compatibility
|
||||
|
||||
### Hugo 模板性能
|
||||
|
||||
1. **缓存策略**: 合理使用 Hugo 缓存机制
|
||||
2. **资源处理**: 优化图片和静态资源
|
||||
3. **构建优化**: 减少不必要的模板处理
|
||||
|
||||
## 可访问性要求
|
||||
|
||||
1. **语义化 HTML**: 使用正确的 HTML 标签
|
||||
2. **ARIA 属性**: 为复杂组件添加 ARIA 支持
|
||||
3. **键盘导航**: 确保键盘可访问性
|
||||
4. **颜色对比**: 满足 WCAG 对比度要求
|
||||
5. **屏幕阅读器**: 提供适当的文本替代
|
||||
|
||||
## 浏览器兼容性
|
||||
|
||||
1. **目标浏览器**: 支持现代浏览器
|
||||
2. **渐进增强**: 基础功能向下兼容
|
||||
3. **特性检测**: 使用特性检测而非浏览器检测
|
||||
4. **Polyfill**: 必要时提供 polyfill 支持
|
||||
|
||||
## 安全考虑
|
||||
|
||||
1. **XSS 防护**: 正确处理用户输入
|
||||
2. **CSRF 保护**: 表单提交安全
|
||||
3. **内容安全**: 合理设置 CSP 策略
|
||||
4. **依赖安全**: 定期更新依赖包
|
||||
|
||||
## 文档要求
|
||||
|
||||
1. **代码注释**: 复杂逻辑必须注释
|
||||
2. **API 文档**: 公共方法需要文档
|
||||
3. **使用示例**: 提供清晰的使用示例
|
||||
4. **更新日志**: 重要更改记录在 CHANGELOG
|
||||
|
||||
## 第三方库管理
|
||||
|
||||
1. **依赖选择**: 优先选择轻量、维护活跃的库
|
||||
2. **版本管理**: 及时更新安全补丁
|
||||
3. **许可证**: 确保许可证兼容性
|
||||
4. **定制化**: 必要时进行本地化修改
|
||||
|
||||
## 贡献指导
|
||||
|
||||
1. **讨论优先**: 重大更改前先讨论
|
||||
2. **小步迭代**: 避免大规模重构
|
||||
3. **测试覆盖**: 新功能需要充分测试
|
||||
4. **文档同步**: 功能和文档同时更新
|
||||
|
||||
遵循这些编码标准将有助于维护代码质量,提高开发效率,并确保项目的长期可维护性。
|
||||
- Target modern browsers
|
||||
- Use progressive enhancement for advanced features
|
||||
- Prefer feature detection over browser detection
|
||||
|
||||
@@ -37,12 +37,3 @@ updates:
|
||||
- Lruihao
|
||||
labels:
|
||||
- dependencies
|
||||
- package-ecosystem: gitsubmodule
|
||||
directory: /
|
||||
schedule:
|
||||
interval: weekly
|
||||
open-pull-requests-limit: 1000
|
||||
assignees:
|
||||
- Lruihao
|
||||
labels:
|
||||
- dependencies
|
||||
|
||||
@@ -36,14 +36,14 @@ jobs:
|
||||
|
||||
steps:
|
||||
- name: Check out repository code
|
||||
uses: actions/checkout@v6
|
||||
uses: actions/checkout@v7
|
||||
with:
|
||||
submodules: true # Fetch Hugo themes (true OR recursive)
|
||||
fetch-depth: 0 # Fetch all history for .GitInfo and .Lastmod
|
||||
|
||||
# Initializes the CodeQL tools for scanning.
|
||||
- name: Initialize CodeQL
|
||||
uses: github/codeql-action/init@v4
|
||||
uses: github/codeql-action/init@v4.37.3
|
||||
with:
|
||||
languages: ${{ matrix.language }}
|
||||
config-file: ./.github/configs/codeql.yml
|
||||
@@ -55,7 +55,7 @@ jobs:
|
||||
# Autobuild attempts to build any compiled languages (C/C++, C#, or Java).
|
||||
# If this step fails, then you should remove it and run the build manually (see below)
|
||||
- name: Autobuild
|
||||
uses: github/codeql-action/autobuild@v4
|
||||
uses: github/codeql-action/autobuild@v4.37.3
|
||||
|
||||
# ℹ️ Command-line programs to run using the OS shell.
|
||||
# 📚 https://git.io/JvXDl
|
||||
@@ -69,4 +69,4 @@ jobs:
|
||||
# make release
|
||||
|
||||
- name: Perform CodeQL Analysis
|
||||
uses: github/codeql-action/analyze@v4
|
||||
uses: github/codeql-action/analyze@v4.37.3
|
||||
|
||||
@@ -14,7 +14,7 @@ jobs:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- name: Checkout
|
||||
uses: actions/checkout@v6
|
||||
uses: actions/checkout@v7
|
||||
- name: Generate hugo-fixit component list
|
||||
uses: hugo-fixit/action-component-list@v1
|
||||
env:
|
||||
@@ -23,11 +23,6 @@ jobs:
|
||||
comment_tag_name: HUGO_FIXIT_COMPONENTS
|
||||
readme_path: 'README.md,README.zh-cn.md'
|
||||
template: "- [{$repo.name}]({$repo.html_url})\\\n {$repo.description}"
|
||||
# - name: Commit changes
|
||||
# uses: stefanzweifel/git-auto-commit-action@v5
|
||||
# with:
|
||||
# commit_message: 'docs(readme): update hugo-fixit component list'
|
||||
# commit_author: 'github-actions[bot] <github-actions[bot]@users.noreply.github.com>'
|
||||
- name: Create Pull Request
|
||||
uses: peter-evans/create-pull-request@v8
|
||||
with:
|
||||
|
||||
@@ -0,0 +1,39 @@
|
||||
name: Update Chroma lexer map
|
||||
on:
|
||||
schedule:
|
||||
# Run at 00:00, on day 1 of the month
|
||||
- cron: '0 0 1 * *'
|
||||
workflow_dispatch:
|
||||
permissions:
|
||||
contents: write
|
||||
pull-requests: write
|
||||
jobs:
|
||||
update:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- name: Checkout
|
||||
uses: actions/checkout@v7
|
||||
- uses: pnpm/action-setup@v6
|
||||
- name: Setup Node.js
|
||||
uses: actions/setup-node@v7
|
||||
with:
|
||||
node-version-file: .nvmrc
|
||||
cache: pnpm
|
||||
- name: Install dependencies
|
||||
run: pnpm install --frozen-lockfile
|
||||
- name: Generate lexer map
|
||||
run: pnpm gen:lexers
|
||||
env:
|
||||
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
|
||||
- name: Create Pull Request
|
||||
uses: peter-evans/create-pull-request@v8
|
||||
with:
|
||||
title: 'chore(assets): regenerate chroma lexer map'
|
||||
commit-message: 'chore(assets): regenerate chroma lexer map'
|
||||
body: |
|
||||
Auto-generated `assets/scss/core/maps/_chroma-lexers.scss` via `pnpm gen:lexers`.
|
||||
Data from: [alecthomas/chroma](https://github.com/alecthomas/chroma/tree/master/lexers) latest release.
|
||||
branch: auto/chroma-lexers
|
||||
base: main
|
||||
labels: dependencies
|
||||
reviewers: Lruihao
|
||||
@@ -0,0 +1,50 @@
|
||||
name: Update libraries from npm
|
||||
on:
|
||||
schedule:
|
||||
# Run at 00:00, on day 1 of the month
|
||||
- cron: '0 0 1 * *'
|
||||
workflow_dispatch:
|
||||
permissions:
|
||||
contents: write
|
||||
pull-requests: write
|
||||
jobs:
|
||||
prepare:
|
||||
runs-on: ubuntu-latest
|
||||
outputs:
|
||||
libraries: ${{ steps.list.outputs.libraries_json }}
|
||||
steps:
|
||||
- name: Checkout
|
||||
uses: actions/checkout@v7
|
||||
- name: List libraries
|
||||
id: list
|
||||
uses: hugo-fixit/librarybot@v1
|
||||
with:
|
||||
mode: list
|
||||
update:
|
||||
needs: prepare
|
||||
runs-on: ubuntu-latest
|
||||
strategy:
|
||||
fail-fast: false
|
||||
matrix:
|
||||
library: ${{ fromJson(needs.prepare.outputs.libraries) }}
|
||||
steps:
|
||||
- name: Checkout
|
||||
uses: actions/checkout@v7
|
||||
- name: Update library
|
||||
id: update
|
||||
uses: hugo-fixit/librarybot@v1
|
||||
with:
|
||||
mode: update
|
||||
library: ${{ matrix.library }}
|
||||
- name: Create Pull Request
|
||||
if: steps.update.outputs.changed == 'true'
|
||||
uses: peter-evans/create-pull-request@v8
|
||||
with:
|
||||
title: 'chore(deps): bump ${{ steps.update.outputs.package }} from `${{ steps.update.outputs.from_version }}` to `${{ steps.update.outputs.to_version }}`'
|
||||
commit-message: 'chore(deps): bump ${{ steps.update.outputs.package }} from `${{ steps.update.outputs.from_version }}` to `${{ steps.update.outputs.to_version }}`'
|
||||
body: |
|
||||
Automated update of `${{ steps.update.outputs.package }}` from `${{ steps.update.outputs.from_version }}` to `${{ steps.update.outputs.to_version }}`.
|
||||
branch: ${{ steps.update.outputs.pr_branch }}
|
||||
base: main
|
||||
labels: dependencies
|
||||
reviewers: Lruihao
|
||||
@@ -0,0 +1,43 @@
|
||||
name: Publish @hugo-fixit/encrypt
|
||||
|
||||
on:
|
||||
push:
|
||||
tags:
|
||||
- 'encrypt-v*.*.*'
|
||||
workflow_dispatch:
|
||||
|
||||
permissions:
|
||||
contents: read
|
||||
id-token: write
|
||||
|
||||
concurrency:
|
||||
group: publish-encrypt-${{ github.ref }}
|
||||
cancel-in-progress: false
|
||||
|
||||
jobs:
|
||||
publish:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- name: Checkout repository
|
||||
uses: actions/checkout@v7
|
||||
|
||||
- uses: pnpm/action-setup@v6
|
||||
- name: Setup Node.js
|
||||
uses: actions/setup-node@v7
|
||||
with:
|
||||
node-version-file: .nvmrc
|
||||
registry-url: 'https://registry.npmjs.org'
|
||||
cache: pnpm
|
||||
scope: '@hugo-fixit'
|
||||
|
||||
- name: Update npm
|
||||
run: npm install -g npm@latest
|
||||
- name: Install dependencies
|
||||
run: pnpm install --frozen-lockfile
|
||||
|
||||
- name: Build package
|
||||
run: pnpm -F encrypt build
|
||||
|
||||
- name: Publish package to npm
|
||||
working-directory: packages/encrypt
|
||||
run: npm publish --access public --provenance
|
||||
@@ -11,13 +11,13 @@ jobs:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- name: Checkout repository
|
||||
uses: actions/checkout@v6
|
||||
uses: actions/checkout@v7
|
||||
with:
|
||||
fetch-depth: 0 # Fetch all history for generating release notes
|
||||
|
||||
- uses: pnpm/action-setup@v4
|
||||
- uses: pnpm/action-setup@v6
|
||||
- name: Setup Node.js
|
||||
uses: actions/setup-node@v6
|
||||
uses: actions/setup-node@v7
|
||||
with:
|
||||
node-version-file: .nvmrc
|
||||
cache: pnpm
|
||||
@@ -40,7 +40,7 @@ jobs:
|
||||
sed -i '1,4d' CHANGELOG.md
|
||||
|
||||
- name: GitHub Release
|
||||
uses: softprops/action-gh-release@v2
|
||||
uses: softprops/action-gh-release@v3
|
||||
with:
|
||||
draft: true
|
||||
body_path: CHANGELOG.md
|
||||
|
||||
@@ -1,10 +1,12 @@
|
||||
# Hugo default output directory
|
||||
public/
|
||||
resources/
|
||||
|
||||
# Hugo
|
||||
.hugo_build.lock
|
||||
jsconfig.json
|
||||
.hugo_cache
|
||||
public/
|
||||
resources/
|
||||
|
||||
# packages
|
||||
dist/
|
||||
|
||||
# NPM
|
||||
node_modules/
|
||||
@@ -15,6 +17,25 @@ node_modules/
|
||||
!.vscode/extensions.json
|
||||
!.vscode/settings.json
|
||||
|
||||
# Trae
|
||||
.trae/
|
||||
|
||||
# Claude
|
||||
.claude/
|
||||
CLAUDE.local.md
|
||||
.codegraph/
|
||||
|
||||
# Vercel
|
||||
.vercel/
|
||||
|
||||
# Environment Variables
|
||||
.env*.local
|
||||
|
||||
# Documentation
|
||||
docs/
|
||||
CHANGELOG.md
|
||||
TODO.md
|
||||
|
||||
# OS Files
|
||||
## Windows
|
||||
Thumbs.db
|
||||
@@ -27,6 +48,3 @@ $RECYCLE.BIN/
|
||||
|
||||
## Linux
|
||||
.directory
|
||||
|
||||
CHANGELOG.md
|
||||
.stash/
|
||||
|
||||
@@ -1,3 +1,2 @@
|
||||
tag-version-prefix="v"
|
||||
ignore-workspace-root-check=true
|
||||
message="chore(release): %s"
|
||||
tag-version-prefix=v
|
||||
message=chore(release): %s
|
||||
|
||||
@@ -0,0 +1,7 @@
|
||||
{
|
||||
"display": {
|
||||
"access": ["public"],
|
||||
"alias": false
|
||||
},
|
||||
"sort": ["group"]
|
||||
}
|
||||
@@ -3,6 +3,11 @@
|
||||
"budparr.language-hugo-vscode",
|
||||
"kaellarkin.hugo-shortcode-syntax",
|
||||
"lruihao.hugo-partials-refs",
|
||||
"tamasfe.even-better-toml"
|
||||
"tamasfe.even-better-toml",
|
||||
"casualjim.gotemplate",
|
||||
"SomewhatStationery.some-sass",
|
||||
"gruntfuggly.todo-tree",
|
||||
"antfu.unocss",
|
||||
"antfu.iconify"
|
||||
]
|
||||
}
|
||||
|
||||
@@ -1,11 +1,16 @@
|
||||
{
|
||||
"todo-tree.tree.scanMode": "workspace only",
|
||||
"explorer.fileNesting.enabled": true,
|
||||
"explorer.fileNesting.patterns": {
|
||||
"tsconfig.json": "tsconfig.*.json, env.d.ts",
|
||||
"package.json": "package-lock.json, pnpm*, .yarnrc*, yarn*, .eslint*, eslint*, .oxlint*, oxlint*, .prettier*, prettier*, .editorconfig"
|
||||
"files.associations": {
|
||||
"*.template.ts": "gots",
|
||||
"*.template.js": "gojs",
|
||||
"*.template.scss": "gocss",
|
||||
"*.template.svg": "html",
|
||||
"**/plugin/script.html": "gohtml",
|
||||
"**/layouts/**/*.json": "gojson",
|
||||
"**/layouts/**/*.xml": "gohtml",
|
||||
"**/layouts/**/*.md": "gotemplate"
|
||||
},
|
||||
// Disable the default formatter, use eslint instead
|
||||
// Disable the default formatter, use ESLint instead
|
||||
"prettier.enable": false,
|
||||
"editor.formatOnSave": false,
|
||||
// Auto fix
|
||||
@@ -66,6 +71,9 @@
|
||||
"fixable": true
|
||||
}
|
||||
],
|
||||
// SCSS path resolution (Some Sass extension)
|
||||
"somesass.workspace.loadPaths": ["assets/scss"],
|
||||
"somesass.scss.links.enabled": true,
|
||||
// Enable eslint for all supported languages
|
||||
"eslint.validate": [
|
||||
"go-html-template",
|
||||
|
||||
@@ -0,0 +1,160 @@
|
||||
# CLAUDE.md
|
||||
|
||||
This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
|
||||
|
||||
## Project Overview
|
||||
|
||||
FixIt is a modern, responsive theme for the Hugo static site generator. Built with Hugo templates, SCSS, UnoCSS, and TypeScript.
|
||||
|
||||
## Development Commands
|
||||
|
||||
### Prerequisites
|
||||
|
||||
- Node.js >= 20
|
||||
- Hugo Extended >= 0.161.0 (Dart Sass required)
|
||||
- pnpm
|
||||
|
||||
### Development
|
||||
|
||||
```bash
|
||||
pnpm install # Install dependencies
|
||||
pnpm dev:demo # Start demo site dev server
|
||||
pnpm dev:test # Start test site dev server
|
||||
pnpm dev:docs # Start docs dev server (requires fixit-docs as sibling directory)
|
||||
```
|
||||
|
||||
### Build
|
||||
|
||||
```bash
|
||||
pnpm build:demo # Build demo site
|
||||
pnpm build:test # Build test site
|
||||
pnpm build # Build all sites (demo + test, merged into public/)
|
||||
pnpm preview # Preview built site (requires build first)
|
||||
```
|
||||
|
||||
### Code Generation
|
||||
|
||||
```bash
|
||||
pnpm gen:lexers # Regenerate assets/scss/core/maps/_chroma-lexers.scss from Chroma source
|
||||
```
|
||||
|
||||
### Code Quality
|
||||
|
||||
```bash
|
||||
pnpm lint # Run ESLint
|
||||
pnpm typecheck # Run TypeScript type checking
|
||||
```
|
||||
|
||||
There are no unit tests. Verify changes by building `pnpm build:demo` or `pnpm build:test` and inspecting the output.
|
||||
|
||||
## Architecture
|
||||
|
||||
### Monorepo Structure
|
||||
|
||||
Root `package.json` is `@hugo-fixit/core`. pnpm workspaces include `apps/*` and `packages/*`:
|
||||
|
||||
- `apps/demo/` — Demo site (deployed to `demo.fixit.lruihao.cn`)
|
||||
- `apps/test/` — Test site for exercising theme features
|
||||
- `packages/shared` — Shared utilities (exports `workspaceRoot`, `fromRoot`, `runCommand`, `capitalize`, `consola`)
|
||||
- `packages/versioning` — Version management (auto-updates version in `layouts/_partials/init/index.html` during pre-commit)
|
||||
- `packages/integration` — Post-build: merges demo/test output into `public/`
|
||||
- `packages/chroma-lexers` — Generates Chroma lexer SCSS map from GitHub
|
||||
|
||||
### JavaScript Module System (`assets/js/`)
|
||||
|
||||
Service-class architecture with direct constructor calls:
|
||||
|
||||
- **`main.ts`** — Entry point. Instantiates all modules with direct constructor calls, builds the typed `window.fixit` public API facade, and runs the init sequence on `DOMContentLoaded`.
|
||||
- **`types/`** — TypeScript type definitions:
|
||||
- `config.ts` — `FixItConfig` and all config sub-types.
|
||||
- `ui.ts` — `FixItPublicAPI`, global `window` augmentation for third-party libs.
|
||||
- `third-party.ts` — Types for vendored libraries.
|
||||
- **`core/`** — Infrastructure layer:
|
||||
- `event-bus.ts` — Typed event bus singleton wrapping DOM `CustomEvents`. Exports `eventBus` (module-level singleton) and `FixItEventMap` type.
|
||||
- `tokens.ts` — Service interfaces (`CoreService`, `ThemeService`, `CodeService`, etc.) used for module constructor typing.
|
||||
- **`modules/`** — Feature modules. Each is a class implementing its service interface. Dependencies are constructor-injected. Private state uses ES6 `#` fields. Modules: charts, code, content, core, encryption, events, menu, misc, search, theme, toc. `pagefind.ts` is a standalone factory consumed by `SearchModule`.
|
||||
- **`utils/`** — Pure utility functions (no side effects, no DOM state). Re-exported from `utils/index.ts`.
|
||||
- **`lib/`** — Third-party library wrappers (aplayer, echarts, file-tree, fixit-decryptor, lightgallery, mapbox, mathjax, mermaid, etc.). All import the shared `eventBus` singleton.
|
||||
- **`head/`** — `color-scheme.ts` runs synchronously in `<head>` before body render to prevent flash of wrong theme.
|
||||
- **`pages/`** — Page-specific scripts (e.g. `link.ts` for the link guard redirection page).
|
||||
|
||||
Cross-module communication uses the shared `eventBus` singleton, not direct module imports. The `window.fixit` facade exposes a typed public API for user custom scripts (`custom.ts`): theme control, scroll state, mask overlay management, content re-initialization, and the event bus.
|
||||
|
||||
### Hugo Templates (`layouts/`)
|
||||
|
||||
- **`_partials/`** — Reusable template components (organized into `init/`, `base/`, `function/`, `plugin/`, `single/`, `store/`)
|
||||
- **`_shortcodes/`** — 31 custom shortcodes (admonition, aplayer, echarts, file-tree, mermaid, tabs, timeline, etc.)
|
||||
- **`_markup/`** — 15 render hooks (code blocks, headings, images, links, tables, blockquote alerts, passthrough for math)
|
||||
|
||||
### Asset Pipeline
|
||||
|
||||
Hugo Pipes processes all assets. The key orchestration is in `_partials/base/assets.html`:
|
||||
|
||||
- **CSS**: `scss/main.scss` is the entry point importing `core/`, `pages/`, `widgets/`, `custom`. SCSS variables are configured via `hugo:vars` (user-configurable from `[params.appearance]`) and `hugo:vars/internal` (theme system config). UnoCSS utility classes are pre-built to `assets/css/unocss.css` (via `pnpm unocss`), loaded before the main SCSS bundle.
|
||||
- **JS**: `_partials/function/js-build.html` wraps `js.Build` with minify-in-production defaults. Hugo's `@params` injection passes config values into TypeScript at build time.
|
||||
- **Third-party libraries**: Stored in `assets/lib/` (vendored, not npm-managed). Tracked by `librarybot.yml` and updated weekly by the `hugo-fixit/librarybot` GitHub Action. Can be overridden via CDN config in `assets/data/cdn/jsdelivr.yml` or `unpkg.yml`.
|
||||
|
||||
### Theme Configuration
|
||||
|
||||
- **`hugo.toml`** — Default theme configuration (1700+ lines). Uses `_merge = "shallow"` to let user configs override without deep merging.
|
||||
- **`theme.toml`** — Theme metadata
|
||||
|
||||
## Coding Standards
|
||||
|
||||
### SCSS (`assets/scss/`)
|
||||
|
||||
- CSS classes: BEM or semantic naming (`header-desktop`, `menu-item`)
|
||||
- SCSS variables: hyphen-separated, semantic (`$global-font-family`)
|
||||
- CSS custom properties: prefixed with `fi-` / `--fi-`
|
||||
- Use `fi-var()` function to reference CSS custom properties (auto-adds `--fi-` prefix), never use `var(--fi-...)` directly
|
||||
- Use CSS variables for theme switching; SCSS variables for colors (no hardcoded values)
|
||||
- Prefer relative units (rem, em, %) over absolute units
|
||||
- Keep selector nesting shallow
|
||||
|
||||
### UnoCSS (`assets/css/unocss.css`)
|
||||
|
||||
- Pre-built utility classes generated by `pnpm unocss` (config: `uno.config.ts`)
|
||||
- Use atomic classes for common utilities (`hidden`, `me-1`, `text-center`, etc.)
|
||||
- Theme colors mapped via `@theme`: `bg-primary`, `text-success`, `text-danger`, etc.
|
||||
- Responsive breakpoints: `sm:` (>=680px), `md:` (>=960px), `lg:` (>=1200px), `xl:` (>=1440px). Use `max-sm:` for xs (<680px)
|
||||
- Wrap SVG elements with `<!-- @unocss-skip-start -->` / `<!-- @unocss-skip-end -->` to avoid false positives from `d` attribute values
|
||||
- `safelist` in `uno.config.ts` for dynamically generated classes (e.g., `order-*`, `sm:hidden`)
|
||||
|
||||
### TypeScript
|
||||
|
||||
- Use ES6 `#` private fields — not TypeScript `private` with `_` prefix
|
||||
- One module per file, one service interface per module
|
||||
- Constructor injection for dependencies — no global state access
|
||||
- Import the shared `eventBus` singleton from `core/event-bus` — do not create new instances
|
||||
- Pure functions only in `utils/` — no side effects, no DOM state
|
||||
- Comment style: follow [TSDoc](https://tsdoc.org/) conventions
|
||||
|
||||
### Hugo Templates
|
||||
|
||||
- Variable naming: camelCase (`$footerConfig`, `$fingerprint`)
|
||||
- Translation: use `T` function (`{{ T "header.switchTheme" }}`)
|
||||
- Whitespace: use `{{- -}}` trim markers
|
||||
- Use `partialCached` for expensive partials that don't change per page
|
||||
- Use `.Site.Store` for shared computed values (e.g. fingerprint)
|
||||
- Check `hugo.IsProduction` before adding analytics or minification
|
||||
- Minimize `id` attribute usage — prefer class selectors for styling and JS queries. Reserve `id` for: `<label for>`, `aria-controls`/`aria-labelledby`, fragment anchors, or third-party library requirements
|
||||
|
||||
## Commit Convention
|
||||
|
||||
Follows [Conventional Commits](https://www.conventionalcommits.org/):
|
||||
|
||||
```
|
||||
<type>(<scope>): <subject>
|
||||
```
|
||||
|
||||
Types: `feat`, `fix`, `refactor`, `chore`, `docs`, `perf`, `style`, `test`, `ci`, `build`
|
||||
|
||||
Scopes: `workflow`, `archetypes`, `assets`, `i18n`, `layouts`, `config`, or specific directories.
|
||||
|
||||
## Pre-commit Hooks
|
||||
|
||||
Pre-commit runs: versioning (dev mode), typecheck, lint-staged (eslint --fix on staged files).
|
||||
|
||||
## ESLint
|
||||
|
||||
Uses `@antfu/eslint-config` with TypeScript support. Config at `eslint.config.ts`.
|
||||
@@ -6,19 +6,27 @@ Make sure that you follow [CODE_OF_CONDUCT.md](CODE_OF_CONDUCT.md) while contrib
|
||||
|
||||
Before you start contributing, make sure you have the following tools installed:
|
||||
|
||||
- **Node.js** (>= 20.0.0) - Required for package management and build tools
|
||||
- **Hugo Extended** (>= 0.156.0) - The static site generator
|
||||
- **pnpm** - Package manager (recommended)
|
||||
- **Hugo Extended** (>= 0.161.0) - The static site generator
|
||||
- **Dart Sass** - Required for SCSS compilation
|
||||
- **Node.js** (>= 22) - Required for package management and build tools
|
||||
- **pnpm** - Package manager
|
||||
|
||||
You can check your installed versions:
|
||||
|
||||
```bash
|
||||
node --version
|
||||
hugo version
|
||||
sass --version
|
||||
node --version
|
||||
pnpm --version
|
||||
```
|
||||
|
||||
## How to contribute to this project
|
||||
Check the Hugo environment information:
|
||||
|
||||
```bash
|
||||
hugo env
|
||||
```
|
||||
|
||||
## How to Contribute
|
||||
|
||||
First, fork this repository by clicking the fork button.
|
||||
|
||||
@@ -36,9 +44,16 @@ pnpm install
|
||||
|
||||
And now you are ready to go!
|
||||
|
||||
Here are some useful commands for development:
|
||||
### Workflow
|
||||
|
||||
### Development
|
||||
1. **Make your changes** in the appropriate directories
|
||||
2. **Test locally** using `pnpm dev:demo` or `pnpm dev:test`
|
||||
3. **Check code quality** with `pnpm lint` and `pnpm typecheck`
|
||||
4. **Check different environments** with production builds (`pnpm build:demo` or `pnpm build:test`)
|
||||
5. **Verify documentation** changes with `pnpm dev:docs` (if applicable)
|
||||
6. **Commit your changes** following the commit message format below
|
||||
|
||||
### Commands
|
||||
|
||||
```bash
|
||||
# Start demo site development server
|
||||
@@ -47,31 +62,49 @@ pnpm dev:demo
|
||||
pnpm dev:test
|
||||
# Start documentation development server (requires fixit-docs as sibling directory)
|
||||
pnpm dev:docs
|
||||
```
|
||||
|
||||
> [!TIP]
|
||||
>
|
||||
> - Add `-e production` to the development command to check the production environment, e.g. `pnpm dev:test -e production`.
|
||||
> - For documentation-related theme changes, it is recommended to clone both `FixIt` and `fixit-docs` as sibling directories.
|
||||
|
||||
### Building
|
||||
|
||||
```bash
|
||||
# Build demo site
|
||||
pnpm build:demo
|
||||
# Build test site
|
||||
pnpm build:test
|
||||
# Build all sites
|
||||
pnpm build
|
||||
```
|
||||
|
||||
### Preview
|
||||
# Lint with ESLint
|
||||
pnpm lint
|
||||
# TypeScript type checking
|
||||
pnpm typecheck
|
||||
|
||||
# Regenerate Chroma lexer map (assets/scss/core/maps/_chroma-lexers.scss)
|
||||
pnpm gen:lexers
|
||||
|
||||
```bash
|
||||
# Preview the built site locally (requires build first)
|
||||
pnpm preview
|
||||
|
||||
# Build UnoCSS utility classes (pre-built, committed to repo)
|
||||
pnpm unocss
|
||||
# Watch mode for UnoCSS (for theme developers)
|
||||
pnpm unocss:watch
|
||||
```
|
||||
|
||||
> [!TIP]
|
||||
>
|
||||
> - Add `-e production` to the development command to check the production environment, e.g. `pnpm dev:test -e production`.
|
||||
> - Add `-e debug` to enable debug mode (if applicable), e.g. `pnpm dev:test -e debug`.
|
||||
> - For documentation-related theme changes, it is recommended to clone both `FixIt` and `fixit-docs` as sibling directories.
|
||||
|
||||
### Pull Request
|
||||
|
||||
- Create a feature branch from `main`
|
||||
- Make your changes with clear, focused commits
|
||||
- Test your changes thoroughly
|
||||
- Update documentation if needed
|
||||
- Submit a pull request with a clear description
|
||||
|
||||
Finally, create a new pull request at <https://github.com/hugo-fixit/FixIt/pulls> to submit your contribution.
|
||||
|
||||
---
|
||||
|
||||
## Project Structure
|
||||
|
||||
Understanding the project structure will help you contribute more effectively:
|
||||
@@ -83,39 +116,27 @@ FixIt/
|
||||
│ └── test/ # Test site
|
||||
├── archetypes/ # Content templates
|
||||
├── assets/ # Theme assets
|
||||
│ ├── css/ # SCSS stylesheets
|
||||
│ ├── js/ # JavaScript files
|
||||
│ ├── css/ # UnoCSS pre-built output (unocss.css)
|
||||
│ ├── images/ # Image assets
|
||||
│ └── lib/ # Third-party libraries
|
||||
│ ├── js/ # JavaScript files
|
||||
│ ├── lib/ # Third-party libraries
|
||||
│ └── scss/ # SCSS stylesheets
|
||||
├── i18n/ # Internationalization files
|
||||
├── layouts/ # Hugo template files
|
||||
│ ├── _markup/ # Hugo render hooks
|
||||
│ ├── _partials/ # Reusable template components
|
||||
│ └── _shortcodes/ # Custom shortcodes
|
||||
├── packages/ # Theme-related packages
|
||||
├── packages/ # Theme-related packages (pnpm workspaces)
|
||||
│ ├── chroma-lexers/ # Chroma lexer SCSS map generator
|
||||
│ ├── integration/ # Post-build site merging
|
||||
│ ├── shared/ # Shared utilities
|
||||
│ └── versioning/ # Version management (pre-commit)
|
||||
├── static/ # Static files
|
||||
├── hugo.toml # Default theme configuration
|
||||
├── uno.config.ts # UnoCSS configuration
|
||||
└── package.json # npm scripts and dependencies
|
||||
```
|
||||
|
||||
## Development Workflow
|
||||
|
||||
1. **Make your changes** in the appropriate directories
|
||||
2. **Test locally** using `pnpm dev` or `pnpm test`
|
||||
3. **Check different environments** with production builds
|
||||
4. **Verify documentation** changes with `pnpm dev:docs` (if applicable)
|
||||
5. **Commit your changes** following the commit message format below
|
||||
|
||||
## Pull Request Guidelines
|
||||
|
||||
- Create a feature branch from `main`
|
||||
- Make your changes with clear, focused commits
|
||||
- Test your changes thoroughly
|
||||
- Update documentation if needed
|
||||
- Submit a pull request with a clear description
|
||||
|
||||
Finally, create a new pull request at <https://github.com/hugo-fixit/FixIt/pulls> to submit your contribution 🎉
|
||||
|
||||
## Git Commit Guidelines
|
||||
|
||||
We follow the [Conventional Commits](https://www.conventionalcommits.org/) specification for commit messages. This enables automatic changelog generation using our custom template: [conventional.hbs](https://github.com/Lruihao/auto-changelog-plus/blob/main/settings/conventional.hbs).
|
||||
@@ -134,6 +155,13 @@ We follow the [Conventional Commits](https://www.conventionalcommits.org/) speci
|
||||
|___________________ Type: Indicates the kind of change.
|
||||
```
|
||||
|
||||
> [!NOTE]
|
||||
>
|
||||
> - Keep the subject line concise and ideally within 72 characters.
|
||||
> - If the change is more than a sentence, add a body.
|
||||
> - Do not include secrets (tokens/keys) or personal data in commit messages.
|
||||
> - Do not invent issue/PR numbers or facts that are not present in the diff.
|
||||
|
||||
### Allowed Types
|
||||
|
||||
- `feat`: A new feature.
|
||||
|
||||
@@ -13,9 +13,9 @@
|
||||
<a href="https://fixit.lruihao.cn/ecosystem/hugo-fixit/fixit/?lang=russian">Русский язык</a> |
|
||||
<a href="https://fixit.lruihao.cn/ecosystem/hugo-fixit/fixit/?lang=spanish">Español</a> |
|
||||
<a href="https://fixit.lruihao.cn/ecosystem/hugo-fixit/fixit/?lang=hindi">हिन्दी</a> |
|
||||
<a href="https://fixit.lruihao.cn/ecosystem/hugo-fixit/fixit/?lang=deutsch">deutsch</a> |
|
||||
<a href="https://fixit.lruihao.cn/ecosystem/hugo-fixit/fixit/?lang=deutsch">Deutsch</a> |
|
||||
<a href="https://fixit.lruihao.cn/ecosystem/hugo-fixit/fixit/?lang=korean">한국어</a> |
|
||||
<a href="https://fixit.lruihao.cn/ecosystem/hugo-fixit/fixit/?lang=japanese">しろうと</a>
|
||||
<a href="https://fixit.lruihao.cn/ecosystem/hugo-fixit/fixit/?lang=japanese">日本語</a>
|
||||
</div>
|
||||
|
||||
<a title="FixIt website" href="https://fixit.lruihao.cn"><img align="right" alt="FixIt logo" width="70" height="70" src="https://avatars.githubusercontent.com/u/110414864?s=200&v=4"></a>
|
||||
@@ -26,11 +26,15 @@
|
||||
|
||||
[](https://demo.fixit.lruihao.cn/)
|
||||
[](https://github.com/hugo-fixit/FixIt/releases)
|
||||
[](https://gohugo.io/)
|
||||
[](https://gohugo.io/)
|
||||
[](/LICENSE)
|
||||
[](https://github.com/hugo-fixit/FixIt)
|
||||
[](https://gitee.com/lruihao/FixIt/stargazers)
|
||||
|
||||
> [!WARNING]
|
||||
> **The `main` branch contains the v1 code. For upgrade instructions, see the [v1 migration guide](https://fixit.lruihao.cn/guides/upgrade-to-v1/).**\
|
||||
> Version 1.0.0 is planned for release in **the first half of 2027**. Welcome to join the development and [discussion](https://github.com/orgs/hugo-fixit/discussions/723)!
|
||||
|
||||
## Live Preview
|
||||
|
||||
<p align="center">
|
||||
@@ -44,9 +48,9 @@
|
||||
|
||||
### Documentation
|
||||
|
||||
Head to the [Quick Start](https://fixit.lruihao.cn/documentation/getting-started/quick-start/) page for a step-by-step guide on how to create a new website with FixIt.
|
||||
Head to the [Quick Start](https://fixit.lruihao.cn/docs/getting-started/quick-start/) page for a step-by-step guide on how to create a new website with FixIt.
|
||||
|
||||
Outline: [Installation](https://fixit.lruihao.cn/documentation/installation/) ➜ [Getting Started](https://fixit.lruihao.cn/documentation/getting-started/) ➜ [Content Management](https://fixit.lruihao.cn/documentation/content-management/) ➜ [Advanced Usage](https://fixit.lruihao.cn/documentation/advanced/)
|
||||
Outline: [Installation](https://fixit.lruihao.cn/docs/installation/) ➜ [Getting Started](https://fixit.lruihao.cn/docs/getting-started/) ➜ [Content Management](https://fixit.lruihao.cn/docs/content-management/) ➜ [Advanced Usage](https://fixit.lruihao.cn/docs/advanced/)
|
||||
|
||||
### Starter Wizard
|
||||
|
||||
@@ -101,10 +105,11 @@ Click the following links to generate a new repository with template:
|
||||
|
||||
- **Responsive** layout
|
||||
- **Light/Dark** mode
|
||||
- **RTL (Right-to-Left)** layout supported
|
||||
- Globally consistent **design language**
|
||||
- **Pagination** supported
|
||||
- Easy-to-use and self-expanding **table of contents**
|
||||
- **Multilanguage** supported and i18n ready
|
||||
- **Multilanguage** supported and I18n ready
|
||||
- Beautiful **CSS animation**
|
||||
|
||||
### Social and Comment Systems
|
||||
@@ -132,7 +137,7 @@ Click the following links to generate a new repository with template:
|
||||
- **Sub Menu** supported
|
||||
- **Content Encryption** supported (Pages, Partial)
|
||||
- **Friends** page embedded template
|
||||
- **Search** supported by [algolia](https://www.algolia.com/), [Fuse.js](https://fusejs.io/), CSE or [PostChat](https://ai.zhheo.com/console/login?InviteID=85041330)
|
||||
- **Search** supported by [algolia](https://www.algolia.com/), [Fuse.js](https://fusejs.io/), [Pagefind](https://pagefind.app), CSE or [PostChat](https://ai.zhheo.com/console/login?InviteID=85041330)
|
||||
- **Custom Search Engine (CSE)** supported by [Google](https://programmablesearchengine.google.com/)
|
||||
- **Twemoji** supported
|
||||
- Automatically **highlighting** code
|
||||
@@ -163,9 +168,9 @@ Click the following links to generate a new repository with template:
|
||||
|
||||
</details>
|
||||
|
||||
## Multilingual and i18n
|
||||
## Multilingual and I18n
|
||||
|
||||
FixIt supports multilingual and i18n. For more information, see the [Content Management](https://fixit.lruihao.cn/documentation/content-management/introduction#multilingual) documentation. You are welcome to [contribute with a new language](https://github.com/hugo-fixit/FixIt/pulls).
|
||||
FixIt supports multilingual and i18n. For more information, see the [Content Management](https://fixit.lruihao.cn/docs/content-management/introduction#multilingual) documentation. You are welcome to [contribute with a new language](https://github.com/hugo-fixit/FixIt/pulls).
|
||||
|
||||
<details>
|
||||
<summary>FixIt supports the following languages.</summary>
|
||||
@@ -186,12 +191,24 @@ FixIt supports multilingual and i18n. For more information, see the [Content Man
|
||||
- Hindi
|
||||
- Japanese
|
||||
- Korean
|
||||
- Arabic
|
||||
- Persian
|
||||
- Urdu
|
||||
|
||||
</details>
|
||||
|
||||
## Browsers Support
|
||||
|
||||
The FixIt theme supports the last two versions of all major browsers.
|
||||
|
||||

|
||||

|
||||

|
||||

|
||||
|
||||
## Theme Components
|
||||
|
||||
The FixIt theme balances **simplicity** and **extensibility** with extra [Hugo theme components](https://fixit.lruihao.cn/ecosystem/#-components) for customization.
|
||||
To balance **simplicity** and **extensibility**, FixIt theme provides extra [Hugo theme components](https://fixit.lruihao.cn/ecosystem/#-components) for customization.
|
||||
|
||||
<details>
|
||||
<summary>Click to view.</summary>
|
||||
@@ -233,19 +250,23 @@ The FixIt theme balances **simplicity** and **extensibility** with extra [Hugo t
|
||||
|
||||
All feedback is welcome! Head over to the [discussions][discussions], [Pull requests][pulls] and [issues][issues] tracker.
|
||||
|
||||
| Official Community | Description |
|
||||
| :-------------------------- | :------------------------------ |
|
||||
| [Discussions][discussions] | GitHub discussion forum |
|
||||
| [FixIt WeChat group][wx-mp] | Follow and reply "FixIt" to get |
|
||||
| [FixIt QQ group][qq-group] | QQ group: `814031017` |
|
||||
| [Hugo FixIt Planet][zsxq] | Paid knowledge Planet |
|
||||
| Official Community | Description |
|
||||
| :--------------------------- | :------------------------------ |
|
||||
| [Discussions][discussions] | GitHub discussion forum |
|
||||
| [FixIt WeChat group][wx-mp] | Follow and reply "FixIt" to get |
|
||||
| [FixIt QQ group][qq-group] | QQ group: `814031017` |
|
||||
| [FixIt Dev group][dev-group] | QQ group: `770835493` |
|
||||
|
||||
[discussions]: https://github.com/hugo-fixit/FixIt/discussions
|
||||
[pulls]: https://github.com/hugo-fixit/FixIt/pulls
|
||||
[issues]: https://github.com/hugo-fixit/FixIt/issues
|
||||
[qq-group]: https://qm.qq.com/cgi-bin/qm/qr?k=awbwdTtSQ_-H5QGzeJxdWgv6JMbNehNM&jump_from=webapi
|
||||
[zsxq]: https://t.zsxq.com/GgKEW
|
||||
[wx-mp]: https://lruihao.cn/images/qr-wx-mp.webp
|
||||
[qq-group]: https://qm.qq.com/q/Mn1I7ljqsS
|
||||
[dev-group]: https://qm.qq.com/q/ky3uru0mbu
|
||||
|
||||
## China Mirror
|
||||
|
||||
A mirror is available on Gitee for users in mainland China: [gitee.com/lruihao/FixIt](https://gitee.com/lruihao/FixIt)
|
||||
|
||||
## Contributing
|
||||
|
||||
@@ -265,11 +286,12 @@ Thanks to the [Hugo DoIt](https://github.com/HEIGE-PCloud/DoIt) theme and [Hexo
|
||||
<details>
|
||||
<summary>Thanks to all the open source projects used in the FixIt theme.</summary>
|
||||
|
||||
- [UnoCSS](https://github.com/unocss/unocss)
|
||||
- [normalize.css](https://github.com/necolas/normalize.css)
|
||||
- [Font Awesome](https://fontawesome.com/)
|
||||
- [Font Awesome](https://github.com/FortAwesome/Font-Awesome)
|
||||
- [Simple Icons](https://github.com/simple-icons/simple-icons)
|
||||
- [Animate.css](https://daneden.github.io/animate.css/)
|
||||
- [autocomplete-js](https://github.com/algolia/autocomplete)
|
||||
- [Animate.css](https://github.com/animate-css/animate.css)
|
||||
- [autocomplete](https://github.com/algolia/autocomplete)
|
||||
- [algoliasearch](https://github.com/algolia/algoliasearch-client-javascript)
|
||||
- [Fuse.js](https://fusejs.io/)
|
||||
- [object-fit-images](https://github.com/fregante/object-fit-images)
|
||||
@@ -297,9 +319,7 @@ Thanks to the [Hugo DoIt](https://github.com/HEIGE-PCloud/DoIt) theme and [Hexo
|
||||
- [Twikoo](https://twikoo.js.org/)
|
||||
- [github-corners](https://github.com/tholman/github-corners)
|
||||
- [giscus](https://giscus.app/zh-CN)
|
||||
- [crypto-js](https://github.com/brix/crypto-js)
|
||||
- [pace](https://github.com/CodeByZach/pace)
|
||||
- [xxhash-wasm](https://github.com/jungomi/xxhash-wasm)
|
||||
- [`<tab-container>` element](https://github.com/github/tab-container-element)
|
||||
- [`<json-viewer>` element](https://github.com/Lruihao/json-viewer-element)
|
||||
|
||||
@@ -315,7 +335,7 @@ If you enjoy the theme, please consider buying me a cup of coffee ☕️. Thanks
|
||||
|
||||
- [WeChat Pay](/images/wechatpay.jpg)
|
||||
- [Alipay](/images/alipay.jpg)
|
||||
- [PayPal](https://paypal.me/Lruihao)
|
||||
<!-- - [PayPal](https://paypal.me/Lruihao) -->
|
||||
|
||||
Thanks to the following sponsors for their great support:
|
||||
|
||||
|
||||
@@ -13,9 +13,9 @@
|
||||
<a href="https://fixit.lruihao.cn/ecosystem/hugo-fixit/fixit/?lang=russian">Русский язык</a> |
|
||||
<a href="https://fixit.lruihao.cn/ecosystem/hugo-fixit/fixit/?lang=spanish">Español</a> |
|
||||
<a href="https://fixit.lruihao.cn/ecosystem/hugo-fixit/fixit/?lang=hindi">हिन्दी</a> |
|
||||
<a href="https://fixit.lruihao.cn/ecosystem/hugo-fixit/fixit/?lang=deutsch">deutsch</a> |
|
||||
<a href="https://fixit.lruihao.cn/ecosystem/hugo-fixit/fixit/?lang=deutsch">Deutsch</a> |
|
||||
<a href="https://fixit.lruihao.cn/ecosystem/hugo-fixit/fixit/?lang=korean">한국어</a> |
|
||||
<a href="https://fixit.lruihao.cn/ecosystem/hugo-fixit/fixit/?lang=japanese">しろうと</a>
|
||||
<a href="https://fixit.lruihao.cn/ecosystem/hugo-fixit/fixit/?lang=japanese">日本語</a>
|
||||
</div>
|
||||
|
||||
<a title="FixIt 官网" href="https://fixit.lruihao.cn/zh-cn/"><img align="right" alt="FixIt logo" width="70" height="70" src="https://avatars.githubusercontent.com/u/110414864?s=200&v=4"></a>
|
||||
@@ -26,11 +26,15 @@
|
||||
|
||||
[](https://demo.fixit.lruihao.cn/)
|
||||
[](https://github.com/hugo-fixit/FixIt/releases)
|
||||
[](https://gohugo.io/)
|
||||
[](https://gohugo.io/)
|
||||
[](/LICENSE)
|
||||
[](https://github.com/hugo-fixit/FixIt)
|
||||
[](https://gitee.com/lruihao/FixIt/stargazers)
|
||||
|
||||
> [!WARNING]
|
||||
> **当前 `main` 分支包含 v1 代码,升级详见 [v1 升级指南](https://fixit.lruihao.cn/guides/upgrade-to-v1/)**。\
|
||||
> 1.0 版本计划在 **2027 年上半年** 发布,欢迎加入开发和 [讨论](https://github.com/orgs/hugo-fixit/discussions/723)!
|
||||
|
||||
## 即时预览
|
||||
|
||||
<p align="center">
|
||||
@@ -44,9 +48,9 @@
|
||||
|
||||
### 主题文档
|
||||
|
||||
前往 [快速上手](https://fixit.lruihao.cn/zh-cn/documentation/getting-started/quick-start/) 页面,了解如何使用 FixIt 主题创建一个新网站的详细步骤。
|
||||
前往 [快速上手](https://fixit.lruihao.cn/zh-cn/docs/getting-started/quick-start/) 页面,了解如何使用 FixIt 主题创建一个新网站的详细步骤。
|
||||
|
||||
大纲:[安装篇](https://fixit.lruihao.cn/zh-cn/documentation/installation/) ➜ [入门篇](https://fixit.lruihao.cn/zh-cn/documentation/getting-started/) ➜ [内容管理](https://fixit.lruihao.cn/zh-cn/documentation/content-management/) ➜ [进阶篇](https://fixit.lruihao.cn/zh-cn/documentation/advanced/)
|
||||
大纲:[安装篇](https://fixit.lruihao.cn/zh-cn/docs/installation/) ➜ [入门篇](https://fixit.lruihao.cn/zh-cn/docs/getting-started/) ➜ [内容管理](https://fixit.lruihao.cn/zh-cn/docs/content-management/) ➜ [进阶篇](https://fixit.lruihao.cn/zh-cn/docs/advanced/)
|
||||
|
||||
### 快速开始
|
||||
|
||||
@@ -85,8 +89,8 @@ pnpx fixit-cli create my-blog
|
||||
|
||||
### 性能和 SEO
|
||||
|
||||
- **性能**优化:在 [Google PageSpeed Insights](https://developers.google.com/speed/pagespeed/insights) 中,99/100 的移动设备得分和 100/100 的桌面设备得分
|
||||
- 使用基于 JSON-LD 格式 的 **SEO SCHEMA** 文件进行 SEO 优化
|
||||
- **性能优化**:在 [Google PageSpeed Insights](https://developers.google.com/speed/pagespeed/insights) 中,99/100 的移动设备得分和 100/100 的桌面设备得分
|
||||
- 使用基于 JSON-LD 格式的 **SEO SCHEMA** 文件进行 SEO 优化
|
||||
- 支持 **[Google Analytics](https://analytics.google.com/analytics)**
|
||||
- 支持 **[Fathom Analytics](https://usefathom.com/)**
|
||||
- 支持 **[百度统计](https://tongji.baidu.com/)**
|
||||
@@ -94,23 +98,24 @@ pnpx fixit-cli create my-blog
|
||||
- 支持 **[Plausible Analytics](https://plausible.io/)**
|
||||
- 支持 **[Cloudflare Web Analytics](https://www.cloudflare.com/web-analytics)**
|
||||
- 支持 **[Splitbee Analytics](https://splitbee.io)**
|
||||
- 支持搜索引擎的**网站验证** (Google, Bing, Yandex, Pinterest, Baidu, 360 and Sogou)
|
||||
- 支持搜索引擎的 **网站验证** (Google, Bing, Yandex, Pinterest, Baidu, 360 and Sogou)
|
||||
- 支持所有第三方库的 **CDN**
|
||||
|
||||
### 外观和布局
|
||||
|
||||
- **响应式**布局
|
||||
- **响应式** 布局
|
||||
- **浅色/深色** 主题模式
|
||||
- 全局一致的**设计语言**
|
||||
- 支持**分页**
|
||||
- 易用和自动展开的**文章目录**
|
||||
- 支持**多语言**和国际化
|
||||
- 支持 **RTL(从右到左)** 布局
|
||||
- 全局一致的 **设计语言**
|
||||
- 支持 **分页**
|
||||
- 易用和自动展开的 **文章目录**
|
||||
- 支持 **多语言** 和国际化
|
||||
- 美观的 **CSS 动画**
|
||||
|
||||
### 社交和评论系统
|
||||
|
||||
- 支持 **[Gravatar](https://gravatar.com)** 头像
|
||||
- 支持本地**头像**
|
||||
- 支持本地 **头像**
|
||||
- 支持多达 **87** 种社交链接
|
||||
- 支持多达 **28** 种网站分享
|
||||
- 支持 **[Disqus](https://disqus.com)** 评论系统
|
||||
@@ -128,44 +133,44 @@ pnpx fixit-cli create my-blog
|
||||
### 扩展功能
|
||||
|
||||
- 支持基于 [PostChat](https://ai.zhheo.com/console/login?InviteID=85041330) 的 **AI 摘要**、**AI 搜索** 和 **AI 智能客服**
|
||||
- 支持**渐进式网页应用**
|
||||
- 支持**二级菜单**
|
||||
- 支持**内容加密**(页面、局部)
|
||||
- 支持**友情链接**的页面模板
|
||||
- 支持基于 [algolia](https://www.algolia.com/)、[Fuse.js](https://fusejs.io/)、 **CSE** 或 [PostChat](https://ai.zhheo.com/console/login?InviteID=85041330) 的**搜索**
|
||||
- 支持基于 [Google](https://programmablesearchengine.google.com/) 的**自定义搜索引擎 (CSE)**
|
||||
- 支持 **渐进式网页应用**
|
||||
- 支持 **二级菜单**
|
||||
- 支持 **内容加密**(页面、局部)
|
||||
- 支持 **友情链接** 的页面模板
|
||||
- 支持基于 [algolia](https://www.algolia.com/)、[Fuse.js](https://fusejs.io/)、[Pagefind](https://pagefind.app)、CSE 或 [PostChat](https://ai.zhheo.com/console/login?InviteID=85041330) 的 **搜索**
|
||||
- 支持基于 [Google](https://programmablesearchengine.google.com/) 的 **自定义搜索引擎 (CSE)**
|
||||
- 支持 **Twemoji**
|
||||
- 支持**代码高亮**
|
||||
- 一键**复制代码**到剪贴板
|
||||
- 支持基于 [lightgallery](https://github.com/sachinchoolur/lightgallery) 的**图片画廊**
|
||||
- 支持 **[Font Awesome](https://fontawesome.com/) 图标**的 Markdown 扩展语法
|
||||
- 支持**上标注释**的 Markdown 扩展语法
|
||||
- 支持**分数**的 Markdown 扩展语法
|
||||
- 支持 **代码高亮**
|
||||
- 一键 **复制代码** 到剪贴板
|
||||
- 支持基于 [lightgallery](https://github.com/sachinchoolur/lightgallery) 的 **图片画廊**
|
||||
- 支持 **[Font Awesome](https://fontawesome.com/) 图标** 的 Markdown 扩展语法
|
||||
- 支持 **上标注释** 的 Markdown 扩展语法
|
||||
- 支持 **分数** 的 Markdown 扩展语法
|
||||
- 支持多种 **admonitions** shortcode 或 **alerts** 的 Markdown 扩展语法
|
||||
- 支持**标签页**的 shortcode,提供多种设计样式
|
||||
- 支持基于 [KaTeX](https://katex.org/) 或 [MathJax](https://www.mathjax.org) 的**数学公式**
|
||||
- 支持基于 [mermaid](https://github.com/knsv/mermaid) 的**图表** 代码块扩展语法和 shortcode
|
||||
- 支持基于 [ECharts](https://echarts.apache.org/) 的**交互式数据可视化** 代码块扩展语法和 shortcode
|
||||
- 支持 **标签页** 的 shortcode,提供多种设计样式
|
||||
- 支持基于 [KaTeX](https://katex.org/) 或 [MathJax](https://www.mathjax.org) 的 **数学公式**
|
||||
- 支持基于 [mermaid](https://github.com/knsv/mermaid) 的 **图表** 代码块扩展语法和 shortcode
|
||||
- 支持基于 [ECharts](https://echarts.apache.org/) 的 **交互式数据可视化** 代码块扩展语法和 shortcode
|
||||
- 支持 **Timeline** 的代码块扩展语法和 shortcode
|
||||
- 支持 **文件树** 的代码块扩展语法和 shortcode
|
||||
- 支持基于 [Mapbox GL JS](https://docs.mapbox.com/mapbox-gl-js) 的 **Mapbox** shortcode
|
||||
- 支持基于 [APlayer](https://github.com/MoePlayer/APlayer) 和 [MetingJS](https://github.com/metowolf/MetingJS) 的**音乐播放器** shortcode
|
||||
- 支持基于 [APlayer](https://github.com/MoePlayer/APlayer) 和 [MetingJS](https://github.com/metowolf/MetingJS) 的 **音乐播放器** shortcode
|
||||
- 支持 **Bilibili 视频** 和 **抖音视频** shortcode
|
||||
- 支持**自定义样式**的 shortcode
|
||||
- 支持**自定义脚本**的 shortcode
|
||||
- 支持**自定义模板块**
|
||||
- 支持 **自定义样式** 的 shortcode
|
||||
- 支持 **自定义脚本** 的 shortcode
|
||||
- 支持 **自定义模板块**
|
||||
- 支持基于 [TypeIt](https://typeitjs.com/) 的**打字动画** shortcode
|
||||
- 支持基于 [cookieconsent](https://github.com/osano/cookieconsent) 的 **Cookie 许可横幅**
|
||||
- 支持基于 [cell-watermark](https://github.com/Lruihao/watermark) 的**网页水印**
|
||||
- 支持基于 [pangu.js](https://github.com/vinta/pangu.js) 的**中文排版**
|
||||
- 支持本地**缓存远程图床图片**
|
||||
- 支持基于 [cell-watermark](https://github.com/Lruihao/watermark) 的 **网页水印**
|
||||
- 支持基于 [pangu.js](https://github.com/vinta/pangu.js) 的 **中文排版**
|
||||
- 支持本地 **缓存远程图床图片**
|
||||
- ……
|
||||
|
||||
</details>
|
||||
|
||||
## 多语言和国际化
|
||||
|
||||
FixIt 主题多语言基本配置及自动翻译等详见 [内容管理](https://fixit.lruihao.cn/zh-cn/documentation/content-management/introduction#multilingual) 文档,欢迎 [贡献一种新的语言](https://github.com/hugo-fixit/FixIt/pulls)。
|
||||
FixIt 主题多语言基本配置及自动翻译等详见 [内容管理](https://fixit.lruihao.cn/zh-cn/docs/content-management/introduction#multilingual) 文档,欢迎 [贡献一种新的语言](https://github.com/hugo-fixit/FixIt/pulls)。
|
||||
|
||||
<details>
|
||||
<summary>FixIt 支持下列语言。</summary>
|
||||
@@ -186,12 +191,24 @@ FixIt 主题多语言基本配置及自动翻译等详见 [内容管理](https:/
|
||||
- 印地语
|
||||
- 日语
|
||||
- 韩语
|
||||
- 阿拉伯语
|
||||
- 波斯语
|
||||
- 乌尔都语
|
||||
|
||||
</details>
|
||||
|
||||
## 浏览器支持
|
||||
|
||||
FixIt 主题支持所有主流浏览器的最近两个版本。
|
||||
|
||||

|
||||

|
||||

|
||||

|
||||
|
||||
## 主题组件
|
||||
|
||||
FixIt 主题旨在在**简洁性**和**可扩展性**之间取得平衡。为此,我们开发了一系列额外的 [Hugo 主题组件](https://fixit.lruihao.cn/zh-cn/ecosystem/#-组件) 供用户选择。
|
||||
为了平衡 FixIt 主题的 **简洁性** 和 **可扩展性**,我们额外开发了一系列 [Hugo 主题组件](https://fixit.lruihao.cn/zh-cn/ecosystem/#-组件) 供用户选择。
|
||||
|
||||
<details>
|
||||
<summary>点击展开</summary>
|
||||
@@ -238,14 +255,18 @@ FixIt 主题旨在在**简洁性**和**可扩展性**之间取得平衡。为此
|
||||
| [Discussions][discussions] | GitHub 讨论区 |
|
||||
| [FixIt 主题交流群(微信)][wx-mp] | 关注「菠菜眾長」回复“FixIt”获取 |
|
||||
| [FixIt 主题交流群(QQ)][qq-group] | QQ 群:`814031017` |
|
||||
| [Hugo FixIt 星球][zsxq] | 付费知识星球 |
|
||||
| [FixIt 开发交流群][dev-group] | QQ 群:`770835493` |
|
||||
|
||||
[discussions]: https://github.com/hugo-fixit/FixIt/discussions
|
||||
[pulls]: https://github.com/hugo-fixit/FixIt/pulls
|
||||
[issues]: https://github.com/hugo-fixit/FixIt/issues
|
||||
[qq-group]: https://qm.qq.com/cgi-bin/qm/qr?k=awbwdTtSQ_-H5QGzeJxdWgv6JMbNehNM&jump_from=webapi
|
||||
[zsxq]: https://t.zsxq.com/GgKEW
|
||||
[wx-mp]: https://lruihao.cn/images/qr-wx-mp.webp
|
||||
[qq-group]: https://qm.qq.com/q/Mn1I7ljqsS
|
||||
[dev-group]: https://qm.qq.com/q/ky3uru0mbu
|
||||
|
||||
## 中国区镜像
|
||||
|
||||
为方便中国大陆用户访问,FixIt 在 Gitee 上提供了镜像仓库:[gitee.com/lruihao/FixIt](https://gitee.com/lruihao/FixIt)
|
||||
|
||||
## 参与贡献
|
||||
|
||||
@@ -265,11 +286,12 @@ FixIt 主题旨在在**简洁性**和**可扩展性**之间取得平衡。为此
|
||||
<details>
|
||||
<summary>感谢 FixIt 主题中使用的所有开源项目。</summary>
|
||||
|
||||
- [UnoCSS](https://github.com/unocss/unocss)
|
||||
- [normalize.css](https://github.com/necolas/normalize.css)
|
||||
- [Font Awesome](https://fontawesome.com/)
|
||||
- [Font Awesome](https://github.com/FortAwesome/Font-Awesome)
|
||||
- [Simple Icons](https://github.com/simple-icons/simple-icons)
|
||||
- [Animate.css](https://daneden.github.io/animate.css/)
|
||||
- [autocomplete-js](https://github.com/algolia/autocomplete)
|
||||
- [Animate.css](https://github.com/animate-css/animate.css)
|
||||
- [autocomplete](https://github.com/algolia/autocomplete)
|
||||
- [algoliasearch](https://github.com/algolia/algoliasearch-client-javascript)
|
||||
- [Fuse.js](https://fusejs.io/)
|
||||
- [object-fit-images](https://github.com/fregante/object-fit-images)
|
||||
@@ -297,9 +319,7 @@ FixIt 主题旨在在**简洁性**和**可扩展性**之间取得平衡。为此
|
||||
- [Twikoo](https://twikoo.js.org/)
|
||||
- [github-corners](https://github.com/tholman/github-corners)
|
||||
- [giscus](https://giscus.app/zh-CN)
|
||||
- [crypto-js](https://github.com/brix/crypto-js)
|
||||
- [pace](https://github.com/CodeByZach/pace)
|
||||
- [xxhash-wasm](https://github.com/jungomi/xxhash-wasm)
|
||||
- [`<tab-container>` element](https://github.com/github/tab-container-element)
|
||||
- [`<json-viewer>` element](https://github.com/Lruihao/json-viewer-element)
|
||||
|
||||
@@ -315,11 +335,11 @@ FixIt 根据 **MIT** 许可协议授权。更多信息请查看 [LICENSE 文件]
|
||||
|
||||
- [微信支付](/images/wechatpay.jpg)
|
||||
- [支付宝](/images/alipay.jpg)
|
||||
- [PayPal](https://paypal.me/Lruihao)
|
||||
<!-- - [PayPal](https://paypal.me/Lruihao) -->
|
||||
|
||||
感谢以下赞助商提供大力支持:
|
||||
|
||||
- [translate.js](https://github.com/xnx3/translate) 赞助[企业级翻译通道](https://translate.zvo.cn/4087.html)。
|
||||
- [translate.js](https://github.com/xnx3/translate) 赞助 [企业级翻译通道](https://translate.zvo.cn/4087.html)。
|
||||
|
||||
## 作者
|
||||
|
||||
|
||||
@@ -6,7 +6,8 @@ Only the latest version receives active maintenance and security updates:
|
||||
|
||||
| Version | Hugo Version | LoveIt Compat | Supported |
|
||||
| :-----: | :---------------: | :----------------: | :----------------: |
|
||||
| 0.4.x | 0.147.7 ~ latest | N/A | :white_check_mark: |
|
||||
| 1.x | 0.159.0 ~ latest | N/A | :white_check_mark: |
|
||||
| 0.4.x | 0.147.7 ~ 0.157.0 | N/A | :white_check_mark: |
|
||||
| 0.3.x | 0.112.0 ~ 0.146.0 | N/A | :x: |
|
||||
| 0.2.x | 0.62.0 ~ 0.110.0 | :white_check_mark: | :x: |
|
||||
| 0.1.x | Unknown | :white_check_mark: | :x: |
|
||||
|
||||
@@ -0,0 +1,25 @@
|
||||
# Apps
|
||||
|
||||
This directory contains the Hugo sites used for development, testing, and demonstration of the [FixIt](https://fixit.lruihao.cn) theme.
|
||||
|
||||
## Overview
|
||||
|
||||
| App | Description | Live |
|
||||
| -------------- | ----------------------------------------------------- | ----------------------------------------------------------------- |
|
||||
| [demo](./demo) | Demo site showcasing FixIt theme features | [demo.fixit.lruihao.cn](https://demo.fixit.lruihao.cn) |
|
||||
| [test](./test) | Test site for exercising and verifying theme features | [demo.fixit.lruihao.cn/test](https://demo.fixit.lruihao.cn/test/) |
|
||||
|
||||
> [!NOTE]
|
||||
> The documentation site (`fixit-docs`) lives in a separate repository: [hugo-fixit/fixit-docs](https://github.com/hugo-fixit/fixit-docs).
|
||||
|
||||
## Development
|
||||
|
||||
From the repository root:
|
||||
|
||||
```bash
|
||||
pnpm dev:demo # Start demo site dev server
|
||||
pnpm dev:test # Start test site dev server
|
||||
pnpm build:demo # Build demo site
|
||||
pnpm build:test # Build test site
|
||||
pnpm build # Build all sites (merged into public/)
|
||||
```
|
||||
@@ -7,7 +7,7 @@
|
||||
# See: https://gohugo.io/getting-started/configuration/
|
||||
# -------------------------------------------------------------------------------------
|
||||
|
||||
title = "Hugo FixIt Demo"
|
||||
title = "FixIt Demo"
|
||||
baseURL = "https://demo.fixit.lruihao.cn/"
|
||||
# theme = "FixIt"
|
||||
|
||||
@@ -17,20 +17,15 @@ _merge = "shallow"
|
||||
[outputs]
|
||||
_merge = "shallow"
|
||||
|
||||
# -------------------------------------------------------------------------------------
|
||||
# Taxonomies Configuration
|
||||
# See: https://gohugo.io/content-management/taxonomies/#configure-taxonomies
|
||||
# -------------------------------------------------------------------------------------
|
||||
|
||||
[taxonomies]
|
||||
_merge = "shallow"
|
||||
|
||||
# -------------------------------------------------------------------------------------
|
||||
# Theme Core Configuration
|
||||
# See: https://fixit.lruihao.cn/documentation/basics/#theme-configuration
|
||||
# See: https://fixit.lruihao.cn/docs/getting-started/configuration/params/
|
||||
# -------------------------------------------------------------------------------------
|
||||
|
||||
[params]
|
||||
# FixIt theme version
|
||||
version = "0.3.X" # e.g. "0.2.X", "0.2.15", "v0.2.15" etc.
|
||||
version = "1.0.X"
|
||||
# ...
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
"name": "@hugo-fixit/demo",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"build": "hugo --themesDir ../../.. --theme $PWD/../.. --gc --minify --logLevel info",
|
||||
"dev": "hugo server --themesDir ../../.. --theme $PWD/../.. -D --disableFastRender --navigateToChanged --ignoreCache -O"
|
||||
"build": "hugo --themesDir ../.. --theme . --gc --minify --logLevel info",
|
||||
"dev": "hugo server --themesDir ../.. --theme . -D --disableFastRender --navigateToChanged --ignoreCache -O"
|
||||
}
|
||||
}
|
||||
|
||||
|
After Width: | Height: | Size: 12 KiB |
@@ -26,3 +26,9 @@ Testing APlayer shortcode in FixIt theme.
|
||||
[00:08.02]amazing
|
||||
{{< /audio >}}
|
||||
{{< /aplayer >}}
|
||||
|
||||
{{% fixit-encryptor "1212" %}}
|
||||
{{< aplayer fixed=false mini=false autoplay=false theme="#b7daff" loop="all" order="list" preload="auto" volume=0.7 mutex=true lrcType=3 listFolded=false listMaxHeight="" storageName="aplayer-setting" >}}
|
||||
{{< audio name="Wavelength" artist="oldmanyoung" url="Wavelength.mp3" cover="Wavelength.webp" lrc="Wavelength.lrc" />}}
|
||||
{{< /aplayer >}}
|
||||
{{% /fixit-encryptor %}}
|
||||
|
||||
@@ -18,7 +18,7 @@ Testing code block in FixIt theme.
|
||||
🎉🥚 in development mode!
|
||||
```
|
||||
|
||||
## Multiple modes
|
||||
## Multiple `modes`
|
||||
|
||||
```js {mode="classic"}
|
||||
// Classic mode
|
||||
@@ -180,6 +180,187 @@ function add(a, b) {
|
||||
|
||||
<p>Lorem ipsum dolor sit amet, graecis denique ei vel, at duo primis mandamus. Et legere ocurreret pri, animal tacimates complectitur ad cum. Cu eum inermis inimicus efficiendi. Labore officiis his ex, soluta officiis concludaturque ei qui, vide sensibus vim ad.</p>
|
||||
|
||||
## Code Toggle
|
||||
|
||||
```toggle {before_tabs="hugo."}
|
||||
[params]
|
||||
description = ''
|
||||
keywords = []
|
||||
|
||||
[params.codeblock]
|
||||
mode = 'classic'
|
||||
wrapper = true
|
||||
```
|
||||
|
||||
## Mermaid
|
||||
|
||||
```mermaid
|
||||
flowchart TD
|
||||
A[Start] --> B{Is it?}
|
||||
B -->|Yes| C[OK]
|
||||
C --> D[Rethink]
|
||||
D --> B
|
||||
B ---->|No| E[End]
|
||||
```
|
||||
|
||||
## ECharts
|
||||
|
||||
```echarts
|
||||
[title]
|
||||
text = "Summary Line Chart"
|
||||
top = "2%"
|
||||
left = "center"
|
||||
|
||||
[tooltip]
|
||||
trigger = "axis"
|
||||
|
||||
[legend]
|
||||
data = [
|
||||
"Email Marketing",
|
||||
"Affiliate Advertising",
|
||||
"Video Advertising",
|
||||
"Direct View",
|
||||
"Search Engine"
|
||||
]
|
||||
top = "10%"
|
||||
|
||||
[grid]
|
||||
left = "5%"
|
||||
right = "5%"
|
||||
bottom = "5%"
|
||||
top = "20%"
|
||||
containLabel = true
|
||||
|
||||
[toolbox]
|
||||
left = "left"
|
||||
[toolbox.feature]
|
||||
[toolbox.feature.saveAsImage]
|
||||
title = "Save as Image"
|
||||
|
||||
[xAxis]
|
||||
type = "category"
|
||||
boundaryGap = false
|
||||
data = [
|
||||
"Monday",
|
||||
"Tuesday",
|
||||
"Wednesday",
|
||||
"Thursday",
|
||||
"Friday",
|
||||
"Saturday",
|
||||
"Sunday"
|
||||
]
|
||||
|
||||
[yAxis]
|
||||
type = "value"
|
||||
|
||||
[[series]]
|
||||
name = "Email Marketing"
|
||||
type = "line"
|
||||
stack = "Total"
|
||||
data = [
|
||||
120.0,
|
||||
132.0,
|
||||
101.0,
|
||||
134.0,
|
||||
90.0,
|
||||
230.0,
|
||||
210.0
|
||||
]
|
||||
|
||||
[[series]]
|
||||
name = "Affiliate Advertising"
|
||||
type = "line"
|
||||
stack = "Total"
|
||||
data = [
|
||||
220.0,
|
||||
182.0,
|
||||
191.0,
|
||||
234.0,
|
||||
290.0,
|
||||
330.0,
|
||||
310.0
|
||||
]
|
||||
|
||||
[[series]]
|
||||
name = "Video Advertising"
|
||||
type = "line"
|
||||
stack = "Total"
|
||||
data = [
|
||||
150.0,
|
||||
232.0,
|
||||
201.0,
|
||||
154.0,
|
||||
190.0,
|
||||
330.0,
|
||||
410.0
|
||||
]
|
||||
|
||||
[[series]]
|
||||
name = "Direct View"
|
||||
type = "line"
|
||||
stack = "Total"
|
||||
data = [
|
||||
320.0,
|
||||
332.0,
|
||||
301.0,
|
||||
334.0,
|
||||
390.0,
|
||||
330.0,
|
||||
320.0
|
||||
]
|
||||
|
||||
[[series]]
|
||||
name = "Search Engine"
|
||||
type = "line"
|
||||
stack = "Total"
|
||||
data = [
|
||||
820.0,
|
||||
932.0,
|
||||
901.0,
|
||||
934.0,
|
||||
1290.0,
|
||||
1330.0,
|
||||
1320.0
|
||||
]
|
||||
```
|
||||
|
||||
## Timeline
|
||||
|
||||
```timeline
|
||||
events:
|
||||
- timestamp: 2024-07-11
|
||||
content: Success
|
||||
- timestamp: 2024-07-13
|
||||
content: Approved
|
||||
- timestamp: 2024-07-15
|
||||
content: Event start
|
||||
```
|
||||
|
||||
## JSON
|
||||
|
||||
```json
|
||||
{
|
||||
"name": "FixIt",
|
||||
"version": "0.4.0",
|
||||
"description": "A clean, elegant but advanced blog theme for Hugo",
|
||||
"keywords": ["Hugo", "theme", "FixIt"]
|
||||
}
|
||||
```
|
||||
|
||||
## File Tree
|
||||
|
||||
{{< file-tree >}}
|
||||
- name: src
|
||||
type: dir
|
||||
children:
|
||||
- name: index.ts
|
||||
type: file
|
||||
- name: app.ts
|
||||
type: file
|
||||
- name: package.json
|
||||
type: file
|
||||
{{< /file-tree >}}
|
||||
|
||||
## Code block inside other blocks
|
||||
|
||||
> [!NOTE]+
|
||||
|
||||
@@ -26,6 +26,17 @@ $$ \ce{CO2 + C -> 2 CO} $$
|
||||
|
||||
$$ \ce{Hg^2+ ->[I-] HgI2 ->[I-] [Hg^{II}I4]^2-} $$
|
||||
|
||||
## JSON
|
||||
|
||||
```json
|
||||
{
|
||||
"name": "fixit",
|
||||
"version": "1.0.0",
|
||||
"description": "A Hugo theme for creating encrypted content.",
|
||||
"author": "Lruihao"
|
||||
}
|
||||
```
|
||||
|
||||
## style
|
||||
|
||||
{{< style "text-align:right; strong{color:#00b1ff;}" >}}
|
||||
@@ -37,10 +48,8 @@ This is a **right-aligned** paragraph.
|
||||
{{< script >}}
|
||||
console.log('before decrypting');
|
||||
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
fixit.decryptor.addEventListener('decrypted', function() {
|
||||
console.log('after decrypting')
|
||||
})
|
||||
document.addEventListener('fixit:decrypted', () => {
|
||||
console.log('after decrypting')
|
||||
});
|
||||
{{< /script >}}
|
||||
|
||||
@@ -157,10 +166,8 @@ series:
|
||||
{{< typeit code=javascript >}}
|
||||
console.log('before decrypting');
|
||||
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
fixit.decryptor.addEventListener('decrypted', function() {
|
||||
console.log('after decrypting')
|
||||
})
|
||||
document.addEventListener('fixit:decrypted', () => {
|
||||
console.log('after decrypting')
|
||||
});
|
||||
{{< /typeit >}}
|
||||
|
||||
|
||||
@@ -49,7 +49,7 @@ This article tests the **File Tree** shortcode functionality in the FixIt theme.
|
||||
|
||||
#### YAML format
|
||||
|
||||
{{< file-tree folderSlash=true >}}
|
||||
{{< file-tree folder_slash=true >}}
|
||||
- name: project-root
|
||||
type: dir
|
||||
children:
|
||||
@@ -99,7 +99,7 @@ type = "file"
|
||||
|
||||
TOML with folder slash and level 3:
|
||||
|
||||
{{< file-tree file="data/example.toml" level=3 folderSlash=true />}}
|
||||
{{< file-tree file="data/example.toml" level=3 folder_slash=true />}}
|
||||
|
||||
#### JSON format
|
||||
|
||||
@@ -107,7 +107,7 @@ TOML with folder slash and level 3:
|
||||
|
||||
JSON with folder slash and level 2:
|
||||
|
||||
{{< file-tree file="filetree/example.json" level=2 folderSlash=true />}}
|
||||
{{< file-tree file="filetree/example.json" level=2 folder_slash=true />}}
|
||||
|
||||
#### YAML format
|
||||
|
||||
@@ -131,15 +131,15 @@ Trying the file not found case (should fallback to next mode):
|
||||
|
||||
#### With folder slash
|
||||
|
||||
{{< file-tree data="example" folderSlash=true />}}
|
||||
{{< file-tree data="example" folder_slash=true />}}
|
||||
|
||||
#### With level and folder slash
|
||||
|
||||
{{< file-tree data="example" level=2 folderSlash=true />}}
|
||||
{{< file-tree data="example" level=2 folder_slash=true />}}
|
||||
|
||||
#### Collapsed with ignore
|
||||
|
||||
{{< file-tree data="example" level=0 ignoreList="README.md" />}}
|
||||
{{< file-tree data="example" level=0 ignore_list="README.md" />}}
|
||||
|
||||
## Filesystem Mode
|
||||
|
||||
@@ -165,13 +165,13 @@ Trying the file not found case (should fallback to next mode):
|
||||
|
||||
{{< file-tree "assets" 0 />}}
|
||||
|
||||
{{< file-tree path="assets" level=2 folderSlash=true />}}
|
||||
{{< file-tree path="assets" level=2 folder_slash=true />}}
|
||||
|
||||
{{< file-tree "assets" -1 />}}
|
||||
|
||||
### With ignore lists
|
||||
|
||||
{{< file-tree ignoreList=".hugo_build.lock, public, resources, node_modules" level=2 folderSlash=true />}}
|
||||
{{< file-tree ignore_list=".hugo_build.lock, public, resources, node_modules" level=2 folder_slash=true />}}
|
||||
|
||||
### root not exist
|
||||
|
||||
@@ -220,7 +220,7 @@ type = "file"
|
||||
|
||||
### With parameters
|
||||
|
||||
```file-tree {level=2 folderSlash=true ignoreList="config.local.js"}
|
||||
```file-tree {level=2 folder_slash=true ignore_list="config.local.js"}
|
||||
- name: project
|
||||
type: dir
|
||||
children:
|
||||
@@ -242,7 +242,7 @@ type = "file"
|
||||
|
||||
### Fully expanded
|
||||
|
||||
```file-tree {level=-1 folderSlash=true}
|
||||
```file-tree {level=-1 folder_slash=true}
|
||||
- name: backend
|
||||
type: dir
|
||||
children:
|
||||
|
||||
@@ -15,9 +15,12 @@ Test for rendering Font Awesome icons.
|
||||
|
||||
## Size
|
||||
|
||||
:(fa-solid fa-camera fa-2xs):
|
||||
:(fa-solid fa-camera fa-xs):
|
||||
:(fa-solid fa-camera fa-sm):
|
||||
:(fa-solid fa-camera fa-lg):
|
||||
:(fa-solid fa-camera fa-xl):
|
||||
:(fa-solid fa-camera fa-2xl):
|
||||
:(fa-solid fa-camera fa-1x):
|
||||
:(fa-solid fa-camera fa-2x):
|
||||
:(fa-solid fa-camera fa-3x):
|
||||
|
||||
@@ -0,0 +1,93 @@
|
||||
---
|
||||
title: Link Rendering Test
|
||||
date: 2026-04-10T11:40:06+08:00
|
||||
collections:
|
||||
- Tests
|
||||
categories:
|
||||
- Markdown
|
||||
tags:
|
||||
- Link
|
||||
link:
|
||||
guard:
|
||||
enable: true
|
||||
# mode: redirect
|
||||
allow_domains:
|
||||
- demo.fixit.lruihao.cn
|
||||
---
|
||||
|
||||
This post validates link rendering paths in FixIt, including Markdown render hook and link shortcode modes.
|
||||
|
||||
<!--more-->
|
||||
|
||||
## Markdown Render Hook (Regular Link)
|
||||
|
||||
These links are rendered by `layouts/_markup/render-link.html` and should always produce regular links.
|
||||
|
||||
- Internal relative link: [Task list test](/test/units/task-list-test/)
|
||||
- Internal anchor link: [Jump to Card Link section](#card-link-shortcode)
|
||||
- Absolute same-site link: [Test site home](http://demo.fixit.lruihao.cn/test/)
|
||||
- External HTTP link: [FixIt Repository](https://github.com/hugo-fixit/FixIt)
|
||||
- Mail link: [Email test](mailto:test@gmail.com)
|
||||
- JavaScript link: [JavaScript test](javascript:void(0))
|
||||
- Tel link: [Phone test](tel:+1234567890)
|
||||
- File link: [File test](file:///path/to/file.txt)
|
||||
- Data link: [Data URI test](data:text/plain;base64,SGVsbG8sIFdvcmxkIQ==)
|
||||
|
||||
### Title Attribute (Markdown)
|
||||
|
||||
[External link with title](https://google.com "Example Title")
|
||||
|
||||
## Link Shortcode (Regular)
|
||||
|
||||
### Named parameters
|
||||
|
||||
{{< link href="https://github.com/hugo-fixit/FixIt" content="GitHub via shortcode" title="GitHub title" >}}
|
||||
|
||||
{{< link href="/test/units/codeblock-test/" content="Internal shortcode link" class="shortcode-link-test" >}}
|
||||
|
||||
{{< link href="https://google.com" content="Custom rel + no noreferrer" rel="ugc" noreferrer=false >}}
|
||||
|
||||
{{< link href="/images/fixit.svg" content="Download local file" download="fixit.svg" >}}
|
||||
|
||||
### Positional parameters
|
||||
|
||||
{{< link "https://mozilla.org" "Positional regular link" "Positional title" >}}
|
||||
|
||||
## Card Link Shortcode
|
||||
|
||||
### Basic card
|
||||
|
||||
{{< link href="https://fixit.lruihao.cn" content="FixIt Documentation" card=true >}}
|
||||
|
||||
### Card with custom icon class
|
||||
|
||||
{{< link href="https://github.com/hugo-fixit/FixIt" content="FixIt on GitHub" card=true card-icon="fa-brands fa-github" >}}
|
||||
|
||||
### Card with custom image icon
|
||||
|
||||
{{< link href="https://gohugo.io" content="Hugo Official Site" card=true card-icon="/images/hugo.svg" >}}
|
||||
|
||||
### Card with download state
|
||||
|
||||
{{< link href="/images/fixit.svg" content="Download as card" card=true download="fixit.svg" >}}
|
||||
|
||||
### Positional card parameters
|
||||
|
||||
{{< link "https://google.com" "Positional card link" "" true "fa-solid fa-link" >}}
|
||||
|
||||
## Edge Cases
|
||||
|
||||
- URL with query string:
|
||||
[Search query test](https://google.com/search?q=fixit&lang=en)
|
||||
- URL with fragment:
|
||||
[Fragment test](https://google.com/docs#installation)
|
||||
- Long URL display (card meta should trim protocol automatically):
|
||||
{{< link href="https://google.com/a/very/long/path/for/testing/card/url/display?foo=bar&baz=qux" content="Long URL card" card=true >}}
|
||||
|
||||
## Manual Verification Checklist
|
||||
|
||||
- Regular Markdown external links include external behavior and icon policy.
|
||||
- Internal links are not treated as external.
|
||||
- Shortcode card links render `.card-link` structure and card meta URL.
|
||||
- `download` shows download icon/state in both regular and card modes.
|
||||
- `noreferrer=false` removes `noopener noreferrer` from generated rel values.
|
||||
@@ -128,7 +128,7 @@ $$
|
||||
|
||||
### Dark Mode Adaptation
|
||||
|
||||
Use `.auto-dark-mode` class to automatically adapt to dark mode by inverting the color and hue:
|
||||
Use `.auto-dark-mode` class or `auto-dark` shortcode to automatically adapt to dark mode by inverting the color and hue:
|
||||
|
||||
For inline formula:
|
||||
|
||||
@@ -137,9 +137,14 @@ $\bbox[border: solid .4pt magenta, pink]{x^2=4}$
|
||||
|
||||
For formula blocks:
|
||||
|
||||
{{< style "[data-theme=dark] & { filter: invert(1) hue-rotate(0.5turn); }" >}}
|
||||
{{< auto-dark >}}
|
||||
$$
|
||||
\bbox[border: solid .4pt magenta, pink]{x^2=4}
|
||||
$$
|
||||
{.auto-dark-mode}
|
||||
{{< /style >}}
|
||||
{{< /auto-dark >}}
|
||||
|
||||
### In Encrypted Content
|
||||
|
||||
{{% fixit-encryptor "1212" %}}
|
||||
$c = \pm\sqrt{a^2 + b^2}$ and \(f(x)=\int_{-\infty}^{\infty} \hat{f}(\xi) e^{2 \pi i \xi x} d \xi\)
|
||||
{{% /fixit-encryptor %}}
|
||||
|
||||
@@ -9,10 +9,23 @@ categories:
|
||||
tags:
|
||||
- Mermaid
|
||||
- Diagrams
|
||||
mermaid:
|
||||
zenuml: https://cdn.jsdelivr.net/npm/@mermaid-js/mermaid-zenuml/dist/mermaid-zenuml.esm.min.mjs
|
||||
---
|
||||
|
||||
The FixIt theme supports two ways to use Mermaid: code block syntax and shortcode syntax.
|
||||
|
||||
```mermaid {wrapper=false}
|
||||
---
|
||||
config:
|
||||
theme: 'forest'
|
||||
---
|
||||
graph TD
|
||||
a --> b
|
||||
```
|
||||
|
||||
<!--more-->
|
||||
|
||||
## Flowchart
|
||||
|
||||
```mermaid
|
||||
@@ -24,8 +37,6 @@ flowchart TD
|
||||
B ---->|No| E[End]
|
||||
```
|
||||
|
||||
<!--more-->
|
||||
|
||||
## Sequence Diagram
|
||||
|
||||
```mermaid
|
||||
|
||||
@@ -0,0 +1,189 @@
|
||||
---
|
||||
title: اختبار دعم اللغة العربية والكتابة من اليمين إلى اليسار
|
||||
date: 2026-08-23T10:00:00+08:00
|
||||
collections:
|
||||
- اختبارات
|
||||
categories:
|
||||
- ميزات
|
||||
tags:
|
||||
- RTL
|
||||
- عربي
|
||||
- اختبار
|
||||
---
|
||||
|
||||
هذا مقال اختباري شامل لدعم اللغة العربية والكتابة من اليمين إلى اليسار في سمة [FixIt](https://github.com/hugo-fixit/FixIt/). يهدف هذا المقال إلى اختبار جميع عناصر الويب المختلفة مع المحتوى العربي.
|
||||
|
||||
<!--more-->
|
||||
|
||||
## المقدمة
|
||||
|
||||
مرحباً بكم في هذا المقال الاختباري الشامل. اللغة العربية هي واحدة من أكثر اللغات انتشاراً في العالم، وتتميز بكتابتها من اليمين إلى اليسار. يتطلب دعم هذه اللغة في تصميمات الويب اهتماماً خاصاً بالعديد من الجوانب التقنية.
|
||||
|
||||
### لماذا RTL مهم؟
|
||||
|
||||
عندما نصمم مواقع ويب تدعم اللغات التي تُكتب من اليمين إلى اليسار، يجب علينا مراعاة عدة عوامل:
|
||||
|
||||
- **اتجاه النص**: يجب أن يتدفق النص بشكل طبيعي من اليمين إلى اليسار
|
||||
- **تخطيط الصفحة**: يجب أن تكون العناصر مرتبة بشكل منطقي
|
||||
- **الرموز والأيقونات**: قد تحتاج بعضها إلى انعكاس
|
||||
- **التباعد بين الأسطر**: يحتاج النص العربي إلى مساحة أكبر للتشكيل
|
||||
|
||||
## النص المختلط
|
||||
|
||||
هذا نص يحتوي على كلمات إنجليزية مثل JavaScript و HTML و CSS مع نص عربي. يجب أن يظهر كل شيء بشكل صحيح.
|
||||
|
||||
## الروابط
|
||||
|
||||
- [موقع Hugo](https://gohugo.io)
|
||||
- [سمة FixIt](https://fixit.lruihao.cn)
|
||||
- [وثائق RTL](https://rtlstyling.com)
|
||||
|
||||
## القوائم
|
||||
|
||||
القوائم غير المرتبة:
|
||||
|
||||
- عنصر القائمة الأول
|
||||
- عنصر القائمة الثاني
|
||||
- عنصر القائمة الثالث
|
||||
- عنصر فرعي
|
||||
- عنصر فرعي آخر
|
||||
|
||||
القوائم المرتبة:
|
||||
|
||||
1. الخطوة الأولى في العملية
|
||||
2. الخطوة الثانية
|
||||
3. الخطوة الثالثة والأخيرة
|
||||
|
||||
قوائم المهام:
|
||||
|
||||
- [x] إعداد بيئة التطوير
|
||||
- [x] كتابة المحتوى الأساسي
|
||||
- [ ] اختبار التوافق مع المتصفحات
|
||||
- [ ] مراجعة التصميم النهائي
|
||||
- [ ] نشر الموقع
|
||||
|
||||
## الجداول
|
||||
|
||||
| اللغة | الاتجاه | الحروف المتصلة |
|
||||
| ---------: | ------: | -------------: |
|
||||
| العربية | RTL | نعم |
|
||||
| الفارسية | RTL | نعم |
|
||||
| العبرية | RTL | لا |
|
||||
| الإنجليزية | LTR | لا |
|
||||
|
||||
## الاقتباسات
|
||||
|
||||
> العلم نور والجهل ظلام
|
||||
> — مثل عربي
|
||||
|
||||
اقتباس طويل:
|
||||
|
||||
> إن الله لا يغير ما بقوم حتى يغيروا ما بأنفسهم وإذا أراد الله بقوم سوءاً فلا مرد له وما لهم من دونه من وال
|
||||
|
||||
## الأيقونات
|
||||
|
||||
أيقونات يتم قلبها في RTL:
|
||||
|
||||
- :(fa-solid fa-tag): وسم
|
||||
- :(fa-solid fa-tags): وسوم
|
||||
- :(fa-solid fa-folder): مجلد
|
||||
- :(fa-solid fa-folder-open): مجلد مفتوح
|
||||
- :(fa-solid fa-pen-to-square): قلم تعديل
|
||||
|
||||
أيقونات لا يتم قلبها في RTL:
|
||||
|
||||
- :(fa-solid fa-share): مشاركة
|
||||
- :(fa-solid fa-search): بحث
|
||||
|
||||
## التبويبات
|
||||
|
||||
{{< tabs >}}
|
||||
{{% tab title="العلامة الأولى" %}}
|
||||
محتوى التبويب الأول.
|
||||
{{% /tab %}}
|
||||
{{% tab title="العلامة الثانية" %}}
|
||||
محتوى التبويب الثاني.
|
||||
{{% /tab %}}
|
||||
{{< /tabs >}}
|
||||
|
||||
## التفاصيل القابلة للطي
|
||||
|
||||
<details>
|
||||
<summary>انقر لعرض التفاصيل</summary>
|
||||
|
||||
هذا محتوى مخفي يمكنBOOLE توسيعه بالنقر.
|
||||
|
||||
المحتوى يمكن أن يكون نصاً أو كوداً أو أي عنصر آخر.
|
||||
|
||||
</details>
|
||||
|
||||
## التنبيهات
|
||||
|
||||
{{< admonition >}}
|
||||
هذا تنبيه عادي يحتوي على معلومات مفيدة للمستخدم.
|
||||
{{< /admonition >}}
|
||||
|
||||
> [!IMPORTANT]
|
||||
> تأكد من اختبار جميع التغييرات قبل النشر.
|
||||
|
||||
## المحتوى المشفر
|
||||
|
||||
{{< fixit-encryptor password="1212" message="أدخل كلمة المرور (1212) لعرض المحتوى" >}}
|
||||
هذا محتوى مشفر. يجب إدخال كلمة المرور لعرضه.
|
||||
{{< /fixit-encryptor >}}
|
||||
|
||||
## أمثلة على المحتوى LTR
|
||||
|
||||
في صفحة RTL، بعض العناصر تبقى باتجاه LTR لأن محتاها لغوي بحت أو برمجي. فيما يلي أمثلة:
|
||||
|
||||
### كتلة الكود
|
||||
|
||||
```c
|
||||
#include <stdio.h>
|
||||
|
||||
int main() {
|
||||
printf("Hello, World!\n");
|
||||
return 0;
|
||||
}
|
||||
```
|
||||
|
||||
### عارض JSON
|
||||
|
||||
```json
|
||||
{
|
||||
"name": "FixIt",
|
||||
"version": "1.0.0",
|
||||
"features": ["RTL", "i18n", "shortcodes"]
|
||||
}
|
||||
```
|
||||
|
||||
### تبويبات الكود
|
||||
|
||||
```python {group=tab1}
|
||||
print("Python")
|
||||
```
|
||||
|
||||
```go {group=tab1}
|
||||
fmt.Println("Go")
|
||||
```
|
||||
|
||||
### الصيغ الرياضية
|
||||
|
||||
معادلة بسيطة: $E = mc^2$
|
||||
|
||||
معادلة معقدة:
|
||||
|
||||
$$\sum_{i=1}^{n} i = \frac{n(n+1)}{2}$$
|
||||
|
||||
### مخططات Mermaid
|
||||
|
||||
```mermaid
|
||||
graph LR
|
||||
A[بداية] --> B[عملية]
|
||||
B --> C[نهاية]
|
||||
```
|
||||
|
||||
---
|
||||
{.awesome-hr}
|
||||
|
||||
_تم إنشاء هذا المقال لاختبار دعم اللغة العربية في سمة FixIt._
|
||||
@@ -0,0 +1,187 @@
|
||||
---
|
||||
title: Arabic RTL Test
|
||||
date: 2026-08-23T10:00:00+08:00
|
||||
collections:
|
||||
- Tests
|
||||
categories:
|
||||
- Features
|
||||
tags:
|
||||
- RTL
|
||||
- Arabic
|
||||
---
|
||||
|
||||
A comprehensive test article for Arabic language and Right-to-Left layout support in the [FixIt](https://github.com/hugo-fixit/FixIt/) theme. This article tests various web elements with Arabic content.
|
||||
|
||||
<!--more-->
|
||||
|
||||
## Introduction
|
||||
|
||||
Welcome to this comprehensive test article. Arabic is one of the most widely spoken languages in the world, characterized by its Right-to-Left writing direction. Supporting this language in web designs requires special attention to many technical aspects.
|
||||
|
||||
### Why RTL Matters
|
||||
|
||||
When designing websites that support Right-to-Left languages, we need to consider several factors:
|
||||
|
||||
- **Text direction**: Text should flow naturally from right to left
|
||||
- **Page layout**: Elements should be arranged in a logical order
|
||||
- **Symbols and icons**: Some may need to be mirrored
|
||||
- **Line spacing**: Arabic text needs more space for diacritics
|
||||
|
||||
## Mixed Text
|
||||
|
||||
This text contains English words like JavaScript, HTML, and CSS alongside Arabic text. Everything should display correctly.
|
||||
|
||||
## Links
|
||||
|
||||
- [Hugo Website](https://gohugo.io)
|
||||
- [FixIt Theme](https://fixit.lruihao.cn)
|
||||
- [RTL Styling](https://rtlstyling.com)
|
||||
|
||||
## Lists
|
||||
|
||||
Unordered lists:
|
||||
|
||||
- First list item
|
||||
- Second list item
|
||||
- Third list item
|
||||
- Sub item
|
||||
- Another sub item
|
||||
|
||||
Ordered lists:
|
||||
|
||||
1. First step in the process
|
||||
2. Second step
|
||||
3. Third and final step
|
||||
|
||||
Task lists:
|
||||
|
||||
- [x] Set up development environment
|
||||
- [x] Write basic content
|
||||
- [ ] Test browser compatibility
|
||||
- [ ] Review final design
|
||||
- [ ] Deploy website
|
||||
|
||||
## Tables
|
||||
|
||||
| Language | Direction | Connected Letters |
|
||||
| ---------- | --------- | ----------------- |
|
||||
| Arabic | RTL | Yes |
|
||||
| Persian | RTL | Yes |
|
||||
| Hebrew | RTL | No |
|
||||
| English | LTR | No |
|
||||
|
||||
## Blockquotes
|
||||
|
||||
> Knowledge is light and ignorance is darkness
|
||||
> — Arabic proverb
|
||||
|
||||
Long quote:
|
||||
|
||||
> Indeed, Allah does not change the condition of a people until they change what is in themselves
|
||||
|
||||
## Icons
|
||||
|
||||
Icons that are flipped in RTL:
|
||||
|
||||
- :(fa-solid fa-tag): Tag
|
||||
- :(fa-solid fa-tags): Tags
|
||||
- :(fa-solid fa-folder): Folder
|
||||
- :(fa-solid fa-folder-open): Folder Open
|
||||
- :(fa-solid fa-pen-to-square): Edit
|
||||
|
||||
Icons that are NOT flipped in RTL:
|
||||
|
||||
- :(fa-solid fa-share): Share
|
||||
- :(fa-solid fa-search): Search
|
||||
|
||||
## Tabs
|
||||
|
||||
{{< tabs >}}
|
||||
{{% tab title="First Tab" %}}
|
||||
Content of the first tab.
|
||||
{{% /tab %}}
|
||||
{{% tab title="Second Tab" %}}
|
||||
Content of the second tab.
|
||||
{{% /tab %}}
|
||||
{{< /tabs >}}
|
||||
|
||||
## Collapsible Details
|
||||
|
||||
<details>
|
||||
<summary>Click to show details</summary>
|
||||
|
||||
This is hidden content that can be expanded by clicking.
|
||||
|
||||
Content can be text, code, or any other element.
|
||||
|
||||
</details>
|
||||
|
||||
## Alerts
|
||||
|
||||
{{< admonition >}}
|
||||
This is a regular admonition with useful information for the user.
|
||||
{{< /admonition >}}
|
||||
|
||||
> [!IMPORTANT]
|
||||
> Make sure to test all changes before deploying.
|
||||
|
||||
## Encrypted Content
|
||||
|
||||
{{< fixit-encryptor password="1212" message="Enter password (1212) to view content" >}}
|
||||
This is encrypted content. You must enter the password to view it.
|
||||
{{< /fixit-encryptor >}}
|
||||
|
||||
## LTR Content Examples
|
||||
|
||||
In an RTL page, some elements remain in LTR direction because their content is purely linguistic or programmatic. Here are examples:
|
||||
|
||||
### Code Block
|
||||
|
||||
```c
|
||||
#include <stdio.h>
|
||||
|
||||
int main() {
|
||||
printf("Hello, World!\n");
|
||||
return 0;
|
||||
}
|
||||
```
|
||||
|
||||
### JSON Viewer
|
||||
|
||||
```json
|
||||
{
|
||||
"name": "FixIt",
|
||||
"version": "1.0.0",
|
||||
"features": ["RTL", "i18n", "shortcodes"]
|
||||
}
|
||||
```
|
||||
|
||||
### Code Tabs
|
||||
|
||||
```python {group=tab1}
|
||||
print("Python")
|
||||
```
|
||||
|
||||
```go {group=tab1}
|
||||
fmt.Println("Go")
|
||||
```
|
||||
|
||||
### Math
|
||||
|
||||
Simple equation: $E = mc^2$
|
||||
|
||||
Complex equation:
|
||||
|
||||
$$\sum_{i=1}^{n} i = \frac{n(n+1)}{2}$$
|
||||
|
||||
### Mermaid Diagram
|
||||
|
||||
```mermaid
|
||||
graph LR
|
||||
A[Start] --> B[Process]
|
||||
B --> C[End]
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
_Created to test Arabic language support in the FixIt theme._
|
||||
@@ -13,7 +13,18 @@ tags:
|
||||
Testing various configurations and nested scenarios for the Tabs shortcode.
|
||||
|
||||
{{< tabs >}}
|
||||
{{% tab title="Test Cases" %}}See Types section for various test cases.{{% /tab %}}
|
||||
{{% tab title="Test Cases" %}}
|
||||
See Types section for various test cases.
|
||||
|
||||
```go-template {name="Shortcode"}
|
||||
{{</* tabs */>}}
|
||||
{{%/* tab title="Test Cases" */%}}
|
||||
{{%/* tab title="Test Cases" */%}}See Types section for various test cases.{{%/* /tab */%}}
|
||||
{{%/* tab title="Nested Tabs" */%}}See Nested Tabs section for examples.{{%/* /tab */%}}
|
||||
{{</* /tabs */>}}
|
||||
```
|
||||
|
||||
{{% /tab %}}
|
||||
{{% tab title="Nested Tabs" %}}See Nested Tabs section for examples.{{% /tab %}}
|
||||
{{< /tabs >}}
|
||||
|
||||
@@ -23,7 +34,7 @@ Testing various configurations and nested scenarios for the Tabs shortcode.
|
||||
|
||||
### Underline (Default)
|
||||
|
||||
<!-- placement: top, bottom, left, right -->
|
||||
<!-- placement: top, bottom, start, end -->
|
||||
|
||||
{{< tabs placement="top" >}}
|
||||
{{% tab title="Tab 1" %}}Content for underline style tab 1{{% /tab %}}
|
||||
@@ -33,7 +44,7 @@ Testing various configurations and nested scenarios for the Tabs shortcode.
|
||||
|
||||
### Pill
|
||||
|
||||
<!-- placement: top, bottom, left, right -->
|
||||
<!-- placement: top, bottom, start, end -->
|
||||
|
||||
{{< tabs type="pill" placement="top" >}}
|
||||
{{% tab title="Tab 1" %}}Content for pill style tab 1{{% /tab %}}
|
||||
@@ -43,7 +54,7 @@ Testing various configurations and nested scenarios for the Tabs shortcode.
|
||||
|
||||
### Card
|
||||
|
||||
<!-- placement: top, bottom, left, right -->
|
||||
<!-- placement: top, bottom, start, end -->
|
||||
|
||||
{{< tabs type="card" placement="top" >}}
|
||||
{{% tab title="Tab 1" %}}Content for card style tab 1{{% /tab %}}
|
||||
@@ -115,7 +126,7 @@ Nested tab C with a table:
|
||||
{{% tab title="Outer Tab 3" %}}
|
||||
This tab contains vertical nested tabs:
|
||||
|
||||
{{< tabs type="card" vertical=true >}}
|
||||
{{< tabs type="card" placement="end" >}}
|
||||
|
||||
{{% tab title="Vertical A" %}}
|
||||
Content for vertical nested tab A.
|
||||
@@ -216,3 +227,16 @@ type = "file"
|
||||
|
||||
{{% /tab %}}
|
||||
{{< /tabs >}}
|
||||
|
||||
### MathJax inside tabs
|
||||
|
||||
{{< tabs >}}
|
||||
{{% tab title="Inline" %}}
|
||||
$c = \pm\sqrt{a^2 + b^2}$ and \(f(x)=\int_{-\infty}^{\infty} \hat{f}(\xi) e^{2 \pi i \xi x} d \xi\)
|
||||
{{% /tab %}}
|
||||
{{% tab title="Block" %}}
|
||||
$$ x = {-b \pm \sqrt{b^2-4ac} \over 2a} $$
|
||||
|
||||
\[ f(a) = \frac{1}{2\pi i} \oint\frac{f(z)}{z-a}dz \]
|
||||
{{% /tab %}}
|
||||
{{< /tabs >}}
|
||||
|
||||
@@ -19,17 +19,6 @@ This post tests the rendering of task lists in Markdown.
|
||||
- [x] Checked Task
|
||||
- Regular list item
|
||||
|
||||
## Nested Task Lists (Bug Fix Verification)
|
||||
|
||||
- [ ] Parent Task 1
|
||||
- [ ] Child Task 1.1
|
||||
- [x] Child Task 1.2
|
||||
- Regular list item
|
||||
- [x] Parent Task 2
|
||||
- [ ] Child Task 2.1
|
||||
- [ ] Grandchild Task 2.1.1
|
||||
- [x] Grandchild Task 2.1.2
|
||||
|
||||
## Extended Task Lists (Custom Icons)
|
||||
|
||||
- [-] Cancelled Task
|
||||
@@ -37,9 +26,27 @@ This post tests the rendering of task lists in Markdown.
|
||||
- [<] Scheduled Task
|
||||
- [>] Rescheduled Task
|
||||
- [!] Important Task
|
||||
- [!x] Important Checked Task
|
||||
- [?] Question Task
|
||||
- Regular list item
|
||||
|
||||
## Nested Task Lists (Bug Fix Verification)
|
||||
|
||||
- [ ] Parent Task 1
|
||||
- [ ] Child Task 1.1
|
||||
- [x] Child Task 1.2
|
||||
- Regular list item
|
||||
- [/] Parent Task 2
|
||||
- Regular list item
|
||||
- [ ] Child Task 2.1
|
||||
- [x] Grandchild Task 2.1.1
|
||||
- [-] Grandchild Task 2.1.2
|
||||
- [<] Scheduled Task
|
||||
- [>] Rescheduled Task
|
||||
- [!] Important Task
|
||||
- [!x] Important Checked Task
|
||||
- [?] Question Task
|
||||
|
||||
## Mixed Content in List Items
|
||||
|
||||
- [ ] Task with **bold** and _italic_ text
|
||||
|
||||
@@ -3,9 +3,30 @@
|
||||
# See: https://gohugo.io/configuration/all/
|
||||
# -------------------------------------------------------------------------------------
|
||||
|
||||
title = "Hugo FixIt TEST"
|
||||
title = "FixIt TEST"
|
||||
baseURL = "https://demo.fixit.lruihao.cn/test/"
|
||||
ignoreLogs = [ "warning-file-tree" ]
|
||||
ignoreLogs = [
|
||||
"warning-file-tree",
|
||||
"warning-encryption"
|
||||
]
|
||||
defaultContentLanguage = "en"
|
||||
|
||||
# test for multilingual support
|
||||
[languages]
|
||||
|
||||
[languages.en]
|
||||
locale = "en"
|
||||
label = "English"
|
||||
|
||||
# [todo] 优化中文排版
|
||||
# [languages.zh-cn]
|
||||
# locale = "zh-CN"
|
||||
# label = "简体中文"
|
||||
|
||||
[languages.ar]
|
||||
direction = "rtl"
|
||||
locale = "ar"
|
||||
label = "العربية"
|
||||
|
||||
[permalinks]
|
||||
|
||||
@@ -21,31 +42,37 @@ _merge = "shallow"
|
||||
[outputs]
|
||||
_merge = "shallow"
|
||||
|
||||
# -------------------------------------------------------------------------------------
|
||||
# Taxonomies Configuration
|
||||
# See: https://gohugo.io/content-management/taxonomies/#configure-taxonomies
|
||||
# -------------------------------------------------------------------------------------
|
||||
|
||||
[taxonomies]
|
||||
_merge = "shallow"
|
||||
|
||||
# -------------------------------------------------------------------------------------
|
||||
# Theme Core Configuration
|
||||
# See: https://fixit.lruihao.cn/documentation/basics/#theme-configuration
|
||||
# See: https://fixit.lruihao.cn/docs/getting-started/configuration/params/
|
||||
# -------------------------------------------------------------------------------------
|
||||
|
||||
[params]
|
||||
version = "0.3.X"
|
||||
version = "1.0.X"
|
||||
collection_list = true
|
||||
collection_navigation = true
|
||||
|
||||
[params.page]
|
||||
collectionList = true
|
||||
collectionNavigation = true
|
||||
[params.home.profile]
|
||||
enable = true
|
||||
avatar_url = "/images/fixit-test.png"
|
||||
|
||||
[params.social]
|
||||
|
||||
[params.social.github]
|
||||
id = "hugo-fixit"
|
||||
weight = 2
|
||||
|
||||
[params.social.twitter]
|
||||
id = "lruihao"
|
||||
weight = 1
|
||||
# for twitter cards
|
||||
# site = "hugo-fixit"
|
||||
|
||||
[params.author]
|
||||
name = "Lruihao"
|
||||
email = ""
|
||||
link = "https://lruihao.cn"
|
||||
avatar = "https://lruihao.cn/images/avatar.jpg"
|
||||
|
||||
[params.mermaid]
|
||||
zenuml = "https://cdn.jsdelivr.net/npm/@mermaid-js/mermaid-zenuml/dist/mermaid-zenuml.esm.min.mjs"
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
"name": "@hugo-fixit/test",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"build": "hugo --themesDir ../../.. --theme $PWD/../.. --gc --minify --logLevel info",
|
||||
"dev": "hugo server --themesDir ../../.. --theme $PWD/../.. -D --disableFastRender --navigateToChanged --ignoreCache -O"
|
||||
"build": "hugo --themesDir ../.. --theme . --gc --minify --logLevel info",
|
||||
"dev": "hugo server --themesDir ../.. --theme . -D --disableFastRender --navigateToChanged --ignoreCache -O"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -4,23 +4,15 @@ subtitle:
|
||||
date: {{ .Date }}
|
||||
slug: {{ substr .File.UniqueID 0 7 }}
|
||||
draft: true
|
||||
author:
|
||||
name:
|
||||
link:
|
||||
email:
|
||||
avatar:
|
||||
description:
|
||||
keywords:
|
||||
comment: false
|
||||
weight: 0
|
||||
tags:
|
||||
- draft
|
||||
categories:
|
||||
- draft
|
||||
hiddenFromHomePage: false
|
||||
hiddenFromSearch: false
|
||||
hiddenFromRelated: false
|
||||
hiddenFromFeed: false
|
||||
collections:
|
||||
- draft
|
||||
tags:
|
||||
- draft
|
||||
summary:
|
||||
resources:
|
||||
- name: featured-image
|
||||
@@ -33,7 +25,7 @@ repost:
|
||||
enable: false
|
||||
url:
|
||||
|
||||
# See details front matter: https://fixit.lruihao.cn/documentation/content-management/introduction/#front-matter
|
||||
# See: https://fixit.lruihao.cn/docs/content-management/front-matter/
|
||||
---
|
||||
|
||||
<!--more-->
|
||||
|
||||
@@ -4,33 +4,25 @@ subtitle:
|
||||
date: {{ .Date }}
|
||||
slug: {{ substr .File.UniqueID 0 7 }}
|
||||
draft: true
|
||||
author:
|
||||
name:
|
||||
link:
|
||||
email:
|
||||
avatar:
|
||||
description:
|
||||
keywords:
|
||||
comment: false
|
||||
weight: 0
|
||||
tags:
|
||||
- draft
|
||||
categories:
|
||||
- draft
|
||||
hiddenFromHomePage: false
|
||||
hiddenFromSearch: false
|
||||
hiddenFromRelated: false
|
||||
hiddenFromFeed: false
|
||||
collections:
|
||||
- draft
|
||||
tags:
|
||||
- draft
|
||||
summary:
|
||||
featuredImagePreview:
|
||||
featuredImage:
|
||||
featured_image:
|
||||
featured_image_preview:
|
||||
password:
|
||||
message:
|
||||
repost:
|
||||
enable: false
|
||||
url:
|
||||
|
||||
# See details front matter: https://fixit.lruihao.cn/documentation/content-management/introduction/#front-matter
|
||||
# See: https://fixit.lruihao.cn/docs/content-management/front-matter/
|
||||
---
|
||||
|
||||
<!--more-->
|
||||
|
||||
@@ -1,82 +0,0 @@
|
||||
@import "../../lib/normalize/normalize";
|
||||
|
||||
html {
|
||||
font-family: fixit-var(global-font-family);
|
||||
font-weight: fixit-var(global-font-weight);
|
||||
font-display: swap;
|
||||
font-size: fixit-var(global-font-size);
|
||||
line-height: fixit-var(global-line-height);
|
||||
width: 100%;
|
||||
scroll-behavior: smooth;
|
||||
overflow: auto;
|
||||
|
||||
@include media('reduce-motion') {
|
||||
scroll-behavior: auto;
|
||||
}
|
||||
}
|
||||
|
||||
::selection {
|
||||
background-color: fixit-var(selection-color);
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: fixit-var(global-background-color);
|
||||
color: fixit-var(global-font-color);
|
||||
@include overflow-wrap(break-word);
|
||||
}
|
||||
|
||||
iframe {
|
||||
border: 0;
|
||||
@include border-radius;
|
||||
}
|
||||
|
||||
[role='button'] {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
summary {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
abbr[title] {
|
||||
cursor: help;
|
||||
text-decoration-skip-ink: none;
|
||||
}
|
||||
|
||||
img {
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
img,
|
||||
video {
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
@include border-radius;
|
||||
}
|
||||
|
||||
dialog {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
details {
|
||||
&.center {
|
||||
summary {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
%code {
|
||||
padding: 0.2em 0.4em;
|
||||
margin: 0;
|
||||
font-size: fixit-var(code-font-size);
|
||||
line-height: fixit-var(code-font-size);
|
||||
font-family: fixit-var(code-font-family);
|
||||
color: fixit-var(code-color);
|
||||
background-color: fixit-var(code-inline-background-color);
|
||||
text-decoration: inherit;
|
||||
@include border-radius;
|
||||
@include overflow-wrap(break-word);
|
||||
}
|
||||
|
||||
@include link(true, true);
|
||||
@@ -1,99 +0,0 @@
|
||||
// ==============================
|
||||
// Common Styles
|
||||
// 常用样式
|
||||
// ==============================
|
||||
|
||||
.text-truncate {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.text-start {
|
||||
text-align: left !important;
|
||||
}
|
||||
.text-end {
|
||||
text-align: right !important;
|
||||
}
|
||||
.text-center {
|
||||
text-align: center !important;
|
||||
}
|
||||
|
||||
.d-none {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.ms-1,
|
||||
.mx-1 {
|
||||
margin-left: 0.25em !important;
|
||||
}
|
||||
.me-1,
|
||||
.mx-1 {
|
||||
margin-right: 0.25em !important;
|
||||
}
|
||||
.ps-1,
|
||||
.px-1 {
|
||||
padding-left: 0.25em !important;
|
||||
}
|
||||
.pe-1,
|
||||
.px-1 {
|
||||
padding-right: 0.25em !important;
|
||||
}
|
||||
|
||||
@each $color, $value in $theme-colors {
|
||||
.text-#{$color} {
|
||||
color: fixit-var(#{$color}) !important;
|
||||
}
|
||||
}
|
||||
|
||||
@each $key, $value in $orders {
|
||||
.order-#{$key} {
|
||||
order: #{$value} !important;
|
||||
}
|
||||
}
|
||||
|
||||
.variant-numeric {
|
||||
font-variant-numeric: tabular-nums lining-nums;
|
||||
}
|
||||
|
||||
.rounded-full {
|
||||
@include border-radius(full);
|
||||
}
|
||||
|
||||
// auto adapt to dark mode by inverting the color and hue
|
||||
.auto-dark-mode {
|
||||
[data-theme=dark] & {
|
||||
filter: invert(1) hue-rotate(0.5turn);
|
||||
}
|
||||
}
|
||||
|
||||
// print view helper
|
||||
.page-break-before {
|
||||
break-before: page;
|
||||
}
|
||||
|
||||
.page-break-after {
|
||||
break-after: page;
|
||||
}
|
||||
|
||||
@include media('xs', 'up') {
|
||||
.d-none-desktop {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@include media('xs') {
|
||||
.d-none-mobile {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
@include media('print') {
|
||||
@page {
|
||||
size: A4 portrait;
|
||||
margin: 1.27cm;
|
||||
}
|
||||
|
||||
.d-none-print {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
@@ -1,6 +0,0 @@
|
||||
@import "_mixin";
|
||||
@import "_base";
|
||||
@import "_common";
|
||||
@import "_root";
|
||||
@import "_layout";
|
||||
@import '_widgets';
|
||||
@@ -1,77 +0,0 @@
|
||||
.breadcrumb-container {
|
||||
padding-inline: 1rem;
|
||||
font-size: 0.75rem;
|
||||
background-color: fixit-var(global-background-color);
|
||||
display: flex;
|
||||
gap: 0.5rem;
|
||||
@include z-index(sticky);
|
||||
|
||||
&:has(~ main[data-reverse]) {
|
||||
flex-direction: row-reverse;
|
||||
}
|
||||
|
||||
&::before,
|
||||
&::after {
|
||||
content: '';
|
||||
flex: 1;
|
||||
padding-inline: 0.5rem;
|
||||
|
||||
@include media('sm', 'down') {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
&.sticky {
|
||||
position: sticky;
|
||||
top: fixit-var(header-height);
|
||||
|
||||
@include media('sm', 'up') {
|
||||
body:not([data-header-desktop='sticky']) & {
|
||||
top: 0;
|
||||
}
|
||||
// adjust the scroll margin top of the content anchors on the page
|
||||
body:not([data-header-desktop='auto']) &+.fi-container .content [id] {
|
||||
scroll-margin-top: calc(#{fixit-var(scroll-mt)} + #{fixit-var(breadcrumb-height)});
|
||||
}
|
||||
}
|
||||
|
||||
@include media('xs') {
|
||||
body:not([data-header-mobile='sticky']) & {
|
||||
top: 0;
|
||||
}
|
||||
// adjust the scroll margin top of the content anchors on the page
|
||||
body:not([data-header-mobile='auto']) &+.fi-container .content [id] {
|
||||
scroll-margin-top: calc(#{fixit-var(scroll-mt)} + #{fixit-var(breadcrumb-height)});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.breadcrumb {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
padding: 0.5rem 0;
|
||||
margin: 0 auto;
|
||||
list-style: none;
|
||||
border-bottom: 1px inset fixit-var(global-border-color);
|
||||
@extend %page-style;
|
||||
|
||||
.breadcrumb-item {
|
||||
display: flex;
|
||||
|
||||
+ .breadcrumb-item::before {
|
||||
content: attr(data-separator);
|
||||
display: inline-block;
|
||||
padding-inline: 0.5rem;
|
||||
color: fixit-var(global-placeholder-color);
|
||||
}
|
||||
|
||||
&.active {
|
||||
color: fixit-var(secondary);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@include media('print') {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
@@ -1,613 +0,0 @@
|
||||
header {
|
||||
width: 100%;
|
||||
background-color: fixit-var(header-background-color);
|
||||
transition: box-shadow 0.3s ease;
|
||||
@include z-index(fixed);
|
||||
|
||||
&:hover {
|
||||
box-shadow: 0 0 1.5rem 0 rgba(0, 0, 0, 0.1);
|
||||
|
||||
[data-theme=dark] & {
|
||||
box-shadow: 0 0 1.5rem 0 rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
}
|
||||
|
||||
@include media('print') {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.header-wrapper {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.header-title {
|
||||
font-size: fixit-var(header-title-font-size);
|
||||
font-family: fixit-var(header-title-font-family);
|
||||
font-weight: bold;
|
||||
margin-right: 0.5rem;
|
||||
min-width: 10%;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
flex: 10;
|
||||
|
||||
.logo {
|
||||
min-height: 1.5em;
|
||||
height: 1.5em;
|
||||
width: auto;
|
||||
vertical-align: top;
|
||||
transform: translateY(calc(#{fixit-var(header-height)} / 2 - 50%));
|
||||
}
|
||||
|
||||
.header-title-text {
|
||||
margin-left: 0.25rem;
|
||||
margin-right: 0.25rem;
|
||||
}
|
||||
|
||||
.header-subtitle {
|
||||
margin-left: 0.25rem;
|
||||
font-size: 0.6em;
|
||||
}
|
||||
}
|
||||
|
||||
.menu {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
.menu-item-divider {
|
||||
list-style: none;
|
||||
margin: 0.25rem 0.5rem;
|
||||
height: 1px;
|
||||
background-color: fixit-var(menu-border-color);
|
||||
}
|
||||
|
||||
.menu-item {
|
||||
list-style: none;
|
||||
|
||||
.dropdown-icon {
|
||||
margin-left: 0.25rem;
|
||||
font-size: .875em;
|
||||
color: fixit-var(global-font-color);
|
||||
|
||||
&.open::before {
|
||||
content: "\f078";
|
||||
}
|
||||
}
|
||||
|
||||
&.active {
|
||||
>.menu-link,
|
||||
>.nested-item>.menu-link {
|
||||
font-weight: bold;
|
||||
color: fixit-var(menu-active-color);
|
||||
}
|
||||
}
|
||||
|
||||
.menu-link[href="javascript:void(0);"] {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.menu-link i {
|
||||
transform: perspective(1rem);
|
||||
transition: transform 0.4s ease;
|
||||
}
|
||||
|
||||
.menu-link:hover i {
|
||||
transform: perspective(1rem) translateZ(0.2rem);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.menu .search {
|
||||
position: relative;
|
||||
|
||||
input {
|
||||
color: transparent;
|
||||
box-sizing: border-box;
|
||||
height: 2.5rem;
|
||||
width: 1.25rem;
|
||||
border: none;
|
||||
outline: none;
|
||||
background-color: transparent;
|
||||
vertical-align: baseline !important;
|
||||
transition: width 0.3s ease;
|
||||
@include border-radius(0.5rem);
|
||||
}
|
||||
|
||||
@include placeholder(transparent);
|
||||
|
||||
.search-button {
|
||||
margin: 0;
|
||||
position: absolute;
|
||||
left: auto;
|
||||
right: 1rem;
|
||||
}
|
||||
|
||||
.search-toggle {
|
||||
left: 0.5rem;
|
||||
right: auto;
|
||||
|
||||
#header-desktop.open & {
|
||||
left: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
.search-loading {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.search-clear {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.open &,
|
||||
&.mobile {
|
||||
input {
|
||||
color: fixit-var(global-font-color);
|
||||
background-color: fixit-var(search-background-color);
|
||||
padding: 0 2rem 0 2rem;
|
||||
}
|
||||
|
||||
@include placeholder;
|
||||
|
||||
.search-button {
|
||||
color: fixit-var(global-placeholder-color);
|
||||
}
|
||||
|
||||
.search-clear:hover {
|
||||
color: #ff6b6b;
|
||||
}
|
||||
|
||||
.search-toggle:hover {
|
||||
cursor: default;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.theme-switch {
|
||||
i {
|
||||
transform: rotate(225deg);
|
||||
transition: all 0.4s ease;
|
||||
}
|
||||
}
|
||||
|
||||
#header-desktop {
|
||||
display: block;
|
||||
position: sticky;
|
||||
top: 0;
|
||||
height: fixit-var(header-height);
|
||||
line-height: fixit-var(header-height);
|
||||
box-sizing: border-box;
|
||||
|
||||
[data-header-desktop='normal'] & {
|
||||
position: static;
|
||||
}
|
||||
|
||||
nav {
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.header-wrapper {
|
||||
// use css native function to calculate max value
|
||||
padding: 0 2rem 0 MAX(10vh, fixit-var(header-height));
|
||||
height: 100%;
|
||||
|
||||
&[data-github-corner='right'] {
|
||||
padding-right: fixit-var(header-height);
|
||||
}
|
||||
|
||||
.header-title {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.menu {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
float: right;
|
||||
|
||||
> .menu-item {
|
||||
&:hover .sub-menu {
|
||||
display: block;
|
||||
transform: translateX(-0.5rem);
|
||||
}
|
||||
&.theme-switch {
|
||||
&:hover i {
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
}
|
||||
&.language-switch:hover .sub-menu {
|
||||
transform: translateX(calc(1.75rem - 100%));
|
||||
}
|
||||
}
|
||||
|
||||
.menu-item {
|
||||
padding: 0 0.5rem;
|
||||
|
||||
&.delimiter {
|
||||
width: 0;
|
||||
margin: 0.125rem 0.25rem;
|
||||
padding: 0;
|
||||
border-left: 1px dashed fixit-var(global-border-color-weight);
|
||||
}
|
||||
}
|
||||
|
||||
.sub-menu {
|
||||
position: absolute;
|
||||
margin: 0;
|
||||
padding: 0.25rem 0;
|
||||
display: none;
|
||||
top: calc(#{fixit-var(header-height)} - 0.75rem);
|
||||
border: 1px solid fixit-var(menu-border-color);
|
||||
background-color: fixit-var(header-background-color);
|
||||
max-height: 60vh;
|
||||
overflow-y: auto;
|
||||
@include border-radius;
|
||||
transition: box-shadow 0.3s ease;
|
||||
box-shadow: 0 0 1.5rem 0 rgba(0, 0, 0, 0.1);
|
||||
|
||||
[data-theme=dark] & {
|
||||
box-shadow: 0 0 1.5rem 0 rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
.menu-item {
|
||||
height: fixit-var(submenu-height);
|
||||
line-height: fixit-var(submenu-height);
|
||||
max-width: 15rem;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@include media('md', 'down') {
|
||||
padding-inline-end: 1rem;
|
||||
}
|
||||
|
||||
@include media('sm', 'down') {
|
||||
padding-inline-start: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
&.open .header-wrapper .menu .menu-item.search {
|
||||
input {
|
||||
width: 24rem;
|
||||
}
|
||||
}
|
||||
|
||||
@include media('xs') {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
#header-mobile {
|
||||
display: none;
|
||||
position: sticky;
|
||||
top: 0;
|
||||
min-height: fixit-var(header-height);
|
||||
line-height: fixit-var(header-height);
|
||||
|
||||
[data-header-mobile='normal'] & {
|
||||
position: static;
|
||||
}
|
||||
|
||||
.header-container {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
|
||||
.header-wrapper {
|
||||
padding: 0 1rem;
|
||||
font-size: 1.125rem;
|
||||
transition: margin-top 0.3s ease;
|
||||
|
||||
.header-title {
|
||||
max-width: 80%;
|
||||
}
|
||||
|
||||
.theme-switch {
|
||||
line-height: 1.25em;
|
||||
}
|
||||
|
||||
.menu-toggle {
|
||||
span {
|
||||
display: block;
|
||||
background-color: fixit-var(global-font-color);
|
||||
width: 20px;
|
||||
height: 2px;
|
||||
@include border-radius(full);
|
||||
transition: all 0.3s ease-in-out;
|
||||
}
|
||||
|
||||
span:not(:last-child) {
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
|
||||
&.active {
|
||||
span:nth-child(1) {
|
||||
transform: translateY(8px) rotate(45deg);
|
||||
}
|
||||
|
||||
span:nth-child(2) {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
span:nth-child(3) {
|
||||
transform: translateY(-8px) rotate(-45deg);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.menu {
|
||||
background-color: fixit-var(header-background-color);
|
||||
border-top: 2px solid fixit-var(global-border-color-light);
|
||||
display: none;
|
||||
overflow-y: auto;
|
||||
max-height: 70vh;
|
||||
box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.1);
|
||||
@include scrollbar-width(none, 0);
|
||||
|
||||
[data-theme=dark] & {
|
||||
box-shadow: 0 0.125rem 0.25rem rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
.search-wrapper {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
box-sizing: border-box;
|
||||
padding: 0.5rem 1rem;
|
||||
line-height: 2.5rem;
|
||||
position: sticky;
|
||||
top: 0;
|
||||
background-color: fixit-var(header-background-color);
|
||||
@include z-index(sticky);
|
||||
}
|
||||
|
||||
.search {
|
||||
flex-grow: 10;
|
||||
|
||||
.algolia-autocomplete,
|
||||
input {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.search-loading,
|
||||
.search-clear {
|
||||
right: 0.5rem;
|
||||
}
|
||||
|
||||
.search-button {
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.search-cancel {
|
||||
display: none;
|
||||
margin-left: 0.75rem;
|
||||
}
|
||||
|
||||
.menu-item {
|
||||
display: block;
|
||||
position: relative;
|
||||
line-height: 2.5rem;
|
||||
padding: 0 1rem;
|
||||
|
||||
&:not(.menu-system):hover {
|
||||
background-color: #f2f2f3;
|
||||
|
||||
[data-theme=dark] & {
|
||||
background-color: #535355;
|
||||
}
|
||||
}
|
||||
|
||||
.menu-link {
|
||||
display: block;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
overflow-x: hidden;
|
||||
flex: 4;
|
||||
}
|
||||
|
||||
& .nested-item {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
.menu-link {
|
||||
max-width: 80%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.menu-system {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
gap: 0.25rem;
|
||||
position: sticky;
|
||||
bottom: 0;
|
||||
line-height: 2.5rem;
|
||||
padding: 0 1rem;
|
||||
background-color: fixit-var(header-background-color);
|
||||
|
||||
.menu-system-item {
|
||||
padding-inline: 0.5rem;
|
||||
}
|
||||
|
||||
.language-switch {
|
||||
position: relative;
|
||||
|
||||
.language-select {
|
||||
position: absolute;
|
||||
opacity: 0;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.sub-menu {
|
||||
padding-left: 0;
|
||||
display: none;
|
||||
|
||||
&.open {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.menu-item:hover {
|
||||
background-color: #e7e7ea;
|
||||
|
||||
[data-theme=dark] & {
|
||||
background-color: #5d5d5f;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.active {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.open {
|
||||
.header-wrapper {
|
||||
margin-top: calc(#{fixit-var(header-height)} * -1);
|
||||
}
|
||||
|
||||
.menu {
|
||||
padding-top: 0;
|
||||
border-top: none;
|
||||
|
||||
.menu-item {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.search-cancel {
|
||||
display: inline;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@include media('xs') {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
.search-dropdown {
|
||||
position: fixed;
|
||||
top: fixit-var(header-height);
|
||||
box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.1);
|
||||
@include z-index(fixed);
|
||||
|
||||
[data-theme=dark] & {
|
||||
box-shadow: 0 0.125rem 0.25rem rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
&.desktop {
|
||||
right: 2rem;
|
||||
width: 30rem;
|
||||
|
||||
@include media('md', 'down') {
|
||||
right: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
&.mobile {
|
||||
right: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
right: 0 !important;
|
||||
background-color: fixit-var(global-background-color);
|
||||
|
||||
.suggestions {
|
||||
overflow-y: auto;
|
||||
// 41px is the height of the search-footer
|
||||
max-height: calc(100dvh - #{fixit-var(header-height)} - 41px);
|
||||
|
||||
.suggestion {
|
||||
padding: 0.75rem 1rem;
|
||||
|
||||
.suggestion-title {
|
||||
display: inline-block;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
font-size: 1rem;
|
||||
font-weight: bold;
|
||||
max-width: 75%;
|
||||
}
|
||||
|
||||
.suggestion-date {
|
||||
font-size: 0.875rem;
|
||||
float: right;
|
||||
text-align: right;
|
||||
color: fixit-var(secondary);
|
||||
}
|
||||
|
||||
.suggestion-context {
|
||||
display: -webkit-box;
|
||||
line-height: 1.25rem;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 2;
|
||||
line-clamp: 2;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
color: fixit-var(global-placeholder-color);
|
||||
@include overflow-wrap(break-word);
|
||||
}
|
||||
|
||||
em {
|
||||
font-style: normal;
|
||||
background-color: fixit-var(selection-color);
|
||||
}
|
||||
|
||||
&.cursor {
|
||||
background: darken($code-background-color, 5%);
|
||||
|
||||
[data-theme=dark] & {
|
||||
background: lighten($code-background-color-dark, 5%);
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.search-empty {
|
||||
padding: 1rem;
|
||||
text-align: center;
|
||||
|
||||
.search-query {
|
||||
font-weight: bold;
|
||||
|
||||
[data-theme=dark] & {
|
||||
color: #ddd;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.search-footer {
|
||||
padding: 0.5rem 1rem;
|
||||
float: right;
|
||||
font-size: 0.8rem;
|
||||
color: fixit-var(secondary);
|
||||
@include link(false, false);
|
||||
|
||||
a {
|
||||
font-size: 1rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,47 +0,0 @@
|
||||
%page-style {
|
||||
@include media('xl') {
|
||||
width: ROUND(60%, 2px);
|
||||
max-width: 1200px;
|
||||
}
|
||||
|
||||
@include media('lg') {
|
||||
width: ROUND(56%, 2px);
|
||||
}
|
||||
|
||||
@include media('md') {
|
||||
width: ROUND(52%, 2px);
|
||||
}
|
||||
|
||||
@include media('sm') {
|
||||
width: ROUND(80%, 2px);
|
||||
}
|
||||
|
||||
@include media('xs') {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
[data-page-style='wide'] {
|
||||
%page-style {
|
||||
@include media('xl') {
|
||||
width: ROUND(64%, 2px);
|
||||
max-width: 1600px;
|
||||
}
|
||||
|
||||
@include media('lg') {
|
||||
width: ROUND(60%, 2px);
|
||||
}
|
||||
|
||||
@include media('md') {
|
||||
width: ROUND(56%, 2px);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
[data-page-style='narrow'] {
|
||||
%page-style {
|
||||
@include media('xl') {
|
||||
max-width: 800px;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,6 +0,0 @@
|
||||
@mixin blur {
|
||||
// TODO refactor blur with backdrop-filter
|
||||
.blur & {
|
||||
filter: blur(1.5px);
|
||||
}
|
||||
}
|
||||
@@ -1,33 +0,0 @@
|
||||
@mixin placeholder($color: fixit-var(global-placeholder-color)) {
|
||||
input::-webkit-input-placeholder {
|
||||
color: $color;
|
||||
}
|
||||
|
||||
input:-moz-placeholder {
|
||||
color: $color;
|
||||
}
|
||||
|
||||
input::-moz-placeholder {
|
||||
color: $color;
|
||||
}
|
||||
|
||||
input:-ms-input-placeholder {
|
||||
color: $color;
|
||||
}
|
||||
|
||||
input::placeholder {
|
||||
color: $color;
|
||||
}
|
||||
}
|
||||
|
||||
// TODO Superseded by text-wrap: wrap; in modern browsers
|
||||
@mixin overflow-wrap($value) {
|
||||
word-wrap: $value;
|
||||
overflow-wrap: $value;
|
||||
}
|
||||
|
||||
@mixin user-select($value) {
|
||||
-webkit-user-select: $value !important;
|
||||
-moz-user-select: $value !important;
|
||||
user-select: $value !important;
|
||||
}
|
||||
@@ -1,10 +0,0 @@
|
||||
@import 'blur';
|
||||
@import 'border-radius';
|
||||
@import 'box-shadow';
|
||||
@import 'compatibility';
|
||||
@import 'link';
|
||||
@import 'loading';
|
||||
@import 'media';
|
||||
@import 'scrollbar-width';
|
||||
@import 'theme-vars';
|
||||
@import 'z-index';
|
||||
@@ -1,50 +0,0 @@
|
||||
/// Link mixin
|
||||
/// @param {Boolean} $light use global link color
|
||||
/// @param {Boolean} $dark use global link color dark
|
||||
/// @param {String} $decoration text-decoration, default none
|
||||
@mixin link($light, $dark, $decoration: none) {
|
||||
a,
|
||||
a::before,
|
||||
a::after {
|
||||
text-decoration: $decoration;
|
||||
|
||||
@if $light {
|
||||
color: $global-link-color;
|
||||
}
|
||||
|
||||
@else {
|
||||
color: $single-link-color;
|
||||
}
|
||||
|
||||
[data-theme=dark] & {
|
||||
@if $dark {
|
||||
color: $global-link-color-dark;
|
||||
}
|
||||
|
||||
@else {
|
||||
color: $single-link-color-dark;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
a:active,
|
||||
a:hover {
|
||||
@if $light {
|
||||
color: $global-link-hover-color;
|
||||
}
|
||||
|
||||
@else {
|
||||
color: $single-link-hover-color;
|
||||
}
|
||||
|
||||
[data-theme=dark] & {
|
||||
@if $dark {
|
||||
color: $global-link-hover-color-dark;
|
||||
}
|
||||
|
||||
@else {
|
||||
color: $single-link-hover-color-dark;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,100 +0,0 @@
|
||||
// Responsive breakpoints matching the project's media query design
|
||||
// ┌──────────────────────────────────────────────────────┐
|
||||
// │ xs │ sm │ md │ lg │ xl │
|
||||
// │ ≤680 │ 681–960 │ 961–1200 │ 1201–1440 │ ≥1441 │
|
||||
// └──────────────────────────────────────────────────────┘
|
||||
$breakpoints: (
|
||||
'xs': (
|
||||
'min': null,
|
||||
'max': 680px,
|
||||
),
|
||||
'sm': (
|
||||
'min': 681px,
|
||||
'max': 960px,
|
||||
),
|
||||
'md': (
|
||||
'min': 961px,
|
||||
'max': 1200px,
|
||||
),
|
||||
'lg': (
|
||||
'min': 1201px,
|
||||
'max': 1440px,
|
||||
),
|
||||
'xl': (
|
||||
'min': 1441px,
|
||||
'max': null,
|
||||
),
|
||||
) !default;
|
||||
|
||||
/// Apply styles within a named media target.
|
||||
/// @param {String} $target - Target name: xs | sm | md | lg | xl | print | reduce-motion
|
||||
/// @param {String} $direction - Range direction: only | up | down [default: only]
|
||||
///
|
||||
/// @example
|
||||
/// // xs: ≤ 680px
|
||||
/// @include media('xs') { ... }
|
||||
/// // sm: 681px – 960px
|
||||
/// @include media('sm') { ... }
|
||||
/// // md and above: ≥ 961px
|
||||
/// @include media('md', 'up') { ... }
|
||||
/// // lg and below: ≤ 1440px
|
||||
/// @include media('lg', 'down') { ... }
|
||||
/// // print media
|
||||
/// @include media('print') { ... }
|
||||
/// // reduced motion
|
||||
/// @include media('reduce-motion') { ... }
|
||||
@mixin media($target, $direction: 'only') {
|
||||
@if $target == 'print' {
|
||||
@media only print {
|
||||
@content;
|
||||
}
|
||||
} @else if $target == 'reduce-motion' {
|
||||
@media screen and (prefers-reduced-motion: reduce) {
|
||||
@content;
|
||||
}
|
||||
} @else {
|
||||
$range: map-get($breakpoints, $target);
|
||||
$min: if($range != null, map-get($range, 'min'), null);
|
||||
$max: if($range != null, map-get($range, 'max'), null);
|
||||
|
||||
@if $range == null {
|
||||
@warn "Unknown media target `#{$target}`. Expected: xs, sm, md, lg, xl, print, reduce-motion.";
|
||||
} @else if $direction == 'only' {
|
||||
@if $min == null {
|
||||
// xs: max-width only, no lower bound
|
||||
@media only screen and (max-width: $max) {
|
||||
@content;
|
||||
}
|
||||
} @else if $max == null {
|
||||
// xl: min-width only, no upper bound
|
||||
@media only screen and (min-width: $min) {
|
||||
@content;
|
||||
}
|
||||
} @else {
|
||||
@media only screen and (min-width: $min) and (max-width: $max) {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
} @else if $direction == 'up' {
|
||||
@if $min == null {
|
||||
// xs-up: no lower bound, always applies
|
||||
@content;
|
||||
} @else {
|
||||
@media only screen and (min-width: $min) {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
} @else if $direction == 'down' {
|
||||
@if $max == null {
|
||||
// xl-down: no upper bound, always applies
|
||||
@content;
|
||||
} @else {
|
||||
@media only screen and (max-width: $max) {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
} @else {
|
||||
@warn "Unknown direction `#{$direction}`. Expected: only, up, down.";
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,6 +0,0 @@
|
||||
@mixin scrollbar-width($width: thin, $widthLegacy: 12px) {
|
||||
@include set-fixit-vars((
|
||||
scrollbar-width: $width,
|
||||
scrollbar-width-legacy: $widthLegacy,
|
||||
));
|
||||
}
|
||||
@@ -1,80 +0,0 @@
|
||||
// ========================================
|
||||
// Theme Variable Mixins and Functions
|
||||
// ========================================
|
||||
|
||||
/// Get CSS variable with prefix
|
||||
/// @param {String} $name - CSS variable name (without prefix)
|
||||
/// @param {*} $fallback - Optional fallback value
|
||||
/// @return {String} - Complete CSS variable reference
|
||||
/// @example
|
||||
/// color: fixit-var(global-font-color);
|
||||
/// background: fixit-var(custom-bg, #fff);
|
||||
@function fixit-var($name, $fallback: null) {
|
||||
@if $fallback {
|
||||
@return var(#{$rootPrefix}#{$name}, #{$fallback});
|
||||
} @else {
|
||||
@return var(#{$rootPrefix}#{$name});
|
||||
}
|
||||
}
|
||||
|
||||
/// Set a single CSS variable
|
||||
/// @param {String} $name - CSS variable name (without prefix)
|
||||
/// @param {*} $value - Variable value
|
||||
/// @example
|
||||
/// @include set-fixit-var(custom-color, #ff0000);
|
||||
@mixin set-fixit-var($name, $value) {
|
||||
#{$rootPrefix}#{$name}: #{$value};
|
||||
}
|
||||
|
||||
/// Batch set CSS variables
|
||||
/// @param {Map} $vars - Variable map, key is CSS variable name (without prefix), value is variable value
|
||||
/// @example
|
||||
/// @include set-fixit-vars((
|
||||
/// custom-color: #ff0000,
|
||||
/// custom-bg: #00ff00,
|
||||
/// ));
|
||||
@mixin set-fixit-vars($vars) {
|
||||
@each $name, $value in $vars {
|
||||
#{$rootPrefix}#{$name}: #{$value};
|
||||
}
|
||||
}
|
||||
|
||||
/// Batch set theme color variables using global $theme-colors
|
||||
/// Generates light theme (in :root) and dark theme ([data-theme=dark]) variables
|
||||
@mixin set-theme-colors() {
|
||||
// Light theme (in :root)
|
||||
@at-root :root {
|
||||
@each $name, $value in $theme-colors {
|
||||
#{$rootPrefix}#{$name}: #{$value};
|
||||
}
|
||||
}
|
||||
|
||||
// Dark theme
|
||||
@at-root [data-theme=dark] {
|
||||
@each $name, $value in $theme-colors {
|
||||
#{$rootPrefix}#{$name}: #{darken($value, 5%)};
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/// Define dual-theme variables (generate definitions for both light and dark simultaneously)
|
||||
/// @param {Map} $vars - Variable map, key is CSS variable name, value is Map(light: $light-val, dark: $dark-val)
|
||||
/// @example
|
||||
/// @include define-theme-vars((
|
||||
/// global-background-color: (light: $global-background-color, dark: $global-background-color-dark)
|
||||
/// ));
|
||||
@mixin define-theme-vars($vars) {
|
||||
// Light theme (in :root)
|
||||
@at-root :root {
|
||||
@each $name, $values in $vars {
|
||||
#{$rootPrefix}#{$name}: #{map-get($values, light)};
|
||||
}
|
||||
}
|
||||
|
||||
// Dark theme
|
||||
@at-root [data-theme=dark] {
|
||||
@each $name, $values in $vars {
|
||||
#{$rootPrefix}#{$name}: #{map-get($values, dark)};
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,11 +0,0 @@
|
||||
body {
|
||||
.cell-tooltip {
|
||||
--tooltip-bg: #ffffff;
|
||||
--tooltip-color: #0f172a;
|
||||
|
||||
[data-theme=dark] & {
|
||||
--tooltip-bg: #39393c;
|
||||
--tooltip-color: #e2e2e6;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,15 +0,0 @@
|
||||
.cc-window.cc-banner {
|
||||
.cc-btn {
|
||||
color: fixit-var(global-font-color);
|
||||
background-color: fixit-var(global-background-color);
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
background-color: #ccc;
|
||||
|
||||
[data-theme=dark] & {
|
||||
background-color: #444;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,48 +0,0 @@
|
||||
@keyframes octocat-wave {
|
||||
0%,
|
||||
100% {
|
||||
transform: rotate(0);
|
||||
}
|
||||
20%,
|
||||
60% {
|
||||
transform: rotate(-25deg);
|
||||
}
|
||||
40%,
|
||||
80% {
|
||||
transform: rotate(10deg);
|
||||
}
|
||||
}
|
||||
|
||||
.github-corner {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
@include z-index(fixed);
|
||||
|
||||
:hover .octo-arm {
|
||||
animation: octocat-wave 560ms ease-in-out;
|
||||
}
|
||||
|
||||
svg {
|
||||
width: fixit-var(header-height);
|
||||
height: fixit-var(header-height);
|
||||
border: 0;
|
||||
color: fixit-var(github-corner-color);
|
||||
fill: fixit-var(github-corner-fill);
|
||||
}
|
||||
|
||||
&.left {
|
||||
left: 0;
|
||||
|
||||
svg {
|
||||
transform: scale(-1, 1);
|
||||
}
|
||||
}
|
||||
|
||||
&.right {
|
||||
right: 0;
|
||||
}
|
||||
|
||||
@include media('print') {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
@@ -1,12 +0,0 @@
|
||||
@import 'cell-tooltip';
|
||||
@import 'cookieconsent';
|
||||
@import 'details';
|
||||
@import 'fixed-button';
|
||||
@import 'github-corner';
|
||||
@import 'icon';
|
||||
@import 'mask';
|
||||
@import 'noscript-warning';
|
||||
@import 'post-chat';
|
||||
@import 'reading-progress';
|
||||
@import 'scrollbar';
|
||||
@import 'typeit';
|
||||
@@ -1,12 +0,0 @@
|
||||
.noscript-warning {
|
||||
background-color: fixit-var(danger);
|
||||
color: white;
|
||||
font-size: 1rem;
|
||||
font-weight: bold;
|
||||
position: fixed;
|
||||
text-align: center;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
@include z-index(fixed);
|
||||
}
|
||||
@@ -1,15 +0,0 @@
|
||||
.reading-progress-bar {
|
||||
height: fixit-var(progress-h, 2px);
|
||||
width: fixit-var(progress, 0);
|
||||
background-color: fixit-var(bg-progress, fixit-var(success));
|
||||
position: fixed;
|
||||
@include z-index(fixed);
|
||||
|
||||
[data-theme=dark] & {
|
||||
background-color: fixit-var(bg-progress-dark, fixit-var(global-font-color));
|
||||
}
|
||||
|
||||
@include media('print') {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
@@ -1,14 +0,0 @@
|
||||
.typeit {
|
||||
.highlight {
|
||||
padding: 0.375rem;
|
||||
font-size: 0.875rem;
|
||||
font-family: fixit-var(code-font-family);
|
||||
font-weight: bold;
|
||||
word-break: break-all;
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
|
||||
--ti-cursor-color: fixit-var(global-font-color);
|
||||
--ti-cursor-font-family: fixit-var(global-font-family);
|
||||
--ti-cursor-transform: translateX(0);
|
||||
}
|
||||
@@ -1,4 +0,0 @@
|
||||
// ==============================
|
||||
// Custom style
|
||||
// 自定义样式
|
||||
// ==============================
|
||||
@@ -1,5 +0,0 @@
|
||||
@import 'admonition';
|
||||
@import 'alert';
|
||||
@import 'code-type';
|
||||
@import 'colors';
|
||||
@import 'utilities';
|
||||
@@ -1,13 +0,0 @@
|
||||
// Utilities
|
||||
|
||||
// property order
|
||||
$orders: (
|
||||
first: -1,
|
||||
0: 0,
|
||||
1: 1,
|
||||
2: 2,
|
||||
3: 3,
|
||||
4: 4,
|
||||
5: 5,
|
||||
last: 6,
|
||||
) !default;
|
||||
@@ -1,4 +0,0 @@
|
||||
// ==============================
|
||||
// Override Variables
|
||||
// 覆盖变量
|
||||
// ==============================
|
||||
@@ -1,6 +0,0 @@
|
||||
#content-404 {
|
||||
font-size: 1.8rem;
|
||||
line-height: 3rem;
|
||||
text-align: center;
|
||||
transform: translateY(30vh);
|
||||
}
|
||||
@@ -1,37 +0,0 @@
|
||||
.page {
|
||||
position: relative;
|
||||
@extend %page-style;
|
||||
|
||||
.content {
|
||||
[id] {
|
||||
scroll-margin-top: fixit-var(scroll-mt);
|
||||
|
||||
[data-header-desktop='normal'] & {
|
||||
@include media('xs', 'up') {
|
||||
@include set-fixit-var(scroll-mt, fixit-var(global-scroll-margin-top));
|
||||
}
|
||||
}
|
||||
|
||||
[data-header-mobile='normal'] & {
|
||||
@include media('xs') {
|
||||
@include set-fixit-var(scroll-mt, fixit-var(global-scroll-margin-top));
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@include blur;
|
||||
|
||||
@include media('print') {
|
||||
width: 100% !important;
|
||||
padding-top: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
@import '_single';
|
||||
@import '_special';
|
||||
@import '_archive';
|
||||
@import 'home';
|
||||
@import '404';
|
||||
@import 'offline';
|
||||
@import "patch";
|
||||
@@ -1,21 +0,0 @@
|
||||
#content-offline {
|
||||
text-align: center;
|
||||
transform: translateY(30vh);
|
||||
|
||||
.offline-title {
|
||||
font-size: 3.6rem;
|
||||
}
|
||||
|
||||
.offline-subtitle {
|
||||
margin: 0.4rem 0;
|
||||
font-size: 1rem;
|
||||
font-weight: normal;
|
||||
font-style: italic;
|
||||
line-height: 100%;
|
||||
color: #57606a;
|
||||
}
|
||||
|
||||
.error-text {
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
}
|
||||
@@ -1,48 +0,0 @@
|
||||
.alert {
|
||||
padding: 0.5rem 1rem;
|
||||
margin-block: 1rem;
|
||||
color: inherit;
|
||||
border-left: 0.25em solid fixit-var(alert-border-color);
|
||||
|
||||
> :first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
> :last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.alert-title {
|
||||
display: flex;
|
||||
font-weight: 500;
|
||||
align-items: center;
|
||||
line-height: 1;
|
||||
margin-bottom: 1rem;
|
||||
color: fixit-var(alert-color);
|
||||
|
||||
> svg.icon {
|
||||
width: initial;
|
||||
height: initial;
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
@each $type, $item in $alert-color-map {
|
||||
&.alert-#{$type} {
|
||||
@include set-fixit-vars((
|
||||
alert-border-color: map-get($item, border-color),
|
||||
alert-color: map-get($item, color)
|
||||
));
|
||||
}
|
||||
}
|
||||
|
||||
[data-theme=dark] & {
|
||||
@each $type, $item in $alert-color-map-dark {
|
||||
&.alert-#{$type} {
|
||||
@include set-fixit-vars((
|
||||
alert-border-color: map-get($item, border-color),
|
||||
alert-color: map-get($item, color)
|
||||
));
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,175 +0,0 @@
|
||||
/// GitHub Dark Dimmed
|
||||
/// copyright (c) 2012 - current GitHub, Inc.
|
||||
/// Licensed under MIT (https://github.com/primer/github-syntax-theme-generator/blob/master/LICENSE)
|
||||
/// Maintained by @Lruihao for FixIt theme
|
||||
/// Created on 2022-03-01
|
||||
/// Updated on 2026-02-03
|
||||
& {
|
||||
@include set-fixit-vars((
|
||||
// Blob colors
|
||||
color-blob-num: #778491,
|
||||
color-blob-code-inner: #c5d1de,
|
||||
// Syntax colors
|
||||
color-prettylights-syntax-comment: #768390,
|
||||
color-prettylights-syntax-constant: #6cb6ff,
|
||||
color-prettylights-syntax-constant-other-reference-link: #96d0ff,
|
||||
color-prettylights-syntax-entity: #dcbdfb,
|
||||
color-prettylights-syntax-storage-modifier-import: #adbac7,
|
||||
color-prettylights-syntax-entity-tag: #8ddb8c,
|
||||
color-prettylights-syntax-keyword: #f47067,
|
||||
color-prettylights-syntax-string: #96d0ff,
|
||||
color-prettylights-syntax-variable: #f69d50,
|
||||
color-prettylights-syntax-brackethighlighter-unmatched: #e5534b,
|
||||
color-prettylights-syntax-brackethighlighter-angle: #768390,
|
||||
color-prettylights-syntax-invalid-illegal-text: #cdd9e5,
|
||||
color-prettylights-syntax-invalid-illegal-bg: #922323,
|
||||
color-prettylights-syntax-carriage-return-text: #cdd9e5,
|
||||
color-prettylights-syntax-carriage-return-bg: #ad2e2c,
|
||||
color-prettylights-syntax-string-regexp: #8ddb8c,
|
||||
color-prettylights-syntax-markup-list: #eac55f,
|
||||
color-prettylights-syntax-markup-heading: #316dca,
|
||||
color-prettylights-syntax-markup-italic: #adbac7,
|
||||
color-prettylights-syntax-markup-bold: #adbac7,
|
||||
color-prettylights-syntax-markup-deleted-text: #ffd8d3,
|
||||
color-prettylights-syntax-markup-deleted-bg: #78191b,
|
||||
color-prettylights-syntax-markup-inserted-text: #b4f1b4,
|
||||
color-prettylights-syntax-markup-inserted-bg: #1b4721,
|
||||
color-prettylights-syntax-markup-changed-text: #ffddb0,
|
||||
color-prettylights-syntax-markup-changed-bg: #682d0f,
|
||||
color-prettylights-syntax-markup-ignored-text: #adbac7,
|
||||
color-prettylights-syntax-markup-ignored-bg: #255ab2,
|
||||
color-prettylights-syntax-meta-diff-range: #dcbdfb,
|
||||
color-prettylights-syntax-sublimelinter-gutter-mark: #545d68,
|
||||
));
|
||||
|
||||
.blob-num {
|
||||
color: fixit-var(color-blob-num);
|
||||
}
|
||||
.blob-code-inner {
|
||||
color: fixit-var(color-blob-code-inner);
|
||||
}
|
||||
|
||||
.pl-c /* comment, punctuation.definition.comment, string.comment */ {
|
||||
color: fixit-var(color-prettylights-syntax-comment);
|
||||
}
|
||||
|
||||
.pl-c1 /* constant, entity.name.constant, variable.other.constant, variable.language, support, meta.property-name, support.constant, support.variable, meta.module-reference, markup.raw, meta.diff.header, meta.output */,
|
||||
.pl-s .pl-v /* string variable */ {
|
||||
color: fixit-var(color-prettylights-syntax-constant);
|
||||
}
|
||||
|
||||
.pl-e /* entity */,
|
||||
.pl-en /* entity.name */ {
|
||||
color: fixit-var(color-prettylights-syntax-entity);
|
||||
}
|
||||
|
||||
.pl-smi /* variable.parameter.function, storage.modifier.package, storage.modifier.import, storage.type.java, variable.other */,
|
||||
.pl-s .pl-s1 /* string source */ {
|
||||
color: fixit-var(color-prettylights-syntax-storage-modifier-import);
|
||||
}
|
||||
|
||||
.pl-ent /* entity.name.tag, markup.quote */ {
|
||||
color: fixit-var(color-prettylights-syntax-entity-tag);
|
||||
}
|
||||
|
||||
.pl-k /* keyword, storage, storage.type */ {
|
||||
color: fixit-var(color-prettylights-syntax-keyword);
|
||||
}
|
||||
|
||||
.pl-s /* string */,
|
||||
.pl-pds /* punctuation.definition.string, source.regexp, string.regexp.character-class */,
|
||||
.pl-s .pl-pse .pl-s1 /* string punctuation.section.embedded source */,
|
||||
.pl-sr /* string.regexp */,
|
||||
.pl-sr .pl-cce /* string.regexp constant.character.escape */,
|
||||
.pl-sr .pl-sre /* string.regexp source.ruby.embedded */,
|
||||
.pl-sr .pl-sra /* string.regexp string.regexp.arbitrary-repitition */ {
|
||||
color: fixit-var(color-prettylights-syntax-string);
|
||||
}
|
||||
|
||||
.pl-v /* variable */,
|
||||
.pl-smw /* sublimelinter.mark.warning */ {
|
||||
color: fixit-var(color-prettylights-syntax-variable);
|
||||
}
|
||||
|
||||
.pl-bu /* invalid.broken, invalid.deprecated, invalid.unimplemented, message.error, brackethighlighter.unmatched, sublimelinter.mark.error */ {
|
||||
color: fixit-var(color-prettylights-syntax-brackethighlighter-unmatched);
|
||||
}
|
||||
|
||||
.pl-ii /* invalid.illegal */ {
|
||||
color: fixit-var(color-prettylights-syntax-invalid-illegal-text);
|
||||
background-color: fixit-var(color-prettylights-syntax-invalid-illegal-bg);
|
||||
}
|
||||
|
||||
.pl-c2 /* carriage-return */ {
|
||||
color: fixit-var(color-prettylights-syntax-carriage-return-text);
|
||||
background-color: fixit-var(color-prettylights-syntax-carriage-return-bg);
|
||||
}
|
||||
|
||||
.pl-c2::before /* carriage-return */ {
|
||||
content: '^M';
|
||||
}
|
||||
|
||||
.pl-sr .pl-cce /* string.regexp constant.character.escape */ {
|
||||
font-weight: bold;
|
||||
color: fixit-var(color-prettylights-syntax-string-regexp);
|
||||
}
|
||||
|
||||
.pl-ml /* markup.list */ {
|
||||
color: fixit-var(color-prettylights-syntax-markup-list);
|
||||
}
|
||||
|
||||
.pl-mh /* markup.heading */,
|
||||
.pl-mh .pl-en /* markup.heading entity.name */,
|
||||
.pl-ms /* meta.separator */ {
|
||||
font-weight: bold;
|
||||
color: fixit-var(color-prettylights-syntax-markup-heading);
|
||||
}
|
||||
|
||||
.pl-mi /* markup.italic */ {
|
||||
font-style: italic;
|
||||
color: fixit-var(color-prettylights-syntax-markup-italic);
|
||||
}
|
||||
|
||||
.pl-mb /* markup.bold */ {
|
||||
font-weight: bold;
|
||||
color: fixit-var(color-prettylights-syntax-markup-bold);
|
||||
}
|
||||
|
||||
.pl-md /* markup.deleted, meta.diff.header.from-file, punctuation.definition.deleted */ {
|
||||
color: fixit-var(color-prettylights-syntax-markup-deleted-text);
|
||||
background-color: fixit-var(color-prettylights-syntax-markup-deleted-bg);
|
||||
}
|
||||
|
||||
.pl-mi1 /* markup.inserted, meta.diff.header.to-file, punctuation.definition.inserted */ {
|
||||
color: fixit-var(color-prettylights-syntax-markup-inserted-text);
|
||||
background-color: fixit-var(color-prettylights-syntax-markup-inserted-bg);
|
||||
}
|
||||
|
||||
.pl-mc /* markup.changed, punctuation.definition.changed */ {
|
||||
color: fixit-var(color-prettylights-syntax-markup-changed-text);
|
||||
background-color: fixit-var(color-prettylights-syntax-markup-changed-bg);
|
||||
}
|
||||
|
||||
.pl-mi2 /* markup.ignored, markup.untracked */ {
|
||||
color: fixit-var(color-prettylights-syntax-markup-ignored-text);
|
||||
background-color: fixit-var(color-prettylights-syntax-markup-ignored-bg);
|
||||
}
|
||||
|
||||
.pl-mdr /* meta.diff.range */ {
|
||||
font-weight: bold;
|
||||
color: fixit-var(color-prettylights-syntax-meta-diff-range);
|
||||
}
|
||||
|
||||
.pl-ba /* brackethighlighter.tag, brackethighlighter.curly, brackethighlighter.round, brackethighlighter.square, brackethighlighter.angle, brackethighlighter.quote */ {
|
||||
color: fixit-var(color-prettylights-syntax-brackethighlighter-angle);
|
||||
}
|
||||
|
||||
.pl-sg /* sublimelinter.gutter-mark */ {
|
||||
color: fixit-var(color-prettylights-syntax-sublimelinter-gutter-mark);
|
||||
}
|
||||
|
||||
.pl-corl /* constant.other.reference.link, string.other.link */ {
|
||||
text-decoration: underline;
|
||||
color: fixit-var(color-prettylights-syntax-constant-other-reference-link);
|
||||
}
|
||||
}
|
||||
@@ -1,29 +0,0 @@
|
||||
/**
|
||||
* Code syntax highlighting for Chroma
|
||||
*
|
||||
* To generate syntax highlighting styles from the command line,
|
||||
* See https://gohugo.io/quick-reference/syntax-highlighting-styles/#styles
|
||||
* For example:
|
||||
* hugo gen chromastyles --style=github > assets/css/_partials/_code-syntax/light.scss
|
||||
* hugo gen chromastyles --style=github-dark > assets/css/_partials/_code-syntax/dark.scss
|
||||
*/
|
||||
.highlight {
|
||||
/* LineLink */
|
||||
.lnlinks {
|
||||
outline: none;
|
||||
text-decoration: none;
|
||||
color: inherit;
|
||||
}
|
||||
/* LineHighlight */
|
||||
.hl {
|
||||
display: block;
|
||||
background-color: fixit-var(code-highlight-color);
|
||||
box-shadow: -0.75rem 0 0 fixit-var(code-highlight-color), 0.75rem 0 0 fixit-var(code-highlight-color);
|
||||
}
|
||||
|
||||
@import 'light';
|
||||
|
||||
[data-theme=dark] & {
|
||||
@import 'dark';
|
||||
}
|
||||
}
|
||||
@@ -1,729 +0,0 @@
|
||||
// inline code
|
||||
code {
|
||||
@extend %code;
|
||||
}
|
||||
|
||||
// indented code
|
||||
pre {
|
||||
margin: 0;
|
||||
line-height: 1.45em;
|
||||
padding: 0.5rem 0.75rem;
|
||||
overflow: auto;
|
||||
font-size: fixit-var(code-block-font-size);
|
||||
font-family: fixit-var(code-font-family);
|
||||
background-color: fixit-var(code-block-background-color);
|
||||
tab-size: 4;
|
||||
@include border-radius;
|
||||
|
||||
+ pre {
|
||||
margin-top: 0.5rem;
|
||||
}
|
||||
|
||||
code {
|
||||
padding: 0;
|
||||
background-color: transparent;
|
||||
font-size: inherit;
|
||||
line-height: inherit;
|
||||
min-width: max-content;
|
||||
@include border-radius(0);
|
||||
|
||||
[data-theme=dark] & {
|
||||
background-color: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
img {
|
||||
min-height: 1em;
|
||||
max-height: 1.2em;
|
||||
vertical-align: text-bottom;
|
||||
}
|
||||
}
|
||||
|
||||
.highlight,
|
||||
.gist {
|
||||
font-size: fixit-var(code-block-font-size);
|
||||
font-family: fixit-var(code-font-family);
|
||||
@include set-fixit-var(scrollbar-thumb-color, inherit);
|
||||
|
||||
table {
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
border-spacing: 0;
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
table,
|
||||
table thead,
|
||||
table tr,
|
||||
table td {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
|
||||
// Code fences blocks or highlight shortcodes
|
||||
.highlight {
|
||||
margin: 0.5rem 0;
|
||||
position: relative;
|
||||
@include border-radius;
|
||||
|
||||
// lineNumbersInTable=true
|
||||
> div.chroma {
|
||||
position: relative;
|
||||
background-color: fixit-var(code-block-background-color);
|
||||
@include border-radius;
|
||||
|
||||
&:is(pre):has(.ln) {
|
||||
padding: 0.5rem;
|
||||
}
|
||||
|
||||
.lntable {
|
||||
overflow: auto;
|
||||
display: block;
|
||||
background-color: fixit-var(code-block-background-color);
|
||||
@include border-radius;
|
||||
|
||||
td {
|
||||
vertical-align: top;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
pre {
|
||||
outline-offset: -1px;
|
||||
@include border-radius(0);
|
||||
}
|
||||
|
||||
// line numbers
|
||||
.lntd:first-child {
|
||||
position: sticky;
|
||||
left: 0;
|
||||
}
|
||||
// code content
|
||||
.lntd:last-child {
|
||||
width: 100%;
|
||||
code {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// line numbers (lineNumbersInTable=false)
|
||||
.ln {
|
||||
padding-right: 0.75rem;
|
||||
display: inline-block;
|
||||
text-align: right;
|
||||
position: sticky;
|
||||
left: 0;
|
||||
}
|
||||
// Line numbers
|
||||
.lnt,
|
||||
.ln {
|
||||
color: fixit-var(secondary);
|
||||
@include user-select(none);
|
||||
}
|
||||
|
||||
&:not(.code-block) {
|
||||
.lntd:last-child pre.chroma {
|
||||
padding-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
// code fences blocks wrapped
|
||||
&.code-block {
|
||||
&[data-shadow='always'] {
|
||||
@include box-shadow(always);
|
||||
}
|
||||
|
||||
&[data-shadow='hover'] {
|
||||
@include box-shadow(hover);
|
||||
}
|
||||
|
||||
&.instant-height .code-wrapper {
|
||||
transition: height 0s !important;
|
||||
}
|
||||
|
||||
.code-wrapper {
|
||||
overflow: hidden;
|
||||
height: auto;
|
||||
position: relative;
|
||||
counter-reset: codeNos calc(#{fixit-var(line-start)} - 1);
|
||||
transition: height 0.5s ease-out;
|
||||
@include border-radius;
|
||||
@include border-radius;
|
||||
// attr() for arbitrary properties is currently only supported in Chromium-based browsers (see https://caniuse.com/css3-attr);
|
||||
// non-supporting browsers fall back to values set via Hugo templating in render-codeblock.html
|
||||
@include set-fixit-vars((
|
||||
max-shown-lines: attr(data-max number, 10),
|
||||
line-start: attr(data-line-start number, 1),
|
||||
line-digit: attr(data-line-digit number, 1),
|
||||
));
|
||||
}
|
||||
|
||||
// code preview
|
||||
&:has(.code-expand-btn):not(.is-expanded, .is-collapsed) {
|
||||
.code-wrapper {
|
||||
height: calc(1.45em * #{fixit-var(max-shown-lines)} + #{fixit-var(code-expand-offset, 0.5rem)});
|
||||
}
|
||||
&[data-mode='mac'] .code-wrapper {
|
||||
@include set-fixit-var(code-expand-offset, 1.875rem + 0.5rem);
|
||||
}
|
||||
}
|
||||
|
||||
.code-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
font-family: fixit-var(global-font-family);
|
||||
font-weight: bold;
|
||||
line-height: 1.4em;
|
||||
color: fixit-var(code-header-color);
|
||||
background-color: fixit-var(code-header-background-color);
|
||||
position: sticky;
|
||||
top: fixit-var(breadcrumb-height);
|
||||
transition: border-radius 0s;
|
||||
cursor: pointer;
|
||||
@include z-index(base);
|
||||
@include border-radius(top);
|
||||
|
||||
+ .code-wrapper {
|
||||
@include border-radius(bottom);
|
||||
|
||||
> pre.chroma {
|
||||
@include border-radius(bottom);
|
||||
}
|
||||
}
|
||||
|
||||
.code-title {
|
||||
width: 100%;
|
||||
padding: 0.4rem;
|
||||
|
||||
&::after {
|
||||
padding-left: 0.2rem;
|
||||
content: attr(data-name, fixit-var(code-type, 'Code'));
|
||||
}
|
||||
|
||||
// filename for code block
|
||||
&[data-name]::after {
|
||||
@include overflow-wrap(break-word);
|
||||
}
|
||||
|
||||
.arrow {
|
||||
padding: 0 0.2rem;
|
||||
transition: transform 0.2s ease;
|
||||
}
|
||||
|
||||
.title-inner {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
background-color: fixit-var(code-header-background-color);
|
||||
padding-inline: 1em;
|
||||
max-width: calc(100% - 200px);
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
@include z-index(base, 1);
|
||||
}
|
||||
}
|
||||
|
||||
.ellipses-btn {
|
||||
display: none;
|
||||
padding: 0.4rem;
|
||||
}
|
||||
|
||||
[role='button'] {
|
||||
padding: 0.4rem;
|
||||
|
||||
@include media('print') {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.copy-btn[data-copied] .fa-clone {
|
||||
--fa: "\f00c";
|
||||
font-weight: 900;
|
||||
color: fixit-var(global-link-hover-color);
|
||||
}
|
||||
|
||||
.download-btn[data-downloaded] .fa-download {
|
||||
--fa: "\f1ce";
|
||||
font-weight: 900;
|
||||
color: fixit-var(global-link-hover-color);
|
||||
}
|
||||
|
||||
.fullscreen-btn[data-fullscreen] .fa-expand {
|
||||
--fa: "\f066";
|
||||
font-weight: 900;
|
||||
color: fixit-var(global-link-hover-color);
|
||||
}
|
||||
|
||||
@each $type, $text in $code-type-map {
|
||||
&.language-#{to-lower-case($type)} {
|
||||
// e.g., --fi-code-type: "JavaScript";
|
||||
@include set-fixit-var(code-type, '"#{$text}"');
|
||||
}
|
||||
}
|
||||
|
||||
[data-header-desktop='sticky'] & {
|
||||
@include media('xs', 'up') {
|
||||
top: calc(#{fixit-var(header-height)} + #{fixit-var(breadcrumb-height)});
|
||||
}
|
||||
}
|
||||
|
||||
[data-header-mobile='sticky'] & {
|
||||
@include media('xs') {
|
||||
top: calc(#{fixit-var(header-height)} + #{fixit-var(breadcrumb-height)});
|
||||
}
|
||||
}
|
||||
|
||||
@include media('print') {
|
||||
top: initial !important;
|
||||
}
|
||||
}
|
||||
|
||||
&.line-wrapping .line-wrap-btn,
|
||||
&:not(.line-nos-hidden) .line-nos-btn,
|
||||
.code-header [role='button']:hover,
|
||||
&:has([contenteditable='true']) .edit-btn {
|
||||
color: fixit-var(global-link-hover-color);
|
||||
}
|
||||
|
||||
&.is-fullscreen {
|
||||
position: fixed;
|
||||
inset: 0;
|
||||
margin: 0 !important;
|
||||
overflow: auto;
|
||||
@include z-index(fixed, 1);
|
||||
@include border-radius(0);
|
||||
|
||||
.code-header {
|
||||
top: 0 !important;
|
||||
cursor: default;
|
||||
@include border-radius(0);
|
||||
|
||||
.arrow {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.code-wrapper {
|
||||
overflow: auto;
|
||||
// 1.4em for header height, 0.8rem for padding
|
||||
height: calc(100dvh - 1.4em - 0.8rem);
|
||||
}
|
||||
|
||||
.code-expand-btn {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.code-expand-btn {
|
||||
width: 100%;
|
||||
padding-block: 1rem;
|
||||
text-align: center;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
background: linear-gradient(
|
||||
180deg,
|
||||
rgba($code-background-color, 0) 0%,
|
||||
rgba($code-background-color, 0.9) 60%,
|
||||
$code-background-color 100%
|
||||
);
|
||||
@include z-index(base);
|
||||
@include border-radius(bottom);
|
||||
|
||||
[data-theme=dark] & {
|
||||
background: linear-gradient(
|
||||
180deg,
|
||||
rgba($code-background-color-dark, 0) 0%,
|
||||
rgba($code-background-color-dark, 0.9) 60%,
|
||||
$code-background-color-dark 100%
|
||||
);
|
||||
}
|
||||
|
||||
.fa-angles-down {
|
||||
opacity: 0;
|
||||
animation-name: fadeOutDown;
|
||||
animation-duration: 1.5s;
|
||||
animation-iteration-count: infinite;
|
||||
animation-delay: 0.3s;
|
||||
transition: transform 0.2s ease;
|
||||
}
|
||||
}
|
||||
|
||||
.code-copy-btn {
|
||||
@extend .diagram-copy-btn;
|
||||
}
|
||||
|
||||
// classic mode code block collapsed
|
||||
&.is-collapsed {
|
||||
.code-header {
|
||||
transition: border-radius 0.2s ease 0.2s;
|
||||
@include set-fixit-var(code-header-background-color, darken($code-background-color, 6%));
|
||||
@include border-radius;
|
||||
|
||||
[data-theme=dark] & {
|
||||
@include set-fixit-var(code-header-background-color, darken($code-background-color-dark, 6%));
|
||||
}
|
||||
|
||||
+ .code-wrapper {
|
||||
height: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.arrow {
|
||||
transform: rotate(-90deg);
|
||||
}
|
||||
|
||||
.ellipses-btn {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
.code-header .action-btn,
|
||||
.code-expand-btn {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
// code preview expanded
|
||||
&.is-expanded {
|
||||
margin-bottom: 1rem;
|
||||
&:has([contenteditable='true']) .code-expand-btn {
|
||||
display: none;
|
||||
}
|
||||
.code-expand-btn {
|
||||
background: transparent;
|
||||
padding-block: 0;
|
||||
transform: translateY(1rem);
|
||||
|
||||
.fa-angles-down {
|
||||
animation-name: fadeOutRotate;
|
||||
|
||||
@keyframes fadeOutRotate {
|
||||
0% {
|
||||
opacity: 1;
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
transform: rotate(180deg) translate3d(0, 100%, 0);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// hide original line numbers
|
||||
&.line-nos-hidden {
|
||||
> .chroma .lntable {
|
||||
width: 100%;
|
||||
display: table;
|
||||
}
|
||||
.lntd:first-child,
|
||||
.ln {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
// line wrapping
|
||||
&.line-wrapping {
|
||||
> .chroma .lntable {
|
||||
width: 100%;
|
||||
display: table;
|
||||
|
||||
// hide original line numbers
|
||||
.lntd:first-child {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
.lntd:last-child pre.chroma,
|
||||
.code-wrapper > pre.chroma {
|
||||
max-width: 100%;
|
||||
box-sizing: border-box;
|
||||
|
||||
code {
|
||||
text-wrap: wrap;
|
||||
word-break: break-all;
|
||||
overflow-wrap: break-word;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// line numbers (pseudo-elements) for code blocks
|
||||
&.line-wrapping:not(.line-nos-hidden) .lntd:last-child pre.chroma,
|
||||
&:not(.line-nos-hidden) .code-wrapper > pre.chroma:not(:has(.ln)) {
|
||||
> code > .line {
|
||||
display: flex;
|
||||
|
||||
&::before {
|
||||
counter-increment: codeNos;
|
||||
content: counter(codeNos);
|
||||
white-space: nowrap;
|
||||
text-align: right;
|
||||
min-width: calc(#{fixit-var(line-digit)} * 1ch);
|
||||
padding-inline: 0.75rem;
|
||||
flex-shrink: 0;
|
||||
color: fixit-var(secondary);
|
||||
background-color: fixit-var(code-block-background-color);
|
||||
}
|
||||
|
||||
// highlight for line numbers
|
||||
&.hl::before {
|
||||
background-color: transparent;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// add sticky effect for line numbers when lineNos=false
|
||||
&:not(.line-nos-hidden) .code-wrapper > pre.chroma > code > .line::before {
|
||||
position: sticky;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
// when line numbers shown
|
||||
&:not(.line-nos-hidden) {
|
||||
.lntd:last-child pre.chroma,
|
||||
.code-wrapper > pre.chroma:not(:has(.ln)) {
|
||||
padding-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
// add border for non-classic mode
|
||||
&:not([data-mode='classic']) {
|
||||
border: 1px solid darken($code-background-color, 3%);
|
||||
|
||||
[data-theme=dark] & {
|
||||
border-color: darken($code-background-color-dark, 3%);
|
||||
}
|
||||
}
|
||||
|
||||
&[data-mode='mac'] {
|
||||
pre.chroma {
|
||||
padding-top: 1.875rem;
|
||||
|
||||
&::after {
|
||||
background: fixit-var(mac-red, #fc625d);
|
||||
box-shadow: 20px 0 fixit-var(mac-yellow, #fdbc40), 40px 0 fixit-var(mac-green, #35cd4b);
|
||||
left: 8px;
|
||||
top: 8px;
|
||||
position: absolute;
|
||||
content: ' ';
|
||||
height: 12px;
|
||||
width: 12px;
|
||||
@include border-radius(full);
|
||||
|
||||
[data-theme=dark] & {
|
||||
@include set-fixit-vars((
|
||||
mac-red: #ff5f56,
|
||||
mac-yellow: #febc2e,
|
||||
mac-green: #28c840,
|
||||
));
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&[data-mode='simple'] {
|
||||
pre.chroma {
|
||||
padding-block: 0.875rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@import './_code-syntax';
|
||||
|
||||
// gist shortcode
|
||||
.gist {
|
||||
background-color: fixit-var(code-block-background-color);
|
||||
@include border-radius(top);
|
||||
|
||||
.gist-file,
|
||||
.gist-data,
|
||||
.gist-meta {
|
||||
border: none;
|
||||
}
|
||||
|
||||
.gist-data {
|
||||
background-color: inherit;
|
||||
|
||||
.blob-wrapper {
|
||||
padding-block: 0.5rem;
|
||||
|
||||
table.highlight {
|
||||
background-color: inherit;
|
||||
overflow: initial;
|
||||
|
||||
td.blob-num {
|
||||
position: sticky;
|
||||
left: 0;
|
||||
background-color: fixit-var(code-block-background-color);
|
||||
@include z-index(base);
|
||||
}
|
||||
|
||||
td.blob-code {
|
||||
padding-left: 2px !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.gist-meta {
|
||||
padding: 0.4rem 0.8rem;
|
||||
@include link(false, false);
|
||||
@include border-radius(bottom);
|
||||
background-color: fixit-var(gist-meta-background-color);
|
||||
}
|
||||
|
||||
[data-theme=dark] & {
|
||||
@import './_code-syntax/github-dark-dimmed';
|
||||
}
|
||||
}
|
||||
|
||||
// Code Tabs
|
||||
.code-tabs {
|
||||
margin: 0.5rem 0;
|
||||
background-color: fixit-var(code-block-background-color);
|
||||
border: 1px solid fixit-var(global-border-color);
|
||||
@include border-radius;
|
||||
|
||||
&[data-shadow='always'] {
|
||||
@include box-shadow(always);
|
||||
}
|
||||
|
||||
&[data-shadow='hover'] {
|
||||
@include box-shadow(hover);
|
||||
}
|
||||
|
||||
&:has(.code-block.active .code-expand-btn) {
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
&:has(.code-block.active.line-wrapping) .tabs-actions .line-wrap-btn,
|
||||
&:has(.code-block.active:not(.line-nos-hidden)) .tabs-actions .line-nos-btn,
|
||||
&:has(.code-block.active [contenteditable='true']) .tabs-actions .edit-btn {
|
||||
color: fixit-var(global-link-hover-color);
|
||||
}
|
||||
|
||||
.tabs-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
line-height: 1.4em;
|
||||
font-size: fixit-var(code-block-font-size);
|
||||
color: fixit-var(code-header-color);
|
||||
background-color: fixit-var(code-header-background-color);
|
||||
position: sticky;
|
||||
top: fixit-var(breadcrumb-height);
|
||||
@include z-index(base);
|
||||
@include border-radius(top);
|
||||
|
||||
.tabs-items {
|
||||
display: flex;
|
||||
overflow-x: auto;
|
||||
position: relative;
|
||||
@include border-radius(top);
|
||||
|
||||
.tab-item {
|
||||
padding: 0.4rem 0.8rem;
|
||||
cursor: pointer;
|
||||
font-weight: bold;
|
||||
color: fixit-var(secondary);
|
||||
white-space: nowrap;
|
||||
@include user-select(none);
|
||||
@include border-radius;
|
||||
|
||||
@include media('xs') {
|
||||
padding-inline: 0.6rem;
|
||||
}
|
||||
}
|
||||
|
||||
&:not(:has(.tab-item:hover)) .tab-item.active,
|
||||
.tab-item:hover {
|
||||
anchor-name: #{$rootPrefix}tab-hover;
|
||||
color: fixit-var(global-font-color);
|
||||
}
|
||||
|
||||
&::before {
|
||||
content: '';
|
||||
position-anchor: #{$rootPrefix}tab-hover;
|
||||
position: absolute;
|
||||
inset: anchor(inside);
|
||||
translate: 2px 2px;
|
||||
width: calc(anchor-size(width) - 0.25rem);
|
||||
height: calc(anchor-size(height) - 0.25rem);
|
||||
box-shadow: inset 0 0 1rem 0.25rem color-mix(in srgb, fixit-var(secondary) 30%, transparent);
|
||||
pointer-events: none;
|
||||
transition: 0.3s ease-in-out;
|
||||
@include border-radius;
|
||||
}
|
||||
}
|
||||
|
||||
.tabs-actions {
|
||||
display: flex;
|
||||
flex-shrink: 0;
|
||||
|
||||
.action-btn {
|
||||
padding: 0.4rem;
|
||||
|
||||
&:hover {
|
||||
color: fixit-var(global-link-hover-color);
|
||||
}
|
||||
|
||||
&.copy-btn[data-copied] .fa-clone {
|
||||
--fa: "\f00c";
|
||||
font-weight: 900;
|
||||
color: fixit-var(global-link-hover-color);
|
||||
}
|
||||
|
||||
&.download-btn[data-downloaded] .fa-download {
|
||||
--fa: "\f1ce";
|
||||
font-weight: 900;
|
||||
color: fixit-var(global-link-hover-color);
|
||||
}
|
||||
|
||||
&.fullscreen-btn {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
[data-header-desktop='sticky'] & {
|
||||
@include media('xs', 'up') {
|
||||
top: calc(#{fixit-var(header-height)} + #{fixit-var(breadcrumb-height)});
|
||||
}
|
||||
}
|
||||
|
||||
[data-header-mobile='sticky'] & {
|
||||
@include media('xs') {
|
||||
top: calc(#{fixit-var(header-height)} + #{fixit-var(breadcrumb-height)});
|
||||
}
|
||||
}
|
||||
|
||||
@include media('print') {
|
||||
top: initial !important;
|
||||
}
|
||||
}
|
||||
|
||||
.tabs-content {
|
||||
.code-block {
|
||||
display: none;
|
||||
margin: 0;
|
||||
@include border-radius(bottom);
|
||||
@include box-shadow(never);
|
||||
|
||||
&.active {
|
||||
display: block;
|
||||
}
|
||||
|
||||
// hide original header
|
||||
.code-header {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,22 +0,0 @@
|
||||
// Color preview styles for inline code
|
||||
.color-code {
|
||||
position: relative;
|
||||
@include set-fixit-var(color-code-size, 0.64em);
|
||||
|
||||
.color-preview {
|
||||
display: inline-block;
|
||||
width: fixit-var(color-code-size);
|
||||
height: fixit-var(color-code-size);
|
||||
@include border-radius(full);
|
||||
margin-right: 0.25em;
|
||||
vertical-align: middle;
|
||||
border: 1px solid;
|
||||
border-color: fixit-var(color-preview-border-color, #d1d9e0b3);
|
||||
pointer-events: none;
|
||||
transform: translateY(-1px);
|
||||
|
||||
[data-theme=dark] & {
|
||||
@include set-fixit-var(color-preview-border-color, #3d444db3);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,11 +0,0 @@
|
||||
> #comments {
|
||||
padding: 2rem 0;
|
||||
|
||||
iframe {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@include media('print') {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
@@ -1,63 +0,0 @@
|
||||
// Diagram container
|
||||
.diagram-container {
|
||||
position: relative;
|
||||
margin-block: 0.5rem;
|
||||
}
|
||||
|
||||
// Diagram copy button styles
|
||||
.diagram-copy-btn {
|
||||
width: 1rem;
|
||||
height: 1rem;
|
||||
position: absolute;
|
||||
top: 0.5rem;
|
||||
right: 0.5rem;
|
||||
line-height: 1;
|
||||
padding: 0.5rem;
|
||||
border: 1px solid;
|
||||
color: fixit-var(dcb-color, #25292e);
|
||||
border-color: fixit-var(dcb-border-color, #d1d9e0);
|
||||
background-color: fixit-var(dcb-background-color, #f6f8fa);
|
||||
box-shadow: fixit-var(dcb-box-shadow, 0px 1px 0px 0px #1f23280a);
|
||||
@include user-select(none);
|
||||
@include border-radius;
|
||||
@include z-index(base);
|
||||
|
||||
[data-theme=dark] & {
|
||||
@include set-fixit-vars((
|
||||
dcb-color: #d1d7e0,
|
||||
dcb-border-color: #3d444d,
|
||||
dcb-background-color: #2a313c,
|
||||
dcb-box-shadow: 0px 0px 0px 0px #000000,
|
||||
));
|
||||
}
|
||||
|
||||
&:hover {
|
||||
@include set-fixit-vars((
|
||||
dcb-border-color: #d1d9e0,
|
||||
dcb-background-color: #eff2f5,
|
||||
));
|
||||
|
||||
[data-theme=dark] & {
|
||||
@include set-fixit-vars((
|
||||
dcb-border-color: #3d444d,
|
||||
dcb-background-color: #2f3742,
|
||||
));
|
||||
}
|
||||
}
|
||||
|
||||
.fa-clone {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
&[data-copied] {
|
||||
.fa-clone {
|
||||
--fa: '\f00c';
|
||||
--fa-style: 900;
|
||||
color: fixit-var(global-link-hover-color);
|
||||
}
|
||||
}
|
||||
|
||||
@include media('print') {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
@@ -1,104 +0,0 @@
|
||||
.fixit-decryptor-container {
|
||||
font-family: fixit-var(global-font-family);
|
||||
text-align: center;
|
||||
margin-block: fixit-var(decryptor-margin-block);
|
||||
|
||||
.fixit-decryptor-loading {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.fixit-decryptor-input,
|
||||
.fixit-decryptor-btn,
|
||||
.fixit-encryptor-btn {
|
||||
display: none;
|
||||
box-sizing: border-box;
|
||||
outline: none;
|
||||
color: fixit-var(global-font-color);
|
||||
border: 1px solid fixit-var(global-border-color);
|
||||
box-shadow: 0px 0px 5px 0px fixit-var(global-border-color);
|
||||
@include border-radius;
|
||||
transition: all 0.1s ease-out;
|
||||
|
||||
&:active,
|
||||
&:focus,
|
||||
&:hover {
|
||||
color: darken($global-link-hover-color, 6%);
|
||||
border-color: fixit-var(global-link-hover-color);
|
||||
box-shadow: 0px 0px 5px 0px lighten($global-link-hover-color, 20%);
|
||||
|
||||
[data-theme=dark] & {
|
||||
color: lighten($global-link-hover-color-dark, 6%);
|
||||
box-shadow: 0px 0px 5px 0px darken($global-link-hover-color-dark, 20%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.fixit-decryptor-input {
|
||||
width: calc(clamp(50%, 450px, 100%) - 100px);
|
||||
height: 3rem;
|
||||
padding-left: 1rem;
|
||||
padding-right: 1rem;
|
||||
background-color: fixit-var(global-background-color);
|
||||
}
|
||||
|
||||
.fixit-decryptor-btn,
|
||||
.fixit-encryptor-btn {
|
||||
cursor: pointer;
|
||||
padding: 0.8rem 1rem;
|
||||
background-color: fixit-var(global-background-color);
|
||||
transition: all 0.1s ease-out;
|
||||
}
|
||||
|
||||
.fixit-encryptor-btn {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
fixit-encryptor {
|
||||
&.initialized > .fixit-decryptor-container {
|
||||
.fixit-decryptor-input,
|
||||
.fixit-decryptor-btn {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.fixit-decryptor-loading {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
cipher-text {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
// fixit-encryptor for for the encrypted pages
|
||||
article fixit-encryptor {
|
||||
.fixit-decryptor-container {
|
||||
@include set-fixit-var(decryptor-margin-block, 2rem);
|
||||
}
|
||||
&.decrypted > .fixit-decryptor-container {
|
||||
.fixit-decryptor-loading,
|
||||
.fixit-decryptor-input,
|
||||
.fixit-decryptor-btn {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.fixit-encryptor-btn {
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// fixit-encryptor shortcodes
|
||||
#content fixit-encryptor {
|
||||
.fixit-decryptor-container {
|
||||
@include set-fixit-var(decryptor-margin-block, 1rem);
|
||||
}
|
||||
&.decrypted > .fixit-decryptor-container {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.encrypted-hidden {
|
||||
display: none !important;
|
||||
}
|
||||
@@ -1,117 +0,0 @@
|
||||
.admonition {
|
||||
position: relative;
|
||||
margin: 1rem 0;
|
||||
padding: 0 0.75rem;
|
||||
border-left: .25rem solid;
|
||||
overflow: hidden;
|
||||
background-color: fixit-var(admonition-bg-color);
|
||||
border-left-color: fixit-var(admonition-color);
|
||||
@include border-radius;
|
||||
|
||||
.admonition-title {
|
||||
font-weight: fixit-var(admonition-title-font-weight, bold);
|
||||
margin: 0 -0.75rem;
|
||||
padding: 0.25rem 1.8rem;
|
||||
border-bottom: 1px solid;
|
||||
position: relative;
|
||||
@include border-radius(0);
|
||||
|
||||
strong {
|
||||
font-weight: bolder;
|
||||
text-shadow: 0 0.05rem 0.05rem rgba(0, 0, 0, 0.2);
|
||||
|
||||
[data-theme=dark] & {
|
||||
text-shadow: 0 0.05rem 0.05rem rgba(255, 255, 255, 0.2);
|
||||
}
|
||||
}
|
||||
|
||||
// title-only admonition without content
|
||||
&:not(:has(+ .details-content)) {
|
||||
@include set-fixit-var(admonition-title-font-weight, normal);
|
||||
padding: 0.75rem 1rem 0.75rem 2.2rem;
|
||||
border: 0;
|
||||
|
||||
i.icon {
|
||||
left: 1.1rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
> .admonition-title {
|
||||
border-bottom-color: fixit-var(admonition-bg-color);
|
||||
background-color: fixit-var(admonition-bg-color-collapsed);
|
||||
transition: all 0.2s ease;
|
||||
|
||||
i.icon {
|
||||
color: fixit-var(admonition-color);
|
||||
}
|
||||
}
|
||||
|
||||
&.open > .admonition-title {
|
||||
background-color: fixit-var(admonition-bg-color);
|
||||
}
|
||||
|
||||
.admonition-content {
|
||||
padding: 0.5rem 0;
|
||||
|
||||
// for extended alert syntax
|
||||
> p {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
// reset sticky header position in code block when inside admonition
|
||||
.code-block .code-header,
|
||||
.code-tabs .tabs-header {
|
||||
top: initial !important;
|
||||
}
|
||||
}
|
||||
|
||||
i.icon {
|
||||
font-size: 0.85rem;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 0.9rem;
|
||||
translate: -50% -50%;
|
||||
}
|
||||
|
||||
i.details-icon {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 0.9rem;
|
||||
translate: 50% -50%;
|
||||
}
|
||||
|
||||
// default admonition type is note
|
||||
@include set-fixit-vars((
|
||||
admonition-color: map-get(map-get($admonition-color-map, note), color),
|
||||
admonition-bg-color: map-get(map-get($admonition-color-map, note), bg-color),
|
||||
admonition-bg-color-collapsed: opacify(map-get(map-get($admonition-color-map, note), bg-color), 0.15),
|
||||
));
|
||||
|
||||
// set color for each admonition type
|
||||
@each $type, $item in $admonition-color-map {
|
||||
@if $type != 'note' {
|
||||
&.#{$type} {
|
||||
@include set-fixit-vars((
|
||||
admonition-color: map-get($item, color),
|
||||
admonition-bg-color: map-get($item, bg-color),
|
||||
admonition-bg-color-collapsed: opacify(map-get($item, bg-color), 0.15),
|
||||
));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0.75rem;
|
||||
}
|
||||
|
||||
// content-only admonition without title
|
||||
&:not(:has(.admonition-title)) {
|
||||
border: 1px solid fixit-var(admonition-bg-color);
|
||||
|
||||
.admonition-content {
|
||||
padding: 0.75rem 0.25rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,16 +0,0 @@
|
||||
.bilibili {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
aspect-ratio: 16 / 9;
|
||||
margin: 1rem auto;
|
||||
text-align: center;
|
||||
|
||||
iframe {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
@@ -1,3 +0,0 @@
|
||||
.bluesky-embed {
|
||||
margin: 1rem auto;
|
||||
}
|
||||
@@ -1,14 +0,0 @@
|
||||
@import 'admonition';
|
||||
@import 'bilibili';
|
||||
@import 'bluesky';
|
||||
@import 'douyin';
|
||||
@import 'cardlink';
|
||||
@import 'center-quote';
|
||||
@import 'echarts';
|
||||
@import 'file-tree';
|
||||
@import 'instagram';
|
||||
@import 'mapbox';
|
||||
@import 'mermaid';
|
||||
@import 'tabs';
|
||||
@import 'timeline';
|
||||
@import 'version';
|
||||
@@ -1,5 +0,0 @@
|
||||
iframe.instagram-media {
|
||||
[data-theme=dark] & {
|
||||
border: none !important;
|
||||
}
|
||||
}
|
||||
@@ -1,55 +0,0 @@
|
||||
.mermaid,
|
||||
.mermaid-dark,
|
||||
.mermaid-neutral {
|
||||
position: relative;
|
||||
margin: 0;
|
||||
overflow: hidden !important;
|
||||
|
||||
&[data-processed] {
|
||||
text-align: center;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
&:not([data-processed])::before {
|
||||
@include loading;
|
||||
}
|
||||
|
||||
svg {
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.mermaid {
|
||||
[data-theme=dark] & {
|
||||
height: 0;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.mermaid-dark {
|
||||
height: 0;
|
||||
padding: 0;
|
||||
|
||||
[data-theme=dark] & {
|
||||
height: auto;
|
||||
padding: 0.5rem 0.75rem;
|
||||
}
|
||||
}
|
||||
|
||||
// for print view
|
||||
.mermaid-neutral {
|
||||
height: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
@include media('print') {
|
||||
.mermaid,
|
||||
.mermaid-dark {
|
||||
display: none !important;
|
||||
}
|
||||
.mermaid-neutral {
|
||||
height: auto;
|
||||
padding: 0.5rem 0.75rem;
|
||||
}
|
||||
}
|
||||
@@ -1,8 +0,0 @@
|
||||
.version-link {
|
||||
white-space: nowrap;
|
||||
|
||||
img.version {
|
||||
height: 1.25em;
|
||||
vertical-align: text-bottom;
|
||||
}
|
||||
}
|
||||
@@ -1,9 +0,0 @@
|
||||
.special {
|
||||
.single-title,
|
||||
.single-subtitle {
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
|
||||
@import 'friends';
|
||||
@import 'search';
|
||||
@@ -1,189 +0,0 @@
|
||||
// ==========================================================================
|
||||
// SCSS Variables
|
||||
// Note: These SCSS variables are now also defined as CSS custom properties
|
||||
// in _core/_root.scss for runtime theme switching and runtime customization.
|
||||
// ==========================================================================
|
||||
|
||||
// ========== Global ========== //
|
||||
$prefix: fi- !default;
|
||||
$rootPrefix: --#{$prefix} !default;
|
||||
|
||||
// Font and Line Height
|
||||
$global-font-family: system-ui, -apple-system, BlinkMacSystemFont, PingFang SC, Microsoft YaHei UI, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, Helvetica, Arial, sans-serif !default;
|
||||
$global-font-size: 16px !default;
|
||||
$global-font-weight: 400 !default;
|
||||
$global-line-height: 1.5rem !default;
|
||||
|
||||
// scroll-margin-top of content anchor
|
||||
$global-scroll-margin-top: 0.5rem !default;
|
||||
|
||||
// Radius of the border
|
||||
$global-border-radius: 5px !default;
|
||||
|
||||
// Color of the background
|
||||
$global-background-color: #ffffff !default;
|
||||
$global-background-color-dark: #292a2e !default;
|
||||
|
||||
// Color of the text
|
||||
$global-font-color: #161209 !default;
|
||||
$global-font-color-dark: #b1b1ba !default;
|
||||
|
||||
// Color of the secondary text
|
||||
$global-font-secondary-color: #8b949e !default;
|
||||
$global-font-secondary-color-dark: #7d8792 !default;
|
||||
|
||||
// Color of the placeholder
|
||||
$global-placeholder-color: #b1b1ba !default;
|
||||
$global-placeholder-color-dark: #909092 !default;
|
||||
|
||||
// Color of the link
|
||||
$global-link-color: #161209 !default;
|
||||
$global-link-color-dark: #b1b1ba !default;
|
||||
|
||||
// Color of the hover link
|
||||
$global-link-hover-color: #2983bb !default; // 潮蓝
|
||||
$global-link-hover-color-dark: #fff !default;
|
||||
|
||||
// Color of the border
|
||||
$global-border-color: #e3e3e3 !default;
|
||||
$global-border-color-dark: #454545 !default;
|
||||
// ========== Global ========== //
|
||||
|
||||
// ========== Scrollbar ========== //
|
||||
// Color of the scrollbar
|
||||
$scrollbar-color: #a6a6a6 !default;
|
||||
|
||||
// Color of the hover scrollbar
|
||||
$scrollbar-hover-color: #7d7d7d !default;
|
||||
// ========== Scrollbar ========== //
|
||||
|
||||
// ========== Selection ========== //
|
||||
// Color of the selected text
|
||||
$selection-color: rgba(53, 166, 247, 0.25) !default;
|
||||
$selection-color-dark: rgba(50, 112, 194, 0.4) !default;
|
||||
// ========== Selection ========== //
|
||||
|
||||
// ========== Header ========== //
|
||||
// Height of the header
|
||||
$header-height: 3.5rem !default;
|
||||
|
||||
// Color of the header background
|
||||
$header-background-color: #f8f8f8 !default;
|
||||
$header-background-color-dark: #252627 !default;
|
||||
|
||||
// Font style of the header title
|
||||
$header-title-font-family: $global-font-family !default;
|
||||
$header-title-font-size: 1.375rem !default;
|
||||
|
||||
// Color of the active menu item
|
||||
$menu-active-color: #161209 !default;
|
||||
$menu-active-color-dark: #fff !default;
|
||||
|
||||
// Border color of the menu item
|
||||
$menu-border-color: #3c3c3c1f !default;
|
||||
$menu-border-color-dark: #5454547a !default;
|
||||
|
||||
// Height of the submenu item of desktop header
|
||||
$submenu-height: $header-height * 0.5 !default;
|
||||
|
||||
// Color of the search background
|
||||
$search-background-color: #e9e9e9 !default;
|
||||
$search-background-color-dark: #363636 !default;
|
||||
// ========== Header ========== //
|
||||
|
||||
// ========== Tag Cloud ========== //
|
||||
// Color range of tag cloud
|
||||
$tag-cloud-start: #b1b1ba !default;
|
||||
$tag-cloud-end: $global-font-color !default;
|
||||
$tag-cloud-start-dark: #909092 !default;
|
||||
$tag-cloud-end-dark: $global-font-color-dark !default;
|
||||
// ========== Tag Cloud ========== //
|
||||
|
||||
// ========== Single Content ========== //
|
||||
// Font size of the TOC
|
||||
$toc-title-font-size: 1rem !default;
|
||||
$toc-content-font-size: 0.875rem !default;
|
||||
|
||||
// Font size of the Collection List
|
||||
$collection-title-font-size: 1rem !default;
|
||||
$collection-list-font-size: 0.875rem !default;
|
||||
|
||||
// Font size of the Related Content List
|
||||
$related-title-font-size: 1rem !default;
|
||||
$related-list-font-size: 0.875rem !default;
|
||||
|
||||
// Color of the single link
|
||||
$single-link-color: #2376b7 !default; // 花青
|
||||
$single-link-color-dark: #1781b5 !default; // 釉蓝
|
||||
|
||||
// Color of the hover single link
|
||||
$single-link-hover-color: #ea517f !default; // 莲瓣红
|
||||
$single-link-hover-color-dark: #cc5595 !default; // 龙须红
|
||||
|
||||
// Color of the table background
|
||||
$table-background-color: #fff !default;
|
||||
$table-background-color-dark: #272c34 !default;
|
||||
|
||||
// Color of the table thead
|
||||
$table-thead-color: #ededed !default;
|
||||
$table-thead-color-dark: #20252b !default;
|
||||
|
||||
// Color of the blockquote
|
||||
$blockquote-color: #697681 !default;
|
||||
$blockquote-color-dark: #9ba3aa !default;
|
||||
|
||||
// Color of reward
|
||||
$reward-color: tomato !default;
|
||||
$reward-color-dark: darken($reward-color, 5%) !default;
|
||||
|
||||
// Width of reward image
|
||||
$reward-img-width: 180px !default;
|
||||
// ========== Single Content ========== //
|
||||
|
||||
// ========== Pagination ========== //
|
||||
// Color of the link in pagination
|
||||
$pagination-link-color: #bfbfbf !default;
|
||||
$pagination-link-color-dark: #b1b1ba !default;
|
||||
|
||||
// Color of the hover link in pagination
|
||||
$pagination-link-hover-color: #000 !default;
|
||||
$pagination-link-hover-color-dark: #fff !default;
|
||||
// ========== Pagination ========== //
|
||||
|
||||
// ========== Code ========== //
|
||||
// Color of the code
|
||||
$code-color: #24292f !default;
|
||||
$code-color-dark: #adbac7 !default;
|
||||
|
||||
// Color of the code background
|
||||
$code-background-color: #f4f6f8 !default;
|
||||
$code-background-color-dark: #2d333b !default;
|
||||
|
||||
$code-error-color: #dc3545 !default;
|
||||
|
||||
// Color of the highlight code
|
||||
$code-highlight-color: #fff8c5 !default;
|
||||
$code-highlight-color-dark: rgba(174, 124, 20, 0.15) !default;
|
||||
|
||||
$code-header-color: #7d7d7d !default;
|
||||
$code-header-color-dark: #b1b0b0 !default;
|
||||
|
||||
// Font size of the code
|
||||
$code-font-size: 0.875em !default;
|
||||
$code-block-font-size: 0.875rem !default;
|
||||
|
||||
// Font family of the code
|
||||
$code-font-family: Source Code Pro, Menlo, Consolas, Monaco, monospace, $global-font-family !default;
|
||||
// ========== Code ========== //
|
||||
|
||||
// ========== GitHub Corners ========== //
|
||||
// Color of the GitHub Corners
|
||||
$github-corner-color: white !default;
|
||||
$github-corner-color-dark: black !default;
|
||||
|
||||
// Color of the GitHub Corners background
|
||||
$github-corner-fill: $header-background-color-dark !default;
|
||||
$github-corner-fill-dark: $header-background-color !default;
|
||||
// ========== GitHub Corners ========== //
|
||||
|
||||
@import '_maps';
|
||||
@@ -1,13 +0,0 @@
|
||||
{{- $logo := resources.Get "images/fixit.svg" | minify -}}
|
||||
{{- $loading := resources.Get "images/loading.svg" | minify -}}
|
||||
|
||||
@charset "utf-8";
|
||||
|
||||
@import "_variables";
|
||||
$base: "{{ relURL "" }}" !default;
|
||||
|
||||
:root {
|
||||
#{$rootPrefix}base: "#{$base}";
|
||||
#{$rootPrefix}logo-img: url("{{ $logo.RelPermalink }}");
|
||||
#{$rootPrefix}loading-img: url("{{ $loading.RelPermalink }}");
|
||||
}
|
||||
@@ -1,7 +0,0 @@
|
||||
@charset "utf-8";
|
||||
|
||||
@import "_variables";
|
||||
@import "_override";
|
||||
@import "_core";
|
||||
@import "_page";
|
||||
@import "_custom";
|
||||
@@ -0,0 +1,104 @@
|
||||
/* layer: preflights */
|
||||
*,::before,::after{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / 0.5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: ;}::backdrop{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / 0.5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: ;}
|
||||
/* layer: icons */
|
||||
.lucide-arrow-down{--un-icon:url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' display='inline-block' vertical-align='text-bottom' width='1em' height='1em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M12 5v14m7-7l-7 7l-7-7'/%3E%3C/svg%3E");-webkit-mask:var(--un-icon) no-repeat;mask:var(--un-icon) no-repeat;-webkit-mask-size:100% 100%;mask-size:100% 100%;background-color:currentColor;color:inherit;display:inline-block;vertical-align:text-bottom;width:1em;height:1em;}
|
||||
.lucide-arrow-up{--un-icon:url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' display='inline-block' vertical-align='text-bottom' width='1em' height='1em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m5 12l7-7l7 7m-7 7V5'/%3E%3C/svg%3E");-webkit-mask:var(--un-icon) no-repeat;mask:var(--un-icon) no-repeat;-webkit-mask-size:100% 100%;mask-size:100% 100%;background-color:currentColor;color:inherit;display:inline-block;vertical-align:text-bottom;width:1em;height:1em;}
|
||||
.lucide-corner-down-left{--un-icon:url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' display='inline-block' vertical-align='text-bottom' width='1em' height='1em' xmlns='http://www.w3.org/2000/svg' %3E%3Cg fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M20 4v7a4 4 0 0 1-4 4H4'/%3E%3Cpath d='m9 10l-5 5l5 5'/%3E%3C/g%3E%3C/svg%3E");-webkit-mask:var(--un-icon) no-repeat;mask:var(--un-icon) no-repeat;-webkit-mask-size:100% 100%;mask-size:100% 100%;background-color:currentColor;color:inherit;display:inline-block;vertical-align:text-bottom;width:1em;height:1em;}
|
||||
.octicon-alert-16{--un-icon:url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 16 16' display='inline-block' vertical-align='text-bottom' width='1em' height='1em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M6.457 1.047c.659-1.234 2.427-1.234 3.086 0l6.082 11.378A1.75 1.75 0 0 1 14.082 15H1.918a1.75 1.75 0 0 1-1.543-2.575Zm1.763.707a.25.25 0 0 0-.44 0L1.698 13.132a.25.25 0 0 0 .22.368h12.164a.25.25 0 0 0 .22-.368Zm.53 3.996v2.5a.75.75 0 0 1-1.5 0v-2.5a.75.75 0 0 1 1.5 0M9 11a1 1 0 1 1-2 0a1 1 0 0 1 2 0'/%3E%3C/svg%3E");-webkit-mask:var(--un-icon) no-repeat;mask:var(--un-icon) no-repeat;-webkit-mask-size:100% 100%;mask-size:100% 100%;background-color:currentColor;color:inherit;display:inline-block;vertical-align:text-bottom;width:1em;height:1em;}
|
||||
.octicon-info-16{--un-icon:url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 16 16' display='inline-block' vertical-align='text-bottom' width='1em' height='1em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M0 8a8 8 0 1 1 16 0A8 8 0 0 1 0 8m8-6.5a6.5 6.5 0 1 0 0 13a6.5 6.5 0 0 0 0-13M6.5 7.75A.75.75 0 0 1 7.25 7h1a.75.75 0 0 1 .75.75v2.75h.25a.75.75 0 0 1 0 1.5h-2a.75.75 0 0 1 0-1.5h.25v-2h-.25a.75.75 0 0 1-.75-.75M8 6a1 1 0 1 1 0-2a1 1 0 0 1 0 2'/%3E%3C/svg%3E");-webkit-mask:var(--un-icon) no-repeat;mask:var(--un-icon) no-repeat;-webkit-mask-size:100% 100%;mask-size:100% 100%;background-color:currentColor;color:inherit;display:inline-block;vertical-align:text-bottom;width:1em;height:1em;}
|
||||
.octicon-light-bulb-16{--un-icon:url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 16 16' display='inline-block' vertical-align='text-bottom' width='1em' height='1em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M8 1.5c-2.363 0-4 1.69-4 3.75c0 .984.424 1.625.984 2.304l.214.253c.223.264.47.556.673.848c.284.411.537.896.621 1.49a.75.75 0 0 1-1.484.211c-.04-.282-.163-.547-.37-.847a9 9 0 0 0-.542-.68l-.268-.32C3.201 7.75 2.5 6.766 2.5 5.25C2.5 2.31 4.863 0 8 0s5.5 2.31 5.5 5.25c0 1.516-.701 2.5-1.328 3.259q-.142.172-.268.319c-.207.245-.383.453-.541.681c-.208.3-.33.565-.37.847a.751.751 0 0 1-1.485-.212c.084-.593.337-1.078.621-1.489c.203-.292.45-.584.673-.848l.213-.253c.561-.679.985-1.32.985-2.304c0-2.06-1.637-3.75-4-3.75M5.75 12h4.5a.75.75 0 0 1 0 1.5h-4.5a.75.75 0 0 1 0-1.5M6 15.25a.75.75 0 0 1 .75-.75h2.5a.75.75 0 0 1 0 1.5h-2.5a.75.75 0 0 1-.75-.75'/%3E%3C/svg%3E");-webkit-mask:var(--un-icon) no-repeat;mask:var(--un-icon) no-repeat;-webkit-mask-size:100% 100%;mask-size:100% 100%;background-color:currentColor;color:inherit;display:inline-block;vertical-align:text-bottom;width:1em;height:1em;}
|
||||
.octicon-report-16{--un-icon:url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 16 16' display='inline-block' vertical-align='text-bottom' width='1em' height='1em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M0 1.75C0 .784.784 0 1.75 0h12.5C15.216 0 16 .784 16 1.75v9.5A1.75 1.75 0 0 1 14.25 13H8.06l-2.573 2.573A1.458 1.458 0 0 1 3 14.543V13H1.75A1.75 1.75 0 0 1 0 11.25Zm1.75-.25a.25.25 0 0 0-.25.25v9.5c0 .138.112.25.25.25h2a.75.75 0 0 1 .75.75v2.19l2.72-2.72a.75.75 0 0 1 .53-.22h6.5a.25.25 0 0 0 .25-.25v-9.5a.25.25 0 0 0-.25-.25Zm7 2.25v2.5a.75.75 0 0 1-1.5 0v-2.5a.75.75 0 0 1 1.5 0M9 9a1 1 0 1 1-2 0a1 1 0 0 1 2 0'/%3E%3C/svg%3E");-webkit-mask:var(--un-icon) no-repeat;mask:var(--un-icon) no-repeat;-webkit-mask-size:100% 100%;mask-size:100% 100%;background-color:currentColor;color:inherit;display:inline-block;vertical-align:text-bottom;width:1em;height:1em;}
|
||||
.octicon-stop-16{--un-icon:url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 16 16' display='inline-block' vertical-align='text-bottom' width='1em' height='1em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M4.47.22A.75.75 0 0 1 5 0h6c.199 0 .389.079.53.22l4.25 4.25c.141.14.22.331.22.53v6a.75.75 0 0 1-.22.53l-4.25 4.25A.75.75 0 0 1 11 16H5a.75.75 0 0 1-.53-.22L.22 11.53A.75.75 0 0 1 0 11V5c0-.199.079-.389.22-.53Zm.84 1.28L1.5 5.31v5.38l3.81 3.81h5.38l3.81-3.81V5.31L10.69 1.5ZM8 4a.75.75 0 0 1 .75.75v3.5a.75.75 0 0 1-1.5 0v-3.5A.75.75 0 0 1 8 4m0 8a1 1 0 1 1 0-2a1 1 0 0 1 0 2'/%3E%3C/svg%3E");-webkit-mask:var(--un-icon) no-repeat;mask:var(--un-icon) no-repeat;-webkit-mask-size:100% 100%;mask-size:100% 100%;background-color:currentColor;color:inherit;display:inline-block;vertical-align:text-bottom;width:1em;height:1em;}
|
||||
/* layer: shortcuts */
|
||||
.z-fixed{z-index:200;}
|
||||
/* layer: default */
|
||||
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0;}
|
||||
.visible{visibility:visible;}
|
||||
.absolute{position:absolute;}
|
||||
.fixed{position:fixed;}
|
||||
.relative{position:relative;}
|
||||
.sticky{position:sticky;}
|
||||
.static{position:static;}
|
||||
.inset-0{inset:0;}
|
||||
.inset-x-0{left:0;right:0;}
|
||||
.bottom-0{bottom:0;}
|
||||
.order-0{order:0;}
|
||||
.order-1{order:1;}
|
||||
.order-2{order:2;}
|
||||
.order-3{order:3;}
|
||||
.order-4{order:4;}
|
||||
.order-5{order:5;}
|
||||
.order-first{order:-9999;}
|
||||
.order-last{order:9999;}
|
||||
.mx-auto{margin-left:auto;margin-right:auto;}
|
||||
.my-4{margin-top:1rem;margin-bottom:1rem;}
|
||||
.me{margin-inline-end:1rem;}
|
||||
.me-1{margin-inline-end:0.25rem;}
|
||||
.me-1\.5{margin-inline-end:0.375rem;}
|
||||
.me-2{margin-inline-end:0.5rem;}
|
||||
.ms-1{margin-inline-start:0.25rem;}
|
||||
.inline{display:inline;}
|
||||
.block{display:block;}
|
||||
.contents{display:contents;}
|
||||
.hidden{display:none;}
|
||||
.aspect-video{aspect-ratio:16/9;}
|
||||
.h-\[1\.25em\]{height:1.25em;}
|
||||
.h-full{height:100%;}
|
||||
.w-full{width:100%;}
|
||||
.flex{display:flex;}
|
||||
.flex-col{flex-direction:column;}
|
||||
.table{display:table;}
|
||||
.transform{transform:translateX(var(--un-translate-x)) translateY(var(--un-translate-y)) translateZ(var(--un-translate-z)) rotate(var(--un-rotate)) rotateX(var(--un-rotate-x)) rotateY(var(--un-rotate-y)) rotateZ(var(--un-rotate-z)) skewX(var(--un-skew-x)) skewY(var(--un-skew-y)) scaleX(var(--un-scale-x)) scaleY(var(--un-scale-y)) scaleZ(var(--un-scale-z));}
|
||||
.resize{resize:both;}
|
||||
.break-before-page{break-before:page;}
|
||||
.break-after-page{break-after:page;}
|
||||
.items-center{align-items:center;}
|
||||
.self-stretch{align-self:stretch;}
|
||||
.justify-center{justify-content:center;}
|
||||
.whitespace-nowrap{white-space:nowrap;}
|
||||
.b,
|
||||
.border{border-width:1px;}
|
||||
.bg-danger{background-color:var(--fi-danger);}
|
||||
.bg-info{background-color:var(--fi-info);}
|
||||
.bg-primary{background-color:var(--fi-primary);}
|
||||
.bg-success{background-color:var(--fi-success);}
|
||||
.bg-warning{background-color:var(--fi-warning);}
|
||||
.px{padding-left:1rem;padding-right:1rem;}
|
||||
.pl{padding-left:1rem;}
|
||||
.pt{padding-top:1rem;}
|
||||
.text-center{text-align:center;}
|
||||
.indent{text-indent:1.5rem;}
|
||||
.align-text-bottom{vertical-align:text-bottom;}
|
||||
.text-3xl{font-size:1.875rem;line-height:2.25rem;}
|
||||
.text-5xl{font-size:3rem;line-height:1;}
|
||||
.text-base{font-size:1rem;line-height:1.5rem;}
|
||||
.text-lg{font-size:1.125rem;line-height:1.75rem;}
|
||||
.text-danger{color:var(--fi-danger);}
|
||||
.text-info{color:var(--fi-info);}
|
||||
.text-primary{color:var(--fi-primary);}
|
||||
.text-secondary{color:var(--fi-secondary);}
|
||||
.text-success{color:var(--fi-success);}
|
||||
.text-warning{color:var(--fi-warning);}
|
||||
.text-white{--un-text-opacity:1;color:rgb(255 255 255 / var(--un-text-opacity));}
|
||||
.font-bold{font-weight:700;}
|
||||
.capitalize{text-transform:capitalize;}
|
||||
.lining-nums{--un-numeric-figure:lining-nums;font-variant-numeric:var(--un-ordinal) var(--un-slashed-zero) var(--un-numeric-figure) var(--un-numeric-spacing) var(--un-numeric-fraction);}
|
||||
.tabular-nums{--un-numeric-spacing:tabular-nums;font-variant-numeric:var(--un-ordinal) var(--un-slashed-zero) var(--un-numeric-figure) var(--un-numeric-spacing) var(--un-numeric-fraction);}
|
||||
.underline{text-decoration-line:underline;}
|
||||
.tab{-moz-tab-size:4;-o-tab-size:4;tab-size:4;}
|
||||
.text-shadow{--un-text-shadow:0 0 1px var(--un-text-shadow-color, rgb(0 0 0 / 0.2)),0 0 1px var(--un-text-shadow-color, rgb(1 0 5 / 0.1));text-shadow:var(--un-text-shadow);}
|
||||
.text-shadow-md{--un-text-shadow:0 1px 2px var(--un-text-shadow-color, rgb(30 29 39 / 0.19)),1px 2px 4px var(--un-text-shadow-color, rgb(54 64 147 / 0.18));text-shadow:var(--un-text-shadow);}
|
||||
.opacity-50{opacity:0.5;}
|
||||
.shadow{--un-shadow:var(--un-shadow-inset) 0 1px 3px 0 var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 1px 2px -1px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);}
|
||||
.blur{--un-blur:blur(8px);filter:var(--un-blur) var(--un-brightness) var(--un-contrast) var(--un-drop-shadow) var(--un-grayscale) var(--un-hue-rotate) var(--un-invert) var(--un-saturate) var(--un-sepia);}
|
||||
.ease-out{transition-timing-function:cubic-bezier(0, 0, 0.2, 1);}
|
||||
@media print{
|
||||
.print\:hidden{display:none;}
|
||||
}
|
||||
@media (max-width: 679.9px){
|
||||
.max-sm\:hidden{display:none;}
|
||||
.max-sm\:w-full{width:100%;}
|
||||
}
|
||||
@media (min-width: 680px){
|
||||
.sm\:hidden{display:none;}
|
||||
}
|
||||
@@ -3,11 +3,11 @@
|
||||
|
||||
prefix:
|
||||
libFiles: https://cdn.jsdelivr.net/npm/
|
||||
# simple-icons@9.19.0 https://github.com/simple-icons/simple-icons
|
||||
simpleIcons: https://cdn.jsdelivr.net/npm/simple-icons@9.19.0/icons/
|
||||
# simple-icons@16.24.1 https://github.com/simple-icons/simple-icons
|
||||
simpleIcons: https://cdn.jsdelivr.net/npm/simple-icons@16.24.1/icons/
|
||||
libFiles:
|
||||
# algoliasearch@4.20.0 https://github.com/algolia/algoliasearch-client-javascript
|
||||
algoliasearchJS: algoliasearch@4.20.0/dist/algoliasearch-lite.umd.min.js
|
||||
# algoliasearch@5.55.1 https://github.com/algolia/algoliasearch-client-javascript
|
||||
algoliasearchJS: algoliasearch@5.55.1/dist/lite/builds/browser.umd.js
|
||||
# animate.css@4.1.1 https://github.com/daneden/animate.css
|
||||
animateCSS: animate.css@4.1.1/animate.min.css
|
||||
# aplayer@1.10.1 https://github.com/MoePlayer/APlayer
|
||||
@@ -16,67 +16,59 @@ libFiles:
|
||||
# artalk@latest https://github.com/ArtalkJS/Artalk
|
||||
artalkCSS: artalk@latest/dist/Artalk.css
|
||||
artalkJS: artalk@latest/dist/Artalk.js
|
||||
# autocomplete-js@0.38.1 https://github.com/algolia/autocomplete
|
||||
# TODO update autocompleteJS: '@algolia/autocomplete-js@1.7.1/dist/umd/index.production.js'
|
||||
autocompleteJS: autocomplete.js@0.38.1/dist/autocomplete.min.js
|
||||
# cell-tooltip@0.1.2 https://github.com/Lruihao/cell-tooltip
|
||||
cellTooltipJS: cell-tooltip@0.1.2/dist/cell-tooltip.umd.cjs
|
||||
# cell-watermark@1.0.3 https://github.com/Lruihao/watermark
|
||||
cellWatermarkJS: cell-watermark@1.0.3/src/watermark.min.js
|
||||
# @algolia/autocomplete-js@1.19.9 https://github.com/algolia/autocomplete
|
||||
autocompleteJS: '@algolia/autocomplete-js@1.19.9/dist/umd/index.production.js'
|
||||
# cell-tooltip@0.3.1 https://github.com/Lruihao/cell-tooltip
|
||||
cellTooltipJS: cell-tooltip@0.3.1/dist/cell-tooltip.umd.js
|
||||
# cell-watermark@1.0.4 https://github.com/Lruihao/watermark
|
||||
cellWatermarkJS: cell-watermark@1.0.4/src/watermark.js
|
||||
# cookieconsent@3.1.1 https://github.com/osano/cookieconsent
|
||||
cookieconsentCSS: cookieconsent@3.1.1/build/cookieconsent.min.css
|
||||
cookieconsentJS: cookieconsent@3.1.1/build/cookieconsent.min.js
|
||||
# crypto-js@4.2.0 https://github.com/brix/crypto-js
|
||||
cryptoCoreJS: crypto-js@4.2.0/core.js
|
||||
cryptoEncBase64JS: crypto-js@4.2.0/enc-base64.js
|
||||
cryptoSha256JS: crypto-js@4.2.0/sha256.js
|
||||
# echarts@5.3.3 https://github.com/apache/echarts
|
||||
echartsJS: echarts@5.3.3/dist/echarts.min.js
|
||||
# fontawesome-free@7.1.0 https://github.com/FortAwesome/Font-Awesome
|
||||
fontawesomeFreeCSS: '@fortawesome/fontawesome-free@7.1.0/css/all.min.css'
|
||||
# fusejs@6.6.2 https://github.com/krisk/fuse
|
||||
fuseJS: fuse.js@6.6.2/dist/fuse.min.js
|
||||
# gitalk@1.7.2 https://github.com/gitalk/gitalk
|
||||
gitalkCSS: gitalk@1.7.2/dist/gitalk.min.css
|
||||
gitalkJS: gitalk@1.7.2/dist/gitalk.min.js
|
||||
# echarts@6.1.0 https://github.com/apache/echarts
|
||||
echartsJS: echarts@6.1.0/dist/echarts.min.js
|
||||
# @fortawesome/fontawesome-free@7.3.0 https://github.com/FortAwesome/Font-Awesome
|
||||
fontawesomeFreeCSS: '@fortawesome/fontawesome-free@7.3.0/css/all.min.css'
|
||||
# gitalk@1.8.0 https://github.com/gitalk/gitalk
|
||||
gitalkCSS: gitalk@1.8.0/dist/gitalk.min.css
|
||||
gitalkJS: gitalk@1.8.0/dist/gitalk.min.js
|
||||
# instant.page@5.2.0 https://github.com/instantpage/instant.page
|
||||
instantPage: instant.page@5.2.0/instantpage.min.js
|
||||
# json-viewer-element@1.0.4 https://github.com/Lruihao/json-viewer-element
|
||||
jsonViewerElementJS: json-viewer-element@1.0.4/dist/json-viewer-element.umd.js
|
||||
# katex@0.16.22 https://github.com/KaTeX/KaTeX
|
||||
katexCopyTexJS: katex@0.16.22/dist/contrib/copy-tex.min.js
|
||||
katexCSS: katex@0.16.22/dist/katex.min.css
|
||||
# lightgallery@2.7.2 https://github.com/sachinchoolur/lightgallery
|
||||
lightgalleryCSS: lightgallery@2.7.2/css/lightgallery-bundle.min.css
|
||||
lightgalleryJS: lightgallery@2.7.2/lightgallery.min.js
|
||||
lightgalleryThumbnailJS: lightgallery@2.7.2/plugins/thumbnail/lg-thumbnail.min.js
|
||||
lightgalleryZoomJS: lightgallery@2.7.2/plugins/zoom/lg-zoom.min.js
|
||||
# mapbox-gl@2.10.0 https://docs.mapbox.com/mapbox-gl-js
|
||||
# TODO update to 3.x
|
||||
mapboxGLCSS: mapbox-gl@2.10.0/dist/mapbox-gl.css
|
||||
mapboxGLJS: mapbox-gl@2.10.0/dist/mapbox-gl.js
|
||||
# meting@2.0.1 https://github.com/metowolf/MetingJS
|
||||
metingJS: meting@2.0.1/dist/Meting.min.js
|
||||
# json-viewer-element@1.0.6 https://github.com/Lruihao/json-viewer-element
|
||||
jsonViewerElementJS: json-viewer-element@1.0.6/dist/json-viewer-element.umd.js
|
||||
# katex@0.17.0 https://github.com/KaTeX/KaTeX
|
||||
katexCopyTexJS: katex@0.17.0/dist/contrib/copy-tex.min.js
|
||||
katexCSS: katex@0.17.0/dist/katex.min.css
|
||||
# lightgallery@2.9.0 https://github.com/sachinchoolur/lightgallery
|
||||
lightgalleryCSS: lightgallery@2.9.0/css/lightgallery-bundle.min.css
|
||||
lightgalleryJS: lightgallery@2.9.0/lightgallery.min.js
|
||||
lightgalleryThumbnailJS: lightgallery@2.9.0/plugins/thumbnail/lg-thumbnail.min.js
|
||||
lightgalleryZoomJS: lightgallery@2.9.0/plugins/zoom/lg-zoom.min.js
|
||||
# mapbox-gl@3.25.0 https://docs.mapbox.com/mapbox-gl-js
|
||||
mapboxGLCSS: mapbox-gl@3.25.0/dist/mapbox-gl.css
|
||||
mapboxGLJS: mapbox-gl@3.25.0/dist/mapbox-gl.js
|
||||
# meting@2.0.2 https://github.com/metowolf/MetingJS
|
||||
metingJS: meting@2.0.2/dist/Meting.min.js
|
||||
# object-fit-images@3.2.4 https://github.com/fregante/object-fit-images
|
||||
objectFitImagesJS: object-fit-images@3.2.4/dist/ofi.min.js
|
||||
# pangu.js@4.0.7 https://github.com/vinta/pangu.js
|
||||
panguJS: pangu@4.0.7/dist/browser/pangu.min.js
|
||||
# pace-js@1.2.4 https://github.com/CodeByZach/pace
|
||||
paceJS: pace-js@1.2.4
|
||||
# sharer.js@0.5.1 https://github.com/ellisonleao/sharer.js
|
||||
sharerJS: sharer.js@0.5.1/sharer.min.js
|
||||
# pangu@7.2.1 https://github.com/vinta/pangu.js
|
||||
panguJS: pangu@7.2.1/dist/browser/pangu.min.js
|
||||
# @panzoom/panzoom@4.6.2 https://github.com/timmywil/panzoom
|
||||
panzoomJS: '@panzoom/panzoom@4.6.2/dist/panzoom.min.js'
|
||||
# sharer.js@0.5.4 https://github.com/ellisonleao/sharer.js
|
||||
sharerJS: sharer.js@0.5.4/sharer.min.js
|
||||
# @github/tab-container-element@4.8.2 https://github.com/github/tab-container-element
|
||||
tabContainerElementJS: '@github/tab-container-element@4.8.2/dist/index.min.js'
|
||||
tabContainerElementJS: '@github/tab-container-element@4.8.2/dist/bundle.min.js'
|
||||
# twemoji@14.0.2 https://github.com/twitter/twemoji
|
||||
twemojiJS: twemoji@14.0.2/dist/twemoji.min.js
|
||||
# twikoo@1.7.3 https://github.com/imaegoo/twikoo
|
||||
twikooJS: twikoo@1.7.3/dist/twikoo.all.min.js
|
||||
# typeit@8.8.4 https://github.com/alexmacarthur/typeit
|
||||
typeitJS: typeit@8.8.4/dist/index.umd.js
|
||||
# valine@1.5.2 https://github.com/xCss/Valine
|
||||
valineJS: valine@1.5.2/dist/Valine.min.js
|
||||
# waline@3.12.1 https://github.com/walinejs/waline
|
||||
walineCSS: '@waline/client@3.12.1/dist/waline.css'
|
||||
walineJS: '@waline/client@3.12.1/dist/waline.umd.js'
|
||||
# xxhash-wasm@1.0.2 https://github.com/jungomi/xxhash-wasm
|
||||
xxhashWasmJS: xxhash-wasm@1.0.2/umd/xxhash-wasm.js
|
||||
# twikoo@1.7.13 https://github.com/imaegoo/twikoo
|
||||
twikooJS: twikoo@1.7.13/dist/twikoo.all.min.js
|
||||
# typeit@8.8.7 https://github.com/alexmacarthur/typeit
|
||||
typeitJS: typeit@8.8.7/dist/index.umd.js
|
||||
# valine@1.5.3 https://github.com/xCss/Valine
|
||||
valineJS: valine@1.5.3/dist/Valine.min.js
|
||||
# @waline/client@3.15.2 https://github.com/walinejs/waline
|
||||
walineCSS: '@waline/client@3.15.2/dist/waline.css'
|
||||
walineJS: '@waline/client@3.15.2/dist/waline.umd.js'
|
||||
|
||||
@@ -3,11 +3,11 @@
|
||||
|
||||
prefix:
|
||||
libFiles: https://unpkg.com/
|
||||
# simple-icons@9.19.0 https://github.com/simple-icons/simple-icons
|
||||
simpleIcons: https://unpkg.com/simple-icons@9.19.0/icons/
|
||||
# simple-icons@16.24.1 https://github.com/simple-icons/simple-icons
|
||||
simpleIcons: https://unpkg.com/simple-icons@16.24.1/icons/
|
||||
libFiles:
|
||||
# algoliasearch@4.20.0 https://github.com/algolia/algoliasearch-client-javascript
|
||||
algoliasearchJS: algoliasearch@4.20.0/dist/algoliasearch-lite.umd.js
|
||||
# algoliasearch@5.55.1 https://github.com/algolia/algoliasearch-client-javascript
|
||||
algoliasearchJS: algoliasearch@5.55.1/dist/lite/builds/browser.umd.js
|
||||
# animate.css@4.1.1 https://github.com/daneden/animate.css
|
||||
animateCSS: animate.css@4.1.1/animate.min.css
|
||||
# aplayer@1.10.1 https://github.com/MoePlayer/APlayer
|
||||
@@ -16,67 +16,59 @@ libFiles:
|
||||
# artalk@latest https://github.com/ArtalkJS/Artalk
|
||||
artalkCSS: artalk@latest/dist/Artalk.css
|
||||
artalkJS: artalk@latest/dist/Artalk.js
|
||||
# autocomplete-js@0.38.1 https://github.com/algolia/autocomplete
|
||||
# TODO update autocompleteJS: '@algolia/autocomplete-js@1.7.1/dist/umd/index.production.js'
|
||||
autocompleteJS: autocomplete.js@0.38.1/dist/autocomplete.min.js
|
||||
# cell-tooltip@0.1.2 https://github.com/Lruihao/cell-tooltip
|
||||
cellTooltipJS: cell-tooltip@0.1.2/dist/cell-tooltip.umd.cjs
|
||||
# cell-watermark@1.0.3 https://github.com/Lruihao/watermark
|
||||
cellWatermarkJS: cell-watermark@1.0.3/src/watermark.min.js
|
||||
# @algolia/autocomplete-js@1.19.9 https://github.com/algolia/autocomplete
|
||||
autocompleteJS: '@algolia/autocomplete-js@1.19.9/dist/umd/index.production.js'
|
||||
# cell-tooltip@0.3.1 https://github.com/Lruihao/cell-tooltip
|
||||
cellTooltipJS: cell-tooltip@0.3.1/dist/cell-tooltip.umd.js
|
||||
# cell-watermark@1.0.4 https://github.com/Lruihao/watermark
|
||||
cellWatermarkJS: cell-watermark@1.0.4/src/watermark.js
|
||||
# cookieconsent@3.1.1 https://github.com/osano/cookieconsent
|
||||
cookieconsentCSS: cookieconsent@3.1.1/build/cookieconsent.min.css
|
||||
cookieconsentJS: cookieconsent@3.1.1/build/cookieconsent.min.js
|
||||
# crypto-js@4.2.0 https://github.com/brix/crypto-js
|
||||
cryptoCoreJS: crypto-js@4.2.0/core.js
|
||||
cryptoEncBase64JS: crypto-js@4.2.0/enc-base64.js
|
||||
cryptoSha256JS: crypto-js@4.2.0/sha256.js
|
||||
# echarts@5.3.3 https://github.com/apache/echarts
|
||||
echartsJS: echarts@5.3.3/dist/echarts.min.js
|
||||
# fontawesome-free@7.1.0 https://github.com/FortAwesome/Font-Awesome
|
||||
fontawesomeFreeCSS: '@fortawesome/fontawesome-free@7.1.0/css/all.min.css'
|
||||
# fusejs@6.6.2 https://github.com/krisk/fuse
|
||||
fuseJS: fuse.js@6.6.2/dist/fuse.min.js
|
||||
# gitalk@1.7.2 https://github.com/gitalk/gitalk
|
||||
gitalkCSS: gitalk@1.7.2/dist/gitalk.min.css
|
||||
gitalkJS: gitalk@1.7.2/dist/gitalk.min.js
|
||||
# echarts@6.1.0 https://github.com/apache/echarts
|
||||
echartsJS: echarts@6.1.0/dist/echarts.min.js
|
||||
# @fortawesome/fontawesome-free@7.3.0 https://github.com/FortAwesome/Font-Awesome
|
||||
fontawesomeFreeCSS: '@fortawesome/fontawesome-free@7.3.0/css/all.min.css'
|
||||
# gitalk@1.8.0 https://github.com/gitalk/gitalk
|
||||
gitalkCSS: gitalk@1.8.0/dist/gitalk.min.css
|
||||
gitalkJS: gitalk@1.8.0/dist/gitalk.min.js
|
||||
# instant.page@5.2.0 https://github.com/instantpage/instant.page
|
||||
instantPage: instant.page@5.2.0/instantpage.js
|
||||
# json-viewer-element@1.0.4 https://github.com/Lruihao/json-viewer-element
|
||||
jsonViewerElementJS: json-viewer-element@1.0.4/dist/json-viewer-element.umd.js
|
||||
# katex@0.16.22 https://github.com/KaTeX/KaTeX
|
||||
katexCopyTexJS: katex@0.16.22/dist/contrib/copy-tex.min.js
|
||||
katexCSS: katex@0.16.22/dist/katex.min.css
|
||||
# lightgallery@2.7.2 https://github.com/sachinchoolur/lightgallery
|
||||
lightgalleryCSS: lightgallery@2.7.2/css/lightgallery-bundle.min.css
|
||||
lightgalleryJS: lightgallery@2.7.2/lightgallery.min.js
|
||||
lightgalleryThumbnailJS: lightgallery@2.7.2/plugins/thumbnail/lg-thumbnail.min.js
|
||||
lightgalleryZoomJS: lightgallery@2.7.2/plugins/zoom/lg-zoom.min.js
|
||||
# mapbox-gl@2.10.0 https://docs.mapbox.com/mapbox-gl-js
|
||||
# TODO update to 3.x
|
||||
mapboxGLCSS: mapbox-gl@2.10.0/dist/mapbox-gl.css
|
||||
mapboxGLJS: mapbox-gl@2.10.0/dist/mapbox-gl.js
|
||||
# meting@2.0.1 https://github.com/metowolf/MetingJS
|
||||
metingJS: meting@2.0.1/dist/Meting.min.js
|
||||
# json-viewer-element@1.0.6 https://github.com/Lruihao/json-viewer-element
|
||||
jsonViewerElementJS: json-viewer-element@1.0.6/dist/json-viewer-element.umd.js
|
||||
# katex@0.17.0 https://github.com/KaTeX/KaTeX
|
||||
katexCopyTexJS: katex@0.17.0/dist/contrib/copy-tex.min.js
|
||||
katexCSS: katex@0.17.0/dist/katex.min.css
|
||||
# lightgallery@2.9.0 https://github.com/sachinchoolur/lightgallery
|
||||
lightgalleryCSS: lightgallery@2.9.0/css/lightgallery-bundle.min.css
|
||||
lightgalleryJS: lightgallery@2.9.0/lightgallery.min.js
|
||||
lightgalleryThumbnailJS: lightgallery@2.9.0/plugins/thumbnail/lg-thumbnail.min.js
|
||||
lightgalleryZoomJS: lightgallery@2.9.0/plugins/zoom/lg-zoom.min.js
|
||||
# mapbox-gl@3.25.0 https://docs.mapbox.com/mapbox-gl-js
|
||||
mapboxGLCSS: mapbox-gl@3.25.0/dist/mapbox-gl.css
|
||||
mapboxGLJS: mapbox-gl@3.25.0/dist/mapbox-gl.js
|
||||
# meting@2.0.2 https://github.com/metowolf/MetingJS
|
||||
metingJS: meting@2.0.2/dist/Meting.min.js
|
||||
# object-fit-images@3.2.4 https://github.com/fregante/object-fit-images
|
||||
objectFitImagesJS: object-fit-images@3.2.4/dist/ofi.min.js
|
||||
# pangu.js@4.0.7 https://github.com/vinta/pangu.js
|
||||
panguJS: pangu@4.0.7/dist/browser/pangu.min.js
|
||||
# pace-js@1.2.4 https://github.com/CodeByZach/pace
|
||||
paceJS: pace-js@1.2.4
|
||||
# sharer.js@0.5.1 https://github.com/ellisonleao/sharer.js
|
||||
sharerJS: sharer.js@0.5.1/sharer.min.js
|
||||
# pangu@7.2.1 https://github.com/vinta/pangu.js
|
||||
panguJS: pangu@7.2.1/dist/browser/pangu.min.js
|
||||
# @panzoom/panzoom@4.6.2 https://github.com/timmywil/panzoom
|
||||
panzoomJS: '@panzoom/panzoom@4.6.2/dist/panzoom.min.js'
|
||||
# sharer.js@0.5.4 https://github.com/ellisonleao/sharer.js
|
||||
sharerJS: sharer.js@0.5.4/sharer.min.js
|
||||
# @github/tab-container-element@4.8.2 https://github.com/github/tab-container-element
|
||||
tabContainerElementJS: '@github/tab-container-element@4.8.2/dist/index.js'
|
||||
tabContainerElementJS: '@github/tab-container-element@4.8.2/dist/bundle.min.js'
|
||||
# twemoji@14.0.2 https://github.com/twitter/twemoji
|
||||
twemojiJS: twemoji@14.0.2/dist/twemoji.min.js
|
||||
# twikoo@1.7.3 https://github.com/imaegoo/twikoo
|
||||
twikooJS: twikoo@1.7.3/dist/twikoo.all.min.js
|
||||
# typeit@8.8.4 https://github.com/alexmacarthur/typeit
|
||||
typeitJS: typeit@8.8.4/dist/index.umd.js
|
||||
# valine@1.5.2 https://github.com/xCss/Valine
|
||||
valineJS: valine@1.5.2/dist/Valine.min.js
|
||||
# waline@3.12.1 https://github.com/walinejs/waline
|
||||
walineCSS: '@waline/client@3.12.1/dist/waline.css'
|
||||
walineJS: '@waline/client@3.12.1/dist/waline.umd.js'
|
||||
# xxhash-wasm@1.0.2 https://github.com/jungomi/xxhash-wasm
|
||||
xxhashWasmJS: xxhash-wasm@1.0.2/umd/xxhash-wasm.js
|
||||
# twikoo@1.7.13 https://github.com/imaegoo/twikoo
|
||||
twikooJS: twikoo@1.7.13/dist/twikoo.all.min.js
|
||||
# typeit@8.8.7 https://github.com/alexmacarthur/typeit
|
||||
typeitJS: typeit@8.8.7/dist/index.umd.js
|
||||
# valine@1.5.3 https://github.com/xCss/Valine
|
||||
valineJS: valine@1.5.3/dist/Valine.min.js
|
||||
# @waline/client@3.15.2 https://github.com/walinejs/waline
|
||||
walineCSS: '@waline/client@3.15.2/dist/waline.css'
|
||||
walineJS: '@waline/client@3.15.2/dist/waline.umd.js'
|
||||
|
||||
@@ -4,7 +4,7 @@ github:
|
||||
Prefix: https://github.com/
|
||||
Title: GitHub
|
||||
Icon:
|
||||
Class: fa-brands fa-github-alt
|
||||
Class: fa-brands fa-github
|
||||
|
||||
# 002: LinkedIn
|
||||
linkedin:
|
||||
@@ -17,7 +17,7 @@ linkedin:
|
||||
# 003: Twitter (X)
|
||||
twitter:
|
||||
Weight: 3
|
||||
Prefix: https://twitter.com/
|
||||
Prefix: https://x.com/
|
||||
Title: X
|
||||
Icon:
|
||||
Class: fa-brands fa-x-twitter
|
||||
@@ -539,15 +539,15 @@ qq:
|
||||
Template: https://wpa.qq.com/msgrd?v=3&uin=%v&site=qq&menu=yes
|
||||
Title: QQ
|
||||
Icon:
|
||||
Simpleicons: tencentqq
|
||||
Simpleicons: qq
|
||||
|
||||
# 069: QQ Group
|
||||
qqgroup:
|
||||
Weight: 69
|
||||
Template: https://qm.qq.com/cgi-bin/qm/qr?k=%v&jump_from=webapi
|
||||
Prefix: https://qm.qq.com/q/
|
||||
Title: QQ Group
|
||||
Icon:
|
||||
Simpleicons: tencentqq
|
||||
Simpleicons: qq
|
||||
|
||||
# 070: Diaspora
|
||||
diaspora:
|
||||
|
||||
@@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path d="M6.457 1.047c.659-1.234 2.427-1.234 3.086 0l6.082 11.378A1.75 1.75 0 0 1 14.082 15H1.918a1.75 1.75 0 0 1-1.543-2.575Zm1.763.707a.25.25 0 0 0-.44 0L1.698 13.132a.25.25 0 0 0 .22.368h12.164a.25.25 0 0 0 .22-.368Zm.53 3.996v2.5a.75.75 0 0 1-1.5 0v-2.5a.75.75 0 0 1 1.5 0ZM9 11a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z"></path></svg>
|
||||
|
Before Width: | Height: | Size: 409 B |
@@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path d="M0 8a8 8 0 1 1 16 0A8 8 0 0 1 0 8Zm8-6.5a6.5 6.5 0 1 0 0 13 6.5 6.5 0 0 0 0-13ZM6.5 7.75A.75.75 0 0 1 7.25 7h1a.75.75 0 0 1 .75.75v2.75h.25a.75.75 0 0 1 0 1.5h-2a.75.75 0 0 1 0-1.5h.25v-2h-.25a.75.75 0 0 1-.75-.75ZM8 6a1 1 0 1 1 0-2 1 1 0 0 1 0 2Z"></path></svg>
|
||||
|
Before Width: | Height: | Size: 354 B |
@@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path d="M8 1.5c-2.363 0-4 1.69-4 3.75 0 .984.424 1.625.984 2.304l.214.253c.223.264.47.556.673.848.284.411.537.896.621 1.49a.75.75 0 0 1-1.484.211c-.04-.282-.163-.547-.37-.847a8.456 8.456 0 0 0-.542-.68c-.084-.1-.173-.205-.268-.32C3.201 7.75 2.5 6.766 2.5 5.25 2.5 2.31 4.863 0 8 0s5.5 2.31 5.5 5.25c0 1.516-.701 2.5-1.328 3.259-.095.115-.184.22-.268.319-.207.245-.383.453-.541.681-.208.3-.33.565-.37.847a.751.751 0 0 1-1.485-.212c.084-.593.337-1.078.621-1.489.203-.292.45-.584.673-.848.075-.088.147-.173.213-.253.561-.679.985-1.32.985-2.304 0-2.06-1.637-3.75-4-3.75ZM5.75 12h4.5a.75.75 0 0 1 0 1.5h-4.5a.75.75 0 0 1 0-1.5ZM6 15.25a.75.75 0 0 1 .75-.75h2.5a.75.75 0 0 1 0 1.5h-2.5a.75.75 0 0 1-.75-.75Z"></path></svg>
|
||||
|
Before Width: | Height: | Size: 800 B |
@@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path d="M0 1.75C0 .784.784 0 1.75 0h12.5C15.216 0 16 .784 16 1.75v9.5A1.75 1.75 0 0 1 14.25 13H8.06l-2.573 2.573A1.458 1.458 0 0 1 3 14.543V13H1.75A1.75 1.75 0 0 1 0 11.25Zm1.75-.25a.25.25 0 0 0-.25.25v9.5c0 .138.112.25.25.25h2a.75.75 0 0 1 .75.75v2.19l2.72-2.72a.749.749 0 0 1 .53-.22h6.5a.25.25 0 0 0 .25-.25v-9.5a.25.25 0 0 0-.25-.25Zm7 2.25v2.5a.75.75 0 0 1-1.5 0v-2.5a.75.75 0 0 1 1.5 0ZM9 9a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z"></path></svg>
|
||||
|
Before Width: | Height: | Size: 524 B |
@@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16"><path d="M4.47.22A.749.749 0 0 1 5 0h6c.199 0 .389.079.53.22l4.25 4.25c.141.14.22.331.22.53v6a.749.749 0 0 1-.22.53l-4.25 4.25A.749.749 0 0 1 11 16H5a.749.749 0 0 1-.53-.22L.22 11.53A.749.749 0 0 1 0 11V5c0-.199.079-.389.22-.53Zm.84 1.28L1.5 5.31v5.38l3.81 3.81h5.38l3.81-3.81V5.31L10.69 1.5ZM8 4a.75.75 0 0 1 .75.75v3.5a.75.75 0 0 1-1.5 0v-3.5A.75.75 0 0 1 8 4Zm0 8a1 1 0 1 1 0-2 1 1 0 0 1 0 2Z"></path></svg>
|
||||
|
Before Width: | Height: | Size: 493 B |
@@ -0,0 +1 @@
|
||||
<svg height="200" viewBox="0 0 1024 1024" width="200" xmlns="http://www.w3.org/2000/svg"><path d="m165.092285 116.164732c-25.344127 4.565483-52.891625 20.150029-71.782258 40.613251-7.39749 8.184825-12.434949 15.741121-18.575209 28.491493-14.638385 29.753014-13.537836 3.462746-13.065796 326.63738l.471998 284.136138 3.621509 11.804231c14.797126 47.856269 52.734987 81.226502 100.432514 88.15414 15.269124 2.203371 164.184377 2.046753 172.841242-.158763 17.472495-4.406741 29.278872-24.556749 24.715513-41.872626-2.205516-8.341486-10.390385-19.04725-17.47464-23.297374-5.352882-2.990749-8.500248-3.147366-88.939372-3.934744l-83.429872-.787378-10.547002-5.194119c-11.962994-5.82488-20.150051-14.325128-25.974888-26.603503l-3.775981-8.184868-.158784-275.949125c-.156596-151.747239.31538-278.467876 1.102779-281.46077 4.565505-20.93524 23.138612-38.407734 45.178756-42.50122 4.87876-.944016 108.302002-1.574777 267.605493-1.574777 259.105246 0 259.577244 0 269.33897 3.306129 11.963037 4.093485 22.351276 11.490997 29.120108 20.937386 11.019043 15.269123 10.390428 7.869488 11.334423 140.412859l.787378 119.636382 4.247978 6.453495c12.909136 19.521393 37.15265 23.456094 53.522386 8.659075 12.909136-11.649867 12.278375-3.304048 12.278375-137.737555 0-131.129524 0-131.601522-9.759624-154.898896-16.056501-38.881834-55.410376-69.104787-98.855613-76.030279-6.768875-.943953-101.533127-1.574713-276.264505-1.41595-218.335377.156617-268.236254.471997-277.995878 2.359988z"/><path d="m250.725528 303.805245c-13.694367 5.663972-22.353378 18.257727-22.509996 32.739472 0 11.021145 6.453495 23.29952 15.584504 29.753014l6.768875 4.722122h317.034309l6.612386-4.406741c10.231557-6.768875 15.110296-15.269124 15.741057-27.862879.471998-8.343631 0-11.806377-2.675368-16.841733-4.09355-8.030396-14.009748-16.687262-22.037999-19.049396-4.408887-1.415993-46.753511-1.88799-156.943504-1.731373-138.527014 0-151.434004.31538-157.574264 2.675369z"/><path d="m246.947402 467.515521c-23.769372 12.437095-25.028747 47.066703-2.359988 60.919791l7.71287 4.7221 104.680493.472126 104.526021.31538 8.341486-3.776002c23.140756-10.54919 27.706218-42.188135 8.500248-58.244551-10.705765-9.130944-7.08417-8.817774-119.479764-8.817774h-103.577735z"/><path d="m634.191337 520.565867c-10.705743 3.46281-22.040058 11.649759-27.547412 19.832482-2.677428 3.936932-9.289772 17.79002-14.640509 30.69701-5.509499 12.909135-20.778623 48.956881-34.003138 80.123743-13.22237 31.169093-29.435489 69.420039-35.88907 85.004628-33.844289 81.069884-45.178583 107.830005-49.113413 116.489016-8.028251 17.944492-6.927638 32.739472 3.462703 44.704612 7.240916 8.500248 16.056545 12.593755 26.916781 12.750372 10.390384 0 18.262018-3.303983 25.816125-10.547001 5.82488-5.666117 10.075004-14.797126 30.225012-63.438628l5.350737-13.378987 83.273255-.471998 83.114492-.31538 12.437138 30.222867c15.584503 38.0945 20.150008 46.753511 26.76012 51.319015 24.715512 16.841734 58.08789-.158763 58.08789-29.594251 0-7.712871-3.306129-16.528499-30.381629-81.069885-16.687262-39.825873-36.206509-86.577238-43.445237-103.893115-17.173505-41.437466-34.437226-82.837515-51.791013-124.19974-7.556253-17.79002-10.705764-23.29952-16.843879-29.596397-13.53775-13.853131-35.103751-19.991246-51.790927-14.638363zm27.388821 131.755993c6.453495 15.897739 18.259937 44.389232 26.131505 63.28201 7.871634 19.04725 14.166366 34.788371 13.853217 35.101606-.315402.31538-24.715598.31538-53.99447.158763l-53.520305-.471998 18.575317-43.290765c10.072794-23.769371 22.194616-52.262946 26.76012-63.279864 4.565505-11.018999 8.815629-20.150008 9.287626-20.150008.471912 0 6.296921 12.909178 12.90699 28.650256z"/><path d="m915.806665 519.937252c-7.712871 2.201225-18.418635 11.647614-21.881382 19.360549-2.831985 6.13805-2.990748 14.638363-2.990748 174.887931 0 159.621017.158763 168.74988 2.990748 174.731378 3.462747 7.871633 13.537751 17.159259 21.409384 19.67801 15.112506 5.035357 33.687758-2.205516 42.501241-16.371881l4.724267-7.712871v-169.380641c0-162.29424-.158762-169.535113-2.992894-174.887995-8.813483-16.685203-26.916737-25.028748-43.760616-20.306626z"/></svg>
|
||||
|
After Width: | Height: | Size: 4.0 KiB |