完成简单组件

.gitignore

@@ -1,5 +1,7 @@
 node_modules/
 .cache/
 dist/
-.idea/
-package-lock.json
+.DS_Store
+/docs/.vuepress/dist
+/.cache
+/package-lock.json

.npmignore

@@ -0,0 +1,4 @@
+/.idea/
+/docs/
+/src/
+/tests/

.travis.yml

@@ -1,6 +1,8 @@
 language: node_js
 node_js:
   - "8"
+  - "9"
+  - "10"
 addons:
   chrome: stable
 sudo: required

LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2018 Frank Fang
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

README.md

@@ -1,6 +1,6 @@
 # pointline(PL)UI 一个 VUE UI 组件库
 
-![PLUI](https://note.youdao.com/yws/api/personal/file/WEBf25c5234fe61d159c54c3d3bc5eb133f?method=download&shareKey=298a782938a815f8741d3e3540d5fd65)
+![PLUI](https://note.youdao.com/yws/api/personal/file/WEB42ab0be8ec96d9393c06494b1b7b603b?method=download&shareKey=21a1a1c74e2ba0085166e93dfd131d42)
 
 [![Build Status](https://travis-ci.org/ivan135/component-s.svg?branch=master)](https://travis-ci.org/ivan135/component-s)
 ![license](https://img.shields.io/npm/l/@nutui/nutui.svg)

babel.config.js

@@ -0,0 +1,10 @@
+module.exports = {
+  presets: [
+    '@vue/app'
+  ],
+  env: {
+    test: {
+      plugins: ["istanbul"]
+    }
+  }
+}

deploy.sh

@@ -0,0 +1,25 @@
+#!/usr/bin/env sh
+
+# 确保脚本抛出遇到的错误
+set -e
+
+# 生成静态文件
+npm run docs:build
+
+# 进入生成的文件夹
+cd docs/.vuepress/dist
+
+# 如果是发布到自定义域名
+# echo 'www.example.com' > CNAME
+
+git init
+git add -A
+git commit -m 'deploy'
+
+# 如果发布到 https://<USERNAME>.github.io
+# git push -f [email protected]:<USERNAME>/<USERNAME>.github.io.git master
+
+# 如果发布到 https://<USERNAME>.github.io/<REPO>
+git push -f [email protected]:frankfang/gulu.git master:gh-pages
+
+cd -

docs/.vuepress/components/button-demo.vue

@@ -0,0 +1,36 @@
+<template>
+    <div style="padding-top: 16px;">
+        <h2>简单用法</h2>
+        <p>
+            <strong>预览</strong>
+        </p>
+        <cs-button>默认按钮</cs-button>
+        <cs-button icon="settings">默认按钮</cs-button>
+        <cs-button :loading="true">默认按钮</cs-button>
+        <cs-button disabled>默认按钮</cs-button>
+
+        <p>
+            <strong>代码</strong>
+        </p>
+        <pre><code>{{content}}</code></pre>
+    </div>
+</template>
+<script>
+    import Button from '../../../src/button/button'
+
+    export default {
+        components: {
+            'cs-button': Button
+        },
+        data () {
+            return {
+             content: `
+            <cs-button>默认按钮</cs-button>
+            <cs-button icon="settings">默认按钮</cs-button>
+            <cs-button :loading="true">默认按钮</cs-button>
+            <cs-button disabled>默认按钮</cs-button>
+      `.replace(/^ {8}/gm, '').trim()
+            }
+        }
+    }
+</script>

docs/.vuepress/components/card-demo.vue

@@ -0,0 +1,81 @@
+<template>
+  <div>
+    <h3>使用方法</h3>
+    <h4>预览</h4>
+    <cs-card class=" c1">
+      <h4>Sample Card Title</h4>
+      <p>He seems sinking under the evidence could not only grieve and a visit. The father is to bless and placed in his length hid...</p>
+    </cs-card>
+    <cs-card class="c2">
+      <h4>Sample Card Title</h4>
+      <p>He seems sinking under the evidence could not only grieve and a visit. The father is to bless and placed in his length hid...</p>
+    </cs-card>
+    <cs-card>
+      <h4>Sample Card Title</h4>
+      <p>He seems sinking under the evidence could not only grieve and a visit. The father is to bless and placed in his length hid...</p>
+    </cs-card>
+    <h4>代码</h4>
+    <pre><code class="html">{{content}}</code></pre>
+  </div>
+</template>
+
+<script>
+import Card from "../../../src/card";
+export default {
+  components: {
+    "cs-card": Card
+  },
+  data() {
+    return {
+      content: `
+        <cs-card class="c1">
+          <h4>Sample Card Title</h4>
+           <p>He seems sinking under the evidence could not only grieve and a visit. The father is to bless and placed in his length hid...</p>
+        </cs-card>
+        <cs-card class="c2">
+          <h4>Sample Card Title</h4>
+           <p>He seems sinking under the evidence could not only grieve and a visit. The father is to bless and placed in his length hid...</p>
+        </cs-card>
+        <cs-card>
+          <h4>Sample Card Title</h4>
+           <p>He seems sinking under the evidence could not only grieve and a visit. The father is to bless and placed in his length hid...</p>
+        </cs-card>
+        <style>
+            .c1 {
+                background: pink;
+            }
+            .c2 {
+                background: bisque;
+            }
+        </style>
+
+    
+    `
+        .replace(/^ {8}/gm, "")
+        .trim()
+    };
+  }
+};
+</script>
+
+<style scoped>
+.Preview {
+  padding: 20px;
+}
+.card {
+  display: inline-block;
+  width: 29%;
+  margin: 0 2px;
+}
+code {
+  font-weight: bold;
+  overflow: unset;
+}
+
+.c1 {
+  background: pink;
+}
+.c2 {
+  background: bisque;
+}
+</style>

docs/.vuepress/components/home.vue

@@ -0,0 +1,118 @@
+<template>
+  <div class="content custom">
+    <div class="container">
+
+    <pc-button elevation="4" class="btn" @click="go">快速上手 →</pc-button>
+    <hr>
+    <cs-card class="card c1">
+      <h2>简明优先</h2>
+      <p>用法简单,构建声明式UI框架</p>
+    </cs-card>
+    <cs-card class="card c2">
+      <h2>Vue 驱动</h2>
+      <p>使用  Vue + webpack 开发环境</p>
+    </cs-card>
+    <cs-card class="card">
+      <h2>说明文档</h2>
+      <p>文档简单通俗，容易理解看懂</p>
+    </cs-card>
+    <div class="footer">MIT Licensed | Copyright © 2018-present Mrlgm</div>
+  </div>
+  </div>
+</template>
+
+<script>
+import Card from "../../../src/card";
+import Button from "../../../src/button/button";
+export default {
+  components: {
+    "cs-card": Card,
+    "pc-button": Button
+  },
+  mounted() {
+  },
+  data() {
+    return {
+      link: "/install/"
+    };
+  },
+  methods: {
+    go() {
+      if (/^http/.test(this.link)) {
+        window.open(this.link);
+      } else {
+        this.$router.push(this.link);
+      }
+    }
+  }
+};
+</script>
+
+<style scoped>
+.container {
+  text-align: center;
+}
+.btn {
+  display: inline-block;
+  box-sizing: content-box;
+  padding: 0.8em 1.5em;
+  margin: 25px 0;
+  font-weight: bold;
+  color: #fff;
+  border-radius: 3px;
+  border: none;
+  background: #46bd87;
+  box-shadow:0 0.5rem 1.25rem 0 rgba(218,224,235,.6);
+}
+.btn:hover {
+  box-shadow:0 0.5rem 2rem 0 #dae0eb;
+}
+
+.btn .content{
+  padding: 1rem 1.5rem;
+}
+
+.card {
+  text-align: left;
+  display: inline-block;
+  padding: 13px;
+  margin: 30px;
+  line-height: 1.7px;
+  background-image: url(https://image.weilanwl.com/color2.0/cardBg.png);
+  background-size: cover;
+  background-position: center;
+  background-color: #46bd87;
+  color: #fff;
+  border-radius: 12px;
+}
+.card::after {
+  content: "";
+  position: absolute;
+  z-index: -1;
+  background-color: inherit;
+  width: 100%;
+  height: 100%;
+  left: 0;
+  bottom: -10%;
+  border-radius: 10px;
+  opacity: 0.2;
+  transform: scale(0.9, 0.9);
+}
+
+.card h2,
+.card p {
+  color: #ffffff;
+}
+@media (max-width: 970px) {
+  .card {
+    display: block;
+  }
+}
+.footer {
+  margin-top: 1rem;
+  padding: 2.5rem;
+  border-top: 1px solid #eaecef;
+  text-align: center;
+  color: #4e6e8e;
+}
+</style>

docs/.vuepress/components/input-demos.vue

@@ -0,0 +1,60 @@
+<template>
+  <div>
+    <h3>使用方法</h3>
+    <h4>预览</h4>
+    <cs-input value="data"></cs-input>
+    <cs-input value="data" disabled></cs-input>
+    <cs-input value="data" readonly></cs-input>
+    <h4>代码</h4>
+    <pre><code class="html">{{content}}</code></pre>
+
+    <hr>
+    <h4>双向绑定</h4>
+    <cs-input v-model="value"></cs-input>
+   <div>
+      value: {{value}}
+    </div>
+    <h4>代码</h4>
+    <pre><code class="html">{{content2}}</code></pre>
+
+  </div>
+</template>
+
+<script>
+import Input from "../../../src/input";
+export default {
+  
+  components: {
+    "cs-input": Input
+  },
+  data() {
+    return {
+      value: "1",
+      content: `
+        <cs-input value="data"></cs-input>
+        <cs-input value="data" disabled></cs-input>
+        <cs-input value="data" readonly></cs-input>
+    `
+        .replace(/^ {8}/gm, "")
+        .trim(),
+        content2:`
+        data:{
+          value: '1'
+        }
+
+        <cs-input v-model="value"></cs-input><div>{{'数据：'+value}}</div>
+        `.replace(/^ {8}/gm, "")
+        .trim()
+    };
+  }
+};
+</script>
+
+<style scoped>
+.Preview {
+  padding: 20px;
+}
+.code {
+  font-weight: bold;
+}
+</style>