Style | /plugins/twindv1_deps.ts | fresh@1.6.8

interface Style

import { type Style } from "https://dotland.deno.dev/x/fresh@1.6.8/plugins/twindv1_deps.ts";

Type Parameters

Variants

Call Signatures

(props?: StyleProps<Variants>): string

CSS Class associated with the current component.

const button = style({
  base: css({
    color: "DarkSlateGray"
  })
})

<div className={button()} />

(match: MatchResult): string

To be used as resolve within config.rules:

{
  rules: [
    // label?prop=value&other=propValue
    // if the style has base eg no prop is required
    ['label(\\?.+)?', style( /* ... *\/ )],

    // if the style requires at least one prop
    ['label\\?(.+)', style( /* ... *\/ )],
  ]
}

The first group is used to extract the props using {@link !URLSearchParams | URLSearchParams}.

Properties

readonly

defaults: StyleProps<Variants>

readonly

className: string

CSS Class associated with the current component.

const button = style({
  base: css`
    color: "DarkSlateGray"
  `
})

<div className={button.className} />

readonly

selector: string

CSS Selector associated with the current component.

const button = style({
  base: css({
    color: "DarkSlateGray"
  })
})

const Card = styled({
  base: css`
    & ${button.selector} {
      boxShadow: "0 0 0 5px"
    }
  `
})