From fd5f95c177ee4d1193ac4669f59c5524f4d8ef6f Mon Sep 17 00:00:00 2001
From: alexnatalia <alekseenko@soramitsu.co.jp>
Date: Fri, 3 Dec 2021 12:40:00 +0300
Subject: [PATCH 1/2] Neu Tabs Card: Added Card Tabs Type.

---
 package.json                       |  2 +-
 src/components/Tab/STabs/STabs.vue |  6 ++--
 src/styles/neumorphism/tabs.scss   | 45 +++++++++++++++++++++++++++++-
 3 files changed, 48 insertions(+), 5 deletions(-)

diff --git a/package.json b/package.json
index 89bc7072..35a7a518 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@soramitsu/soramitsu-js-ui",
-  "version": "1.0.22",
+  "version": "1.0.23",
   "private": false,
   "publishConfig": {
     "registry": "https://nexus.iroha.tech/repository/npm-soramitsu/"
diff --git a/src/components/Tab/STabs/STabs.vue b/src/components/Tab/STabs/STabs.vue
index 2de7c83d..4863dd93 100644
--- a/src/components/Tab/STabs/STabs.vue
+++ b/src/components/Tab/STabs/STabs.vue
@@ -113,9 +113,9 @@ export default class STabs extends Mixins(BorderRadiusMixin, DesignSystemInject)
     if (this.designSystemClass) {
       cssClasses.push(this.designSystemClass)
     }
-    // neu tabs implemented only with TabsType.ROUNDED type
-    if (this.isNeumorphic || (this.type === TabsType.ROUNDED && ([TabsPosition.TOP, TabsPosition.BOTTOM] as Array<string>).includes(this.position))) {
-      cssClasses.push('s-rounded')
+    // neu tabs implemented only with TabsType.ROUNDED or TabsType.CARD types
+    if (this.isNeumorphic || ([TabsType.ROUNDED, TabsType.CARD].includes(this.type) && ([TabsPosition.TOP, TabsPosition.BOTTOM] as Array<string>).includes(this.position))) {
+      cssClasses.push(`s-${this.type}`)
     } else if (this.type === TabsType.ACCENT_ROUNDED && ([TabsPosition.TOP, TabsPosition.BOTTOM] as Array<string>).includes(this.position)) {
       cssClasses.push('s-accent-rounded')
     }
diff --git a/src/styles/neumorphism/tabs.scss b/src/styles/neumorphism/tabs.scss
index 842011bb..6cc001f4 100644
--- a/src/styles/neumorphism/tabs.scss
+++ b/src/styles/neumorphism/tabs.scss
@@ -1,5 +1,8 @@
 $neu-tab-shadow: var(--s-shadow-element-pressed);
 $neu-tabs-shadow: var(--s-shadow-element);
+$neu-card-tabs-item-padding: var(--s-size-mini);
+$neu-card-tabs-item-shadow: -5px -5px 15px var(--s-shadow-color-light-dark), 1px 1px 15px var(--s-shadow-color-dark), inset 0px 0px 8px var(--s-shadow-color-dark);
+$neu-card-tabs-item-shadow-pressed: -5px -5px 15px var(--s-shadow-color-light-dark), 1px 1px 15px var(--s-shadow-color-dark);
 
 :root {
   --neu-tab-shadow: #{$neu-tab-shadow};
@@ -23,7 +26,7 @@ $neu-tabs-shadow: var(--s-shadow-element);
     }
   }
 
-  &.s-rounded {
+  &.s-rounded, &.s-card {
     .el-tabs {
       &__nav-wrap {
         background-color: var(--s-color-base-background);
@@ -48,9 +51,49 @@ $neu-tabs-shadow: var(--s-shadow-element);
           }
         }
       }
+    }
+  }
+
+  &.s-rounded {
+    .el-tabs {
       &__item {
         text-transform: uppercase;
       }
     }
   }
+
+  &.s-card {
+    .el-tabs {
+      &__nav-wrap {
+        .el-tabs__item {
+          box-shadow: $neu-card-tabs-item-shadow;
+          &.is-active {
+            box-shadow: $neu-card-tabs-item-shadow-pressed;
+          }
+          &.is-active, &:not(.is-active):hover, &:not(.is-active):focus.is-focus {
+            color: var(--s-color-base-content-primary);
+          }
+        }
+      }
+      &__item {
+        text-transform: capitalize;
+        text-align: center;
+        padding-right: calc(#{$neu-card-tabs-item-padding} / 2);
+        padding-left: calc(#{$neu-card-tabs-item-padding} / 2);
+      }
+      &__active-bar {
+        &::after {
+          content: "";
+          position: absolute;
+          display: block;
+          height: 2px;
+          width: calc(100% + calc(#{$neu-card-tabs-item-padding}));
+          left: 0;
+          bottom: 0;
+          background-color: inherit;
+          margin-left: calc(#{$neu-card-tabs-item-padding} / -2);
+        }
+      }
+    }
+  }
 }
\ No newline at end of file

From 46c2a891336ca519b30536917381d48d953432c4 Mon Sep 17 00:00:00 2001
From: alexnatalia <alekseenko@soramitsu.co.jp>
Date: Fri, 3 Dec 2021 12:56:00 +0300
Subject: [PATCH 2/2] Increased lib version.

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index 35a7a518..48077786 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@soramitsu/soramitsu-js-ui",
-  "version": "1.0.23",
+  "version": "1.0.24",
   "private": false,
   "publishConfig": {
     "registry": "https://nexus.iroha.tech/repository/npm-soramitsu/"