@prefecthq/prefect-ui-library/src/styles/states.css

This library is the Vue and Typescript component library for [Prefect 2](https://github.com/PrefectHQ/prefect) and [Prefect Cloud 2](https://www.prefect.io/cloud/). _The components and utilities in this project are not meant to be used independently_.

.state--completed { @apply
  bg-state-completed-50
  text-state-completed-600
  dark:bg-state-completed-600
  dark:text-state-completed-50
}
.state-text--completed { @apply
  text-state-completed-50
  dark:text-state-completed-600
}

.state--running { @apply
  bg-state-running-100
  text-state-running-700
  dark:bg-state-running-700
  dark:text-state-running-100
}
.state-text--running { @apply
  text-state-running-100
  dark:text-state-running-700
}

.state--scheduled { @apply
  bg-state-scheduled-100
  text-state-scheduled-700
  dark:bg-state-scheduled-700
  dark:text-state-scheduled-100
}
.state-text--scheduled { @apply
  text-state-scheduled-100
  dark:text-state-scheduled-700
}

.state--pending { @apply
  bg-state-pending-300
  text-state-pending-800
  dark:bg-state-pending-800
  dark:text-state-pending-300
}
.state-text--pending { @apply
  text-state-pending-300
  dark:text-state-pending-800
}

.state--paused { @apply
  bg-state-paused-300
  text-state-paused-800
  dark:bg-state-paused-800
  dark:text-state-paused-300
}
.state-text--paused { @apply
  text-state-paused-300
  dark:text-state-paused-800
}

.state--failed { @apply
  bg-state-failed-50
  text-state-failed-700
  dark:bg-state-failed-700
  dark:text-state-failed-50
}
.state-text--failed { @apply
  text-state-failed-50
  dark:text-state-failed-700
}

.state--cancelled { @apply
  bg-state-cancelled-100
  text-state-cancelled-600
  dark:bg-state-cancelled-600
  dark:text-state-cancelled-100
}
.state-text--cancelled { @apply
  text-state-cancelled-100
  dark:text-state-cancelled-600
}

.state--cancelling { @apply
  bg-state-cancelling-100
  text-state-cancelling-600
  dark:bg-state-cancelling-600
  dark:text-state-cancelling-100
}
.state-text--cancelling { @apply
  text-state-cancelling-100
  dark:text-state-cancelling-600
}

.state--crashed { @apply
  bg-state-crashed-50
  text-state-crashed-600
  dark:bg-state-crashed-600
  dark:text-state-crashed-50
}
.state-text--crashed { @apply
  text-state-crashed-50
  dark:text-state-crashed-600
}

.state--unknown { @apply
  bg-sentiment-neutral
}
.state-text--unknown { @apply
 text-sentiment-neutral
}