소스 검색

[edit] popup list style

wenliming 2 년 전
부모
커밋
5305ad0850
1개의 변경된 파일16개의 추가작업 그리고 4개의 파일을 삭제
  1. 16 4
      src/view/popup/popup.vue

+ 16 - 4
src/view/popup/popup.vue

@@ -34,6 +34,7 @@
                 <div class="give-list" v-if="currentTabIndex == 0">
                     <template v-if="giveList.length">
                         <div class="cell" 
+                            :class="{'cell-center': item.type == 1}"
                             v-for="(item, index) in giveList" 
                             :key="index"
                             @click="clickListItem(item, index)">
@@ -51,12 +52,15 @@
                                 </template>
                                 <!-- 发出去红包 -->
                                 <template v-else-if="2">
-                                    <img :src="
+                                    <img 
+                                        class="icon-big-give"
+                                        :src="
                                         require('@/assets/svg/icon-list-big-give.svg')
                                     " />
                                 </template>
                             </div>
-                            <div class="info-wrapper">
+                            <div class="info-wrapper"
+                                :class="{'info-center': item.type == 1}">
                                 <div class="left">
                                     <div class="nickname">
                                         {{
@@ -762,7 +766,6 @@ body {
             .cell {
                 display: flex;
                 justify-content: space-between;
-                align-items: center;
                 min-height: 66px;
                 box-sizing: border-box;
                 padding-left: 14px;
@@ -791,6 +794,10 @@ body {
                         right: -4px;
                         bottom: 2px;
                     }
+
+                    .icon-big-give {
+                        margin-top: 14px;
+                    }
                 }
 
                 .info-wrapper {
@@ -798,7 +805,6 @@ body {
                     height: 100%;
                     display: flex;
                     justify-content: space-between;
-                    align-items: center;
                     border-bottom: 1px solid #d1d1d1;
                     box-sizing: border-box;
                     padding: 10px 14px 10px 0;
@@ -899,6 +905,12 @@ body {
                         }
                     }
                 }
+                .info-center {
+                    align-items: center;
+                }
+            }
+            .cell-center {
+                align-items: center;
             }
 
             .icon-empty {