A set of web components to create HTML presentations
npm install @schnrap/presentablePresentable is a small collection of web components built to create web-based presentations. It structures a presentation in sections which contain the slide shown in the presenation.
Install the components using npm
``bash`
npm install -S @schnrap/presentable
Include presentable.js in your document. If you want to start immediatelly, include the presentable.css to get a basic stylesheet for your presenation. Otherwise, you can style the content of your slides using a custom stylesheet.
`html
`
The root component of a presenation is the pr-presentation component, which manages the sections and slides. The pr-section component can be used in order to structure the presenation. The pr-slidecomponent contains the visible HTML. Note, that this structure needs to be maintained.
`html`
Presentable
a web component library for creating awesome presenations
The pr-presentation component manages the sections and resonds to user input. In the following, the available properties for configuration are listed.
| property | description |
| ------------------ | ------------------------------------------------------------ |
| disable-navigation | hides the navigation arrows to trigger slide transitions (default: false) |
| animated | adds slide-in animations to slide transitions (default: false) |
The pr-section component manages the ancillary slides.
The pr-slide contains the HTML visible within one presentation slide. The content of a section can either be set directly through a template element within the component or using an external file. The external file needs to contain the template element, which is inserted within the slide
`html`
Presentable
In the following, the available properties for configuration are listed
| property | description |
| -------- | ------------------------------------------ |
| url | url to HTML document containing template` |
| flowIn | adds slide-in animation (default: false) |