Implement basic SideMenu component

Author: Turbo87

app/components/side-menu.hbs

@@ -0,0 +1,3 @@
+<ul role="list" local-class="list" ...attributes>
+  {{yield (hash Item=(component "side-menu/item"))}}
+</ul>

app/components/side-menu.module.css

@@ -0,0 +1,9 @@
+.list {
+    list-style: none;
+    margin: 0;
+    padding: 0;
+
+    > * + * {
+        margin-top: 8px;
+    }
+}

app/components/side-menu/item.hbs

@@ -0,0 +1,3 @@
+<li>
+  <a href={{@link.url}} local-class="link {{if @link.isActive "active"}}" {{on "click" @link.transitionTo}}>{{yield}}</a>
+</li>

app/components/side-menu/item.module.css

@@ -0,0 +1,22 @@
+.link {
+    display: block;
+    padding: 10px 12px;
+    border-radius: 6px;
+    color: var(--main-color-light);
+    transition: all 300ms ease-in;
+
+    &:hover {
+        background-color: var(--main-bg-dark);
+        color: var(--main-color);
+        transition: none;
+    }
+}
+
+.active {
+    background-color: var(--main-bg-dark);
+    color: var(--main-color);
+
+    &:hover {
+        background-color: #e5e1cd;
+    }
+}