@trackunit/react-form-components 0.0.104 → 0.0.106

package/index.esm.css

@@ -1,259 +0,0 @@
-/* CSS related to the Label component */
-
-.tu-label {
-  @apply text-base
-    text-slate-700	
-    overflow-hidden
-    whitespace-nowrap
-    text-ellipsis
-    hover:text-slate-800 
-    group-hover:text-slate-800 
-    active:text-slate-800
-    group-active:text-slate-800;
-
-  &--invalid {
-    @apply text-red-600
-      hover:text-red-700 
-      group-hover:text-red-700 
-      active:text-red-700
-      group-active:text-red-700;
-  }
-
-  &--disabled {
-    @apply text-slate-400
-      hover:text-slate-400
-      group-hover:text-slate-400;
-  }
-}
-
-/* CSS related to the RadioGroup component */
-.tu-radiogroup {
-  @apply flex
-    gap-2
-    flex-col
-    items-start;
-
-  &--inline {
-    @apply flex
-      gap-3
-      flex-row
-      items-center;
-  }
-}
-
-.tu-radioitem {
-  @apply w-4
-    h-4
-    appearance-none
-    rounded-3xl
-    bg-white
-    border-solid
-    border
-    border-slate-300
-    shadow-sm
-    shrink-0
-    transition
-    box-border
-    hover:cursor-pointer
-    hover:bg-slate-100
-    focus:ring-2
-    focus:ring-offset-2
-    focus:ring-blue-700;
-
-  &__wrapper {
-    @apply flex
-      gap-2
-      items-center;
-  }
-
-  &--checked {
-    @apply border-solid
-      border-4
-      border-blue-600
-      bg-white
-      hover:bg-slate-100
-      hover:cursor-pointer
-      outline-0
-      active:bg-slate-200
-      active:ring-2
-      active:ring-offset-2
-      active:ring-blue-700
-      focus:bg-slate-200
-      focus:ring-2
-      focus:ring-offset-2
-      focus:ring-blue-700
-      group-active:ring-2
-      group-active:ring-offset-2
-      group-active:ring-blue-700;
-  }
-
-  &--invalid {
-    @apply border-red-600
-      active:ring-red-700
-      focus:ring-red-700
-      group-focus:ring-2
-      group-focus:ring-offset-2;
-  }
-
-  &--disabled {
-    @apply bg-slate-400
-      border-slate-300
-      cursor-not-allowed
-      group-hover:bg-slate-400
-      group-focus:bg-slate-400
-      hover:bg-slate-400
-      focus:bg-slate-400
-      active:bg-slate-400
-      focus:ring-0
-      focus:ring-offset-0
-      group-active:ring-0
-      group-active:ring-offset-0;
-  }
-
-  &--disabled.tu-radioitem--checked {
-    @apply bg-white;
-  }
-
-  &__label-container {
-    @apply gap-y-1
-      grid;
-  }
-
-  &__description {
-    @apply text-sm
-      font-normal
-      text-slate-500
-      text-left
-      whitespace-nowrap
-      text-ellipsis
-      overflow-hidden;
-
-    &--disabled {
-      @apply text-slate-400
-        hover:text-slate-400
-        group-hover:text-slate-400;
-    }
-  }
-}
-
-/* CSS related to the toggle component */
-.tu-toggle {
-  @apply rounded-full
-    bg-white
-    h-full
-    aspect-square
-    translate-x-0
-    transition-all;
-
-  &__wrapper {
-    @apply flex
-      gap-2;
-  }
-
-  &__input-container {
-    @apply flex
-      self-start
-      w-fit	
-      active:shadow
-      rounded-full
-      cursor-pointer
-      focus-within:ring
-      focus-within:ring-offset-2
-      focus-within:ring-blue-700;
-  }
-
-  &__input {
-    @apply absolute
-      opacity-0
-      -z-10;
-  }
-
-  &__switch-container {
-    @apply flex
-      items-center
-      p-1
-      cursor-pointer
-      rounded-full
-      bg-slate-300
-      focus:bg-slate-400
-      hover:bg-slate-400
-      active:bg-slate-500;
-  }
-
-  &__switch {
-    @apply bg-white
-      rounded-full
-      h-full
-      w-5/12		
-      aspect-square
-      translate-x-4
-      transition-all;
-  }
-
-  &--medium {
-    @apply flex
-      items-center
-      p-1
-      cursor-pointer
-      w-9
-      h-5;
-  }
-
-  &--small {
-    @apply flex
-      items-center
-      p-1
-      cursor-pointer
-      w-8
-      h-4;
-
-    .tu-toggle__switch {
-      @apply w-4/12;
-    }
-  }
-
-  &--toggled {
-    @apply flex
-      items-center
-      p-1
-      cursor-pointer
-      bg-blue-600
-      focus:bg-blue-700
-      hover:bg-blue-700
-      active:bg-blue-800;
-  }
-
-  &--disabled {
-    @apply flex
-      items-center
-      p-1
-      cursor-not-allowed
-      pointer-events-none
-      bg-slate-200;
-  }
-
-  &--disabled.tu-toggle--toggled {
-    @apply bg-slate-400;
-  }
-
-  &__label-container {
-    @apply gap-y-1
-      grid;
-  }
-
-  &__description {
-    @apply text-sm	
-      font-normal
-      text-slate-500	
-      text-left
-      whitespace-nowrap
-      text-ellipsis	
-      overflow-hidden;
-
-    &--disabled {
-      @apply text-slate-400
-        hover:text-slate-400
-        group-hover:text-slate-400;
-    }
-  }
-}