fadgram-ui/css/overview-card.css

Fadgram UI is a Tailwind CSS plugin that provides a set of custom utility classes to enhance your web development experience. This plugin is designed to work seamlessly with Tailwind CSS, allowing you to quickly and easily style your web applications. ![F

@utility overview-card {
  @apply bg-white dark:bg-gray-800;
  @apply rounded-lg border border-gray-200 dark:border-gray-700;
  @apply p-2;
  @apply shadow;
  @apply overflow-hidden;
  @apply border-s-6 border-s-primary;
}

@utility overview-card-title {
  @apply text-xs font-bold text-primary uppercase mb-1;
}

@utility overview-card-number {
  @apply text-2xl font-bold mb-0;
}

@utility overview-card-icon {
  @apply text-primary w-10 h-10;
}
@utility overview-card-* {
  border-inline-start-color: --value(--color- *);

  .overview-card-title {
    color: --value(--color- *);
  }

  .overview-card-icon {
    color: --value(--color- *);
  }
}