on master help sign in
Merge pull request #33 from urbit/docs-mobile-nav

Docs mobile nav

commit57dfe171a571ca439d52de00dafce20773ef1a28 authorMorgan Sutherland <msutherl@users.noreply.github.com> dateThu 17 Jan 2019, 18:15 (8 years ago) parent48df12019fb76d
7 files changed+50−10
partials/doc-wrap.hoon+18−5 partials/head.hoon−2 static-site/assets/dropdown.svg+1 static-site/css/colors.css+3 static-site/css/menu.css+15−3 static-site/css/visibility.css+6 static-site/js/main.js+7
partials/doc-wrap.hoon+18−5
@@ -12,20 +12,33 @@
1212 ;+ (head "Urbit / Docs")
1313 ;body
1414 ;+ menu
15+ ;div#sidebar-mobile.bg-gray-light.sidebar-hide.overflow-y
16+ ;div.container
17+ ;div.col-sm-10
18+ ;+ sidebar
19+ ==
20+ ;div.col-sm-1.sidebar-toggle.fixed(style "top: 20px; right: 1em")
21+ ;img.w-8.h-8.dropdown-right@"/assets/dropdown.svg";
22+ ==
23+ ==
24+ ==
1525 ;div.container.mt-10
16− ;div.row.fixed.pb-30(style "height:100%")
17− ;div.col-sm-3.col-md-12.menu-toggle
26+ ;div.row.col-sm-2.col-md-3.fixed.pb-30.h-100-md
27+ ;div.col-sm-3.col-lg-6.menu-toggle
1828 ;img.w-8.h-8@"/assets/menu-open.svg";
1929 ==
20−
21− ;div.overflow-y.col-sm-8.col-lg-12.w-48.sm-hide(style "height:100%")
30+ ;div.col-sm-12.mt-7.sidebar-toggle.md-hide
31+ ;img.w-8.h-8.dropdown-left@"/assets/dropdown.svg";
32+ ==
33+ ;div.overflow-y.col-sm-8.col-md-11.col-lg-7.w-48.sm-hide(style "height:100%")
2234 ;+ sidebar
2335 ==
2436 ==
2537 ;div.row.pb-80
26− ;div.col-sm-9.col-md-8.col-sm-offset-3.col-md-offset-3.docs
38+ ;div.col-sm-9.col-md-8.col-sm-offset-2.col-md-offset-3.docs
2739 ;+ content
2840 ==
41+
2942 ==
3043 ==
3144 ;footer.mb-36
partials/head.hoon−2
@@ -5,14 +5,12 @@
55 ;meta(name "viewport", content "width=device-width , initial-scale=1");
66 ;link/"/tilde.ico"(rel "icon");
77 ;link/"/css/base.css"(rel "stylesheet");
8− ;link/"/css/base.css"(rel "preload");
98 ;link/"/css/lists.css"(rel "stylesheet");
109 ;link/"/css/visibility.css"(rel "stylesheet");
1110 ;link/"/css/borders.css"(rel "stylesheet");
1211 ;link/"/css/colors.css"(rel "stylesheet");
1312 ;link/"/css/inputs.css"(rel "stylesheet");
1413 ;link/"/css/typography.css"(rel "stylesheet");
15− ;link/"/css/typography.css"(rel "preload");
1614 ;link/"/css/menu.css"(rel "stylesheet");
1715 ;link/"/css/images.css"(rel "stylesheet");
1816 ;link/"/css/flex.css"(rel "stylesheet");
static-site/assets/dropdown.svgnew file+1
@@ -0,0 +1 @@
1+<svg fill="none" height="16" viewBox="0 0 16 16" width="16" xmlns="http://www.w3.org/2000/svg"><path d="m8.04705 10.7614 4.71405-4.71404h-9.42809z" fill="#000"/></svg>
static-site/css/colors.css+3
@@ -1,3 +1,6 @@
1+.bg-gray-light {
2+ background-color: #E6E6E6;
3+}
14.bg-gray-dark {
25 background-color: #7F7F7F ;
36}
static-site/css/menu.css+15−3
@@ -1,4 +1,4 @@
1−.menu-show {
1+.menu-show, .sidebar-show {
22 position: fixed;
33 top:0%;
44 bottom: 0%;
@@ -8,11 +8,23 @@
88 opacity: 1;
99}
1010
11−.menu-hide {
11+.menu-hide, .sidebar-hide {
1212 visibility: hidden;
1313 display: none;
1414}
1515
16−.menu-toggle {
16+.menu-toggle,.sidebar-toggle {
1717 cursor: pointer;
1818}
19+
20+.dropdown-left {
21+ transform: rotate(90deg);
22+}
23+.dropdown-right {
24+ transform: rotate(-90deg);
25+}
26+@media only screen and (min-width: 480px) {
27+ .h-100-md{
28+ height: 100%;
29+ }
30+}
static-site/css/visibility.css+6
@@ -9,3 +9,9 @@
99 display: none;
1010 }
1111}
12+
13+@media only screen and (min-width: 480px) {
14+.md-hide {
15+ display: none;
16+ }
17+}
static-site/js/main.js+7
@@ -4,3 +4,10 @@ $(function() {
44 $('body').toggleClass('overflow-hidden');
55 })
66});
7+
8+$(function() {
9+ $('.sidebar-toggle').on('click', function() {
10+ $('#sidebar-mobile').toggleClass('sidebar-hide sidebar-show');
11+ $('body').toggleClass('overflow-hidden');
12+ })
13+});