Merge branch 'intelligent-recommend' into dev

src/components/intelligent-recommend/index.js

@@ -257,7 +257,7 @@ function Options({options, handleSelect}) {
     {
       !!options.length && options.map(item => {
         return <li onClick={() => handleSelect(item)} key={item.id}>
-          {item.describe}
+          <button>{item.describe}</button>
         </li>
       })
     }

src/components/intelligent-recommend/index.scss

@@ -73,6 +73,7 @@
 
   .message {
     .avatar {
+      width: 10%;
       display: inline-block;
       margin-right: 14px;
 
@@ -84,9 +85,9 @@
     }
 
     .text {
+      max-width: 85%;
       position: relative;
       padding: 0 16px;
-      height: 40px;
       display: inline-block;
       background: rgba(255, 255, 255, 1);
       border-radius: 4px;
@@ -120,6 +121,7 @@
     &.user {
       .avatar {
         float: right;
+        margin-right: 0;
       }
 
       .text {
@@ -159,15 +161,21 @@
     }
 
     li {
-      width: 126px;
-      height: 33px;
-      margin: 0 auto 15px;
-      background: linear-gradient(90deg, rgba(0, 153, 255, 1) 0%, rgba(77, 184, 255, 1) 100%);
-      border-radius: 17px;
-      font-size: 16px;
-      color: #fff;
+      margin-bottom: 15px;
       text-align: center;
-      line-height: 33px;
+
+      button {
+        padding: 9px 30px;
+        box-sizing: border-box;
+        background: linear-gradient(90deg, rgba(0, 153, 255, 1) 0%, rgba(77, 184, 255, 1) 100%);
+        border-radius: 17px;
+        font-size: 16px;
+        color: #fff;
+        -webkit-appearance: none;
+        outline: none;
+        border: none;
+      }
+
     }
   }