add select default

front/project/www/components/Select/index.less

@@ -2,6 +2,7 @@
 
 .select {
   position: relative;
+  text-align: center;
 
   .mask {
     position: fixed;
@@ -106,7 +107,6 @@
 
   &.white {
     cursor: pointer;
-    text-align: center;
 
     .select-warp.active {
       background: rgba(241, 243, 246, 1);
@@ -142,4 +142,59 @@
       border: none;
     }
   }
+
+  .up-arrow::after {
+    display: inline-block;
+    content: " ";
+    height: 8px;
+    width: 8px;
+    border-width: 2px 2px 0 0;
+    border-color: #fff;
+    border-style: solid;
+    transform: matrix(0.71, 0.71, -0.71, 0.71, 0, 0);
+    position: absolute;
+    top: 50%;
+    margin-top: -1px;
+  }
+
+  &.default {
+    cursor: pointer;
+
+    .select-warp.active {
+      background: rgba(241, 243, 246, 1);
+    }
+
+    .button {
+      line-height: 20px;
+    }
+
+    .up-arrow::after {
+      width: auto;
+      height: auto;
+      border-width: 5px;
+      border-color: transparent transparent #8897a8 transparent;
+      border-style: solid;
+      transform: translateY(-3px);
+    }
+
+    .down-arrow::after {
+      width: auto;
+      height: auto;
+      border-width: 5px;
+      border-color: #8897a8 transparent transparent transparent;
+      border-style: solid;
+      transform: translateY(3px);
+    }
+
+    .select-body {
+      border: none;
+    }
+
+    .select-option {
+      padding: 0;
+      text-align: center;
+      line-height: 30px;
+      border: none;
+    }
+  }
 }

front/project/www/routes/page/demo/page.js

@@ -14,6 +14,7 @@ import IconButton from '../../../components/IconButton';
 import Step from '../../../components/Step';
 import OtherAnswer from '../../../components/OtherAnswer';
 import QAList from '../../../components/QAList';
+import Select from '../../../components/Select';
 
 export default class extends Page {
   renderView() {
@@ -21,6 +22,9 @@ export default class extends Page {
       <div>
         <Continue date={'2019-04-29 16:30'} data={{}} />
         <div className="content">
+          <Select list={[{ title: '123' }, { title: '321' }]} />
+          <Select theme="white" list={[{ title: '123' }, { title: '321' }]} />
+          <Select theme="default" list={[{ title: '123' }, { title: '321' }]} />
           <Division col="3" type="compact">
             <SmallPanel
               title="千行 CAT"