Mixins / foldkit-mixins/theme

inContainer

function · packages/mixins/src/theme/tokens.ts:250

function inContainer<Breakpoints extends Readonly<Record<string, string>>>(
  name: string,
  breakpoints: Breakpoints,
): {
  readonly [K in keyof Breakpoints]: string
}

The same breakpoints measured on a named container rather than the window: Theme.inContainer('page', Theme.tokens.breakpoint) gives md as '@container page (min-width: 48rem)', for Style.responsive and a responsive look. An element must be that container (container: page / inline-size) for them to match.