介绍

个人工作中总结的一套组件库,专门用于学习使用,不要用于生产项目,个人有时间就会新增几个组件

安装

使用 npm 安装

推荐使用 npm 的方式进行开发,享受 node 生态圈和 webpack 工具链带来的便利。通过 npm 安装的模块包,我们可以轻松的使用 import 或者 require 的方式引用

npm install suchengyong-simple-ui

yarn add suchengyong-simple-ui

快速上手

<template>
  <div id="app">
    <s-button type="primary">点击报名</s-button>
  </div>
</template>

<script>
import {Button} from 'suchengyong-simple-ui'
import 'suchengyong-simple-ui/dist/simple.css'

export default {
  name: 'app',
  components: {
    's-button':Button
  }
}
</script>

颜色搭配

Color 色彩搭配

推荐使用以下颜色作为设计和开发规范,以保证页面和组件之间的视觉一致。

主色

使用友好的蓝色作为主色

Light #3eaf7c
Primary #1890ff
Dark #096dd9

功能色

功能色常用于信息提示,比如成功、警告和失败。

Success #52c41a
Warning #faad14
Error #f5222d