colorResolver | /deps/@unocss/preset-mini/utils.ts | netzo@0.4.42

function colorResolver

import { colorResolver } from "https://deno.land/x/netzo@0.4.42/deps/@unocss/preset-mini/utils.ts";

colorResolver(

property: string,

varName: string,

key?: ThemeColorKeys,

shouldPass?: (css: CSSObject) => boolean,

): DynamicMatcher

Provide DynamicMatcher function to produce color value matched from rule.

Examples

Resolving 'red' from theme: colorResolver('background-color', 'background')('', 'red') return { 'background-color': '#f12' }

Resolving 'red-100' from theme: colorResolver('background-color', 'background')('', 'red-100') return { '--un-background-opacity': '1', 'background-color': 'rgb(254 226 226 / var(--un-background-opacity))' }

Resolving 'red-100/20' from theme: colorResolver('background-color', 'background')('', 'red-100/20') return { 'background-color': 'rgb(204 251 241 / 0.22)' }

Resolving 'hex-124': colorResolver('color', 'text')('', 'hex-124') return { '--un-text-opacity': '1', 'color': 'rgb(17 34 68 / var(--un-text-opacity))' }

Parameters

property: string

Property for the css value to be created.

varName: string

Base name for the opacity variable.

optional

key: ThemeColorKeys

Theme key to select the color from.

optional

shouldPass: (css: CSSObject) => boolean

Function to decide whether to pass the css.

Returns

DynamicMatcher

object.