@quasar/quasar-ui-qscroller
v1.1.3
Published
QScroller - Embed string, time, date and range scrollers in your Quasar Apps
Downloads
107
Readme
QScroller
QScroller is a Quasar component. It allows you to have time and date selections or a combination of both, including range selections.
Examples and Documentation
Can be found here
Usage
Quasar CLI project
Install the App Extension.
OR:
Create and register a boot file:
import Vue from 'vue'
import Plugin from '@quasar/quasar-ui-qscroller'
import '@quasar/quasar-ui-qscroller/dist/index.css'
Vue.use(Plugin)
OR:
<style src="@quasar/quasar-ui-qscroller/dist/index.css"></style>
<script>
import { QScroller } from '@quasar/quasar-ui-qscroller'
export default {
components: {
QScroller
}
}
</script>
Vue CLI project
import Vue from 'vue'
import Plugin from '@quasar/quasar-ui-qscroller'
import '@quasar/quasar-ui-qscroller/dist/index.css'
Vue.use(Plugin)
OR:
<style src="@quasar/quasar-ui-qscroller/dist/index.css"></style>
<script>
import { QScroller } from '@quasar/quasar-ui-qscroller'
export default {
components: {
QScroller
}
}
</script>
UMD variant
Exports window.QScroller
.
Add the following tag(s) after the Quasar ones:
<head>
<!-- AFTER the Quasar stylesheet tags: -->
<link href="https://cdn.jsdelivr.net/npm/@quasar/quasar-ui-qscroller/dist/index.min.css" rel="stylesheet" type="text/css">
</head>
<body>
<!-- at end of body, AFTER Quasar script(s): -->
<script src="https://cdn.jsdelivr.net/npm/@quasar/quasar-ui-qscroller/dist/index.umd.min.js"></script>
</body>
If you need the RTL variant of the CSS, then go for the following (instead of the above stylesheet link):
<link href="https://cdn.jsdelivr.net/npm/@quasar/quasar-ui-qscroller/dist/index.rtl.min.css" rel="stylesheet" type="text/css">
Building the Projects
Setup
In both the ui
and ui/dev
folders:
$ yarn
Developing
In the ui
folder
# start dev in SPA mode
$ yarn dev
# start dev in UMD mode
$ yarn dev:umd
# start dev in SSR mode
$ yarn dev:ssr
# start dev in Cordova iOS mode
$ yarn dev:ios
# start dev in Cordova Android mode
$ yarn dev:android
# start dev in Electron mode
$ yarn dev:electron
Building package
$ yarn build
build just the JSON API
$ yarn build:api
Donate
If you appreciate the work that went into this, please consider donating to Quasar or Jeff.
License
MIT (c) Jeff Galbraith [email protected]