fe / xianyu-ufo-app-web · Commits

Go to a project

Authored by 张文文
Commit f69972340e13549bb2d3013951faac5df0bb1727 1 parent 0f14d3c2

图片模糊fix review by lea.guo

Inline Side-by-side
Showing 2 changed files with 26 additions and 4 deletions
1 <template> 1 <template>
2 <div class="product-wrapper"> 2 <div class="product-wrapper">
3 - <ImageFormat :src="data.goodImg" width="90" height="90"></ImageFormat>  
4 - 3 + <div class="good-image">
  4 + <ImageFormat :src="data.goodImg" :width="180" :height="180"></ImageFormat>
  5 + </div>
5 <div class="product-price"> 6 <div class="product-price">
6 <div class="red">¥{{data.goodPrice}}</div> 7 <div class="red">¥{{data.goodPrice}}</div>
7 <div class="product-name">{{data.productName}}</div> 8 <div class="product-name">{{data.productName}}</div>
@@ -30,6 +31,16 @@ export default { @@ -30,6 +31,16 @@ export default {
30 height: 180px; 31 height: 180px;
31 } 32 }
32 33
  34 +.good-image {
  35 + width: 180px;
  36 + height: 180px;
  37 + overflow: hidden;
  38 + img {
  39 + width: 100%;
  40 + display: block;
  41 + }
  42 +}
  43 +
33 .product-price { 44 .product-price {
34 display: inline-block; 45 display: inline-block;
35 vertical-align: top; 46 vertical-align: top;
1 <template> 1 <template>
2 <div class="product-wrapper"> 2 <div class="product-wrapper">
3 - <ImageFormat :src="data.goodImg" width="120" height="120"></ImageFormat>  
4 - 3 + <div class="good-image">
  4 + <ImageFormat :src="data.goodImg" :width="240" :height="240"></ImageFormat>
  5 + </div>
5 <div class="product-price"> 6 <div class="product-price">
6 <div class="product-price-wrapper"> 7 <div class="product-price-wrapper">
7 <div class="price">{{data.colorName}}，{{data.sizeName}}</div> 8 <div class="price">{{data.colorName}}，{{data.sizeName}}</div>
@@ -33,6 +34,16 @@ export default { @@ -33,6 +34,16 @@ export default {
33 overflow: hidden; 34 overflow: hidden;
34 } 35 }
35 36
  37 +.good-image {
  38 + width: 240px;
  39 + height: 240px;
  40 + overflow: hidden;
  41 + img {
  42 + width: 100%;
  43 + display: block;
  44 + }
  45 +}
  46 +
36 .product-price { 47 .product-price {
37 display: flex; 48 display: flex;
38 height: 100%; 49 height: 100%;