持证人样式优化

.config.dev.js

 module.exports = {
   domain: 'dev.ezijing.com',
-  url: 'https://project-api2.ezijing.com',
+  url: 'https://project-api.ezijing.com',
   isEnableToIphoneDebugger: false,
-  apiBaseURL: 'https://project-api2.ezijing.com/api',
+  apiBaseURL: 'https://project-api.ezijing.com/api',
   webpack: {
     externals: {
       CKEDITOR: 'window.CKEDITOR',

src/pages/showcase/index.vue

@@ -10,9 +10,10 @@
       <div class="avatar-list" v-if="showIndex === 1">
         <div class="avatar-item" v-for="item in list" :key="item.id">
           <div class="content">
+            <p>中国PRP持证人</p>
             <h2>{{ item.name }}</h2>
             <p>证书编号</p>
-            <p>{{ item.number }}</p>
+            <p style="color:#cfb181">{{ item.number }}</p>
           </div>
           <img :src="item.avatar" class="pic" />
         </div>
@@ -96,25 +97,40 @@ export default {
 }
 .avatar-list {
   display: flex;
+  flex-wrap: wrap;
   width: 970px;
   margin: 0 auto;
 }
 .avatar-item {
   display: flex;
+  align-items: center;
+  flex: 0 0 298px;
   width: 300px;
+  height: 180px;
+  margin-right: 20px;
+  margin-bottom: 20px;
+  background: url('../../assets/images/showcase_bg.png') no-repeat;
   .content {
     flex: 1;
     margin-right: 10px;
     overflow: hidden;
+    color: #fff;
+    padding: 10px;
     h2 {
       font-size: 20px;
+      font-weight: 500;
+      color: #cfb181;
       margin-bottom: 10px;
     }
+    p {
+      font-size: 14px;
+      color: #ffffff;
+    }
   }
   .pic {
-    width: 160px;
+    width: 150px;
     height: 100%;
-    object-fit: contain;
+    object-fit: cover;
   }
 }
 </style>