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

export default defineConfig({
    shortcuts: [
        ['wallet-dock-width', 'fixed inset-x-0 w-full max-w-[426px] left-0 right-0'],
        ['app-dock-add-bar', 'wallet-dock-width !fixed bottom-[var(--app-bottom-chrome-height)] z-[var(--app-z-wallet-add-bar)] h-[var(--app-add-card-height)] flex items-center justify-center gap-1 rounded-t-3xl bg-[#FBFBFC] shadow-[0_1px_26px_11px_rgba(0,0,0,0.1)] cursor-pointer box-border'],
        ['wallet-add-card-bar', 'app-dock-add-bar'],
        ['wallet-card-slider', 'wallet-dock-width !fixed bottom-[calc(var(--app-bottom-chrome-height)+var(--app-add-card-height)-var(--wallet-card-dock-overlap))] z-[var(--app-z-wallet-dock)] px-3 touch-none flex flex-col justify-end overflow-visible'],
    ],
    theme: {
        colors: {
            "primary":  'var(--App-primary-color)',
            "secondary": "#ffffff",
            "tertiary": 'var(--App-secondary-color)'
        }
    },
    presets: [
        presetUno(),
        presetAttributify(),
        //presetIcons(),
        //presetTypography(),
        /*presetWebFonts({
            fonts: {
                // ...
            },
        }),*/
    ],
    transformers: [
        transformerDirectives(),
        transformerVariantGroup(),
    ],
})