@nist-berlin/rent-slider

Rent Slider

How to use on a page

Script tag

• Put a script tag <script src='https://unpkg.com/@nist-berlin/rent-slider@latest/dist/rent-slider/rent-slider.js'></script> in the head of your index.html. The version corresponds to the latest package version in npmjs.
• Then you can use <rent-slider></rent-slider> anywhere in your template, JSX, html etc. Keep in mind the hyphen notation.

Node Modules

• Run npm i nist-rent-slider --save
• Put a script tag <script src='node_modules/@nist-berlin/rent-slider/dist/rent-slider.js'></script> in the head of your index.html
• Then you can use the element <rent-slider></rent-slider> anywhere in your template, JSX, html etc

Component attributes

heading: Header text displayed directly above slider.

firstcontentline: Rent slider text - first line.

secondcontentline: Rent slider text - second line.

maxrent: Maximum possible value of monthly rent.

minrent: Minimum possible value of monthly rent.

rentstep: A step value for rent range control.

ctatext: CTA text.

ctaurl: Location where the CTA should lead after click.

ctashow: A value that indicates whether CTA should be displayed or not.