Style
/ API Reference / Plugins
Style
/ API Reference / Plugins

responsiveValue

This plugin resolves responsive values into a single value.
Responsive values are defined as an array of values, where the first value is the default value and the rest are the values for the media queries.

Important Note

This plugin requires some manual setup to work properly due to TypeScript limitations.


Read the Responsive Values guide for more information.

The Gist

import { responsiveValuePlugin } from '@weser/style'

const plugin = responsiveValuePlugin([
  '@media (min-width: 800px)',
  '@media (min-width: 1024px)',
])

Parameters

ParameterTypeDefaultDescription
mediaQueriesArray<string>[]The media queries used to resolve responsive values.

Returns

(Plugin) A plugin function that can be passed to the createRenderer function.

On this page