CodeHighlighter

CodeHighlighter is a custom directive to highlight code blocks using PrismJS


#titanic {{'{'}}
    float: none;
{{'}'}}

Import


{{'import {CodeHighlighter} from "fuel-ui/fuel-ui"'}}

Getting Started

CodeHighlighter is applied to a code element with [code-highlight] directive. The <code> should have a style class having "language-" prefix to specify the language to highlight. See Prismjs docs for the list of available languages. An example block with css code would be as follows.

Usage


<code class="language-css" code-highlight>
    #titanic {{'{'}} 
        float: none;
    {{'}'}}
</code>