spur-tailwind/css/components/recurring-days.css

Spur web UI

.recurring-days {
  @apply mb-4;
}

.recurring-days-container {
  @apply flex -mx-2;
}

.recurring-days-list {
  @apply flex flex-row;
  transition: opacity 200ms ease-in-out;
}

.recurring-days-list-item {
  @apply flex items-center justify-center mx-2 p-6 w-8 h-8 rounded-full cursor-pointer bg-filter-grey text-spur-grey;

  &.is-selected {
    @apply bg-blue-jeans text-white;
  }
}

/* Disabled state */
.recurring-days.is-disabled .recurring-days-list {
  @apply opacity-50 pointer-events-none;
}
.recurring-days-list-item.is-disabled {
  @apply opacity-50 pointer-events-none;
}

/* Sliderover modifiers */
.slideover .recurring-days-list-item {
  @apply mx-1;
}