Directory

← Back

prism-element

Syntax / code highlighting via the Prism webcomponent.

Author

Rating

Popularity

<100

Integration of the <prism-element> Webcomponent. Enables you to display syntax highlighted code via Prism.

Sample code

new PrismHighlighter("p { color: blue; }");
new PrismHighlighter("p { color: blue; }","css");
new PrismHighlighter("@Route(\"\")\n" +
        "public class DemoView extends VerticalLayout {\n" +
        "\n" +
        "    public DemoView() {\n" +
        "        add(\n" +
        "                new PrismHighlighter(\"<style>p { color: blue; }</style>\", \"html\"),\n" +
        "                new PrismHighlighter(\"<style>p { color: blue; }</style>\", \"html\"),\n" +
        "                new PrismHighlighter(\"<style>p { color: blue; }</style>\", \"html\"),\n" +
        "                new PrismHighlighter(\"<style>p { color: blue; }</style>\", \"html\")\n" +
        "        );\n" +
        "    }\n" +
        "}\n");
new PrismHighlighter("@Route(\"\")\n" +
        "public class DemoView extends VerticalLayout {\n" +
        "\n" +
        "    public DemoView() {\n" +
        "        add(\n" +
        "                new PrismHighlighter(\"<style>p { color: blue; }</style>\", \"html\"),\n" +
        "                new PrismHighlighter(\"<style>p { color: blue; }</style>\", \"html\"),\n" +
        "                new PrismHighlighter(\"<style>p { color: blue; }</style>\", \"html\"),\n" +
        "                new PrismHighlighter(\"<style>p { color: blue; }</style>\", \"html\")\n" +
        "        );\n" +
        "    }\n" +
        "}\n","java");

Compatibility

(Loading compatibility data...)

Was this helpful? Need more help?
Leave a comment or a question below. You can also join the chat on Discord or ask questions on StackOverflow.

Version

  • ported to Polymer 3
  • allowed using your own styles

The compatibility mode is currently not supported!

Released
2019-08-26
Maturity
BETA
License
Apache License 2.0

Compatibility

Framework
Vaadin 14+
Vaadin 10+ in 0.5
Browser
Firefox
Opera
Safari
Google Chrome
Microsoft Edge

prism-element - Vaadin Add-on Directory

Syntax / code highlighting via the Prism webcomponent. prism-element - Vaadin Add-on Directory
Integration of the \ Webcomponent. Enables you to display syntax highlighted code via Prism.
Online