slush-atp

slush generators for ATP

Usage no npm install needed!

<script type="module">
  import slushAtp from 'https://cdn.skypack.dev/slush-atp';
</script>

README

slush─ATP

slush generators for ATP

使用指南

1 npm install ─g slush slush─atp 2 slush atp

目录结构

root ├── assets //静态资源 │ ├── fonts //字体文件 │ ├── icons //图标文件 │ └── images//图片文件 ├── config //设置 │ ├── color //配色系统 │ ├── core //核心配置 │ └── element//按键配置 ├── scripts//js文件 ├── style //样式源代码 │ ├── atoms //原子级样式 │ │ ├── core //核心样式 │ │ │ ├── font.styl //字体样式文件 │ │ │ ├── icon.styl //图标样式文件 │ │ │ ├── margin.styl //公用外边距样式文件 │ │ │ ├── padding.styl //公用内边距样式文件 │ │ │ ├── scaffolding.styl //脚手架样式文件 │ │ │ └── utilities.styl //基本公用样式文件 │ │ ├── elements //元素样式 │ │ │ ├── buttons.styl //按键样式文件 │ │ │ ├── checkbox.styl //单选框样式文件 │ │ │ ├── code.styl //代码样式文件 │ │ │ ├── forms.styl //表单样式文件 │ │ │ ├── img.styl //图片样式文件 │ │ │ ├── inputs.styl //输入框样式文件 │ │ │ ├── list.styl //列表框样式文件 │ │ │ ├── radio.styl //多选框样式文件 │ │ │ └── select.styl //下拉框样式文件 │ │ └── reset //重置样式 │ │ ├── normalize.styl //兼容样式文件 │ │ └── print.styl //打印样式文件 │ ├── molecules //分子级样式 │ │ ├── collections // 集合样式 │ │ │ ├──breadcrumb.styl // 面包屑样式文件 │ │ │ ├──button-group.styl // 按键组样式文件 │ │ │ ├──forms.styl // 表单样式文件 │ │ │ ├──grid.styl // 栅格样式文件 │ │ │ ├──menu.styl // 菜单样式文件 │ │ │ ├──table.styl // 表格样式文件 │ │ │ └──tabs.styl // 标签项样式文件 │ │ └── components // 组件样式 │ │ ├── animations.styl // 动画样式文件 │ │ ├── number-enhanced.styl // 数字组样式文件 │ │ └── rating.styl // 等级样式文件 │ ├── organisms //有机体样式 │ │ ├── article //内容样式 │ │ ├── admin //后台管理样式 │ │ └── admin //后台管理样式 │ └── templates //模板样式 │ ├── admin //后台管理样式 │ │ ├── dashboard.styl // 仪盘表样式文件 │ │ ├── detail.styl // 详情样式文件 │ │ └── list.styl // 列表样式文件 │ ├── blog //博客样式 │ │ ├── dashboard.styl // 仪盘表样式文件 │ │ ├── detail.styl // 详情样式文件 │ │ └── list.styl // 列表样式文件 │ └── mall //商城样式 │ ├── dashboard.styl // 仪盘表样式文件 │ ├── detail.styl // 详情样式文件 │ └── list.styl // 列表样式文件 ├── view //页面源代码 │ ├── atoms //原子级视图 │ │ ├── core //核心样式 │ │ │ ├── font.jade //字体视图文件 │ │ │ ├── icon.jade //图标视图文件 │ │ │ ├── margin.jade //公用外边距视图文件 │ │ │ ├── padding.jade //公用内边距视图文件 │ │ │ ├── scaffolding.jade //脚手架视图文件 │ │ │ └── utilities.jade //基本公用视图文件 │ │ └── elements //元素视图 │ │ ├── buttons.jade //按键视图文件 │ │ ├── checkbox.jade //单选框视图文件 │ │ ├── code.jade //代码视图文件 │ │ ├── forms.jade //表单视图文件 │ │ ├── img.jade //图片视图文件 │ │ ├── inputs.jade //输入框视图文件 │ │ ├── list.jade //列表框视图文件 │ │ ├── radio.jade //多选框视图文件 │ │ └── select.jade //下拉框视图文件 │ ├── molecules //分子级视图 │ │ ├── collections // 集合视图 │ │ │ ├──breadcrumb.jade // 面包屑视图文件 │ │ │ ├──button-group.jade // 按键组视图文件 │ │ │ ├──forms.jade // 表单视图文件 │ │ │ ├──grid.jade // 栅格视图文件 │ │ │ ├──menu.jade // 菜单视图文件 │ │ │ ├──table.jade // 表格视图文件 │ │ │ └──tabs.jade // 标签项视图文件 │ │ └── components // 组件视图 │ │ ├── animations.jade // 动画视图文件 │ │ ├── number-enhanced.jade // 数字组视图文件 │ │ └── rating.jade // 等级视图文件 │ ├── organisms //有机体视图 │ │ ├── header //头部视图 │ │ │ ├── animations.jade │ │ ├── article //内容视图 │ │ ├── section //公共模块视图 │ │ └── footer //尾部视图 │ └── templates //模板视图 │ ├── admin //后台管理视图 │ │ ├── dashboard.jade // 仪盘表视图文件 │ │ ├── detail.jade // 详情视图文件 │ │ └── list.jade // 列表视图文件 │ ├── blog //博客视图 │ │ ├── dashboard.jade // 仪盘表视图文件 │ │ ├── detail.jade // 详情视图文件 │ │ └── list.jade // 列表视图文件 │ └── mall //商城视图 │ ├── dashboard.jade // 仪盘表视图文件 │ ├── detail.jade // 详情视图文件 │ └── list.jade // 列表视图文件 ├── Gulpfile.js //任务配置文件 ├── package.json //包信息 └── README.md //项目介绍


##产出结构
>```
输出文件
  ├── css //样式
  ├── doc //文档
  └── page //页面

##文档结构

###dashboard要求
1 简介展示所有atoms、molecules、organisms样式。
2 足够的简介。
3 可以链接到具体的某一部分。