nodejs.org/packages/ui-components/src/Common/BadgeGroup/index.module.css at 42e1fd0223396799ac26e1e7ecb57621eca00a70 · nodejs/nodejs.org · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
@reference "../../styles/index.css";

.wrapper {
  @apply flex
    w-fit
    items-center
    rounded-full
    border
    py-1
    pl-1
    pr-2.5
    text-sm
    font-medium;

  .icon {
    @apply size-4;
  }

  .badge {
    @apply mr-2;
  }

  .message {
    @apply mr-1;
  }

  &.default {
    @apply border-green-200
      bg-green-100
      dark:border-green-700
      dark:bg-neutral-900;

    .icon {
      @apply text-green-500
        dark:text-green-300;
    }

    .message,
    .message a:not(:hover) {
      @apply text-green-700
        dark:text-green-300;
    }
  }

  &.error {
    @apply border-danger-200
      bg-danger-100
      dark:border-danger-700
      dark:bg-neutral-900;

    .icon {
      @apply text-danger-500
        dark:text-danger-300;
    }

    .message,
    .message a:not(:hover) {
      @apply text-danger-700
        dark:text-danger-300;
    }
  }

  &.warning {
    @apply border-warning-200
      bg-warning-100
      dark:border-warning-700
      dark:bg-neutral-900;

    .icon {
      @apply text-warning-500
        dark:text-warning-300;
    }

    .message,
    .message a:not(:hover) {
      @apply text-warning-700
        dark:text-warning-300;
    }
  }
}