react-shiki/src/styles/features.css

Syntax highlighter component for react using shiki

@layer base {
  .rs-has-line-numbers {
    counter-reset: line-number calc(var(--line-start, 1) - 1);

    & .rs-line-number::before {
      counter-increment: line-number;
      content: counter(line-number);
      display: inline-flex;
      justify-content: flex-end;
      align-items: flex-start;
      box-sizing: content-box;
      min-width: var(--rs-line-numbers-width, 2ch);
      padding-left: var(--rs-line-numbers-padding-left, 0ch);
      padding-right: var(--rs-line-numbers-padding-right, 2ch);
      color: var(--rs-line-numbers-foreground, rgba(107, 114, 128, 0.5));
      font-size: var(--rs-line-numbers-font-size, inherit);
      font-weight: var(--rs-line-numbers-font-weight, inherit);
      line-height: var(--rs-line-numbers-line-height, inherit);
      font-family: var(--rs-line-numbers-font-family, inherit);
      opacity: var(--rs-line-numbers-opacity, 1);
      user-select: none;
      pointer-events: none;
    }
  }
}