@idds/styles 1.2.11 → 1.2.13

package/src/components/tab-horizontal.css

@@ -1,278 +0,0 @@
-/* =========================== */
-/* HORIZONTAL TAB STYLES       */
-/* =========================== */
-
-.ina-tab-horizontal {
-  display: flex;
-  flex-direction: column;
-  width: fit-content;
-}
-
-.ina-tab-horizontal--full-width {
-  width: 100%;
-}
-
-.ina-tab-horizontal__container {
-  display: flex;
-  align-items: center;
-}
-
-.ina-tab-horizontal__container--full-width {
-  width: 100%;
-}
-
-/* Base Tab Styles */
-.ina-tab-horizontal__tab {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  border: none;
-  background: none;
-  cursor: pointer;
-  transition: all var(--ina-transition-base);
-  white-space: nowrap;
-  position: relative;
-  border-radius: 4px;
-  padding: 0 16px;
-  box-sizing: border-box;
-  font-family: Inter, sans-serif;
-  font-style: normal;
-  font-weight: 400;
-  letter-spacing: var(--ina-spacing-letter-normal, 0);
-}
-
-.ina-tab-horizontal__tab--full-width {
-  flex: 1 0 0;
-  min-width: 120px;
-}
-
-/* Size: Small */
-.ina-tab-horizontal__tab--size-sm {
-  font-size: 14px;
-  line-height: 20px;
-  height: 36px;
-}
-
-/* Size: Medium */
-.ina-tab-horizontal__tab--size-md {
-  font-size: 16px;
-  line-height: 20px;
-  height: 40px;
-}
-
-/* Mobile Responsive */
-@media (max-width: 768px) {
-  .ina-tab-horizontal__tab--size-sm {
-    font-size: 12px;
-    height: 32px;
-  }
-
-  .ina-tab-horizontal__tab--size-md {
-    font-size: 14px;
-    height: 36px;
-  }
-}
-
-/* Variant: Outline (Default) */
-.ina-tab-horizontal__tab--variant-outline {
-  color: var(--ina-content-secondary);
-  background: transparent;
-  border-bottom: 1px solid var(--ina-stroke-primary, var(--ina-neutral-200));
-}
-
-.ina-tab-horizontal__tab--variant-outline:hover:not(
-    .ina-tab-horizontal__tab--disabled
-  ) {
-  color: var(--ina-content-primary);
-}
-
-.ina-tab-horizontal__tab--variant-outline.ina-tab-horizontal__tab--selected {
-  color: var(--ina-content-primary);
-  font-weight: 600;
-  border-bottom: 2px solid var(--ina-content-primary);
-  border-radius: 0;
-}
-
-.ina-tab-horizontal--use-brand-color .ina-tab-horizontal__tab--variant-outline {
-  color: var(--ina-content-secondary);
-}
-
-.ina-tab-horizontal--use-brand-color
-  .ina-tab-horizontal__tab--variant-outline:hover:not(
-    .ina-tab-horizontal__tab--disabled
-  ) {
-  color: var(--ina-primary-primary);
-}
-
-.ina-tab-horizontal--use-brand-color
-  .ina-tab-horizontal__tab--variant-outline.ina-tab-horizontal__tab--selected {
-  color: var(--ina-primary-primary);
-  border-bottom-color: var(--ina-primary-primary);
-}
-
-/* Variant: Button Brand */
-.ina-tab-horizontal__tab--variant-button-brand {
-  color: var(--ina-content-secondary);
-  background: transparent;
-}
-
-.ina-tab-horizontal__tab--variant-button-brand:hover:not(
-    .ina-tab-horizontal__tab--disabled
-  ) {
-  color: var(--ina-content-primary);
-}
-
-.ina-tab-horizontal__tab--variant-button-brand.ina-tab-horizontal__tab--selected {
-  background-color: var(--ina-primary-25);
-  color: var(--ina-primary-primary) !important;
-  font-weight: 600;
-}
-
-/* Variant: Button White */
-.ina-tab-horizontal--variant-button-white {
-  background-color: var(--ina-background-secondary);
-  border-radius: 4px;
-  padding: 4px;
-}
-
-.ina-tab-horizontal--variant-button-white .ina-tab-horizontal__container {
-  gap: 0;
-}
-
-.ina-tab-horizontal__tab--variant-button-white {
-  color: var(--ina-content-secondary);
-  background: transparent;
-  border-radius: 4px;
-}
-
-.ina-tab-horizontal__tab--variant-button-white:hover:not(
-    .ina-tab-horizontal__tab--disabled
-  ) {
-  color: var(--ina-content-primary);
-}
-
-.ina-tab-horizontal__tab--variant-button-white.ina-tab-horizontal__tab--selected {
-  background-color: var(--ina-background-primary);
-  color: var(--ina-content-primary);
-  font-weight: 600;
-  box-shadow: 0 12px 16px -4px rgba(10, 13, 18, 0.08),
-    0 4px 6px -2px rgba(10, 13, 18, 0.03);
-}
-
-.ina-tab-horizontal--use-brand-color
-  .ina-tab-horizontal__tab--variant-button-white {
-  color: var(--ina-content-secondary);
-}
-
-.ina-tab-horizontal--use-brand-color
-  .ina-tab-horizontal__tab--variant-button-white:hover:not(
-    .ina-tab-horizontal__tab--disabled
-  ) {
-  color: var(--ina-primary-primary);
-}
-
-.ina-tab-horizontal--use-brand-color
-  .ina-tab-horizontal__tab--variant-button-white.ina-tab-horizontal__tab--selected {
-  color: var(--ina-primary-primary);
-}
-
-/* Disabled State */
-.ina-tab-horizontal__tab--disabled {
-  color: var(--ina-content-disabled);
-  cursor: not-allowed;
-  opacity: 0.6;
-}
-
-.ina-tab-horizontal__tab--disabled:hover {
-  color: var(--ina-content-disabled);
-  background-color: transparent;
-}
-
-.ina-tab-horizontal--disabled .ina-tab-horizontal__tab {
-  color: var(--ina-content-disabled);
-  cursor: not-allowed;
-  opacity: 0.6;
-}
-
-.ina-tab-horizontal--disabled .ina-tab-horizontal__tab:hover {
-  color: var(--ina-content-disabled);
-  background-color: transparent;
-}
-
-/* Focus State */
-.ina-tab-horizontal__tab:focus {
-  outline: 2px solid var(--ina-primary-500);
-  outline-offset: 2px;
-}
-
-.ina-tab-horizontal__tab:focus:not(:focus-visible) {
-  outline: none;
-}
-
-/* Dark Mode */
-[data-theme='dark'] .ina-tab-horizontal__tab--variant-outline {
-  color: var(--ina-content-secondary);
-}
-
-[data-theme='dark']
-  .ina-tab-horizontal__tab--variant-outline:hover:not(
-    .ina-tab-horizontal__tab--disabled
-  ) {
-  color: var(--ina-content-primary);
-}
-
-[data-theme='dark']
-  .ina-tab-horizontal__tab--variant-button-brand:hover:not(
-    .ina-tab-horizontal__tab--disabled
-  ) {
-  color: var(--ina-content-primary);
-}
-[data-theme='dark']
-  .ina-tab-horizontal__tab--variant-button-brand:hover:not(
-    .ina-tab-horizontal__tab--selected
-  ) {
-  color: var(--ina-content-primary);
-}
-.ina-tab-horizontal__tab--variant-button-brand:hover:not(
-    .ina-tab-horizontal__tab--disabled
-  ) {
-  color: var(--ina-content-primary);
-}
-.ina-tab-horizontal__tab--variant-button-brand:hover:not(
-    .ina-tab-horizontal__tab--selected
-  ) {
-  color: var(--ina-content-primary);
-}
-
-[data-theme='dark']
-  .ina-tab-horizontal__tab--variant-outline.ina-tab-horizontal__tab--selected {
-  color: var(--ina-content-primary);
-  border-bottom-color: var(--ina-content-primary);
-}
-
-[data-theme='dark'] .ina-tab-horizontal__tab--variant-button-brand {
-  color: var(--ina-content-secondary);
-}
-
-[data-theme='dark']
-  .ina-tab-horizontal__tab--variant-button-brand:hover:not(
-    .ina-tab-horizontal__tab--disabled
-  ) {
-  color: var(--ina-content-primary);
-}
-
-[data-theme='dark']
-  .ina-tab-horizontal__tab--variant-button-brand.ina-tab-horizontal__tab--selected {
-  background-color: var(--ina-primary-25);
-  color: var(--ina-primary-primary) !important;
-}
-
-[data-theme='dark'] .ina-tab-horizontal--variant-button-white {
-  background-color: var(--ina-background-secondary);
-}
-
-[data-theme='dark']
-  .ina-tab-horizontal__tab--variant-button-white.ina-tab-horizontal__tab--selected {
-  background-color: var(--ina-background-primary);
-  color: var(--ina-content-primary);
-}

package/src/components/tab-vertical.css

@@ -1,261 +0,0 @@
-/* =========================== */
-/* VERTICAL TAB STYLES         */
-/* =========================== */
-
-.ina-tab-vertical {
-  display: flex;
-  flex-direction: column;
-  width: fit-content;
-}
-
-.ina-tab-vertical__container {
-  display: flex;
-  flex-direction: column;
-}
-
-/* Base Tab Styles */
-.ina-tab-vertical__tab {
-  display: flex;
-  align-items: center;
-  justify-content: flex-start;
-  border: none;
-  background: none;
-  cursor: pointer;
-  transition: all var(--ina-transition-base);
-  text-align: left;
-  position: relative;
-  border-radius: 4px;
-  width: 100%;
-  padding: 0 16px;
-  box-sizing: border-box;
-  font-family: Inter, sans-serif;
-  font-style: normal;
-  font-weight: 400;
-  letter-spacing: var(--ina-spacing-letter-normal, 0);
-}
-
-/* Size: Small */
-.ina-tab-vertical__tab--size-sm {
-  font-size: 14px;
-  line-height: 20px;
-  height: 36px;
-}
-
-/* Size: Medium */
-.ina-tab-vertical__tab--size-md {
-  font-size: 16px;
-  line-height: 20px;
-  height: 40px;
-}
-
-/* Mobile Responsive */
-@media (max-width: 768px) {
-  .ina-tab-vertical__tab--size-sm {
-    font-size: 12px;
-    height: 32px;
-  }
-
-  .ina-tab-vertical__tab--size-md {
-    font-size: 14px;
-    height: 36px;
-  }
-}
-
-/* Variant: Outline (Default) */
-.ina-tab-vertical__tab--variant-outline {
-  color: var(--ina-content-secondary);
-  background: transparent;
-}
-
-.ina-tab-vertical__tab--variant-outline:hover:not(
-    .ina-tab-vertical__tab--disabled
-  ) {
-  color: var(--ina-content-primary);
-}
-
-.ina-tab-vertical__tab--variant-outline.ina-tab-vertical__tab--selected {
-  color: var(--ina-content-primary);
-  font-weight: 600;
-  border-left: 3px solid var(--ina-content-primary);
-  border-radius: 0;
-  padding-left: 13px; /* 16px - 3px border */
-}
-
-.ina-tab-vertical--use-brand-color .ina-tab-vertical__tab--variant-outline {
-  color: var(--ina-content-secondary);
-}
-
-.ina-tab-vertical--use-brand-color
-  .ina-tab-vertical__tab--variant-outline:hover:not(
-    .ina-tab-vertical__tab--disabled
-  ) {
-  color: var(--ina-primary-primary);
-}
-
-.ina-tab-vertical--use-brand-color
-  .ina-tab-vertical__tab--variant-outline.ina-tab-vertical__tab--selected {
-  color: var(--ina-primary-primary);
-  border-left-color: var(--ina-primary-primary);
-}
-
-/* Variant: Button Brand */
-.ina-tab-vertical__tab--variant-button-brand {
-  color: var(--ina-content-secondary);
-  background: transparent;
-}
-
-.ina-tab-vertical__tab--variant-button-brand:hover:not(
-    .ina-tab-vertical__tab--disabled
-  ) {
-  color: var(--ina-content-primary);
-}
-
-.ina-tab-vertical__tab--variant-button-brand.ina-tab-vertical__tab--selected {
-  background-color: var(--ina-primary-25);
-  color: var(--ina-primary-primary) !important;
-  font-weight: 600;
-}
-
-/* Variant: Button White */
-.ina-tab-vertical--variant-button-white {
-  background-color: var(--ina-background-secondary);
-  border-radius: 4px;
-  padding: 4px;
-}
-
-.ina-tab-vertical--variant-button-white .ina-tab-vertical__container {
-  gap: 0;
-}
-
-.ina-tab-vertical__tab--variant-button-white {
-  color: var(--ina-content-secondary);
-  background: transparent;
-  border-radius: 4px;
-}
-
-.ina-tab-vertical__tab--variant-button-white:hover:not(
-    .ina-tab-vertical__tab--disabled
-  ) {
-  color: var(--ina-content-primary);
-}
-
-.ina-tab-vertical__tab--variant-button-white.ina-tab-vertical__tab--selected {
-  background-color: var(--ina-background-primary);
-  color: var(--ina-content-primary);
-  font-weight: 600;
-  border-radius: 4px;
-  box-shadow: 0 12px 16px -4px rgba(10, 13, 18, 0.08),
-    0 4px 6px -2px rgba(10, 13, 18, 0.03);
-}
-
-.ina-tab-vertical--use-brand-color
-  .ina-tab-vertical__tab--variant-button-white {
-  color: var(--ina-content-secondary);
-}
-
-.ina-tab-vertical--use-brand-color
-  .ina-tab-vertical__tab--variant-button-white:hover:not(
-    .ina-tab-vertical__tab--disabled
-  ) {
-  color: var(--ina-primary-primary);
-}
-
-.ina-tab-vertical--use-brand-color
-  .ina-tab-vertical__tab--variant-button-white.ina-tab-vertical__tab--selected {
-  color: var(--ina-primary-primary);
-}
-
-/* Disabled State */
-.ina-tab-vertical__tab--disabled {
-  color: var(--ina-content-disabled);
-  cursor: not-allowed;
-  opacity: 0.6;
-}
-
-.ina-tab-vertical__tab--disabled:hover {
-  color: var(--ina-content-disabled);
-  background-color: transparent;
-}
-
-.ina-tab-vertical--disabled .ina-tab-vertical__tab {
-  color: var(--ina-content-disabled);
-  cursor: not-allowed;
-  opacity: 0.6;
-}
-
-.ina-tab-vertical--disabled .ina-tab-vertical__tab:hover {
-  color: var(--ina-content-disabled);
-  background-color: transparent;
-}
-
-/* Focus State */
-.ina-tab-vertical__tab:focus {
-  outline: 2px solid var(--ina-primary-primary);
-  outline-offset: 2px;
-}
-
-.ina-tab-vertical__tab:focus:not(:focus-visible) {
-  outline: none;
-}
-
-/* Dark Mode */
-[data-theme='dark'] .ina-tab-vertical__tab--variant-outline {
-  color: var(--ina-content-secondary);
-}
-
-[data-theme='dark']
-  .ina-tab-vertical__tab--variant-outline:hover:not(
-    .ina-tab-vertical__tab--disabled
-  ) {
-  color: var(--ina-content-primary);
-}
-
-[data-theme='dark']
-  .ina-tab-vertical__tab--variant-outline.ina-tab-vertical__tab--selected {
-  color: var(--ina-content-primary);
-  border-left-color: var(--ina-content-primary);
-}
-
-[data-theme='dark'] .ina-tab-vertical__tab--variant-button-brand {
-  color: var(--ina-content-secondary);
-}
-
-[data-theme='dark']
-  .ina-tab-vertical__tab--variant-button-brand:hover:not(
-    .ina-tab-vertical__tab--disabled
-  ) {
-  color: var(--ina-content-primary);
-}
-[data-theme='dark']
-  .ina-tab-vertical__tab--variant-button-brand:hover:not(
-    .ina-tab-vertical__tab--selected
-  ) {
-  color: var(--ina-content-primary);
-}
-.ina-tab-vertical__tab--variant-button-brand:hover:not(
-    .ina-tab-vertical__tab--disabled
-  ) {
-  color: var(--ina-content-primary);
-}
-.ina-tab-vertical__tab--variant-button-brand:hover:not(
-    .ina-tab-vertical__tab--selected
-  ) {
-  color: var(--ina-content-primary);
-}
-
-[data-theme='dark']
-  .ina-tab-vertical__tab--variant-button-brand.ina-tab-vertical__tab--selected {
-  background-color: var(--ina-primary-25);
-  color: var(--ina-primary-primary) !important;
-  font-weight: 600;
-}
-
-[data-theme='dark'] .ina-tab-vertical--variant-button-white {
-  background-color: var(--ina-background-secondary);
-}
-
-[data-theme='dark']
-  .ina-tab-vertical__tab--variant-button-white.ina-tab-vertical__tab--selected {
-  background-color: var(--ina-background-primary);
-  color: var(--ina-content-primary);
-}

package/src/components/table-progress-bar.css

@@ -1,48 +0,0 @@
-/* TableProgressBar Component Styles */
-
-/* Base container */
-.ina-table-progress-bar {
-  width: 100%;
-}
-
-/* Animation states */
-@keyframes ina-progress-animate {
-  0% {
-    transform: translateX(-100%);
-  }
-  100% {
-    transform: translateX(0);
-  }
-}
-
-.ina-table-progress-bar--animating {
-  animation: ina-progress-animate 0.2s ease-in-out;
-}
-
-/* Variant styles */
-.ina-table-progress-bar--variant-primary {
-  /* Inherits from ProgressBar component */
-}
-
-.ina-table-progress-bar--variant-secondary {
-  /* Inherits from ProgressBar component */
-}
-
-.ina-table-progress-bar--variant-success {
-  /* Inherits from ProgressBar component */
-}
-
-.ina-table-progress-bar--variant-warning {
-  /* Inherits from ProgressBar component */
-}
-
-.ina-table-progress-bar--variant-error {
-  /* Inherits from ProgressBar component */
-}
-
-/* Responsive adjustments */
-@media (max-width: 640px) {
-  .ina-table-progress-bar {
-    /* Mobile-specific adjustments */
-  }
-}