From b7af2d5016721bab5e476c101327a7102b42ad56 Mon Sep 17 00:00:00 2001
From: Andrew Croce <andrew+dds@promptworks.com>
Date: Tue, 16 Oct 2018 11:39:06 -0400
Subject: [PATCH] menu styles

---
 styles/elements/_menu.scss | 49 ++++++++++++++++++++++++++++++++++++++
 1 file changed, 49 insertions(+)
 create mode 100644 styles/elements/_menu.scss

diff --git a/styles/elements/_menu.scss b/styles/elements/_menu.scss
new file mode 100644
index 00000000..ca7953db
--- /dev/null
+++ b/styles/elements/_menu.scss
@@ -0,0 +1,49 @@
+.menu {
+  background-color: $color-blue-darkest;
+  color: $color-white;
+  position: absolute;
+  min-width: 30rem;
+  max-height: 80vh;
+  overflow-y: auto;
+  padding-bottom: $gap * 2;
+  box-shadow: 0 2px 4px rgba(0,0,0,0.25);
+
+  .menu__heading {
+    @include h5;
+    margin: 0;
+    padding: ($gap * 3) ($gap * 2) $gap;
+  }
+
+  .menu__list {
+    margin: 0;
+    padding: 0;
+
+    > .menu__list__item {
+      margin: 0;
+
+      > a {
+        @include h5;
+        font-weight: normal;
+        text-decoration: none;
+        display: block;
+        color: $color-white;
+        padding: ($gap * .75) ($gap * 2);
+
+        .icon {
+          @include icon-color($color-white);
+          @include icon-size(10);
+          margin-left: $gap;
+        }
+
+        &:hover {
+          background-color: $color-blue-darker;
+        }
+      }
+    }
+  }
+
+  .menu__button {
+    margin: ($gap * 2) ($gap * 2) 0;
+    white-space: nowrap;
+  }
+}