Lede Component

npm version

Use vf-lede for introductory text.

Install

This repository is distributed with [npm][npm]. After [installing npm][install-npm], you can install primer-buttons with this command.

$ yarn add --dev @visual-framework/vf-lede

Usage

The source files included are written in [Sass][sass] (scss) You can simply point your sass include-path at your node_modules directory and import it like this.

@import "@visual-framework/vf-lede/index.scss";

Make sure you import Sass requirements along with the modules.


File system location: components/vf-lede

Variants


Variant: Default live block

Nunjucks demo

{% render '@vf-lede--default', {
  "component-type": "block",
  "vf_lede_text": "Lede text is a generic type of conent for different diseases in which cells divide many more times than usual. <a href=\"#\">This abnormal growth</a> can affect many cell types in almost any part of the body."
} %}
        

Sample output

Lede text is a generic type of conent for different diseases in which cells divide many more times than usual. This abnormal growth can affect many cell types in almost any part of the body.

Sample output as HTML

<p class="vf-lede">Lede text is a generic type of conent for different diseases in which cells divide many more times than usual. <a href="#">This abnormal growth</a> can affect many cell types in almost any part of the body.</p>
        

Assets

All components in this design system

This page is part of the components section.