10000 Reorganize secondary nav links into sectioned ecosystem dropdown (#604) · rubythonode/vuejs.org@445bed3 · GitHub
[go: up one dir, main page]
Skip to content

Commit 445bed3

Browse files
chrisvfritzchrisvfritz
authored
Reorganize secondary nav links into sectioned ecosystem dropdown (vuejs#604)
* reorganize secondary nav links into sectioned ecosystem dropdown * improve typeface of nav dropdown
1 parent f1d08ce commit 445bed3

File tree

6 files changed

+51
-21
lines changed

6 files changed

+51
-21
lines changed

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

Lines changed: 0 additions & 10 deletions
This file was deleted.

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

Lines changed: 24 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,29 @@
11
<li class="nav-dropdown-container ecosystem">
22
<a class="nav-link">Ecosystem</a><span class="arrow"></span>
33
<ul class="nav-dropdown">
4-
<li><a href="https://router.vuejs.org/" class="nav-link" target="_blank">vue-router</a></li>
5-
<li><a href="https://vuex.vuejs.org/" class="nav-link" target="_blank">vuex</a></li>
6-
<li><a href="https://github.com/vuejs/vue-cli" class="nav-link" target="_blank">vue-cli</a></li>
7-
<li><a href="https://github.com/vuejs/awesome-vue" class="nav-link" target="_blank">awesome-vue</a></li>
4+
<li><h4>Help</h4></li>
5+
<li><ul>
6+
<li><a href="http://forum.vuejs.org" class="nav-link" target="_blank">Forum</a></li>
7+
<li><a href="https://gitter.im/vuejs/vue" class="nav-link" target="_blank">Chat</a></li>
8+
<li><a href="https://github.com/vuejs-templates" class="nav-link" target="_blank">Templates</a></li>
9+
</ul></li>
10+
<li><h4>News</h4></li>
11+
<li><ul>
12+
<li><a href="https://twitter.com/vuejs" class="nav-link" target="_blank">Twitter</a></li>
13+
<li><a href="https://medium.com/the-vue-point" class="nav-link" target="_blank">Blog</a></li>
14+
<li><a href="https://vuejsjob.com/?ref=vuejs" class="nav-link" target="_blank">Jobs</a></li>
15+
</ul></li>
16+
<li><h4>Core Plugins</h4></li>
17+
<li><ul>
18+
<li><a href="https://router.vuejs.org/" class="nav-link" target="_blank">Vue Router</a></li>
19+
<li><a href="https://vuex.vuejs.org/" class="nav-link" target="_blank">Vuex</a></li>
20+
</ul></li>
21+
<li><h4>Resource Lists</h4></li>
22+
<li><ul>
23+
<li><a href="https://github.com/vuejs" class="nav-link" target="_blank">Official Repos</a></li>
24+
<li><a href="https://github.com/vuejs/awesome-vue" class="nav-link" target="_blank">Awesome Vue</a></li>
25+
</ul></li>
826
</ul>
927
</li>
28+
29+

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

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<li class="nav-dropdown-container language">
2-
<a class="nav-link">Language</a><span class="arrow"></span>
2+
<a class="nav-link">Translations</a><span class="arrow"></span>
33
<ul class="nav-dropdown">
44
<li><a href="https://cn.vuejs.org/" class="nav-link" target="_blank">中文</a></li>
55
<li><a href="https://jp.vuejs.org/" class="nav-link" target="_blank">日本語</a></li>

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

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,5 @@
66
<li><a href="/v2/guide/" class="nav-link<%- page.path.match(/guide/) ? ' current' : '' %>">Guide</a></li>
77
<li><a href="/v2/api/" class="nav-link<%- page.path.match(/api/) ? ' current' : '' %>">API</a></li>
88
<li><a href="/v2/examples/" class="nav-link<%- page.path.match(/examples/) ? ' current' : '' %>">Examples</a></li>
9-
<li><a href="https://medium.com/the-vue-point" target="_blank" class="nav-link<%- page.path.match(/blog/) ? ' current' : '' %>">Blog</a></li>
10-
<%- partial('partials/community_dropdown') %>
119
<%- partial('partials/ecosystem_dropdown') %>
1210
<%- partial('partials/language_dropdown') %>

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

Lines changed: 22 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -150,13 +150,18 @@ a.button
150150
&:hover
151151
.nav-dropdown
152152
display block
153-
&.ecosystem, &.language
153+
&.language
154154
margin-left 20px
155+
.arrow
156+
pointer-events none
155157
.nav-dropdown
156158
display none
159+
box-sizing border-box
160+
max-height "calc(100vh - %s)" % $header-height
161+
overflow-y scroll
157162
position absolute
158163
top 100%
159-
left 0
164+
right -15px
160165
background-color #fff
161166
padding 10px 0
162167
border 1px solid #ddd
@@ -168,11 +173,24 @@ a.button
168173
line-height 1.8em
169174
margin 0
170175
display block
176+
> ul
177+
padding-left: 0
178+
&:first-child
179+
h4
180+
margin-top 0
181+
padding-top: 0
182+
border-top: 0
183+
a, h4
184+
padding 0 24px 0 20px
185+
h4
186+
// text-transform uppercase
187+
margin .45em 0 0
188+
padding-top: .45em
189+
border-top: 1px solid #eee
171190
a
172-
color $light
191+
color lighten($dark, 10%)
173192
font-size .9em
174193
display block
175-
padding 0 24px 0 20px
176194
&:hover
177195
color $green
178196
.arrow

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

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -75,6 +75,10 @@
7575
padding 4px 0
7676
text-align center
7777
margin-bottom 20px
78+
.nav-dropdown
79+
h4
80+
font-weight normal
81+
margin: 0
7882

7983
@media screen and (max-width: 900px)
8084
.sidebar

0 commit comments

Comments
 (0)
0