Skip to content

Commit 3adfba2

Browse files
committedOct 23, 2015
add community dropdown
1 parent c20af01 commit 3adfba2

File tree

6 files changed

+64
-11
lines changed

6 files changed

+64
-11
lines changed
 

‎themes/vue/layout/index.ejs

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,9 +4,8 @@
44
<li><a href="/guide/" class="nav-link">Guide</a></li>
55
<li><a href="/api/" class="nav-link">API</a></li>
66
<li><a href="/examples/" class="nav-link">Examples</a></li>
7-
<li><a href="https://github.com/vuejs/vue" class="nav-link" target="_blank">GitHub</a></li>
8-
<li><a href="http://forum.vuejs.org" class="nav-link" target="_blank">Forum</a></li>
9-
<li><a href="https://gitter.im/vuejs/vue" class="nav-link" target="_blank">Chat</a></li>
7+
<li><a href="/blog" class="nav-link">Blog</a></li>
8+
<%- partial('partials/community_dropdown') %>
109
</ul>
1110
<div id="logo-wrap">
1211
<img id="logo" src="/images/logo.png">
Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
<li class="nav-dropdown-container">
2+
<a class="nav-link">Community</a><span class="arrow"></span>
3+
<ul class="nav-dropdown">
4+
<li><a href="https://github.com/vuejs/vue" class="nav-link" target="_blank">GitHub</a></li>
5+
<li><a href="http://forum.vuejs.org" class="nav-link" target="_blank">Forum</a></li>
6+
<li><a href="https://gitter.im/vuejs/vue" class="nav-link" target="_blank">Chat</a></li>
7+
<li><a href="https://twitter.com/vuejs" class="nav-link" target="_blank">Twitter</a></li>
8+
</ul>
9+
</li>

‎themes/vue/layout/partials/main_menu.ejs

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,5 @@
66
<li><a href="/guide/" class="nav-link<%- page.path.match(/guide/) ? ' current' : '' %>">Guide</a></li>
77
<li><a href="/api/" class="nav-link<%- page.path.match(/api/) ? ' current' : '' %>">API</a></li>
88
<li><a href="/examples/" class="nav-link<%- page.path.match(/examples/) ? ' current' : '' %>">Examples</a></li>
9-
<li><a href="https://github.com/vuejs/vue" class="nav-link" target="_blank">GitHub</a></li>
10-
<li><a href="http://forum.vuejs.org" class="nav-link" target="_blank">Forum</a></li>
11-
<li><a href="https://gitter.im/vuejs/vue" class="nav-link" target="_blank">Chat</a></li>
9+
<li><a href="/blog/" class="nav-link<%- page.path.match(/blog/) ? ' current' : '' %>">Blog</a></li>
10+
<%- partial('partials/community_dropdown') %>

‎themes/vue/source/css/_common.styl

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -120,3 +120,47 @@ a.button
120120
.carbon-poweredby
121121
color #aaa
122122
font-weight normal
123+
124+
#nav
125+
.nav-link
126+
cursor pointer
127+
.nav-dropdown-container
128+
.nav-link
129+
&:hover
130+
border-bottom none
131+
&:hover
132+
.nav-dropdown
133+
display block
134+
.nav-dropdown
135+
display none
136+
position absolute
137+
top 100%
138+
left 0
139+
background-color #fff
140+
padding 10px 0
141+
border 1px solid #ddd
142+
border-bottom-color #ccc
143+
text-align left
144+
border-radius 4px
145+
li
146+
line-height 1.8em
147+
margin 0
148+
display block
149+
a
150+
color $light
151+
font-size .9em
152+
display block
153+
padding 0 30px 0 20px
154+
&:hover
155+
color $green
156+
.arrow
157+
display inline-block
158+
vertical-align middle
159+
margin-top -1px
160+
margin-left 6px
161+
margin-right -14px
162+
width 0
163+
height 0
164+
border-left 4px solid transparent
165+
border-right 4px solid transparent
166+
border-top 5px solid #ccc

‎themes/vue/source/css/index.styl

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -13,8 +13,11 @@ html, body
1313
list-style-type none
1414
text-align center
1515
padding 0
16+
margin 0
1617
li
1718
display inline-block
19+
position relative
20+
line-height 40px
1821
&:last-child .nav-link
1922
margin-right 0
2023

@@ -41,7 +44,7 @@ html, body
4144
width 200px
4245

4346
#logo-wrap
44-
margin 4em 0
47+
margin 3.5em 0 4em
4548

4649
#hero
4750
text-align center
@@ -251,11 +254,9 @@ html, body
251254
body
252255
font-size 14px
253256
#nav
254-
margin 3em 1.8em 0
257+
margin 2em 1.8em 0
255258
#translations
256259
margin-bottom 2em
257-
#logo-wrap
258-
margin 4em 0
259260
#logo
260261
width 120px
261262
.nav-link

‎themes/vue/source/css/page.styl

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ $header-height = 40px
99
box-shadow 0 0 4px rgba(0,0,0,.25)
1010
padding 25px 60px
1111
position relative
12-
z-index 0
12+
z-index 2
1313

1414
#nav
1515
list-style-type none
@@ -24,6 +24,7 @@ $header-height = 40px
2424
display none
2525
li
2626
display inline-block
27+
position relative
2728
margin 0 .6em
2829

2930
.nav-link

0 commit comments

Comments
 (0)
Please sign in to comment.