fe / yoho-blk · Commits

Go to a project

Authored by yyq
Commit 352f0f963d77472f8cee5bc63b68e6e7f61894c7 1 parent 12d7e28c

头部导航

Inline Side-by-side
Showing 8 changed files with 233 additions and 8 deletions
... ... @@ -37,7 +37,7 @@
购物袋
<div class="mini-bag-box sub-wrapper">
<div class="bag-content">
您的购物,袋暂无商品
您的购物袋暂无商品
</div>
</div>
</li>
... ... @@ -46,3 +46,4 @@
</div>
</div>
{{/ pageHeader}}
{{> nav-menu}}
... ...
{{!-- {{# navMenu}} --}}
<div class="yoho-nav">
<div class="main-nav">
<div class="center-content">
<ul class="main-nav-list">
{{!-- {{# navbars}} --}}
<li class="nav-item{{#if cur}} cur{{/if}}">
<span class="nav-en">MEN</span>
<span class="nav-cn">男士</span>
</li>
<li class="nav-item cur">
<span class="nav-en">WOMEN</span>
<span class="nav-cn">女士</span>
</li>
{{!-- {{/ navbars}} --}}
</ul>
<div class="main-logo"></div>
</div>
</div>
<div class="sub-nav">
<div class="center-content">
<ul class="sub-nav-list">
{{!-- {{# subNav}} --}}
<li{{#if thirdNav}} class="contain-third"{{/if}}>
<a href="{{link}}">
<span class="nav-en">New</span>
<span class="nav-cn">新品</span>
</a>
</li>
<li>
<a href="{{link}}">
<span class="nav-en">Brand</span>
<span class="nav-cn">品牌</span>
</a>
</li>
<li>
<a href="{{link}}">
<span class="nav-en">Clothing</span>
<span class="nav-cn">服饰</span>
</a>
</li>
{{!-- {{/ subNav}} --}}
</ul>
<div class="search-entry">
<span class="iconfont">&#xe605;</span>
<div class="search-wrapper">
<div class="search-input">
<span class="iconfont left">&#xe605;</span>
<input type="text" name="query" id="search-key" class="search-key" placeholder="search"autocomplete="off">
<span class="iconfont right">&#xe608;</span>
</div>
<ul class="search-hint clearfix">
<li class="cur">
<a href="#">
<span>大衣</span>
<span class="right">约300个商品</span>
</a>
</li>
<li>
<a href="#">
<span>大衣</span>
<span class="right">约300个商品</span>
</a>
</li>
<li>
<a href="#">
<span>大衣</span>
<span class="right">约300个商品</span>
</a>
</li>
</ul>
<div class="hot-search">
<a href="#">外套</a>
<a href="#">长裤</a>
<a href="#">大衣</a>
<a href="#">毛衣</a>
<a href="#">图案</a>
<a href="#">简约连衣裙</a>
</div>
</div>
</div>
</div>
</div>
</div>
{{!-- {{/ navMenu}} --}}
\ No newline at end of file
... ...
No preview for this file type
... ... @@ -2,11 +2,11 @@
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
<svg xmlns="http://www.w3.org/2000/svg">
<metadata>
Created by FontForge 20120731 at Wed Jun 29 12:53:43 2016
Created by FontForge 20120731 at Thu Jun 30 11:53:42 2016
By admin
</metadata>
<defs>
<font id="iconfont" horiz-adv-x="374" >
<font id="iconfont" horiz-adv-x="1024" >
<font-face
font-family="iconfont"
font-weight="500"
... ... @@ -16,14 +16,14 @@ Created by FontForge 20120731 at Wed Jun 29 12:53:43 2016
ascent="896"
descent="-128"
x-height="792"
bbox="34 -31 956 792"
bbox="0 -212 1024 896"
underline-thickness="50"
underline-position="-100"
unicode-range="U+0078-E600"
unicode-range="U+0078-E608"
/>
<missing-glyph
<missing-glyph horiz-adv-x="374"
d="M34 0v682h272v-682h-272zM68 34h204v614h-204v-614z" />
<glyph glyph-name=".notdef"
<glyph glyph-name=".notdef" horiz-adv-x="374"
d="M34 0v682h272v-682h-272zM68 34h204v614h-204v-614z" />
<glyph glyph-name=".null" horiz-adv-x="0"
/>
... ... @@ -33,8 +33,27 @@ d="M34 0v682h272v-682h-272zM68 34h204v614h-204v-614z" />
d="M281 543q-27 -1 -53 -1h-83q-18 0 -36.5 -6t-32.5 -18.5t-23 -32t-9 -45.5v-76h912v41q0 16 -0.5 30t-0.5 18q0 13 -5 29t-17 29.5t-31.5 22.5t-49.5 9h-133v-97h-438v97zM955 310v-52q0 -23 0.5 -52t0.5 -58t-10.5 -47.5t-26 -30t-33 -16t-31.5 -4.5q-14 -1 -29.5 -0.5
t-29.5 0.5h-32l-45 128h-439l-44 -128h-29h-34q-20 0 -45 1q-25 0 -41 9.5t-25.5 23t-13.5 29.5t-4 30v167h911zM163 247q-12 0 -21 -8.5t-9 -21.5t9 -21.5t21 -8.5q13 0 22 8.5t9 21.5t-9 21.5t-22 8.5zM316 123q-8 -26 -14 -48q-5 -19 -10.5 -37t-7.5 -25t-3 -15t1 -14.5
t9.5 -10.5t21.5 -4h37h67h81h80h64h36q23 0 34 12t2 38q-5 13 -9.5 30.5t-9.5 34.5q-5 19 -11 39h-368zM336 498v228q0 11 2.5 23t10 21.5t20.5 15.5t34 6h188q31 0 51.5 -14.5t20.5 -52.5v-227h-327z" />
<glyph glyph-name="uniE600" unicode="&#xe600;" horiz-adv-x="1024"
<glyph glyph-name="uniE600" unicode="&#xe600;"
d="M900 660h-776q-8 0 -14 -6t-6 -14v-21q0 -8 6 -14t14 -6h776q8 0 14 6t6 14v21q0 8 -6 14t-14 6zM900 415h-776q-8 0 -14 -6t-6 -15v-20q0 -9 6 -15t14 -6h776q8 0 14 6t6 15v20q0 9 -6 15t-14 6zM900 169h-776q-8 0 -14 -6t-6 -14v-21q0 -8 6 -14t14 -6h776q8 0 14 6
t6 14v21q0 8 -6 14t-14 6z" />
<glyph glyph-name="uniE601" unicode="&#xe601;"
d="M0 896h1024v-1024h-1024v1024zM85 -43h854v854h-854v-854z" />
<glyph glyph-name="uniE602" unicode="&#xe602;"
d="M1024 896h-1024v-1024h1024v1024zM448 101l-237 238l90 90l147 -146l307 306l90 -90l-397 -397v-1z" />
<glyph glyph-name="uniE603" unicode="&#xe603;"
d="M512 -128q-139 0 -257 68.5t-186.5 186.5t-68.5 257t68.5 257t186.5 186.5t257 68.5t257 -68.5t186.5 -186.5t68.5 -257t-68.5 -257t-186.5 -186.5t-257 -68.5zM512 -14q108 0 200 53t145 145t53 200t-53 200t-145 145t-200 53t-200 -53t-145 -145t-53 -200t53 -200
t145 -145t200 -53zM512 100q118 0 201 83t83 201t-83 201t-201 83t-201 -83t-83 -201t83 -201t201 -83z" />
<glyph glyph-name="uniE604" unicode="&#xe604;"
d="M512 684q159 0 271.5 -112.5t112.5 -271.5t-112.5 -271.5t-271.5 -112.5t-271.5 112.5t-112.5 271.5t112.5 271.5t271.5 112.5zM512 812q-139 0 -257 -68.5t-186.5 -186.5t-68.5 -257t68.5 -257t186.5 -186.5t257 -68.5t257 68.5t186.5 186.5t68.5 257t-68.5 257
t-186.5 186.5t-257 68.5z" />
<glyph glyph-name="uniE605" unicode="&#xe605;"
d="M968 -37l-163 164q69 108 69 234q0 119 -57.5 219t-157 158.5t-216 58.5t-216 -58.5t-157 -158.5t-57.5 -218.5t57.5 -219t157 -158.5t216.5 -58q124 0 231 69l163 -164q27 -28 65 -28t65 27.5t27 66t-27 66.5zM443.5 50q-127.5 0 -217.5 91.5t-90 220t90 219.5t217.5 91
t217.5 -91t90 -219.5t-90 -220t-217.5 -91.5z" />
<glyph glyph-name="uniE606" unicode="&#xe606;"
d="M387 158l45 -46l272 272l-272 272l-45 -46l226 -226z" />
<glyph glyph-name="uniE607" unicode="&#xe607;"
d="M704 665l-41 39l-343 -320l343 -320l41 39l-301 281z" />
<glyph glyph-name="uniE608" unicode="&#xe608;"
d="M959 -62l-85 -85l-362 362l-362 -362l-85 85l362 362l-362 362l85 85l362 -362l362 362l85 -85l-362 -362z" />
</font>
</defs></svg>
... ...
No preview for this file type
No preview for this file type

2.76 KB | W: | H:

2.07 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin
... ... @@ -40,6 +40,7 @@
border: 1px solid #eee;
line-height: 32px;
padding: 20px 0;
background: #fff;
position: absolute;
top: 50px;
... ... @@ -112,7 +113,9 @@
margin-left: -86px;
line-height: 1.5;
border: 1px solid #eee;
background: #fff;
position: absolute;
z-index: 20;
text-align: center;
display: none;
... ... @@ -135,7 +138,9 @@
.mini-bag-box {
padding: 18px;
border: 1px solid #eee;
background: #fff;
position: absolute;
z-index: 20;
right: 0;
display: none;
... ... @@ -148,3 +153,118 @@
}
}
}
.yoho-nav {
.main-nav {
height: 80px;
.main-nav-list {
li {
float: left;
height: 21px;
margin-top: 38px;
margin-right: 30px;
color: #999;
}
.cur {
color: #1d1d1d;
border-bottom: 2px solid #1d1d1d;
}
}
.main-logo {
width: 264px;
height: 40px;
left: 50%;
position: absolute;
margin-left: -132px;
margin-top: 20px;
background: resolve('layout/blk-logo.png') no-repeat center center;
}
}
.sub-nav {
height: 50px;
background: #1d1d1d;
.sub-nav-list {
line-height: 50px;
li {
float: left;
margin-right: 66px;
}
li > a {
color: #fff;
}
}
.search-entry {
float: right;
width: 50px;
height: 50px;
line-height: 50px;
text-align: center;
position: relative;
color: #fff;
cursor: pointer;
}
.search-wrapper {
width: 360px;
padding: 16px 0 10px;
font-size: 14px;
top: 50px;
right: 0;
position: absolute;
background: #1d1d1d;
text-align: left;
display: none;
}
.search-input {
font-size: 16px;
padding: 0 20px;
.search-key {
width: 260px;
height: 30px;
padding: 10px;
background: none;
border: none;
color: #fff;
}
}
.search-hint {
display: none;
li {
line-height: 30px;
padding: 0 20px;
}
.cur {
background: #000;
}
a {
color: #fff;
}
}
.hot-search {
line-height: 65px;
margin: 0 20px;
border-top: 1px solid #fff;
a {
color: #fff;
margin-right: 15px;
}
}
}
}
... ...