调整首页切换语言位置
This commit is contained in:
@@ -6,8 +6,14 @@
|
|||||||
@click="turnToNewPage('/')"
|
@click="turnToNewPage('/')"
|
||||||
src="@/assets/images/homePage/aidaIcon.png"
|
src="@/assets/images/homePage/aidaIcon.png"
|
||||||
/>
|
/>
|
||||||
<div class="gallery_btn login white" @click="setLogin">Login</div>
|
<div class="gallery_btn login white" @click="setLogin">{{ t('Login.Login') }}</div>
|
||||||
<div class="gallery_btn" @click="signUp">Sign up</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>
|
||||||
|
|
||||||
<div class="content">
|
<div class="content">
|
||||||
@@ -171,14 +177,15 @@ export default defineComponent({
|
|||||||
z-index: 2;
|
z-index: 2;
|
||||||
margin-left: auto;
|
margin-left: auto;
|
||||||
display: flex;
|
display: flex;
|
||||||
|
column-gap: 2rem;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
right: 0;
|
right: 0;
|
||||||
@media (max-width: 768px) {
|
@media (max-width: 768px) {
|
||||||
position: relative;
|
position: relative;
|
||||||
justify-content: space-between;
|
justify-content: flex-end;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
padding: .7rem 1.4rem;
|
padding: 0.7rem 1.4rem;
|
||||||
margin-left: auto;
|
margin-left: auto;
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
}
|
}
|
||||||
@@ -187,10 +194,35 @@ export default defineComponent({
|
|||||||
@media (max-width: 768px) {
|
@media (max-width: 768px) {
|
||||||
display: block;
|
display: block;
|
||||||
height: 2.5rem;
|
height: 2.5rem;
|
||||||
|
margin-right: auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.language_btn {
|
||||||
|
color: #fff;
|
||||||
|
cursor: pointer;
|
||||||
|
font-size: 2.5rem;
|
||||||
|
>div {
|
||||||
|
display: flex;
|
||||||
|
>i{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
font-size: 2.5rem;
|
||||||
|
margin-right: .7rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
font-size: 1.5rem;
|
||||||
|
color: #000;
|
||||||
|
>div {
|
||||||
|
>i{
|
||||||
|
font-size: 1.5rem;
|
||||||
|
margin-right: .7rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
> .gallery_btn {
|
> .gallery_btn {
|
||||||
margin-right: 2rem;
|
// margin-right: 2rem;
|
||||||
border: none;
|
border: none;
|
||||||
font-size: 1.7rem;
|
font-size: 1.7rem;
|
||||||
width: 13rem;
|
width: 13rem;
|
||||||
@@ -206,14 +238,12 @@ export default defineComponent({
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
@media (max-width: 768px) {
|
@media (max-width: 768px) {
|
||||||
font-size: .72rem;
|
font-size: 0.72rem;
|
||||||
width: 5.2rem;
|
width: 5.2rem;
|
||||||
line-height: 2.4rem;
|
line-height: 2.4rem;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
> .content {
|
> .content {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
@@ -269,7 +299,7 @@ export default defineComponent({
|
|||||||
left: 50%;
|
left: 50%;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
bottom: 1rem;
|
bottom: 1rem;
|
||||||
font-size: .8rem;
|
font-size: 0.8rem;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
transform: translateX(-50%);
|
transform: translateX(-50%);
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user