器件详情样式

components/product/component/ComponentDetail.vue

@@ -22,7 +22,7 @@
             <div class="message-detail">
               <div class="message-item">类目(产品名称)</div>
               <div class="colon">:</div>
-              <div class="message-body">
+              <div class="message-body body-long">
                 {{list.kind.nameCn || ''}}
               </div>
             </div>
@@ -34,7 +34,7 @@
             <div class="message-detail">
               <div class="message-item">产品生命周期</div>
               <div class="colon">:</div>
-              <div class="message-body">
+              <div class="message-body body-long">
                 {{list.lifecycle | lifecycleFilter}}
               </div>
             </div>
@@ -63,8 +63,8 @@
             </div>
             <!--<div class="message-detail"></div>-->
             <!--<div class="form-group">-->
-               <!--<button type="text" v-if="!collectList" @click="collect(list.id)" class="btn btn-default btn-store">加入收藏</button>-->
-               <!--<button class="btn btn-default btn-store" v-if="collectList" disabled="disabled">已收藏</button>-->
+            <!--<button type="text" v-if="!collectList" @click="collect(list.id)" class="btn btn-default btn-store">加入收藏</button>-->
+            <!--<button class="btn btn-default btn-store" v-if="collectList" disabled="disabled">已收藏</button>-->
             <!--</div>-->
           </div>
         </div>
@@ -104,7 +104,7 @@
   </div>
 </template>
 <script>
-//  import ComponentMenu from '~components/product/component/componentMenu.vue'
+  //  import ComponentMenu from '~components/product/component/componentMenu.vue'
   export default {
     name: 'ComponentDetail',
     data () {
@@ -313,6 +313,9 @@
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
+    width: 93px;
+  }
+  .componentDetail .container .component-message .message-body.body-long {
     width: 450px;
   }
   .componentDetail .container .component-message .message-body >img {