| | |
| | | <view class="productPage_shop_item_img"> |
| | | <image :src="item.imgurl ? item.prefixUrl + item.imgurl : ''" mode="widthFix"></image> |
| | | </view> |
| | | <text>{{stringOperations(item.name, 6)}}</text> |
| | | <text>{{item.name}}</text> |
| | | </view> |
| | | <view class="productPage_shop_zw"></view> |
| | | <view class="productPage_shop_zw"></view> |
| | |
| | | } |
| | | .productPage_shop_item { |
| | | width: 168px; |
| | | height: 204px; |
| | | margin-bottom: 12px; |
| | | cursor: pointer; |
| | | background: rgba(0,224,255,0.18); |
| | | border-radius: 8px; |
| | | display: flex; |
| | | transition: .5s; |
| | | padding: 15px; |
| | | box-sizing: border-box; |
| | | flex-direction: column; |
| | | justify-content: center; |
| | | align-items: center; |
| | | box-sizing: border-box; |
| | | white-space: pre-wrap; |
| | | word-break: break-all; |
| | | text-align: center; |
| | | &:hover { |
| | | background: linear-gradient(180deg, rgba(0,224,255,0.3) 0%, rgba(255,255,255,0.41) 100%); |
| | | border-radius: 8px; |
| | | border: 2px solid #FFFFFF; |
| | | box-sizing: border-box; |
| | | } |
| | | .productPage_shop_item_img { |
| | | width: 136px; |
| | |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: center; |
| | | overflow: hidden; |
| | | image { |
| | | width: 100%; |
| | | height: 100%; |
| | | } |
| | | } |
| | | text { |
| | | width: 100%; |
| | | overflow: hidden; |
| | | text-overflow: ellipsis; |
| | | display: -webkit-box; |
| | | -webkit-line-clamp: 2; |
| | | -webkit-box-orient: vertical; |
| | | font-size: 16px; |
| | | font-family: SourceHanSansSC-Normal, SourceHanSansSC; |
| | | font-weight: 400; |