theluyuan/beelink
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

about 顶部栏

Browse Source
This commit is contained in:
asd 2020-10-23 17:34:16 +08:00
parent 71dac35372
commit 83f39bbaae
2 changed files with 83 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/router/index.ts
View File

@ -127,7 +127,11 @@ const routes: Array<RouteRecordRaw> = [
name: 'Share',
component: () => import('../views/login/Share.vue')
},
{
path: '/about',
name: 'About',
component: () => import('../views/login/About.vue')
}
]
const router = createRouter({

78
src/views/login/About.vue
View File

@ -1,5 +1,21 @@
<template>
<div class="about">
<div class="topnav">
<div class="navcontent">
<div class="left">
<img src="@/static/images/logo.png" alt="" class="logo">
<span class="orgname">Beelink</span>
</div>
<div class="right">
<div>立即登录</div>
<div class="signnow">立即注册</div>
<div class="line"></div>
<img src="@/static/images/yuyan.png" alt="" class="icon">
<div>中文</div>
<img src="@/static/images/jiantou2.png" alt="" class="arrow">
</div>
</div>
</div>
<div class="top">
<div class="titlebox">
<div class="title">beelink</div>
@ -96,6 +112,68 @@ export default defineComponent({
color:white!important
}
.about {
.topnav{
width: 100%;
height: 57px;
background: white;
display: flex;
align-items: center;
position: fixed;
top: 0;
.navcontent{
width: 910px;
margin: 0 auto;
display:flex;
justify-content: space-between;
align-items: center;
.left{
.logo{
width: 38px;
height: 36px;
margin-right:6px;
}
.orgname{
color: #0DBBA4;
font-size: 20px;
font-weight: bold;
}
}
.right{
width: 282px;
font-size: 11px;
color:#111111;
display: flex;
align-items: center;
.signnow{
width: 85px;
height: 23px;
background: linear-gradient(90deg, #00DAC2, #42DE9D, #87E062, #D0EB3D, #FFFA18);
border-radius: 11px;
color: white;
text-align: center;
line-height: 23px;
margin-left: 26px;
margin-right: 23px;
}
.line{
width: 1px;
height: 18px;
background: #EEEEEE;
margin-right: 23px;
}
.icon{
width: 14px;
height: 14px;
margin-right: 6px;
}
.arrow{
width: 9px;
height: 5px;
margin-left: 28px;
}
}
}
}
.top {
width: 100%;
height: 512px;