From 5dc54a59184b305a85aaad31dd4cce01b31a8a2d Mon Sep 17 00:00:00 2001
From: zuoxiao <470321431@qq.com>
Date: 星期四, 13 六月 2024 14:58:06 +0800
Subject: [PATCH] 开关泵定版
---
pages/home/home.wxss | 219 ++++++++++++++++++++++++++++++++++++++++++++++++++----
1 files changed, 202 insertions(+), 17 deletions(-)
diff --git a/pages/home/home.wxss b/pages/home/home.wxss
index 3e06c83..0b70b8e 100644
--- a/pages/home/home.wxss
+++ b/pages/home/home.wxss
@@ -1,6 +1,6 @@
/* pages/home/home.wxss */
.base-wrapper {
- background-color: #f5f5f5;
+ background-color: #ececec;
width: 100%;
height: 100vh;
overflow: hidden;
@@ -11,19 +11,20 @@
.head-wrapper {
background-color: #1890FF;
- height: 30vh;
+ height: 25vh;
+ width: 100%;
padding-left: 40rpx;
display: grid;
flex-direction: column;
align-items: center;
-
border-bottom-left-radius: 5rpx;
border-bottom-right-radius: 5rpx;
z-index: 1;
+ border-top: 1px solid #0484fc;
+
}
.head-top {
- margin-top: 40rpx;
display: flex;
align-items: center;
/* 鍦ㄧ旱鍚戞柟鍚戜笂灞呬腑瀵归綈 */
@@ -31,14 +32,51 @@
.head-text-wrapper {
+ flex: 1;
display: flex;
flex-direction: column;
- margin-left: 30rpx;
+ align-items: left;
+ justify-content: center;
+ margin-left: 15rpx;
+}
+
+.head-button-wrapper {
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ margin-left: 15rpx;
+}
+
+
+.head-bottom {
+ margin-top: 20rpx;
+ color: #fff;
+ font-size: 35rpx;
+}
+
+.unbind {
+ font-size: 30rpx;
+ /* 鎸夐挳鏂囧瓧鐨勫瓧浣撳ぇ灏� */
+ color: #1890FF;
+ /* 鎸夐挳鏂囧瓧棰滆壊 */
+ background-color: #fff;
+ /* 鎸夐挳鑳屾櫙棰滆壊 */
+ border: none;
+ /* 鍘绘帀鎸夐挳杈规 */
+ border-radius: 20px;
+ /* 鎸夐挳鍦嗚 */
+ padding-left: 20rpx;
+ padding-right: 20rpx;
+ padding-top: 5rpx;
+ padding-bottom: 5rpx;
+ margin-bottom: 10rpx;
}
.head-text-wrapper text {
- margin-bottom: 10rpx;
color: #fff;
+ font-size: 32rpx;
}
.balance-label {
@@ -64,6 +102,8 @@
}
.center-view {
+ flex: 1;
+ /* 姣忎釜鍏冪礌骞冲垎瀹藉害 */
display: flex;
flex-direction: column;
/* 鍦ㄧ旱鍚戜笂鎺掑垪瀛愬厓绱� */
@@ -73,9 +113,20 @@
/* 鍦ㄦí鍚戝拰绾靛悜涓婇兘灞呬腑鏄剧ず瀛愬厓绱� */
}
+.center-view image,
+.center-view t-avatar {
+ width: 90rpx;
+ /* 鏍规嵁闇�瑕佽皟鏁村浘鏍囧ぇ灏� */
+ height: 90rpx;
+ /* 鏍规嵁闇�瑕佽皟鏁村浘鏍囧ぇ灏� */
+ margin-bottom: 10rpx;
+ /* 鍥炬爣鍜屾枃鏈箣闂寸殑闂磋窛 */
+}
+
.center-view text {
margin-top: 15rpx;
font-size: 30rpx;
+ color: #1890FF;
}
.bottom-wrapper {
@@ -98,25 +149,23 @@
.list-item {
background-color: #fff;
- margin-top: 10rpx;
+ margin-bottom: 2rpx;
display: flex;
justify-content: space-between;
align-items: center;
padding-left: 30rpx;
padding-right: 30rpx;
- padding-top: 20rpx;
- padding-bottom: 20rpx;
-
+ padding-top: 30rpx;
+ padding-bottom: 30rpx;
+ margin-left: 20rpx;
+ margin-right: 20rpx;
}
.list-item text {
font-size: 30rpx;
}
-.list-item image {
- width: 80rpx;
- height: 80rpx;
-}
+
.list-item-piping {
display: flex;
@@ -127,7 +176,143 @@
.bottom-title {
border-radius: 5px 5px 0 0;
background-color: #fff;
- padding-left: 30rpx;
- padding-top: 30rpx;
- padding-bottom: 30rpx;
+ display: flex;
+ align-items: center;
+ /* 鍨傜洿鏂瑰悜灞呬腑 */
+ justify-content: space-between;
+ /* 瀛愬厓绱犲湪涓昏酱涓婄殑瀵归綈鏂瑰紡 */
+ padding: 10px;
+ /* 瀹瑰櫒鐨勫唴杈硅窛 */
+ margin-left: 20rpx;
+ margin-right: 20rpx;
+ margin-top: 20rpx;
+}
+
+.bottom-title-text {
+ position: absolute;
+ /* 缁濆瀹氫綅 */
+ left: 50%;
+ /* 绉诲姩鍒板鍣ㄧ殑涓棿 */
+ transform: translateX(-50%);
+ /* 閫氳繃骞崇Щ鑷韩瀹藉害鐨勪竴鍗婃潵瀹炵幇鐪熸鐨勫眳涓� */
+ font-size: 16px;
+ /* 瀛椾綋澶у皬 */
+ color: #333;
+ /* 瀛椾綋棰滆壊 */
+}
+
+.refresh-button {
+ margin-left: auto;
+ /* 灏嗘寜閽帹鍒板鍣ㄧ殑鏈�鍙充晶 */
+ font-size: 30rpx;
+ /* 鎸夐挳鏂囧瓧鐨勫瓧浣撳ぇ灏� */
+ color: #fff;
+ /* 鎸夐挳鏂囧瓧棰滆壊 */
+ background-color: #1890FF;
+ /* 鎸夐挳鑳屾櫙棰滆壊 */
+ border: none;
+ /* 鍘绘帀鎸夐挳杈规 */
+ border-radius: 5px;
+ /* 鎸夐挳鍦嗚 */
+ padding-left: 25rpx;
+ padding-right: 25rpx;
+ padding-top: 15rpx;
+ padding-bottom: 15rpx;
+}
+
+.refresh-view {
+ text-align: center;
+ padding: 30rpx;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+}
+
+.dot {
+ width: 20rpx;
+ height: 20rpx;
+ background-color: #333;
+ border-radius: 50%;
+ margin: 0 5px;
+ animation: blink 1.4s infinite both;
+}
+
+.dot:nth-child(2) {
+ animation-delay: 0.2s;
+}
+
+.dot:nth-child(3) {
+ animation-delay: 0.4s;
+}
+
+@keyframes blink {
+
+ 0%,
+ 80%,
+ 100% {
+ opacity: 0;
+ }
+
+ 40% {
+ opacity: 1;
+ }
+}
+
+.switch {
+ --td-switch-checked-color: #1890FF;
+}
+
+
+.item-left {
+ display: flex;
+ align-items: center;
+}
+
+.item-left text {
+ font-size: 40rpx;
+ min-width: 150rpx;
+}
+
+.item-img {
+ width: 40rpx;
+ /* 鏍规嵁闇�瑕佽皟鏁村浘鏍囧ぇ灏� */
+ height: 40rpx;
+ /* 鏍规嵁闇�瑕佽皟鏁村浘鏍囧ぇ灏� */
+ margin-left: 20rpx;
+}
+
+.t-dialog {
+ --td-dialog-content-font-size: 40rpx;
+ --td-dialog-content-line-height: 50rpx
+}
+
+.noMore-View-home {
+ display: flex;
+ flex-direction: column;
+ /* 纭繚瀛愬厓绱犵旱鍚戞帓鍒� */
+ justify-content: center;
+ /* 鍨傜洿灞呬腑 */
+ align-items: center;
+ /* 姘村钩灞呬腑 */
+ height: 100%;
+ /* 璁╁鍣ㄩ珮搴﹀崰婊＄埗鍏冪礌 */
+}
+
+.item-button {
+ display: flex;
+ height: 80rpx;
+ padding: 0 60rpx;
+ background-color: #1890FF;
+ color: white;
+ border: none;
+ border-radius: 20rpx;
+ font-size: 30rpx;
+ align-items: center;
+ justify-content: center;
+}
+
+.divider {
+ width: 100%;
+ margin-top: 2rpx;
+ /* background-color: #e0e0e0; */
}
\ No newline at end of file
--
Gitblit v1.8.0