quasar-ui-qverticalexpansionitem

0.0.1 • Public • Published

Component QVerticalExpansionItem

npm npm

QVerticalExpansionItem is a Quasar component. It allows you to have Vertical Expanders for your Quasar App.

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-ui-qverticalexpansionitem'
import 'quasar-ui-qverticalexpansionitem/dist/index.css'
 
Vue.use(Plugin)

OR:

<style src="quasar-ui-qverticalexpansionitem/dist/index.css"></style>
 
<script>
import { QVerticalExpansionGroup, QVerticalExpansionItem } from 'quasar-ui-qverticalexpansionitem'
 
export default {
  components: {
    QVerticalExpansionGroup,
    QVerticalExpansionItem
  }
}
</script> 

Vue CLI project

import Vue from 'vue'
import Plugin from 'quasar-ui-qverticalexpansionitem'
import 'quasar-ui-qverticalexpansionitem/dist/index.css'
 
Vue.use(Plugin)

OR:

<style src="quasar-ui-qverticalexpansionitem/dist/index.css"></style>
 
<script>
import { QVerticalExpansionGroup, QVerticalExpansionItem } from 'quasar-ui-qverticalexpansionitem'
 
export default {
  components: {
    QVerticalExpansionGroup,
    QVerticalExpansionItem
  }
}
</script> 

UMD variant

Exports window.QVerticalExpansionItem.

Add the following tag(s) after the Quasar ones:

<head>
  <!-- AFTER the Quasar stylesheet tags: -->
  <link href="https://cdn.jsdelivr.net/npm/quasar-ui-qverticalexpansionitem/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-ui-qverticalexpansionitem/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-ui-qverticalexpansionitem/dist/index.rtl.min.css" rel="stylesheet" type="text/css">

Setup

$ 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 jeff@quasar.dev

Package Sidebar

Install

npm i quasar-ui-qverticalexpansionitem

Weekly Downloads

21

Version

0.0.1

License

MIT

Unpacked Size

74.2 kB

Total Files

20

Last publish

Collaborators

  • hawkeye64