oduck/uno.config.ts at main · kvoon3/oduck · 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
import { defineConfig, presetMini, presetIcons, presetWebFonts, transformerVariantGroup } from 'unocss'

export default defineConfig({
  content: {
    pipeline: {
      include: [
        /\.(vue|svelte|[jt]sx|html)($|\?)/,
        'src/**/*.ts',
      ],
      exclude: [
        // Large data file — no utility classes to extract, exclude to avoid bloating the UnoCSS bundle
        'src/bang.ts',
      ],
    },
  },
  presets: [
    presetMini({
      dark: 'media',
      preflight: true,
    }),
    presetIcons({
      scale: 1.2,
      extraProperties: {
        display: 'inline-block',
        'vertical-align': 'middle',
      },
    }),
    presetWebFonts({
      fonts: {
        sans: 'DM Sans',
        mono: 'DM Mono'
      },
    }),
  ],
  transformers: [transformerVariantGroup()],
  shortcuts: {
    'btn': 'cursor-pointer appearance-none border-none disabled:cursor-not-allowed',
    'btn-base': 'btn rounded-md text-sm font-medium px-3 py-1.75 transition duration-150 op-75 hover:op-100 disabled:op-40 focus-visible:(outline-none ring-2 ring-neutral-500/45 ring-offset-2 ring-offset-white) dark:focus-visible:ring-offset-[#101010]',
    'btn-sm': 'px-2.5 py-1 text-xs',
    'btn-surface': 'bg-neutral-200/50 text-neutral-950 dark:(bg-neutral-700/50 text-neutral-50)',
    'btn-primary': 'btn-base btn-surface',
    'btn-secondary': 'btn-base btn-surface',
    'btn-danger': 'btn-base bg-neutral-200/50 text-[#8a0018] dark:(bg-neutral-700/50 text-[#ff9aaa])',
    'btn-icon': 'btn flex items-center justify-center rounded-md bg-neutral-200/50 p-2 text-neutral-950 op-75 transition duration-150 hover:op-100 focus-visible:(outline-none ring-2 ring-neutral-500/45 ring-offset-2 ring-offset-white) dark:(bg-neutral-700/50 text-neutral-50 focus-visible:ring-offset-[#101010])',
    'btn-close': 'btn flex items-center justify-center w-8 h-8 rounded-md bg-neutral-200/50 text-neutral-950 text-xl leading-none op-75 transition duration-150 hover:op-100 focus-visible:(outline-none ring-2 ring-neutral-500/45 ring-offset-2 ring-offset-white) dark:(bg-neutral-700/50 text-neutral-50 focus-visible:ring-offset-[#101010])',
    'btn-ghost': 'btn flex items-center justify-center p-1 bg-transparent border-none text-neutral-600 op-60 transition duration-150 hover:op-100 focus-visible:(outline-none ring-2 ring-neutral-500/45 ring-offset-2 ring-offset-white) dark:(text-neutral-400 focus-visible:ring-offset-[#101010])',
    'link': 'border-0 border-b border-solid border-current pb-0.5 text-[#444] no-underline op-75 transition-opacity duration-150 dark:text-[#a9a9a9]',
    'link-active': 'hover:op-100',
    'input': 'box-border w-full min-w-0 border border-solid border-[#e5e5e5] dark:border-[#27272a] rounded-md bg-[#fafafa] px-3 py-2 text-base text-neutral-600 outline-none transition duration-150 placeholder:text-neutral-400 dark:(bg-[#111] text-neutral-300 placeholder:text-neutral-600)',
    'checkbox': 'size-4 cursor-pointer accent-neutral-600 dark:accent-neutral-400',
    'border': 'border border-solid border-[#ddd] dark:border-[#3d3d3d]',
    'error-text': 'text-[#b00020] dark:text-[#ff8a9a]',
    'overscroll-contain': '[overscroll-behavior:contain]',
  },
})