Add @page type

[milesj]

@page has special rules here: https://developer.mozilla.org/en-US/docs/Web/CSS/@page

This is similar to @viewport which already has a custom type Viewport.

export interface Viewport<TLength = string | 0> {
  msHeight?: ViewportHeightProperty<TLength>;
  msMaxHeight?: ViewportMaxHeightProperty<TLength>;
  msMaxWidth?: ViewportMaxWidthProperty<TLength>;
  msMaxZoom?: ViewportMaxZoomProperty;
  msMinHeight?: ViewportMinHeightProperty<TLength>;
  msMinWidth?: ViewportMinWidthProperty<TLength>;
  msMinZoom?: ViewportMinZoomProperty;
  msOrientation?: ViewportOrientationProperty;
  msUserZoom?: ViewportUserZoomProperty;
  msWidth?: ViewportWidthProperty<TLength>;
  msZoom?: ViewportZoomProperty;
  OOrientation?: ViewportOrientationProperty;
  height?: ViewportHeightProperty<TLength>;
  maxHeight?: ViewportMaxHeightProperty<TLength>;
  maxWidth?: ViewportMaxWidthProperty<TLength>;
  maxZoom?: ViewportMaxZoomProperty;
  minHeight?: ViewportMinHeightProperty<TLength>;
  minWidth?: ViewportMinWidthProperty<TLength>;
  minZoom?: ViewportMinZoomProperty;
  orientation?: ViewportOrientationProperty;
  userZoom?: ViewportUserZoomProperty;
  width?: ViewportWidthProperty<TLength>;
  zoom?: ViewportZoomProperty;
}

Spec: https://drafts.csswg.org/css-page-3/#at-page-rule

[kripod]

Great idea! I just put together a basic implementation and usage example as follows:

import * as CSS from 'csstype';

export type MarginAtRules<TLength> = {
  [pageMargin in
    | '@top-left-corner'
    | '@top-left'
    | '@top-center'
    | '@top-right'
    | '@top-right-corner'
    | '@right-top'
    | '@right-middle'
    | '@right-bottom'
    | '@bottom-right-corner'
    | '@bottom-right'
    | '@bottom-center'
    | '@bottom-left'
    | '@bottom-left-corner'
    | '@left-bottom'
    | '@left-middle'
    | '@left-top']?: CSS.Properties<TLength>; // TODO: PageMarginCSSProperties
};

export type Page<TLength = string | 0> =
  | CSS.Properties<TLength> // TODO: PageCSSProperties
  | MarginAtRules<TLength>
  | {
      [pseudo in ' :left' | ' :right' | ' :first' | ' :blank']?: MarginAtRules<
        TLength
      >;
    };

export type GlobalCSSRules = {
  '@page'?: Page;
};

Please see the CSS Paged Media Module specification for the values of PageProperties and PageMarginProperties.