Class VelvetResponsive

Namespace

Velvet

Assembly

Velvet.Docs.dll

Public entry points for Velvet's responsive system, for consumers that need to reference its conventions from code rather than only as utility-class strings.

public static class VelvetResponsive

Inheritance

object

VelvetResponsive

Fields

ContainerClass

The utility class that marks an element as a query container — Tailwind v4's @container, the CSS container-type: inline-size analog. Its descendants' @sm:…@7xl:, @min-*: and @max-*: variants evaluate against THAT element's width. The viewport variants sm:…2xl: are unaffected: they never read a container. Exposed so tooling can apply the marker without hardcoding the raw string.

A container can be named, @container/name, which only @sm/name:-style variants of the same name ask for; an unnamed variant asks for the nearest container whatever its name. Adding or removing the class, or changing its name, on an already-attached ancestor re-points the descendants that are already attached.

ViewportClass

The utility class that makes an element stand in for the viewport: its descendants' sm:… 2xl: variants evaluate against THAT element's width instead of the panel root's. It is for tooling that simulates a viewport inside a larger panel, such as the preview window's Viewport addon; an application that wants a component to respond to its own width marks it ContainerClass and writes @sm:-style variants. Adding or removing the class on an already-attached ancestor re-points the descendants that are already attached.