Release/0.5.1

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@soramitsu/soramitsu-js-ui",
-  "version": "0.5.0",
+  "version": "0.5.1",
   "private": false,
   "publishConfig": {
     "registry": "https://nexus.iroha.tech/repository/npm-soramitsu-private/"

src/components/Menu/SMenu.vue

@@ -6,6 +6,7 @@
     :mode="mode"
     :collapse="collapse"
     :background-color="backgroundColor"
+    :box-shadow="boxShadow"
     :text-color="textColor"
     :active-text-color="activeTextColor"
     :default-active="defaultActive"
@@ -48,6 +49,10 @@ export default class SMenu extends Vue {
    * By default it's set to `"#2D2926"`
    */
   @Prop({ default: '#2D2926', type: String }) readonly backgroundColor!: string
+  /**
+   * Menu shadow if it exists
+   */
+  @Prop({ default: 'none', type: String }) readonly boxShadow!: string
   /**
    * Text color of menu in hex format.
    *
@@ -104,6 +109,9 @@ export default class SMenu extends Vue {
 
   get computedStyles (): object {
     const styles = {} as any
+    if (this.boxShadow) {
+      styles['--s-menu-box-shadow'] = this.boxShadow
+    }
     if (this.activeHoverColor) {
       styles['--s-menu-color-hover'] = this.activeHoverColor
     }

src/stories/SIcon.stories.ts

@@ -21,7 +21,7 @@ export const configurable = () => ({
       default: select('Name', Object.values(Icons), Icons.Activity)
     },
     size: {
-      default: number('Content position', 16)
+      default: number('Icon Size', 16)
     }
   }
 })

src/styles/menu.scss

@@ -1,6 +1,7 @@
 $margin-bottom-menu-item: 8px;
 
 .s-menu {
+  box-shadow: var(--s-menu-box-shadow);
   padding: 20px 12px;
   &:not(.el-menu--horizontal) > :not(:last-child) {
     margin-bottom: $margin-bottom-menu-item;