import presetRemToPx from '@unocss/preset-rem-to-px'

import {
  defineConfig,
  presetAttributify,
  presetIcons,
  presetTypography,
  presetUno,
  presetWebFonts,
  transformerDirectives,
  transformerVariantGroup,
} from 'unocss'

// https://unocss.dev/guide/config-file
export default defineConfig({
  rules: [
    ['h-screen-nav', { height: 'calc(100vh - var(--van-nav-bar-height))' }],
    [/^van-btn-w-(\d+)px$/, ([_, d]) => ({
      width: `${d}px !important` // 使用 !important 覆盖默认样式
    })],
    [/^van-btn-h-(\d+)px$/, ([_, d]) => ({
      height: `${d}px !important`
    })]
  ],
  shortcuts: [
    // shortcuts to multiple utilities
    ['btn', 'px-6 py-3 rounded-3 inline-block bg-primary text-white cursor-pointer hover:bg-primary-hover disabled:cursor-default disabled:bg-gray-600 disabled:opacity-50'],
  ],

  presets: [
    presetUno(),
    presetAttributify(),
    presetIcons(),
    presetTypography(),
    presetWebFonts(),
    presetRemToPx({
      baseFontSize: 4,
    }),
  ],

  transformers: [
    transformerDirectives(),
    transformerVariantGroup(),
  ],

  theme: {
    colors: {
      primary: {
        DEFAULT: '#3554AF',
        active: '#3554AF',
      },
    },
  },
})