diff --git a/src/views/HomeRecommend.vue b/src/views/HomeRecommend.vue
index 452b97e0..0b1e0299 100644
--- a/src/views/HomeRecommend.vue
+++ b/src/views/HomeRecommend.vue
@@ -1,14 +1,20 @@
 <template>
-    <div class="homeRecommend_max">
-		<div class="header">
-			<img
-				class="homeRecommend_logo"
-				@click="turnToNewPage('/')"
-				src="@/assets/images/homePage/aidaIcon.png"
-			/>
-			<div class="gallery_btn login white" @click="setLogin">Login</div>
-			<div class="gallery_btn" @click="signUp">Sign up</div>
-		</div>
+  <div class="homeRecommend_max">
+    <div class="header">
+		<img
+        class="homeRecommend_logo"
+        @click="turnToNewPage('/')"
+        src="@/assets/images/homePage/aidaIcon.png"
+      />
+      <div class="gallery_btn login white" @click="setLogin">{{ t('Login.Login') }}</div>
+      <div class="gallery_btn" @click="signUp">{{ t('Login.SignUp') }}</div>
+      <div class="language_btn">
+        <div @click="handleChangeLanguage">
+          <i class="fi fi-rr-globe"></i>
+          {{ isChinese ? 'CN' : 'EN' }}
+        </div>
+      </div>
+    </div>
 
 		<div class="content">
 			<img class="bg pc" src="@/assets/images/homePage/squareBg.png" alt="">
@@ -158,227 +164,251 @@ export default defineComponent({
 </script>
 
 <style lang="less" scoped>
-.homeRecommend_max{
-	width: 100%;
-	height: 100%;
-	display: flex;
-	position: relative;
-	@media (max-width: 768px) {
-		flex-direction: column;
-	}
-	> .header{
-		padding: 3.2rem 4rem;
-		z-index: 2;
-		margin-left: auto;
+.homeRecommend_max {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  position: relative;
+  @media (max-width: 768px) {
+    flex-direction: column;
+  }
+  > .header {
+    padding: 3.2rem 4rem;
+    z-index: 2;
+    margin-left: auto;
+    display: flex;
+    column-gap: 2rem;
+    align-items: center;
+    position: absolute;
+    right: 0;
+    @media (max-width: 768px) {
+      position: relative;
+      justify-content: flex-end;
+      width: 100%;
+      padding: 0.7rem 1.4rem;
+      margin-left: auto;
+      background-color: #fff;
+    }
+    > .homeRecommend_logo {
+      display: none;
+      @media (max-width: 768px) {
+        display: block;
+        height: 2.5rem;
+        margin-right: auto;
+      }
+    }
+    .language_btn {
+      color: #fff;
+      cursor: pointer;
+	  font-size: 2.5rem;
+	  >div {
 		display: flex;
-		align-items: center;
-		position: absolute;
-		right: 0;
-		@media (max-width: 768px) {
-			position: relative;
-			justify-content: space-between;
-			width: 100%;
-			padding: .7rem 1.4rem;
-			margin-left: auto;
-			background-color: #fff;
+		>i{
+			display: flex;
+			align-items: center;
+			font-size: 2.5rem;
+			margin-right: .7rem;
 		}
-		> .homeRecommend_logo{
-			display: none;
-			@media (max-width: 768px) {
-				display: block;
-				height: 2.5rem;
+	  }
+      @media (max-width: 768px) {
+		  font-size: 1.5rem;
+        color: #000;
+		>div {
+			>i{
+				font-size: 1.5rem;
+				margin-right: .7rem;
 			}
 		}
-		> .gallery_btn{
-			margin-right: 2rem;
-			border: none;
-			font-size: 1.7rem;
-			width: 13rem;
-			line-height: 6rem;
-			font-weight: 500;
-			border-radius: 4rem;
-			&:last-child{
-				margin-right: 0;
-			}
-			&.login{
-				@media (max-width: 768px) {
-					display: none;
-				}
-			}
-			@media (max-width: 768px) {
-				font-size: .72rem;
-				width: 5.2rem;
-				line-height: 2.4rem;
-				padding: 0;
-				
-			}
-		}
-		
-	}
-	> .content{
-		flex: 1;
-		position: relative;
-		> .bg{
-			width: 100%;
-			height: 100%;
-			position: absolute;
-			left: 50%;
-			top: 50%;
-			transform: translate(-50%,-50%);
-			object-fit: cover;
-			display: none;
-			&.pc{
-				@media (min-width: 768px) {
-					display: block;
-				}
-			}
-			&.mobile{
-				@media (max-width: 768px) {
-					display: block;
-				}
-			}
-		}
-		> .title{
-			display: none;
-			position: absolute;
-			left: 50%;
-			top: 50%;
-			transform: translate(-50%,-50%);
-			text-align: center;
-			@media (max-width: 768px) {
-				margin-top: -2rem;
-				> img{
-					width: 17rem;
-				}
-				> .text{
-					width: max-content;
-					text-align: center;
-				}
-				font-size: 1.8rem;
-				color: #fff;
-				display: block;
-			}
-		}
-		> .beForm{
-			position: absolute;
-			font-size: 2.1rem;
-			bottom: 10rem;
-			left: 10rem;
-			@media (max-width: 768px) {
-				display: block;
-				left: 50%;
-				color: #fff;
-				bottom: 1rem;
-				font-size: .8rem;
-				text-align: center;
-				transform: translateX(-50%);
-			}
-		}
-		> .learnMore{
-			position: absolute;
-			bottom: 29rem;
-			right: 10rem;
-			width: 53.4rem;
-			text-align: right;
-			z-index: 2;
-			> img{
-				height: 19.5rem;
-				margin-bottom: 2rem;
-				display: none;
-			}
-			
-			// > .title{
-			// 	margin-bottom: .8rem;
-			// 	font-size: 11.8rem;
-			// 	font-weight: 500;
-			// }
-			// > .info{
-			// 	font-family: 'pingfang_regular';
-			// 	font-size: 2.8rem;
-			// 	font-weight: 400;
-			// 	margin-bottom: 2rem;
-			// }
-			> .btn{
-				line-height: 6rem;
-				width: 18rem;
-				font-size: 2rem;
-				font-weight: 500;
-			}
-		}
-		// > .left,> .right{
-		// 	height: 100%;
-		// 	display: flex;
-		// 	display: none;
-		// }
-		// > .left{
-		// 	width: 45%;
-		// 	align-items: center;
-		// 	justify-content: center;
-		// 	position: relative;
-		// 	> .logoBox{
-		// 		height: 4rem;
-		// 		position: absolute;
-		// 		left: 2rem;
-		// 		top: 2rem;
-		// 		img{
-		// 			height: 100%;
-		// 			margin-left: 2rem;
-		// 		}
-		// 		.codeCreatelogo{
-		// 			cursor: pointer;
-		// 		}
-		// 	}
-		// 	> .text{
-		// 		width: 68rem;
-		// 		> .title{
-		// 			font-size: 6.4rem;
-		// 			font-weight: 900;
-		// 			line-height: 1.2;
-		// 			margin-bottom: 3.2rem;
-		// 			p{
-		// 				margin-bottom: 0;
-		// 			}
-		// 		}
-		// 		> .info{
-		// 			font-size: 2.4rem;
-		// 			margin-bottom: 1.6rem;
-		// 			line-height: 1.2;
-		// 			> span{
-		// 				color: #0070c9;
-		// 				cursor: pointer;
-		// 				&:hover{
-		// 					text-decoration: underline;
-		// 				}
-		// 			}
-		// 		}
-		// 		> .continue{
-		// 			font-size: 2.4rem;
-		// 			> i{
-		// 				margin-left: 1rem;
-		// 			}
-		// 		}
-		// 	}
-		// }
-		// > .right{
-		// 	position: relative;
-		// 	width: 55%;
-		// 	background: #d7d6d5;
-		// 	display: flex;
-		// 	align-items: center;
-		// 	justify-content: flex-end;
-		// 	> img{
-		// 		object-fit: cover;
-		// 	}
-		// 	> .model{
-		// 		height: 100%;
-		// 		position: absolute;
-		// 		left: 0;
-		// 	}
-		// 	> .text{
-		// 		height: 45rem;
-		// 		text-align: right;
-		// 	}
-		// }
-	}
+      }
+    }
+    > .gallery_btn {
+      // margin-right: 2rem;
+      border: none;
+      font-size: 1.7rem;
+      width: 13rem;
+      line-height: 6rem;
+      font-weight: 500;
+      border-radius: 4rem;
+      &:last-child {
+        margin-right: 0;
+      }
+      &.login {
+        @media (max-width: 768px) {
+          display: none;
+        }
+      }
+      @media (max-width: 768px) {
+        font-size: 0.72rem;
+        width: 5.2rem;
+        line-height: 2.4rem;
+        padding: 0;
+      }
+    }
+  }
+  > .content {
+    flex: 1;
+    position: relative;
+    > .bg {
+      width: 100%;
+      height: 100%;
+      position: absolute;
+      left: 50%;
+      top: 50%;
+      transform: translate(-50%, -50%);
+      object-fit: cover;
+      display: none;
+      &.pc {
+        @media (min-width: 768px) {
+          display: block;
+        }
+      }
+      &.mobile {
+        @media (max-width: 768px) {
+          display: block;
+        }
+      }
+    }
+    > .title {
+      display: none;
+      position: absolute;
+      left: 50%;
+      top: 50%;
+      transform: translate(-50%, -50%);
+      text-align: center;
+      @media (max-width: 768px) {
+        margin-top: -2rem;
+        > img {
+          width: 17rem;
+        }
+        > .text {
+          width: max-content;
+          text-align: center;
+        }
+        font-size: 1.8rem;
+        color: #fff;
+        display: block;
+      }
+    }
+    > .beForm {
+      position: absolute;
+      font-size: 2.1rem;
+      bottom: 10rem;
+      left: 10rem;
+      @media (max-width: 768px) {
+        display: block;
+        left: 50%;
+        color: #fff;
+        bottom: 1rem;
+        font-size: 0.8rem;
+        text-align: center;
+        transform: translateX(-50%);
+      }
+    }
+    > .learnMore {
+      position: absolute;
+      bottom: 29rem;
+      right: 10rem;
+      width: 53.4rem;
+      text-align: right;
+      z-index: 2;
+      > img {
+        height: 19.5rem;
+        margin-bottom: 2rem;
+        display: none;
+      }
+
+      // > .title{
+      // 	margin-bottom: .8rem;
+      // 	font-size: 11.8rem;
+      // 	font-weight: 500;
+      // }
+      // > .info{
+      // 	font-family: 'pingfang_regular';
+      // 	font-size: 2.8rem;
+      // 	font-weight: 400;
+      // 	margin-bottom: 2rem;
+      // }
+      > .btn {
+        line-height: 6rem;
+        width: 18rem;
+        font-size: 2rem;
+        font-weight: 500;
+      }
+    }
+    // > .left,> .right{
+    // 	height: 100%;
+    // 	display: flex;
+    // 	display: none;
+    // }
+    // > .left{
+    // 	width: 45%;
+    // 	align-items: center;
+    // 	justify-content: center;
+    // 	position: relative;
+    // 	> .logoBox{
+    // 		height: 4rem;
+    // 		position: absolute;
+    // 		left: 2rem;
+    // 		top: 2rem;
+    // 		img{
+    // 			height: 100%;
+    // 			margin-left: 2rem;
+    // 		}
+    // 		.codeCreatelogo{
+    // 			cursor: pointer;
+    // 		}
+    // 	}
+    // 	> .text{
+    // 		width: 68rem;
+    // 		> .title{
+    // 			font-size: 6.4rem;
+    // 			font-weight: 900;
+    // 			line-height: 1.2;
+    // 			margin-bottom: 3.2rem;
+    // 			p{
+    // 				margin-bottom: 0;
+    // 			}
+    // 		}
+    // 		> .info{
+    // 			font-size: 2.4rem;
+    // 			margin-bottom: 1.6rem;
+    // 			line-height: 1.2;
+    // 			> span{
+    // 				color: #0070c9;
+    // 				cursor: pointer;
+    // 				&:hover{
+    // 					text-decoration: underline;
+    // 				}
+    // 			}
+    // 		}
+    // 		> .continue{
+    // 			font-size: 2.4rem;
+    // 			> i{
+    // 				margin-left: 1rem;
+    // 			}
+    // 		}
+    // 	}
+    // }
+    // > .right{
+    // 	position: relative;
+    // 	width: 55%;
+    // 	background: #d7d6d5;
+    // 	display: flex;
+    // 	align-items: center;
+    // 	justify-content: flex-end;
+    // 	> img{
+    // 		object-fit: cover;
+    // 	}
+    // 	> .model{
+    // 		height: 100%;
+    // 		position: absolute;
+    // 		left: 0;
+    // 	}
+    // 	> .text{
+    // 		height: 45rem;
+    // 		text-align: right;
+    // 	}
+    // }
+  }
 }
 </style>