Add left off canvas navigation arrows

diff --git a/scss/_left-off-canvas.scss b/scss/_left-off-canvas.scss
new file mode 100644 (file)
index 0000000..af670ab
--- /dev/null
+++ b/scss/_left-off-canvas.scss
@@ -0,0 +1,88 @@
+/* for the mobile menu */
+aside.left-off-canvas-menu {
+  /*background: transparent;*/
+  background-color: rgba(0, 0, 0, 0.7);
+  color: white;
+}
+aside.left-off-canvas-menu li.page_item {
+  display: block;
+  overflow: hidden;
+  position: relative;
+  padding: 4px 8px;
+}
+aside.left-off-canvas-menu .off-canvas-list ul li a {
+  line-height: 20px;
+  color: white;
+  border-bottom: 1px solid #b1b3b6;
+  background-repeat: no-repeat;
+  background-position: 3px 50%;
+}
+//aside.left-off-canvas-menu .off-canvas-list ul li a:hover {
+  //background-color: $secondary-color;
+  //color: black;
+//}
+aside.left-off-canvas-menu li.page_item_has_children a.toggle {
+  @include off-canvas-arrow(down, $secondary-color);
+  font-size: 0;
+  height: 0;
+  line-height: 0;
+  padding: 0;
+  position: absolute;
+  right: 10px;
+  top: 13px;
+  width: 0;
+}
+//aside.left-off-canvas-menu li.page_item_has_children:hover > a.toggle {
+  //  @include off-canvas-arrow(down, $primary-color);
+//}
+aside.left-off-canvas-menu li.page_item_has_children a.toggle.open {
+    @include off-canvas-arrow(up, $secondary-color);
+}
+//aside.left-off-canvas-menu li.page_item_has_children:hover > a.toggle.open {
+  //  @include off-canvas-arrow(up, $primary-color);
+//}
+//aside.left-off-canvas-menu li.page_item_has_children a.toggle.open:hover {
+    //background-color: $primary-color;
+//}
+aside.left-off-canvas-menu ul.children {
+  display: none;
+}
+aside.left-off-canvas-menu .off-canvas-list ul li > ul li > a {
+  padding-left: 10px;
+  margin-left: 25px;
+  line-height: 18px;
+}
+aside.left-off-canvas-menu ul.open {
+  display: block;
+}
+.left-off-canvas-menu {
+        list-style: none;
+        li {
+            a {
+                color: $white;
+                font-size: rem-calc(20);
+                line-height: 150%;
+                border-color: white;
+            }
+            a:hover {
+                color: black;
+            }
+            .dropdown {
+                list-style: none;
+            }
+        }
+        ul {
+            list-style: none;
+
+            padding: 10px 0;
+            li {
+                a {
+                    color: $white;
+                }
+                ul {
+                    list-style: none;
+                }
+            }
+        }
+}
+/* End Mobile Menu */

diff --git a/scss/app.scss b/scss/app.scss
index dfb448c..a07d467 100644 (file)
--- a/scss/app.scss
+++ b/scss/app.scss
@@ -1,8 +1,9 @@
 @import "settings";
 @import "foundation";
-@import "structure";
-@import "wordpress";
 @import "mixins";
+@import "wordpress";
+@import "structure";
+@import "left-off-canvas";
 
 // Or selectively include components
 // @import