fix
This commit is contained in:
huangjinming
parent
a0b6dc42d5
commit
0ce1737c1b
36
src/assets/img/about/boder-bottom.svg
Normal file
36
src/assets/img/about/boder-bottom.svg
Normal file
@ -0,0 +1,36 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- Generator: Adobe Illustrator 25.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<svg version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
viewBox="0 0 270 32" style="enable-background:new 0 0 270 32;" xml:space="preserve">
|
||||
<style type="text/css">
|
||||
.st0{fill:#EC2E5B;}
|
||||
.st1{fill:#DC5C7F;}
|
||||
.st2{fill:#0F6569;}
|
||||
.st3{fill:#8AF4E1;}
|
||||
.st4{fill:#CEC3C3;}
|
||||
</style>
|
||||
<g>
|
||||
<rect x="0" y="31.05" class="st4" width="270" height="0.9"/>
|
||||
|
||||
<rect x="267" y="26.94" transform="matrix(-9.094965e-11 1 -1 -9.094965e-11 296.9444 -238.0556)" class="st4" width="1" height="5"/>
|
||||
|
||||
<rect x="264.5" y="27.64" transform="matrix(-9.004016e-11 1 -1 -9.004016e-11 293.6384 -237.3616)" class="st4" width="2" height="1"/>
|
||||
|
||||
<rect x="265.5" y="25.64" transform="matrix(-8.913066e-11 1 -1 -8.913066e-11 292.6384 -239.3616)" class="st4" width="1" height="2"/>
|
||||
|
||||
<rect x="266.5" y="26.64" transform="matrix(-9.004016e-11 1 -1 -9.004016e-11 294.6384 -240.3616)" class="st4" width="2" height="1"/>
|
||||
|
||||
<rect x="263.5" y="20.64" transform="matrix(-1.346054e-10 1 -1 -1.346054e-10 288.6384 -246.3616)" class="st4" width="8" height="1"/>
|
||||
<rect x="256" y="28.94" transform="matrix(-1 -1.348327e-10 1.348327e-10 -1 520 58.8889)" class="st4" width="8" height="1"/>
|
||||
<rect x="255" y="14" transform="matrix(6.347640e-11 -1 1 6.347640e-11 255 284)" class="st4" width="29" height="1"/>
|
||||
<rect x="-1.5" y="21.64" transform="matrix(6.730267e-11 -1 1 6.730267e-11 -19.6384 24.6384)" class="st4" width="8" height="1"/>
|
||||
<rect x="0" y="26.94" transform="matrix(-1 -4.547486e-11 4.547486e-11 -1 1 58.8889)" class="st4" width="1" height="5"/>
|
||||
<rect x="0.81" y="26.94" transform="matrix(-1 -4.456536e-11 4.456536e-11 -1 3.6121 54.8889)" class="st4" width="2" height="1"/>
|
||||
<rect x="2.81" y="26.94" transform="matrix(-1 -4.547486e-11 4.547486e-11 -1 6.6121 55.8889)" class="st4" width="1" height="2"/>
|
||||
<rect x="1.81" y="28.94" transform="matrix(-1 -4.547486e-11 4.547486e-11 -1 5.6121 58.8889)" class="st4" width="2" height="1"/>
|
||||
|
||||
<rect x="4.81" y="28.94" transform="matrix(-1 -6.730273e-11 6.730273e-11 -1 17.6121 58.8889)" class="st4" width="8" height="1"/>
|
||||
|
||||
<rect x="-12.5" y="12.64" transform="matrix(6.380502e-11 -1 1 6.380502e-11 -12.6384 13.6384)" class="st4" width="26" height="1"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.3 KiB |
16
src/assets/img/about/boder-center.svg
Normal file
16
src/assets/img/about/boder-center.svg
Normal file
@ -0,0 +1,16 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- Generator: Adobe Illustrator 25.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<svg version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
viewBox="0 0 270 32" style="enable-background:new 0 0 270 32;" xml:space="preserve">
|
||||
<style type="text/css">
|
||||
.st0{fill:#EC2E5B;}
|
||||
.st1{fill:#DC5C7F;}
|
||||
.st2{fill:#0F6569;}
|
||||
.st3{fill:#8AF4E1;}
|
||||
.st4{fill:#CEC3C3;}
|
||||
</style>
|
||||
<g>
|
||||
<polyline class="st4" points="1,0 1,32 0,32 0,0 "/>
|
||||
<polyline class="st4" points="270,0 270,32 269,32 269,0 "/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 618 B |
30
src/assets/img/about/boder-top.svg
Normal file
30
src/assets/img/about/boder-top.svg
Normal file
@ -0,0 +1,30 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- Generator: Adobe Illustrator 25.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||
<svg version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
|
||||
viewBox="0 0 270 32" style="enable-background:new 0 0 270 32;" xml:space="preserve">
|
||||
<style type="text/css">
|
||||
.st0{fill:#EC2E5B;}
|
||||
.st1{fill:#DC5C7F;}
|
||||
.st2{fill:#0F6569;}
|
||||
.st3{fill:#8AF4E1;}
|
||||
.st4{fill:#CEC3C3;}
|
||||
</style>
|
||||
<rect x="133.59" y="0.71" transform="matrix(0.7071 -0.7071 0.7071 0.7071 38.0406 96.0807)" class="st3" width="2.83" height="2.83"/>
|
||||
<polygon class="st4" points="140,2.11 135,6.04 130,2.11 0,2.11 0,3.09 129,3.09 135,8 141,2.98 270,2.98 270,2 "/>
|
||||
<g>
|
||||
<rect x="2" y="2" transform="matrix(4.547480e-11 -1 1 4.547480e-11 -2 7)" class="st4" width="1" height="5"/>
|
||||
<rect x="3.5" y="5.31" transform="matrix(4.456530e-11 -1 1 4.456530e-11 -1.3061 10.3061)" class="st4" width="2" height="1"/>
|
||||
<rect x="3.5" y="6.31" transform="matrix(4.547480e-11 -1 1 4.547480e-11 -3.3061 11.3061)" class="st4" width="1" height="2"/>
|
||||
<rect x="1.5" y="6.31" transform="matrix(4.547480e-11 -1 1 4.547480e-11 -4.3061 9.3061)" class="st4" width="2" height="1"/>
|
||||
<rect x="-1.5" y="12.31" transform="matrix(6.753004e-11 -1 1 6.753004e-11 -10.3061 15.3061)" class="st4" width="8" height="1"/>
|
||||
<rect x="6" y="4" class="st4" width="8" height="1"/>
|
||||
</g>
|
||||
<rect x="-13.5" y="17.5" transform="matrix(-1.836970e-16 1 -1 -1.836970e-16 18.5 17.5)" class="st4" width="28" height="1"/>
|
||||
<rect x="269.06" y="3" class="st4" width="0.94" height="5"/>
|
||||
<rect x="267.37" y="7" class="st4" width="1.87" height="1"/>
|
||||
<rect x="266.43" y="6" class="st4" width="0.94" height="2"/>
|
||||
<rect x="266.43" y="5" class="st4" width="1.87" height="1"/>
|
||||
<rect x="258" y="5" class="st4" width="7.5" height="1"/>
|
||||
<rect x="263.66" y="12.53" transform="matrix(-1.836970e-16 1 -1 -1.836970e-16 280.6573 -254.6574)" class="st4" width="8" height="0.94"/>
|
||||
<rect x="258.03" y="20.03" transform="matrix(-1.836970e-16 1 -1 -1.836970e-16 290.0315 -249.0315)" class="st4" width="23" height="0.94"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.1 KiB |
BIN
src/assets/img/home/link-icon.png
Normal file
BIN
src/assets/img/home/link-icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 318 B |
@ -1 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 48 48"><image width="46" height="45" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAC4AAAAtCAYAAADRLVmZAAAEO0lEQVRogb3ZeahVVRTH8Y8ahpUJ 9bDyD0tpIP+wiIImyiyCSqIsoyCiqCBTEaNoIiojoj/KKCVCmqysTMoSMssGFIMGSi0jNcqyRF7m kEZqNPyxzuPenmef4d77/MHlnrvWPnt/2W+/vdZeu58cDblxYp45pYMwDmMxGiMxBP3RjTX4GMvw Af6q0zlsn/3kXrb96nbSpONwOyYI+DwNyz7nZL+78RKewA9tjK1/C+8MyQZejeukofM0FNOwFrNw aAvjoz74qViFyRjQ6qDiL31z1te5rXRQB/wKfIThrQyU0DC8i3vqvlgV/ErMxf51B6jIMB2P132p TGfiee0tjSqagrurNi4DPwTzMLAdohqajvOqNCwDfxRHtI1TXf3xNA6s0jClE3BNp4hqaLjYMgtV BH4n+nUMp56mYlBRgxR4Fy7tOE51deGSogYp8Avtu3/IlMYXOVPgY/sApK7GFDlT4KM7z1FbXSKy 5ioFfmTfsNTWiJQjBX5wH4HU1fEpRwr8nz4CqatpEmeGFPj2vmOppVG4Jc+RAv8px/Zt9tmXmoH1 eY4U+Ioc21s4HUs6w1RJL4okby+lwJfl2FbjOdyAx3L8W1ohK9AufJVypg7Li/C3Rg6+R5wTL85s 48TJfbY4g8p+j1HvDFqk5QoqAqkZ78bipt+f4I/s+djs+zWcorHuD8D8GmBlO9frRc6i7HBG0/Mi MetwWJN9HU4TJ6TvywZr0krF4FvE+k6qqK6yBB+KmshibM3svYPTNlybPQ/OgMoOKO+IfD+lh/F7 UQdlA0wWs/qlWAo0lkyedmBDSZ/dWZ8prRR1m0KVgX8j6h7/ivIE5Xv5xhL/Izg54duOy/FnSR+V SnAbcLTGCXxBSftNJX3NlB8niFPXdxWYKpUnRuJtsbZ/zAYu0q8FvqkicTomx7cDL1TgQbUZn5AN tEeUDraVtE/N+Cy8gTkJ/3zsrMCDajPes58PFLNSps05tjm4TeTXV+X4t6kx21Sb8RVifx6PB0XI L1LzjG/GXWInmodX8Z6IwuvEel6rhZJz1fr4FBHOrxeZ4/SCtmvwFJaKxGynCCZjcZmSwFJVVYue GzEpe74f9yba9cNRIkmbq7Fm3xRx4KSWKHNUp8z8ikaKeR/uyJ4HiNuJSfhcQD7Qq+9F2I0z2mD9 n+oW9idqRMaHRKq7QwSlmRozOkLk7j3aifdxVsukvVQXfAuu1ki4Rtm7VLYr+76ol32BWOcdqbG3 cge0FDfhF3wttrFbcT4OF5cAcGKv9xaKdX5BS6S91Oqt27PZJ089ydjQXvZN+FREz7K0oVStzHiZ RmXfv/WyDxa3bGNwdruD9AV4D9QXTbZBeFmkDjtEztOWOg3eJU5ERPAZIe5CPxP/rFtF+Xh9uwO1 c7Ocp/FNfS5vsu/GMyJw/dyJgToN3nPY2CwAV4n7+4U6XL74Dx3VyAC1SuGXAAAAAElFTkSuQmCC" transform="translate(1 1.5)" overflow="visible"/></svg>
|
||||
<svg version="1.1" id="prefix__图层_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 48 48" xml:space="preserve"><style>.prefix__st2{fill:#0f6569} .prefix__st2:hover{fill:#f12c12}</style><path class="prefix__st2" d="M40.94 19.13l-1-1c0-7-4-16-14.41-16.47-7.4-.34-13.59.47-18.59 10.47s2 17 2 17c0-7 3-9 3-9 1.19 1.03.92.95 4 3 3 2 4 5 4 5v-3c0-.67-1-3-1-3s1 1 2 3c2.08 4.15 1.28 9.52 1.05 10 4.98-.07 8.95-10 8.95-10 1 5-1.78 7-1.78 7l-.22 3 4.89-1.33c4.89-2.33 6.11-13.67 6.11-13.67 1 1 3 0 3 0s-1 0-2-1z"/><path class="prefix__st2" d="M21.99 35.12h-.05c.01.07.03.05.05 0z"/><path class="prefix__st2" d="M27.94 33.13l-1 1s-.16 1.53 0 2c.53 1.59 3 6 3 6l-4 4h-5v-2s1.74-2.14 2-3c.07-.24.09-.77 0-1-.24-.66-1.31-1.86-2-2-.78-.16-3 1-3 1l-4-1-4-6v-1.04l3-2.96-1-5-1-1v6l-3 3 1 2 4 6 5 1s2.22-1.16 3-1c.35.07.89.66 1 1 .08.24.07.76 0 1-.26.86-2 3-2 3v3h6l5-5s-2.47-4.41-3-6c-.23-.71 0-3 0-3z"/></svg>
|
||||
|
Before Width: | Height: | Size: 1.7 KiB After Width: | Height: | Size: 912 B |
@ -49,6 +49,7 @@ export default class ChainManager {
|
||||
}
|
||||
|
||||
get isLogined() {
|
||||
|
||||
return !!UserModule.token && !!AppModule.step
|
||||
}
|
||||
|
||||
|
||||
44
src/components/about/Grid9Panel.vue
Normal file
44
src/components/about/Grid9Panel.vue
Normal file
@ -0,0 +1,44 @@
|
||||
<template>
|
||||
<div class="bg">
|
||||
<div class="bg-middle"></div>
|
||||
<div class="bg-up"></div>
|
||||
<div class="bg-down"></div>
|
||||
</div>
|
||||
</template>
|
||||
<style scoped>
|
||||
.bg {
|
||||
width: 100%;
|
||||
padding-left: 15px;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 38px;
|
||||
height: 96px;
|
||||
min-height: 96px;
|
||||
}
|
||||
|
||||
.bg-up {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
height: 32px;
|
||||
width: 300px;
|
||||
background: url("@/assets/img/about/boder-top.svg") no-repeat;
|
||||
background-size: 300px 32px ;
|
||||
}
|
||||
.bg-middle {
|
||||
position: absolute;
|
||||
top: 22px;
|
||||
height: calc(100% - 22px);
|
||||
width: 300px;
|
||||
background: url("@/assets/img/about/boder-center.svg") repeat-y;
|
||||
background-size: 300px 32px ;
|
||||
}
|
||||
|
||||
.bg-down {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
height: 32px;
|
||||
width: 300px;
|
||||
background: url("@/assets/img/about/boder-bottom.svg") no-repeat;
|
||||
background-size:300px 32px ;
|
||||
}
|
||||
</style>
|
||||
@ -42,6 +42,7 @@
|
||||
<div class="card-list">
|
||||
<div class="card-item">
|
||||
<img src="@/assets/img/about/card.png" alt="" />
|
||||
<Grid9Panel class="grid"></Grid9Panel>
|
||||
</div>
|
||||
<div class="card-item">
|
||||
<img src="@/assets/img/about/card.png" alt="" />
|
||||
@ -66,6 +67,7 @@
|
||||
|
||||
<script setup>
|
||||
import { ref, computed, reactive, onMounted } from "vue";
|
||||
import Grid9Panel from "./Grid9Panel.vue";
|
||||
const Y1 = ref(0);
|
||||
const ratio = ref(0.2); //视差偏移率
|
||||
|
||||
@ -190,6 +192,7 @@ function handleScroll() {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
.card-item {
|
||||
position: relative;
|
||||
width: 330px;
|
||||
height: 456px;
|
||||
}
|
||||
@ -197,4 +200,33 @@ function handleScroll() {
|
||||
}
|
||||
}
|
||||
}
|
||||
.grid {
|
||||
width: 100%;
|
||||
height: 96px;
|
||||
cursor: pointer;
|
||||
animation-timing-function: cubic-bezier(.4,0,.2,1);
|
||||
animation: myfirstnone 0.5s alternate 1 forwards;
|
||||
}
|
||||
|
||||
.grid:hover {
|
||||
animation-timing-function: cubic-bezier(.4,0,.2,1);
|
||||
animation: myfirst 0.5s alternate 1 forwards;
|
||||
}
|
||||
|
||||
@keyframes myfirst {
|
||||
0% {
|
||||
height: 96px;
|
||||
}
|
||||
100% {
|
||||
height: 396px;
|
||||
}
|
||||
}
|
||||
@keyframes myfirstnone {
|
||||
0% {
|
||||
height: 396px;
|
||||
}
|
||||
100% {
|
||||
height: 96px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -49,7 +49,7 @@ const listred = [
|
||||
"src/assets/img/home/tabs/CHIP-red-tab.png",
|
||||
];
|
||||
const listblack = [
|
||||
"src/assets/img/home/tabs/HERO-black-tab.png",
|
||||
"src/assets/svg/hero-icon.svg",
|
||||
"src/assets/img/home/tabs/WEAPON-black-tab.png",
|
||||
"src/assets/img/home/tabs/CHIP-black-tab.png",
|
||||
];
|
||||
|
||||
@ -13,7 +13,7 @@
|
||||
<div class="dropdown">
|
||||
<ul>
|
||||
<li v-for="(item, index) in nav.submenu" :key="index">
|
||||
<a href="#" v-if="i !== 2"> {{ item.label }}</a>
|
||||
<a class="link-name" href="#" v-if="i !== 2"> {{ item.label }} <img class="link-img" src="../../assets/img/home/link-icon.png" alt=""></a>
|
||||
<span v-else>{{ item.label }}</span>
|
||||
</li>
|
||||
</ul>
|
||||
@ -87,11 +87,6 @@ async function login(event) {
|
||||
await chain.chainManager.login();
|
||||
console.log("logined:", chain.chainManager.isLogined);
|
||||
chain.logined = chain.chainManager.isLogined;
|
||||
} else {
|
||||
// 已经登录过就退出登录
|
||||
await chain.chainManager.logout();
|
||||
console.log("logined:", chain.chainManager.isLogined);
|
||||
chain.logined = chain.chainManager.isLogined;
|
||||
}
|
||||
}
|
||||
const logout = async () => {
|
||||
@ -385,4 +380,12 @@ function handNavCurent(nav) {
|
||||
border: 2px solid rgba(215, 68, 88, 1);
|
||||
border-radius: 50%;
|
||||
}
|
||||
.link-name{
|
||||
position: relative;
|
||||
.link-img{
|
||||
position: absolute;
|
||||
top: 24px;
|
||||
right: -18px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -7,6 +7,7 @@ export const useChainStore = defineStore('chain', ()=> {
|
||||
const chainManager = ref(new ChainManager());
|
||||
chainManager.value.init().then(()=> {
|
||||
console.log("chain init:", {chainManager})
|
||||
|
||||
logined.value = chainManager.value.isLogined;
|
||||
});
|
||||
|
||||
|
||||
@ -1,11 +1,9 @@
|
||||
<template>
|
||||
<div class="home-box">
|
||||
<!-- <NavBar></NavBar> -->
|
||||
<Banner></Banner>
|
||||
<WhatCebg></WhatCebg>
|
||||
<GameIntroduction></GameIntroduction>
|
||||
<GameGallerp></GameGallerp>
|
||||
<!-- <FooterBar></FooterBar> -->
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user