5.1.1 • Published 6 years ago
veams-component-comparer v5.1.1
Comparer
Description
The component represents a comparison handler.
It allows you to change via drag the image.
Requirements
Veams >= v5.0.0- Veams Framework.
Installation
Installation with Veams
veams install vc comparer
Fields
comparer.hbs
Settings
- settings.comparerContextClass {
String} default - Context class of component. - settings.comparerClasses {
String} - Modifier classes for component. - settings.jsOptions {
Object} - JavaScript options which gets stringified.
JavaScript Options
The module gives you the possibility to override default options:
- handle {
String} ['data-js-item="comparer-handle"'] - Define the handler element. - topContainer {
String} ['data-js-item="comparer-top-container"'] - Define the element for top container. - topContent {
String} ['data-js-item="comparer-top-content"'] - Define the content element in top container. - draggClass {
String} 'is-dragging' - Define the dragging class. - dragMode {
Boolean} true - Enable or disable drag mode. - topContentRight {
Boolean} false - Reverse the drag mode direction. - disabled {
Object} 'desktop': false, 'tablet-large': false, 'tablet-small': false, 'mobile-large': false, 'mobile-medium': false, 'mobile-small': false - Define on which viewport the module is enabled.
Sass Options
There are multiple global variables which you can change:
- $comparer-color-light
#fff- Handle color.