I just published my tutorial “Building an Electron File Explorer with Quasar (and Vue)”. If interested, check it out: https://medium.com/quasar-framework/building-an-electron-file-explorer-with-quasar-and-vue-7bf94f1bbf6

Best posts made by Hawkeye64
-
Building an Electron File Explorer with Quasar (and Vue)
-
New Quasar UI App Extension: @quasar/qactivity v1.0.0-alpha.1 Release!
A new Quasar UI App Extension
@quasar/qactivity v1.0.0-alpha.1 Release! https://github.com/quasarframework/app-extension-qactivity/releases/tag/v1.0.0-alpha.1
Demo: https://qactivity.netlify.com/#/ -
@quasar/qpdfviewer v1.0.0-alpha.1 Release!
@quasar/qpdfviewer v1.0.0-alpha.1 Release! https://github.com/quasarframework/app-extension-qpdfviewer/releases/tag/v1.0.0-alpha.1
This is the initial release of QPdfviewer
Demo here: https://qpdfviewer.netlify.com/#/ -
RE: [Solved] How to make a q-table with multiple headers?
@KevinYang @s-molinari
I must say I like a bit of challenge. I think the issue you were having before is you needed more than onetr
element, but that is where the scope goes. So, I tried a different approach and put a div in with theheader
scope.
Also, notice thestyle="display: contents"
on the div.
You can see the results here: https://jsfiddle.net/Hawkeye64/5y6rbn9u/46/ -
Solution to Sticky DataTable
In case anyone wants to know how it is done: https://jsfiddle.net/Hawkeye64/noc64qr2/
-
RE: Suggestion/Feedback from a NEW user's Perspective!
@Ben-Hayat Ok, so I misread…I followed the herring instead of the bigger fish.
I think what you are looking for is a Quasar plugin:
https://quasar-framework.org/guide/app-plugins.htmlExamples of plugins I use:
import AnimatedVue from 'animated-vue' export default ({ Vue }) => { Vue.use(AnimatedVue) }
import axios from 'axios' export default ({ Vue }) => { Vue.prototype.$axios = axios }
// batman's utility belt for javascript import _ from 'lodash' export default ({ Vue }) => { Vue.prototype._ = _ }
import moment from 'moment' // leave the export, even if you don't use it export default ({ Vue }) => { Vue.prototype.$moment = moment }
// form validation // See: https://www.npmjs.com/package/slug this project is dead // now using dodoslug, a fork of node-slug // See: https://github.com/dodo/node-slug import slug from 'dodoslug' slug.defaults.modes['mymode'] = { replacement: '-', // replace spaces with replacement symbols: true, // replace unicode symbols or not remove: /[._]/g, // (optional) regex to remove characters lower: true, // result in lower case charmap: slug.charmap, // replace special characters multicharmap: slug.multicharmap // replace multi-characters } slug.defaults.mode = 'mymode' export default ({ Vue }) => { Vue.prototype.$slug = slug }
-
@quasar/dotenv v1.0.0-beta.5 Release!
@quasar/dotenv v1.0.0-beta.5 Release! https://github.com/quasarframework/app-extension-dotenv/releases/tag/v1.0.0-beta.5
Now will create your .env files for you (if you want), will not overwrite existing files. [based on new prompt]
Now will add to your .gitignore [based on new prompt] -
RE: Did you get support from the Quasar Dev Team or the Community?
@quasar_beginner @s-molinari I am just seeing this, but your accusations are a bit unfair. As soon as I saw the no workweek events on QCalendar, this was added and announced immediately:
https://discordapp.com/channels/415874313728688138/552811775440060417/705033048017862676
https://github.com/quasarframework/quasar-ui-qcalendar/releases/tag/v1.5.6 -
QMediaPlayer v1.0.19 has been released!
https://github.com/quasarframework/quasar-ui-qmediaplayer/releases/tag/v1.0.19
- fix: mobile-mode is broken (#107)
- fix: click event propagation issues
- fix: Fullscreen issues when Quasar AppFullscreen plugin is not installed
- fix: fullscreen issues when constraint is added by user (ie: max-width)
-
Is ellipsis possible in q-select?
In a multi-select q-select, I am wondering if it’s possible to have an ellipsis at the end if the text runs over? Right now it is cut off and I don’t see a way of adding an ellipsis to the output. I did try adding the
class="ellipsis"
to theq-select
but that did not work.@rstoenescu Can an
ellipsis
option be added to q-select, similar tomultiple
andtoggle
? -
RE: sharing my docker 2 stage build for production with yarn.
- There have been instances when Yarn borks everything up globally. If you haven’t hit it yet, then don’t worry about it until you do.
- Yarn puts globals into it’s own location, thereby excluding use of Node Versioning toolsets, like NVM.
At work, we have 4.5.3, 5.0/5.1 and (upcoming) 6.0 versions of our product, each of versions are using different versions of Node and associated NPM packages, so I have to use NVM to manage all that.
-
RE: Quasar v1.0 beta1 in a few days
FYI, with the release of Vue 2.6 (now up to 2.6.2) the code had to be reworked with breaking changes (their release should have been Vue 3.0.0-beta-1). It’s taken a couple of days to be Vue 2.6 compliant, and even then, if the Vue guys make more fixes, we may also have to as we’re downstream.
-
RE: [Solved] Q-toolbar dropdown menu possible ?
I do it like this:
<q-tab v-if="isLoggedIn && checkFeature('settings')" label="Settings <i class='fas fa-caret-down' />" name="settings" slot="title" icon="fas fa-cogs faa-pulse" class="faa-parent animated-hover" @click="toggleSettingsPopover()" > <q-popover v-model="displaySettingsMenu"> <q-list item-separator link> <q-item v-if="checkFeature('settings-system')" to="settings-system" replace v-close-overlay > <q-item-side left class="faa-parent animated-hover"> <q-item-tile icon="fas fa-cog faa-pulse" /> </q-item-side> System </q-item> <q-item v-if="checkFeature('settings-users') && isAdmin()" to="settings-users" replace v-close-overlay > <q-item-side left class="faa-parent animated-hover"> <q-item-tile icon="fas fa-user faa-pulse" /> </q-item-side> Users </q-item> <q-item v-if="checkFeature('settings-sites') && isAdmin()" to="settings-sites" replace v-close-overlay > <q-item-side left class="faa-parent animated-hover"> <q-item-tile icon="fas fa-map-marker faa-pulse" /> </q-item-side> Sites </q-item> <q-item v-if="checkFeature('settings-sam') && isAdmin()" to="settings-sams" replace v-close-overlay > <q-item-side left class="faa-parent animated-hover"> <q-item-tile icon="fas fa-laptop faa-pulse" /> </q-item-side> SAMs </q-item> <q-item v-if="checkFeature('settings-hvr') && isAdmin()" to="settings-hvrs" replace v-close-overlay > <q-item-side left class="faa-parent animated-hover"> <q-item-tile icon="fas fa-video faa-pulse" /> </q-item-side> DCAMs/HVRs </q-item> <q-item v-if="checkFeature('settings-ptz') && isAdmin()" to="settings-ptzs" replace v-close-overlay > <q-item-side left class="faa-parent animated-hover"> <q-item-tile class="icon" icon="fas fa-ptz32 faa-pulse" /> </q-item-side> PTZs </q-item> <q-item v-if="checkFeature('settings-accessories') && isAdmin()" to="settings-accessories" replace v-close-overlay > <q-item-side left class="faa-parent animated-hover"> <q-item-tile icon="fas fa-cubes faa-pulse" /> </q-item-side> Accessories </q-item> <q-item v-if="checkFeature('settings-analytic-control') && isAdmin()" to="settings-analytic-control" replace v-close-overlay > <q-item-side left class="faa-parent animated-hover"> <q-item-tile icon="fas fa-microchip faa-pulse" /> </q-item-side> Analytic Control </q-item> <q-item to="themes" replace v-close-overlay > <q-item-side left class="faa-parent animated-hover"> <q-item-tile icon="fas fa-adjust faa-pulse" /> </q-item-side> Themes </q-item> </q-list> </q-popover> </q-tab>
-
New App Extension: @quasar/qmarkdown v1.0.0-alpha.1 Release!
@quasar/qmarkdown v1.0.0-alpha.1 Release! https://github.com/quasarframework/app-extension-qmarkdown/releases/tag/v1.0.0-alpha.1
This is the initial release of QMarkdown.
Demo here: https://qmarkdown.netlify.com/#/ -
RE: [v1] Quasar v1.0.0-beta.12/13 released! Don't miss it.
These are great updates!
-
RE: [Solved] Q-toolbar dropdown menu possible ?
and:
toggleSettingsPopover: function () { this.displaySettingsMenu = !this.displaySettingsMenu },