import { defineConfig, presetIcons, presetWind3 } from 'unocss'
import { createResolver } from 'nuxt/kit'
import { projectIcons } from './shared/project-icons'
const resolver = createResolver(import.meta.url)
export default defineConfig({
content: {
filesystem: [
resolver.resolve('./content/**/*.md'),
resolver.resolve('./app/**/*.vue'),
],
},
safelist: [...projectIcons],
shortcuts: [
{
'underlined-link':
'relative inline-block after:block after:my-[-0.5em] after:mx-[-0.25em] after:opacity-10 after:border-current after:content-empty after:duration-300 after:transition-border-color after:transition-opacity after:border-b-[0.5em] outline-none hover:after:opacity-35 active:after:opacity-35 focus-visible:after:opacity-35',
'f-ring':
'outline-none focus-visible:ring-2 focus-visible:ring-primary/80 focus-visible:ring-offset-2 focus-visible:ring-offset-background',
'f-ring-accent':
'outline-none focus-visible:ring-2 focus-visible:ring-primary/80 focus-visible:ring-offset-2 focus-visible:ring-offset-accent',
'f-ring-inset':
'outline-none focus-visible:ring-2 focus-visible:ring-primary/80 focus-visible:ring-inset',
'f-tray-item':
'outline-none rounded-full focus-visible:ring-2 focus-visible:ring-primary/80 focus-visible:ring-offset-1 focus-visible:ring-offset-accent',
},
],
variants: [
{
order: -10,
match: matcher => {
if (!matcher.startsWith('*:')) return matcher
matcher = matcher.slice('*:'.length)
const child = matcher.match(/(first|last):/)?.[1]
if (child) {
matcher = matcher.slice(child.length + 1)
return {
matcher,
selector: s => `${s} > *:${child}-child`,
}
}
return {
matcher,
selector: s => `${s} > *`,
}
},
},
],
theme: {
colors: {
primary: 'var(--primary)',
accent: 'var(--accent)',
muted: 'rgb(var(--muted) / var(--un-bg-opacity, 1))',
background: 'var(--background)',
},
fontFamily: {
sans: 'Barlow, system-ui, sans-serif',
code: 'Fira Code',
serif: 'Vollkorn, serif',
},
},
presets: [
presetIcons({
extraProperties: {
'display': 'inline-block',
'vertical-align': 'middle',
},
collections: {
custom: {
twitter: ``,
threads: ``,
},
},
}),
presetWind3(),
],
})