diff --git a/packages/.DS_Store b/packages/.DS_Store
index 1e20d54b84ace4bf56741b84f9cfbcacab7b2665..bcea691dcd5057e7a4d0539e7351369d24462eac 100644
Binary files a/packages/.DS_Store and b/packages/.DS_Store differ
diff --git a/packages/farris-theme/README.md b/packages/farris-theme/README.md
index 27de50ba1e90dcdd75b71405f114e6455014cb3c..b986578936d86c86bf49e99560277522c5e98a2b 100644
--- a/packages/farris-theme/README.md
+++ b/packages/farris-theme/README.md
@@ -9,18 +9,24 @@
### 1.1 部分主题界面示例
#### 1.1.1 商务风-蓝色主题
-
-
+
+
+
#### 1.1.2 商务风-绿色主题
-
+
+
+
#### 1.1.3 拟物风-红色主题
-
+
+
+
### 1.2 主题文件生成
+
#### 1.2.1 初次生成
1. 全局安装 gulp 包 :
@@ -32,20 +38,32 @@
```
npm install
```
+ ```
+ npm install
+ ```
+3. 生成默认主题:
3. 生成默认主题:
```
gulp theme
```
+ ```
+ gulp theme
+ ```
#### 1.2.2 后续生成
+#### 1.2.2 后续生成
1. 生成所有主题
在终端运行如下命令可以生成 farris 下的所有主题:
```
./themes.sh
```
+ 在终端运行如下命令可以生成 farris 下的所有主题:
+ ```
+ ./themes.sh
+ ```
2. 生成特定主题
```
gulp theme --code 主题编码 --type 主题尺寸
@@ -59,13 +77,80 @@
packages/farris-theme/src/assets/themes/主题风格-颜色
```
+### 1.3 新增主题
+
+#### 1.3.1 新增主题以现有主题为基础
+
+Farris 主题工具支持用户新增类似风格的主题,以下示例为如何以商务风绿色主题为基础,快速新增加一个主题:
+
+1. 修改 `packages/farris-theme/themes/setting.json`文件,在最后面追加新的主题节点。
+
+ 以下示例假设新增主题名称为`test-green`:
+
+ ```
+ {
+ "theme": "test-green",
+ "types": ["default", "loose"],
+ "dist": "src/assets/themes/test-green"
+ }
+ ```
+
+2. 拷贝 `green` 文件夹,重名为新主题的名字 `test-green`
+ a. 修改 `test-green/base` 文件,根据具体需求调整颜色变量和尺寸变量
+ b. 修改 `test-green/default` 文件中的 `extend.scss` ,调整自有样式。同时在`index.scss`文件中调整变量
+ c. 修改 `test-green/loose` 文件中的 `extend.scss` ,调整自有样式。同时在`index.scss` 文件中调整变量
+
+3. 执行如下命令生成该主题的紧凑版:
+ ```
+ gulp theme --code test-green --type default
+ ```
+ 生成文件路径为:
+ ```
+ packages/farris-theme/src/assets/themes/test-green/default
+ ```
+
+#### 1.3.2 新增主题不同于现有风格
+
+Farris 主题工具支持用户新增不同风格的主题,以下示例为如何增加一个完全不同于现有风格的主题:
+
+1. 修改 `packages/farris-theme/themes/setting.json`文件,在最后面追加新的主题节点。
+
+ 以下示例假设新增主题名称为`test-default`:
+
+ ```
+ {
+ "theme": "test-default",
+ "types": ["default", "loose"],
+ "dist": "src/assets/themes/test-default"
+ }
+ ```
+
+2. 拷贝 `mimicry` 文件夹,重命名为 `test-default`
+ a. 根据需求决定是否修改 `assets/imgs` 文件夹,调整图片资源
+ b. 根据需求决定是否修改 `base/color`文件夹,调整颜色变量。保留结构`_color.scss` 作为当前文件夹的出口文件,可增加、删除、修改文件
+ c. 根据需求决定是否修改 `base/extend` 文件夹,调整自有样式。保留结构`_extend.scss` 作为当前文件夹的出口文件,可增加、删除、修改文件
+ d. 根据需求决定是否修改 `base/size` 文件夹,调整尺寸变量。保留结构`size.scss` 和`loose.scss` 作为紧凑尺寸和宽松尺寸的出口文件,可增加、删除、修改文件
+3. 执行如下命令生成该主题的紧凑版:
+
+ ```
+ gulp theme --code test-default --type default
+ ```
+
+ 生成文件路径为:
+
+ ```
+ packages/farris-theme/src/assets/themes/test-default/default
+ ```
+
## 2. 公共样式文件
### 2.1 公共样式界面示例
当前可生成的公共样式包括:商务风-蓝色、绿色、红色主题,拟物风-蓝色、绿色、红色主题。暗黑主题将在后续迭代更新。
-
+
+
+
### 2.2 公共样式生成
@@ -73,13 +158,12 @@
1. 生成默认公共样式
- 在终端输入如下命令来生成默认公共样式(即商务风下的蓝色主题公共样式):
+ 在终端输入如下命令来生成默认公共样式(即商务风下的蓝色主题公共样式):
```
gulp pubsite
```
-
#### 2.2.2 后续生成
1. 生成所有公共样式
@@ -102,16 +186,16 @@
```
packages/farris-theme/dist/farris-pub
```
- 双击index.html文件,可在浏览器中查看所有生成的公共样式。若某个风格下的样式还没有生成,则该风格下的色值展示将全部置灰。
+ 双击 index.html 文件,可在浏览器中查看所有生成的公共样式。若某个风格下的样式还没有生成,则该风格下的色值展示将全部置灰。
重新运行如下命令,刷新页面,即可查看。
```
./farris-pub.sh
```
-
-
+## 3. 更新日志
## 3. 更新日志
+##### v0.0.8 Date:2023-1-5--2023-1-6
##### v0.0.8 Date:2023-1-5--2023-1-6
1. gulpfile: 修改 gulpfile 文件
@@ -120,6 +204,7 @@
b. 公共样式站点调整(暂不显示暗黑主题相关内容)
c. 增加 farris-pub.sh 文件
d. 增加 公共样式文件说明文档
+ d. 增加 公共样式文件说明文档
##### v0.0.7 Date:2023-1-4