fox/src/.vitepress/theme/scss/design-tokens.scss

@use '@beeline/design-tokens/scss/font-face' with (
  $font-path-beeline-sans: '/fonts/beeline-sans',
  $font-path-roboto-mono: '/fonts/roboto-mono'
);
@use "@beeline/design-tokens/scss/iconfont/iconfont" with (
  $font-path-iconfont: '/fonts/iconfont'
);
@use "@beeline/design-tokens/scss/iconfont/icons";
@use '@beeline/design-tokens/scss/tokens/themes/dark';
@use '@beeline/design-tokens/scss/tokens/themes';

:root {
    --color-text-active: rgba(9, 11, 22, 0.94);
    --color-text-inactive: rgba(25, 28, 52, 0.7);
    --color-gradient-magma: linear-gradient(-46deg, #1a73e8 0%, #bc00b8 49.44%, #f55555 100%);

    // Button
    --color-button-contained-background-color: #fdd835;
    --color-button-contained-hover-background-color: #fdc435;
    --color-button-contained-text-color: rgba(9, 11, 22, 0.94);

    @include themes.theme();
}

.dark {
    --color-text-active: rgba(255, 255, 255, 0.87);
    --color-text-inactive: rgba(255, 255, 255, 0.6);

    @include themes.theme(dark.$theme);
}