CodeExample

A live example with its source under it.

IzzyBlazor.CodeExample in the IzzyBlazor.Core package, generated from the 0.1.0-alpha.17 assembly and its doc comments.

Properties (13)

ChildContentRenderFragment?

The live example.

Codestring?

The example's source. For several files, write CodeExampleFiles instead (or as well: this is then the first tab).

Languagestring = "razor"

The language of the source, for colors. Defaults to "razor".

Titlestring?

A file name for the source, such as "SignIn.razor", in a header row (or on its tab).

HighlightLinesstring?

Lines of the source to highlight, such as "3-5,9".

LineNumbersbool = false

Numbers the source's lines.

MaxHeightLength?

The tallest the source gets before it scrolls, such as Length.Rem(20).

Collapsiblebool = false

Hides the source behind a "Show code" toggle, which works with JavaScript off.

SourceOpenbool = false

With Collapsible, starts with the source shown.

Centerbool = false

Centers the preview's content both ways.

ShowCodeTextstring? = "Show code"

The toggle's text while the source is hidden. Defaults to "Show code".

HideCodeTextstring? = "Hide code"

The toggle's text while the source is shown. Defaults to "Hide code".

FilesLabelstring? = "Source files"

The source tabs' name for screen readers. Defaults to "Source files".

Plus 16 item props and 4 common props.

Show them here

Events (0)

No events.

Parts (1)

Components written inside CodeExample, documented here with it.

`CodeExampleFile`

One source file of a CodeExample, shown as a tab over its source. Write it among the example's content; it renders nothing where it's written.

Titlestring required

The file name, shown on its tab.

Codestring required

The source.

Languagestring? (computed)

The language, for colors. Defaults to the example's Language.

HighlightLinesstring?

Lines to highlight, such as "3-5,9" (see HighlightLines).

Types (1)

`Length`

struct

A width, height or flex basis: a size token, a keyword, or a CSS length built with a factory such as Rem.

Length members
Member	Description
`Sm`	640px (matches the `sm` breakpoint).
`Md`	768px (matches the `md` breakpoint).
`Lg`	1024px (matches the `lg` breakpoint).
`Xl`	1280px (matches the `xl` breakpoint).
`Prose`	A comfortable reading width, 68 characters.
`Full`	100% of the containing block.
`Auto`	`auto`.
`FitContent`	`fit-content`: as wide as the content, up to the available space.
`MinContent`	`min-content`.
`MaxContent`	`max-content`.
`Px(double value)`	Pixels.
`Rem(double value)`	Root ems (16px each by default).
`Percent(double value)`	Percent of the containing block.
`Ch(double value)`	Character widths, for text measures.
`Vw(double value)`	Percent of the viewport width.
`Dvh(double value)`	Percent of the dynamic viewport height (accounts for mobile browser bars).
`Of(string css)`	Any CSS length, such as `calc(100% - 2rem)`. Checked for unsafe characters.
`Css string`	The CSS value this length renders as.