# craft-flow-web

**Repository Path**: simafei/craft-flow-web

## Basic Information

- **Project Name**: craft-flow-web
- **Description**: 轻量级流程编排前端服务
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2024-07-16
- **Last Updated**: 2025-08-01

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# CraftFlow Web
- 轻量级的流程编排Web

## 相关技术
- Vite
- React
- UnoCSS
- Typescript
- AntDesign
- Recoil
- Antv/x6
- Antv/xflow
- Scss
- Emotion

## 推荐安装vscode插件

- UnoCSS
- Eslint
- Code Spell Checker
- Auto Close Tag
- Auto Rename Tag
- Path Autocomplete
- Prettier - Code formatter

## unocss样式预测

### 字体
- 在标签class中直接使用 text-字体大小， 例如: 不加粗字体`<div class="text-12" />`, <b>加粗字体</b>`<div class="text-12--bold" />`
- 提供`12 ~ 48`字体大小的快捷配置，一般为4的倍数
- 详情查看 `uno.config.ts` 下的shortcuts

### 颜色
- 在标签class中直接使用背景颜色 `bg-色系-色号`, 例如：使用主色 `<div class="bg-primary-500" />`

- 在标签class中直接使用字体颜色 `text-色系-色号`, 例如：使用灰色 `<div class="text-gray-500" />`

- 在scss中使用颜色变量 `$colors-色系-色号`  例如：使用主色 `color: $colors-primary-500;`

### 字体图标
- 已支持使用solar字体图标(7000+个)，在标签class中直接使用 `i-solar:图标名`，例如 ：`<div class="i-solar:arrow-left-outline" />`
- 更多图标请访问 [https://icones.js.org/collection/solar](https://icones.js.org/collection/solar)， 选择心仪的图标复制即可。