扩展应用
文档目的：为设计/研发流程提供完善灵活的基建，帮助设计师和开发者进行高效的工作，在扩展应用的方案设计与开发实现过程中，请严格遵循以下规范产出「视觉稿」并实现交互视觉效果。
开放坑位示意
扩展应用容器框架分为两种：1/2屏（宽度720px）、1/4屏（宽度375px）。
1、开放坑位总宽为容器框架宽度，高度不限制，建议前端自适应开发。
2、四周边距为18px（1/4底部输入模块四周间距为12px）。
3、其他规范遵循上述组件库规范进行设计。
1/2屏（宽度720px） |
1/4屏（宽度375px） |
千牛规范组件
千牛官方规范以3的倍数为基准
用于元素/模块间距、圆角等。
规范组件下载
注意：在查看框架基础规范及千牛PC表格规范时，下载文件后需解压次文件，将主文件的后缀名.sketch修改为.zip压缩包并打开，然后将次文件解压的文件复制到主文件压缩包中，最后将主文件后缀名重新更改为.sketch文件，更改成功后就能正常使用。
规范类型 |
开放能力 |
mgdone转sketch格式适配问题汇总 |
组件交互设计规范 |
在页面的交互设计上，请按照以下批量工具的交互，进行产品的交互细节设计。 1）框架基础规范 1.1）主文件：【基础】千牛PC组件.sketch 2）千牛PC表格规范 2.1）主文件：基础交互规范.sketch 3）弹窗交互规范：千牛PC-选择器弹窗规范.sketch 4）内容设计参考：复制发品工具.sketch 5）图标库：【通用】千牛ICON库.sketch -highlight：当前提供的为千牛最新版本的视觉规范，如发现fusion组件样式与设计稿有出入，可fusion组件样式为准。 数字字体包： |
1）间距：组件库中 11px改为12px，17px改为18px，5px改为6px。 2）选项卡Tab 2.1）默认tab 2.1.1）sketch效果： 2.1.2）正确效果： 2.2）包裹型tab 2.2.1）sketch效果： 2.2.2）正确效果： |
视觉交付规范
功能区规范
注意：最多 6 个功能菜单，最少1个。
图标设计规范
参考图标
注意事项
1）图标风格为线性图标，简洁为主，避免设计过于复杂的图标。
2）图标色值：#666666、#3D5EFF。
3）需要上传2个色值的图标。
4）上传图标尺寸128*128px。
列表规范
由于容器宽度有限，内容较多的列表请合理使用首尾固定的列表样式。
表单规范
1）间距：一级模块间距24px、二级模块间距18px、表单内容间距12px、二级标题与内容间距12px。
2）字体：一级标题16px 中粗体、二级标题14px 常规体、表单内容12px 常规体。
3）二级标题左对齐，必填标在标题右侧。
编辑器规范
1）开放坑位宽高为1屏高度，左右操作区宽度固定。
2）画布区：底色#F7F8FA，圆角18px。
3）菜单栏Icon：默认底色：#3D5EFF 且透明度为6%，选中图标加描边，圆角为9px。
右侧操作区排版参考：
常用页面布局参考
历史记录页，如下图所示：
