package virtual_dom

  1. Overview
  2. Docs
package virtual_dom
Legend:
Page
Library
Module
Module type
Parameter
Class
Class type
Source

Module Css_genSource

A set of functions to generate css declaration lists. This library can be used to programmatically produce strings suitable for the HTML style attribute, e.g. style="display:flex;background-color:red".

Sourcetype 'a css_global_values = [
  1. | `Inherit
  2. | `Initial
  3. | `Var of string
  4. | `Var_with_default of string * 'a
]
Sourceval sexp_of_css_global_values : ('a -> Sexplib0.Sexp.t) -> 'a css_global_values -> Sexplib0.Sexp.t
Sourceval css_global_values_of_sexp : (Sexplib0.Sexp.t -> 'a) -> Sexplib0.Sexp.t -> 'a css_global_values
Sourceval __css_global_values_of_sexp__ : (Sexplib0.Sexp.t -> 'a) -> Sexplib0.Sexp.t -> 'a css_global_values
Sourceval compare_css_global_values : ('a -> 'a -> int) -> 'a css_global_values -> 'a css_global_values -> int
Sourceval css_global_values_sexp_grammar : 'a Sexplib0.Sexp_grammar.t -> 'a css_global_values Sexplib0.Sexp_grammar.t
Sourcemodule Color : sig ... end
Sourcemodule Length : sig ... end
Sourcemodule Auto_or_length : sig ... end
Sourcetype t
include Sexplib0.Sexpable.S with type t := t
Sourceval t_of_sexp : Sexplib0.Sexp.t -> t
Sourceval sexp_of_t : t -> Sexplib0.Sexp.t
include Ppx_compare_lib.Comparable.S with type t := t
Sourceval compare : t -> t -> int
include Ppx_compare_lib.Equal.S with type t := t
Sourceval equal : t -> t -> bool
include Core.Bin_prot.Binable.S with type t := t
include Bin_prot.Binable.S_only_functions with type t := t
Sourceval bin_size_t : t Bin_prot.Size.sizer
Sourceval bin_write_t : t Bin_prot.Write.writer
Sourceval bin_read_t : t Bin_prot.Read.reader
Sourceval __bin_read_t__ : (int -> t) Bin_prot.Read.reader

This function only needs implementation if t exposed to be a polymorphic variant. Despite what the type reads, this does *not* produce a function after reading; instead it takes the constructor tag (int) before reading and reads the rest of the variant t afterwards.

Sourceval bin_shape_t : Bin_prot.Shape.t
Sourceval create : field:string -> value:string -> t

Create a single property, value pair (a declaration in CSS parlance). The value must be a valid CSS literal. We do run a simple CSS parser on the value to validate this and will throw an exception if that parser fails. Note that the parser is less forgiving than many browsers. That is browsers will silently accept or drop many illegal constructs. We prefer to raise on them, so that errors are detected earlier.

It is recommended to use one of the other constructors instead if they are available. If they are not, consider adding them to this library.

Sourceval empty : t
Sourceval is_empty : t -> bool
Sourceval position : ?top:Length.t -> ?bottom:Length.t -> ?left:Length.t -> ?right:Length.t -> [ `Static | `Absolute | `Sticky | `Relative | `Fixed ] -> t

Set the position attribute and optionally top, bottom,left,right Note that left and top have no effect when position is `Static.

Sourceval top : Length.t -> t

Add the top property alone.

Sourceval bottom : Length.t -> t

Add the bottom property alone.

Sourceval left : Length.t -> t

Add the left property alone.

Sourceval right : Length.t -> t

Add the right property alone.

Sourceval combine : t -> t -> t

Neither combine nor concat validate that each t is unique. For combine x y, y will override x if they are the same attribute. For concat l, the greatest index of an attribute will prevail.

Sourceval (@>) : t -> t -> t
Sourceval concat : t list -> t
Sourceval to_string_list : t -> (string * string) list
Sourceval to_string_css : t -> string
Sourceval of_string_css_exn : string -> t

The inverse of to_string_css. Primarily useful if you want to reuse a css literal from the web (aka copy paste web design). Raises if the string fails validation. See create for comments on the validation we do.

Sourcetype box_sizing = [
  1. | `Content_box
  2. | `Border_box
  3. | box_sizing css_global_values
]
Sourceval box_sizing : box_sizing -> t
Sourcetype display = [
  1. | `Inline
  2. | `Block
  3. | `Inline_block
  4. | `List_item
  5. | `Table
  6. | `Inline_table
  7. | `None
  8. | `Inline_grid
  9. | display css_global_values
]
Sourceval display : display -> t
Sourcetype visibility = [
  1. | `Visible
  2. | `Hidden
  3. | `Collapse
  4. | visibility css_global_values
]
Sourceval visibility : visibility -> t
Sourcetype overflow = [
  1. | `Visible
  2. | `Hidden
  3. | `Scroll
  4. | `Auto
  5. | overflow css_global_values
]
Sourceval overflow : overflow -> t
Sourceval overflow_x : overflow -> t
Sourceval overflow_y : overflow -> t
Sourceval z_index : int -> t
Sourceval opacity : float -> t
Sourcetype font_style = [
  1. | `Normal
  2. | `Italic
  3. | `Oblique
  4. | font_style css_global_values
]
Sourcetype font_weight = [
  1. | `Normal
  2. | `Bold
  3. | `Bolder
  4. | `Lighter
  5. | `Number of int
  6. | font_weight css_global_values
]
Sourcetype font_variant = [
  1. | `Normal
  2. | `Small_caps
  3. | font_variant css_global_values
]
Sourceval font_size : Length.t -> t
Sourceval font_family : string list -> t
Sourceval font_style : font_style -> t
Sourceval font_weight : font_weight -> t
Sourceval font_variant : font_variant -> t
Sourceval font : size:Length.t -> family:string list -> ?style:font_style -> ?weight:font_weight -> ?variant:font_variant -> unit -> t
Sourceval bold : t
Sourcetype stops = (Core.Percent.t * Color.t) list
Sourcetype linear_gradient = {
  1. direction : [ `Deg of int ];
  2. stops : stops;
}
Sourcetype radial_gradient = {
  1. stops : stops;
}
Sourcetype background_image = [
  1. | `Url of string
  2. | `Linear_gradient of linear_gradient
  3. | `Radial_gradient of radial_gradient
]
Sourcetype text_align = [
  1. | `Left
  2. | `Right
  3. | `Center
  4. | `Justify
  5. | text_align css_global_values
]
Sourcetype horizontal_align = [
  1. | `Left
  2. | `Right
  3. | `Center
  4. | horizontal_align css_global_values
]
Sourcetype vertical_align = [
  1. | `Top
  2. | `Bottom
  3. | `Middle
  4. | `Super
  5. | `Sub
  6. | vertical_align css_global_values
]
Sourcetype white_space = [
  1. | `Normal
  2. | `Nowrap
  3. | `Pre
  4. | `Pre_line
  5. | `Pre_wrap
  6. | white_space css_global_values
]
Sourceval create_with_color : field:string -> color:[< Color.t ] -> t
Sourceval color : [< Color.t ] -> t
Sourceval background_color : [< Color.t ] -> t
Sourceval background_image : background_image -> t
Sourceval fill : Color.t -> t
Sourceval text_align : text_align -> t
Sourceval horizontal_align : horizontal_align -> t
Sourceval vertical_align : vertical_align -> t
Sourceval white_space : white_space -> t
Sourceval float : [ `None | `Left | `Right | 'float css_global_values ] as 'float -> t
Sourceval line_height : Length.t -> t
Sourceval width : Length.t -> t
Sourceval min_width : Length.t -> t
Sourceval max_width : Length.t -> t
Sourceval height : Length.t -> t
Sourceval min_height : Length.t -> t
Sourceval max_height : Length.t -> t
Sourceval padding_top : Length.t -> t
Sourceval padding_bottom : Length.t -> t
Sourceval padding_left : Length.t -> t
Sourceval padding_right : Length.t -> t
Sourceval uniform_padding : Length.t -> t
Sourceval row_gap : Length.t -> t
Sourceval column_gap : Length.t -> t
Sourceval padding : ?top:Length.t -> ?bottom:Length.t -> ?left:Length.t -> ?right:Length.t -> unit -> t
Sourceval margin_top : Auto_or_length.t -> t
Sourceval margin_bottom : Auto_or_length.t -> t
Sourceval margin_left : Auto_or_length.t -> t
Sourceval margin_right : Auto_or_length.t -> t
Sourceval uniform_margin : Auto_or_length.t -> t
Sourceval margin : ?top:Auto_or_length.t -> ?bottom:Auto_or_length.t -> ?left:Auto_or_length.t -> ?right:Auto_or_length.t -> unit -> t
Sourcetype border_style = [
  1. | `None
  2. | `Hidden
  3. | `Dotted
  4. | `Dashed
  5. | `Solid
  6. | `Double
  7. | `Groove
  8. | `Ridge
  9. | `Inset
  10. | `Outset
  11. | border_style css_global_values
]
Sourceval border_top : ?width:Length.t -> ?color:[< Color.t ] -> style:border_style -> unit -> t
Sourceval border_bottom : ?width:Length.t -> ?color:[< Color.t ] -> style:border_style -> unit -> t
Sourceval border_left : ?width:Length.t -> ?color:[< Color.t ] -> style:border_style -> unit -> t
Sourceval border_right : ?width:Length.t -> ?color:[< Color.t ] -> style:border_style -> unit -> t
Sourceval border : ?width:Length.t -> ?color:[< Color.t ] -> style:border_style -> unit -> t
Sourceval border_radius : Length.t -> t
Sourcetype border_collapse = [
  1. | `Separate
  2. | `Collapse
  3. | border_collapse css_global_values
]
Sourceval border_collapse : border_collapse -> t
Sourceval border_spacing : Length.t -> t
Sourceval outline : ?width:Length.t -> ?color:[< Color.t ] -> style:border_style -> unit -> t
Sourcetype text_decoration_line = [
  1. | `None
  2. | `Underline
  3. | `Overline
  4. | `Line_through
  5. | text_decoration_line css_global_values
]
Sourcetype text_decoration_style = [
  1. | `Solid
  2. | `Double
  3. | `Dotted
  4. | `Dashed
  5. | `Wavy
  6. | text_decoration_style css_global_values
]
Sourceval text_decoration : ?style:text_decoration_style -> ?color:[< Color.t ] -> line:text_decoration_line list -> unit -> t
Sourcetype item_alignment = [
  1. | `Auto
  2. | `Flex_start
  3. | `Flex_end
  4. | `Center
  5. | `Baseline
  6. | `Stretch
]
Sourcetype content_alignment = [
  1. | `Normal
  2. | `Flex_start
  3. | `Flex_end
  4. | `Center
  5. | `Space_between
  6. | `Space_around
  7. | `Space_evenly
  8. | `Stretch
]
Sourcetype justify_content = [
  1. | `Flex_start
  2. | `Flex_end
  3. | `Center
  4. | `Space_between
  5. | `Space_around
  6. | `Space_evenly
]
Sourceval flex_container : ?inline:bool -> ?direction:[ `Row | `Row_reverse | `Column | `Column_reverse | `Default ] -> ?wrap:[ `Nowrap | `Wrap | `Wrap_reverse | `Default ] -> ?align_items:item_alignment -> ?align_content:content_alignment -> ?justify_content:justify_content -> ?row_gap:Length.t -> ?column_gap:Length.t -> unit -> t
Sourceval flex_item : ?order:int -> ?basis:Auto_or_length.t -> ?shrink:float -> grow:float -> unit -> t
Sourceval align_self : item_alignment -> t
Sourcetype resize = [
  1. | `None
  2. | `Both
  3. | `Horizontal
  4. | `Vertical
  5. | resize css_global_values
]
Sourceval resize : resize -> t
Sourcetype direction = [
  1. | `Normal
  2. | `Reverse
  3. | `Alternate
  4. | `Alternate_reverse
  5. | direction css_global_values
]
Sourcetype fill_mode = [
  1. | `None
  2. | `Forwards
  3. | `Backwards
  4. | `Both
  5. | fill_mode css_global_values
]
Sourceval animation : name:string -> duration:Core.Time_ns.Span.t -> ?delay:Core.Time_ns.Span.t -> ?direction:direction -> ?fill_mode:fill_mode -> ?iter_count:int -> ?timing_function:string -> unit -> t

Note: You must include the names @keyframes in the stylesheet

Sourcetype user_select = [
  1. | `All
  2. | `Auto
  3. | `None
  4. | `Text
]
Sourceval user_select : user_select -> t
Sourcemodule Stable : sig ... end
Sourcemodule Expert : sig ... end
Sourcemodule Private : sig ... end
OCaml

Innovation. Community. Security.

GitHub Discord Twitter Peertube RSS
About
Changelog Releases Industrial Users Academic Users Why OCaml
Ecosystem
Packages Community Events OCaml Planet Jobs
Resources
Install OCaml Get Started Platform Tools Language Manual Standard Library API Books Exercises Papers OCaml Playground Logo
Policies
Carbon Footprint Governance Privacy Code of Conduct