Release 0.5.8

package.json

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

src/styles/breadcrumbs.scss

@@ -1,5 +1,3 @@
-@import "./variables";
-
 .el-breadcrumb__separator {
   color: var(--s-color-base-content-tertiary);
   font-weight: normal;

src/styles/button.scss

@@ -1,5 +1,3 @@
-@import "./variables";
-
 $s-color-button-tertiary-color: var(--s-color-base-content-primary) !default;
 $s-color-button-tertiary-color-active: var(--s-color-theme-accent) !default;
 $s-color-button-tertiary-background: var(--s-color-base-background) !default;

src/styles/card.scss

@@ -1,5 +1,3 @@
-@import "./variables";
-
 .s-card {
   color: var(--s-color-base-content-primary);
   border-radius: 8px;

src/styles/checkbox.scss

@@ -1,6 +1,3 @@
-@import "./variables";
-@import "./common";
-
 .el-checkbox {
   color: var(--s-color-base-content-primary);
   &.is-bordered {

src/styles/collapse.scss

@@ -1,5 +1,3 @@
-@import "./variables";
-
 .el-collapse {
   border-top-color: var(--s-color-base-border-secondary);
   border-bottom-color: var(--s-color-base-border-secondary);

src/styles/common.scss

@@ -1,5 +1,3 @@
-@import "./variables";
-
 [class^="el-"]:not(i):not([class*='el-icon']),
 [class*="el-"]:not(i):not([class*='el-icon']) {
   font-family: $s-font-family-default;

src/styles/datepicker.scss

@@ -1,5 +1,3 @@
-@import "./variables";
-
 .s-date-picker {
   font-family: $s-font-family-default;
   width: 100%;

src/styles/dialog.scss

@@ -1,5 +1,3 @@
-@import "./variables";
-
 .el-dialog {
   border-radius: 8px;
   .el-dialog__title {

src/styles/dropdown.scss

@@ -1,5 +1,3 @@
-@import "./variables";
-
 .el-dropdown {
   color: var(--s-color-base-content-primary);
   > .el-button-group {

src/styles/element-variables.scss

@@ -1,5 +1,3 @@
-@import "./variables";
-
 $--color-primary: $s-color-theme-accent;
 $--color-danger: $s-color-status-error;
 $--color-success: $s-color-status-success;

src/styles/fonts.scss

@@ -1,6 +1,6 @@
 @font-face {
   font-family: "soramitsu-icons";
-  src: url("~@/assets/fonts/soramitsu-icons.woff");
+  src: url("~@/assets/fonts/soramitsu-icons-1.0.0.woff");
   font-weight: normal;
   font-style: normal;
   font-display: block;

src/styles/form.scss

@@ -1,5 +1,3 @@
-@import "./variables";
-
 .el-form-item {
   margin-bottom: 12px;
   &__content {

src/styles/icons.scss

@@ -1,5 +1,3 @@
-@import "./variables";
-
 [class^="s-icon-"], [class*=" s-icon-"] {
   font-family: 'soramitsu-icons' !important;
   font-style: normal;

src/styles/input.scss

@@ -1,5 +1,3 @@
-@import "./variables";
-
 .s-input {
   font-family: $s-font-family-default;
   width: 100%;

src/styles/json-input.scss

@@ -1,6 +1,3 @@
-@import "./variables";
-// @import "./icons";
-
 $color-ide-variable: #0451A5;
 $color-ide-string: #A31515;
 $color-ide-number: #098658;

src/styles/layout.scss

@@ -1,5 +1,3 @@
-@import "./common";
-
 $box-shadow-layout: 0px 0px 8px rgba(45, 41, 38, 0.2);
 $font-size-layout: 18px;
 

src/styles/pagination.scss

@@ -1,5 +1,3 @@
-@import "./variables";
-
 .el-pagination {
   &.is-background .el-pager li:not(.disabled) {
     &.active {

src/styles/radio.scss

@@ -1,6 +1,3 @@
-@import "./variables";
-@import "./common";
-
 $radio-button-class: ".el-radio-button";
 $radio-button-border-width: 1px;
 $radio-button-border-color: var(--s-color-theme-accent);

src/styles/scroll-sections.scss

@@ -1,5 +1,3 @@
-@import "./variables";
-
 .s-scroll-sections {
   font-family: $s-font-family-default;
   font-size: 14px;

src/styles/select.scss

@@ -1,6 +1,3 @@
-@import "./variables";
-@import "./icons";
-
 .s-select {
   font-family: $s-font-family-default;
   width: 100%;

src/styles/slider.scss

@@ -1,5 +1,3 @@
-@import "./variables";
-
 @mixin slider-colors(
   $background-color: --s-color-theme-accent,
   $border-color: $background-color,

src/styles/switch.scss

@@ -1,5 +1,3 @@
-@import "./variables";
-
 $switch-class: ".el-switch";
 
 .s-switch {

src/styles/table.scss

@@ -1,5 +1,3 @@
-@import "./variables";
-
 .el-table,
 .el-table__header-wrapper tbody td,
 .el-table__footer-wrapper tbody td {

src/styles/tabs.scss

@@ -1,5 +1,3 @@
-@import "./variables";
-
 .s-tabs {
   width: 100%;
   .el-tabs__item {

src/styles/tooltip.scss

@@ -1,5 +1,3 @@
-@import "./variables";
-
 .el-tooltip__popper {
   &.is-dark {
     background-color: var(--s-color-base-content-primary);

src/styles/variables.scss

@@ -10,7 +10,7 @@ $s-color-theme-secondary-pressed: #F1C0D2 !default;
 $s-color-theme-secondary-focused: #EDABC3 !default;
 // Base content colors
 $s-color-base-content-primary: #2D2926 !default;
-$s-color-base-content-secondary: #53565A !default; // not used
+$s-color-base-content-secondary: #53565A !default;
 $s-color-base-content-tertiary: #75787B !default;
 $s-color-base-content-quaternary: #A3A4A8 !default;
 // Base misc colors
@@ -86,6 +86,7 @@ $--breakpoints-spec: (
 );
 
 :root {
+  // Colors
   --s-color-theme-accent: #{$s-color-theme-accent};
   --s-color-theme-accent-hover: #{$s-color-theme-accent-hover};
   --s-color-theme-accent-pressed: #{$s-color-theme-accent-pressed};
@@ -115,4 +116,11 @@ $--breakpoints-spec: (
   --s-color-status-success-background: #{$s-color-status-success-background};
   --s-color-status-warning-background: #{$s-color-status-warning-background};
   --s-color-status-error-background: #{$s-color-status-error-background};
+  // Shadows
+  --s-shadow-surface: #{$s-shadow-surface};
+  --s-shadow-tooltip: #{$s-shadow-tooltip};
+  --s-shadow-tab: #{$s-shadow-tab};
+  --s-shadow-dropdown: #{$s-shadow-dropdown};
+  --s-shadow-mobile-tap-bar: #{$s-shadow-mobile-tap-bar};
+  --s-shadow-mobile-side-menu: #{$s-shadow-mobile-side-menu};
 }