card hover

src/components/FourCard.vue

@@ -37,7 +37,6 @@
           </g>
         </g>
       </svg>
-      <!-- <img :src="Hardware" alt="icon" class="icon" /> -->
       <h3 class="card_title">硬件定制</h3>
       <div class="desc">
         <p class="line">专业水下视学设备团队，研发出品多</p>
@@ -313,10 +312,14 @@
       font-weight: 500;
       color: #7e7e7e;
       white-space: nowrap;
+      padding: 10px 0;
     }
     &:hover {
       box-shadow: 0 10px 30px 0 rgba(136, 150, 171, 0.15);
       border-radius: 10px;
+      .en {
+        border-bottom: 1px solid #000;
+      }
     }
   }
 

src/components/Product.vue

@@ -72,6 +72,13 @@ import A1 from '@/static/img/index/a1.png'
       .product_img {
         width: 100%;
         height: 100%;
+        &:hover {
+          ~ {
+            .detail_show_container {
+              display: flex;
+            }
+          }
+        }
       }
       .bottom_tip {
         position: absolute;
@@ -86,6 +93,13 @@ import A1 from '@/static/img/index/a1.png'
         align-items: center;
         justify-content: space-between;
         background: $light-background;
+        &:hover {
+          ~ {
+            .detail_show_container {
+              display: flex;
+            }
+          }
+        }
         .btn {
           display: flex;
           align-items: center;
@@ -145,9 +159,6 @@ import A1 from '@/static/img/index/a1.png'
         }
       }
       &:hover {
-        .detail_show_container {
-          display: flex;
-        }
         .bottom_tip {
           background: none;
           p {