on master help sign in
adding custom css classes to fix sidebar
f157030Jimmy
partials/doc-wrap.hoon+2−2
@@ -23,14 +23,14 @@
23 ==
23 ==
24 ==
24 ==
25 ;div.container.mt-10
25 ;div.container.mt-10
26− ;div.row.col-sm-2.col-md-3.col-lg-2.fixed.pb-30.h-100-md
26+ ;div.sidebar-container.row.col-sm-3.fixed.pb-30.h-100-md
27 ;div.col-sm-3.col-lg-6.menu-toggle
27 ;div.col-sm-3.col-lg-6.menu-toggle
28 ;img.w-8.h-8@"/assets/menu-open.svg";
28 ;img.w-8.h-8@"/assets/menu-open.svg";
29 ==
29 ==
30 ;div.col-sm-12.mt-7.sidebar-toggle.md-hide
30 ;div.col-sm-12.mt-7.sidebar-toggle.md-hide
31 ;img.w-8.h-8.dropdown-left@"/assets/dropdown.svg";
31 ;img.w-8.h-8.dropdown-left@"/assets/dropdown.svg";
32 ==
32 ==
33− ;div.overflow-y.col-sm-8.col-md-11.col-lg-10.w-48.sm-hide(style "height:100%")
33+ ;div.h-100.col-sm-8.col-md-11.overflow-y.sm-hide
34 ;+ sidebar
34 ;+ sidebar
35 ==
35 ==
36 ==
36 ==
static-site/css/menu.css+22−2
@@ -7,7 +7,6 @@
7 visibility: visible;
7 visibility: visible;
8 opacity: 1;
8 opacity: 1;
9}
9}
10−
11.menu-hide, .sidebar-hide {
10.menu-hide, .sidebar-hide {
12 visibility: hidden;
11 visibility: hidden;
13 display: none;
12 display: none;
@@ -17,13 +16,34 @@
17 cursor: pointer;
16 cursor: pointer;
18}
17}
19
18
19+/*****************
20+SIDEBAR CUSTOM CSS
21+******************/
20.dropdown-left {
22.dropdown-left {
21 transform: rotate(90deg);
23 transform: rotate(90deg);
22}
24}
23.dropdown-right {
25.dropdown-right {
24 transform: rotate(-90deg);
26 transform: rotate(-90deg);
25}
27}
28+.sidebar-container {
29+ max-width: 232px;
30+}
31+
32+.h-100 {
33+ height: 100%;
34+}
26−@media only screen and (min-width: 480px) {
35+@media only screen and (max-width: 750px) {
36+.sm-hide {
37+ display: none;
38+ }
39+}
40+
41+@media only screen and (min-width: 750px) {
42+.md-hide {
43+ display: none;
44+ }
45+}
46+@media only screen and (min-width: 750px) {
27 .h-100-md{
47 .h-100-md{
28 height: 100%;
48 height: 100%;
29 }
49 }
static-site/css/visibility.css−10
@@ -4,17 +4,7 @@
4.overflow-y {
4.overflow-y {
5 overflow-y: scroll;
5 overflow-y: scroll;
6}
6}
7−@media only screen and (max-width: 480px) {
8−.sm-hide {
9− display: none;
10− }
11−}
12
7
13−@media only screen and (min-width: 480px) {
14−.md-hide {
15− display: none;
16− }
17−}
18
8
19.zn1{
9.zn1{
20 z-index: -1;
10 z-index: -1;