Просмотр исходного кода

ghsPad与hdPad 列表的卡片项背景变更为白色及列表背景颜色变更为灰色

shizhongqi 2 месяцев назад
Родитель
Сommit
b8b0640562
2 измененных файлов с 20 добавлено и 16 удалено
  1. 10 8
      ghsPad/src/pages/home/components/leftArea.vue
  2. 10 8
      hdPad/src/pages/home/components/leftArea.vue

+ 10 - 8
ghsPad/src/pages/home/components/leftArea.vue

@@ -306,15 +306,16 @@ export default {
         flex: 1;
         flex: 1;
         height: 0;
         height: 0;
         border: 1px solid #eee;
         border: 1px solid #eee;
+        background-color: #f3f6f4;
         & .show-item_box {
         & .show-item_box {
-            padding: 2upx;
+            padding: 3upx 4upx;
             position: relative;
             position: relative;
             overflow: hidden;
             overflow: hidden;
             .delete-btn {
             .delete-btn {
                 position: absolute;
                 position: absolute;
-                top: 3upx;
-                right: 3upx;
-                bottom: 3upx;
+                top: 4upx;
+                right: 5upx;
+                bottom: 4upx;
                 width: 40upx;
                 width: 40upx;
                 display: flex;
                 display: flex;
                 align-items: center;
                 align-items: center;
@@ -322,7 +323,7 @@ export default {
                 color: #FFFFFF;
                 color: #FFFFFF;
                 font-size: 12upx;
                 font-size: 12upx;
                 background-color: #f56c6c;
                 background-color: #f56c6c;
-                border-radius: 2upx;
+                border-radius: 4upx;
             }
             }
             & .item-body_box {
             & .item-body_box {
                 position: relative;
                 position: relative;
@@ -333,6 +334,7 @@ export default {
                 border-bottom: 3upx solid transparent;
                 border-bottom: 3upx solid transparent;
                 transition: transform 0.2s;
                 transition: transform 0.2s;
                 z-index: 1;
                 z-index: 1;
+                box-shadow: 0 2upx 8upx rgba(0, 0, 0, 0.08);
                 &.is-swiped {
                 &.is-swiped {
                     transform: translateX(-42upx);
                     transform: translateX(-42upx);
                 }
                 }
@@ -340,10 +342,10 @@ export default {
                     border-bottom-color: #3385FF;
                     border-bottom-color: #3385FF;
                 }
                 }
                 &.active {
                 &.active {
-                    background-color: #d4d6d6;
+                    background-color: #ffffff;
                 }
                 }
                 &.not-active {
                 &.not-active {
-                    background-color: #e7e9e9;
+                    background-color: #ffffff;
                 }
                 }
                 .item-price-num{
                 .item-price-num{
                     color:green;
                     color:green;
@@ -398,4 +400,4 @@ export default {
         justify-content: space-around;
         justify-content: space-around;
     }
     }
 }
 }
-</style>
+</style>

+ 10 - 8
hdPad/src/pages/home/components/leftArea.vue

@@ -310,15 +310,16 @@ export default {
         flex: 1;
         flex: 1;
         height: 0;
         height: 0;
         border: 1px solid #eee;
         border: 1px solid #eee;
+        background-color: #f3f6f4;
         & .show-item_box {
         & .show-item_box {
-            padding: 2upx;
+            padding: 3upx 4upx;
             position: relative;
             position: relative;
             overflow: hidden;
             overflow: hidden;
             .delete-btn {
             .delete-btn {
                 position: absolute;
                 position: absolute;
-                top: 3upx;
-                right: 3upx;
-                bottom: 3upx;
+                top: 4upx;
+                right: 5upx;
+                bottom: 4upx;
                 width: 40upx;
                 width: 40upx;
                 display: flex;
                 display: flex;
                 align-items: center;
                 align-items: center;
@@ -326,7 +327,7 @@ export default {
                 color: #FFFFFF;
                 color: #FFFFFF;
                 font-size: 12upx;
                 font-size: 12upx;
                 background-color: #f56c6c;
                 background-color: #f56c6c;
-                border-radius: 2upx;
+                border-radius: 4upx;
             }
             }
             & .item-body_box {
             & .item-body_box {
                 position: relative;
                 position: relative;
@@ -337,6 +338,7 @@ export default {
                 border-bottom: 3upx solid transparent;
                 border-bottom: 3upx solid transparent;
                 transition: transform 0.2s;
                 transition: transform 0.2s;
                 z-index: 1;
                 z-index: 1;
+                box-shadow: 0 2upx 8upx rgba(0, 0, 0, 0.08);
                 &.is-swiped {
                 &.is-swiped {
                     transform: translateX(-42upx);
                     transform: translateX(-42upx);
                 }
                 }
@@ -344,10 +346,10 @@ export default {
                     border-bottom-color: #8abf8a;
                     border-bottom-color: #8abf8a;
                 }
                 }
                 &.active {
                 &.active {
-                    background-color: #d4d6d6;
+                    background-color: #ffffff;
                 }
                 }
                 &.not-active {
                 &.not-active {
-                    background-color: #e7e9e9;
+                    background-color: #ffffff;
                 }
                 }
                 .item-price-num{
                 .item-price-num{
                     color:green;
                     color:green;
@@ -402,4 +404,4 @@ export default {
         justify-content: space-around;
         justify-content: space-around;
     }
     }
 }
 }
-</style>
+</style>