This commit is contained in:
cookfront 2017-03-30 16:18:36 +08:00
parent 50d87fa634
commit 09be7c9323
3 changed files with 38 additions and 17 deletions

View File

@ -9,9 +9,13 @@
<a href="#">首页</a>
</li>
<li>
<a href="#" class="active">组件</a>
<a href="#" class="active">基础组件</a>
</li>
<li>
<a href="#">业务组件</a>
</li>
</ul>
<a href="#" class="github-logo">Github</a>
</div>
<div class="main-content">
<div class="page-container clearfix">

View File

@ -70,6 +70,8 @@ ul, ol {
height: 60px;
background-color: #fbfbfb;
overflow: hidden;
padding-right: 62px;
position: relative;
}
.page-header-logo {
@ -88,7 +90,6 @@ ul, ol {
.page-header-navs {
float: right;
margin-right: 50px;
li {
float: left;
@ -99,14 +100,28 @@ ul, ol {
line-height: 60px;
color: #333;
font-size: 16px;
margin: 0 35px;
margin: 0 20px;
&.active {
&.active,
&:hover {
color: #3388FF;
}
}
}
.github-logo {
position: absolute;
top: 19px;
right: 20px;
width: 22px;
height: 0;
padding-top: 22px;
overflow: hidden;
background-image: url(https://img.yzcdn.cn/upload_files/2017/03/30/Fil9peDfgzvk3kj-oFCsElS4FS1x.png);
background-size: contain;
background-repeat: no-repeat;
}
.main-content {
margin: 40px 15px;
}
@ -121,10 +136,11 @@ ul, ol {
.page-content {
box-sizing: border-box;
padding: 0 40px;
flex: 1;
section {
padding: 0 40px;
> h1,
> h2,
> h3,

View File

@ -6,7 +6,7 @@
class="footer-nav__link footer-nav__left"
@click="handleNavClick('prev')">
<zan-icon name="arrow"></zan-icon>
{{ leftNav.title }}
<span>{{ leftNav.title }}</span>
</a>
<a
href="javascript:void(0)"
@ -14,7 +14,7 @@
class="footer-nav__link footer-nav__right"
@click="handleNavClick('next')">
<zan-icon name="arrow"></zan-icon>
{{ rightNav.title }}
<span>{{ rightNav.title }}</span>
</a>
</div>
</template>
@ -85,27 +85,26 @@ export default {
<style>
@component-namespace footer {
@b nav {
padding: 24px 0;
font-size: 30px;
padding: 24px 40px;
overflow: hidden;
border-top: 1px solid #e5e5e5;
@e link {
color: #3388FF;
overflow: hidden;
padding-top: 35px;
position: relative;
font-size: 20px;
line-height: 1.5;
.zan-icon {
box-sizing: border-box;
width: 20px;
display: block;
font-size: 12px;
line-height: 20px;
line-height: 16px;
border: 2px solid #3388FF;
border-radius: 50%;
text-align: center;
margin-bottom: 10px;
position: absolute;
top: 0;
margin-top: 5px;
}
}
@ -113,8 +112,9 @@ export default {
float: left;
.zan-icon {
float: left;
transform: rotate(180deg);
left: 0;
margin-right: 10px;
}
}
@ -122,7 +122,8 @@ export default {
float: right;
.zan-icon {
right: 0;
float: right;
margin-left: 10px;
}
}
}