Refactor(云灵AI):换一换动态效果实现

assets/css/aiChat.less

@@ -12,9 +12,9 @@ page {
 	min-height: 100vh;
 	background: linear-gradient(155deg, rgba(61, 76, 241, 0.15) 0%, rgba(255,255,255,1) 25%, rgba(255,255,255,1) 75%, rgba(61, 76, 241, 0.15) 100%);
   // background-color: #fff;
-	// background-size: 100% 100vh;
+	background-size: 100% calc(100vh - 160rpx);
 	// background-image: url(https://wxapp.xdd618.com/api/file/pic/aiChat/bg.png);
-	// background-repeat: no-repeat;
+	background-repeat: no-repeat;
 	// background-attachment: fixed;
 	.fix-tabbar-header {
 		position: fixed;
@@ -1081,10 +1081,20 @@ page {
 		align-items: center;
 		justify-content: center;
 		padding: 0 0 20rpx 0;
-		.icon {
-			display: block;
-			width: 124rpx;
-			height: 38rpx;
+		.change-btn-content {
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			color: #3D4CF0;
+			.icon {
+				display: block;
+				width: 40rpx;
+				height: 32rpx;
+				margin: 0 8rpx 0 0;
+				&.rotate {
+					animation: spin-icon 1s linear;
+				}
+			}
 		}
 	}
 }
@@ -1335,3 +1345,12 @@ page {
     margin: 24rpx 0 0 0;
   }
 }
+
+@keyframes spin-icon {
+	0% {
+		transform: rotate(0deg);
+	}
+	100% {
+		transform: rotate(360deg);
+	}
+}