base

assets/css/components/_nav-tabs.scss

@@ -0,0 +1,40 @@
+.nav--tabs{
+    height: calc(var(--h-block)*1);
+    width: auto;
+    border: var(--border);
+    border-radius: var(--radius-small);
+    overflow: hidden;
+
+
+    display: inline-flex;
+
+    width: auto;
+    margin: 0 auto;  
+    margin-bottom: var(--spacing);
+ 
+
+    .nav--tabs__btn{
+        font-family: var(--font);
+        font-size: var(--fs-small);
+        font-weight: var(--fw-medium);
+        padding: 0 2ch;
+
+        &.is-selected{
+            background-color: var(--color-txt);
+            color: var(--color-bg);
+        }
+
+        &:not(.is-selected):hover{
+            background-color: var(--grey-800);
+            cursor: pointer;
+        }
+
+    }
+
+    .nav--tabs__btn +  .nav--tabs__btn{
+        border-left: var(--border);
+
+    }
+
+
+}